/* AUTO-GENERATED by scripts/build_frontend_css.py. DO NOT EDIT. build=adf8134b0031dbd1 */
/* ui-current owns future changes; ui-legacy is a frozen compatibility snapshot. */
@layer ui-current, ui-legacy;

@layer ui-legacy {

/* BEGIN frontend/assets/styles.css */
:root { --ink:#172033; --muted:#687386; --line:#e2e6ee; --surface:#fff; --canvas:#f6f7fb; --blue:#2463eb; --green:#15803d; --orange:#c55f11; --red:#c63748; --violet:#7152c8; --radius:8px; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; color:var(--ink); font:14px/1.45 Inter,"PingFang SC","Microsoft YaHei",sans-serif; background:var(--canvas); }
button,input,select { font:inherit; } button { cursor:pointer; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:222px minmax(0,1fr); }
.sidebar { background:#161d2b; color:#d7ddea; padding:18px 12px; display:flex; flex-direction:column; min-height:100vh; position:sticky; top:0; height:100vh; }
.brand { min-height:66px; display:flex; align-items:center; gap:12px; padding:5px 10px 17px; color:#fff; border-bottom:1px solid #2a3547; }
.brand-mark { position:relative; width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; background:#a92733; border:1px solid #d36069; border-radius:6px; box-shadow:inset 0 0 0 3px #8e1f2a; }
.brand-mark::after { content:""; position:absolute; right:5px; bottom:5px; width:6px; height:2px; background:#f2c9cd; }
.brand-mark b { color:#fff; font-size:18px; font-weight:750; line-height:1; }
.brand-copy { min-width:0; display:grid; align-content:center; line-height:1.2; }.brand-copy strong { color:#fff; font-size:17px; font-weight:700; white-space:nowrap; }.brand-copy small { margin-top:5px; color:#aeb8c9; font-size:10px; font-weight:500; white-space:nowrap; }
.nav { display:grid; gap:4px; margin-top:18px; }.nav-item { width:100%; color:#c5cede; border:0; background:transparent; min-height:40px; display:flex; align-items:center; gap:11px; padding:0 11px; text-align:left; border-radius:6px; }.nav-item span { width:16px; text-align:center; color:#97a4b8; }.nav-item:hover { background:#222d3f; color:#fff; }.nav-item.active { background:#264f94; color:#fff; }.nav-item.active span { color:#b8d2ff; }.nav-item b { margin-left:auto; min-width:18px; height:18px; display:grid; place-items:center; background:#c63748; color:#fff; border-radius:9px; font-size:11px; }
.sidebar-footer { margin-top:auto; padding:12px 10px 0; border-top:1px solid #2a3547; font-size:12px; color:#97a4b8; }.online-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:#3bc978; margin-right:5px; }
.workspace { min-width:0; }.app-shell.auth-mode { display:block; }.topbar { height:80px; background:#fff; display:flex; align-items:center; justify-content:space-between; padding:0 32px; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:2; }.eyebrow { margin:0 0 2px; font-size:12px; color:var(--muted); }.topbar h1 { font-size:19px; margin:0; letter-spacing:0; }.top-actions { display:flex; gap:10px; align-items:center; }.search { height:36px; width:260px; display:flex; align-items:center; gap:8px; border:1px solid var(--line); padding:0 10px; border-radius:6px; color:#8a95a5; }.search input { width:100%; border:0; outline:0; color:var(--ink); }.top-actions select { height:36px; border:1px solid var(--line); background:#fff; padding:0 10px; border-radius:6px; color:var(--ink); }.icon-button { width:36px; height:36px; border:1px solid var(--line); background:#fff; border-radius:6px; color:var(--ink); }.user-menu { min-height:36px; border:1px solid var(--line); background:#fff; padding:5px 10px; border-radius:6px; display:grid; text-align:left; gap:0; color:var(--ink); }.user-menu small { color:var(--muted); font-size:11px; }.auth-workspace { display:block; min-height:100vh; background:#eef1f5; }.auth-workspace .topbar { display:none; }.auth-workspace #page { width:100%; max-width:none; min-height:100vh; padding:36px; display:grid; place-items:center; }.auth-shell { width:min(900px,calc(100vw - 72px)); min-height:540px; display:grid; grid-template-columns:360px minmax(0,1fr); background:#fff; border:1px solid #dce1e9; border-radius:8px; overflow:hidden; box-shadow:0 24px 70px #25334a18; }.auth-brand-panel { padding:46px 42px 38px; display:flex; flex-direction:column; justify-content:space-between; color:#fff; background:#192130; border-left:5px solid #b4232f; }.auth-brand-mark { width:52px; height:52px; display:grid; place-items:center; margin-bottom:40px; color:#fff; background:#b4232f; border:1px solid #d36a72; border-radius:6px; font-size:24px; font-weight:750; }.auth-company { margin:0 0 8px; color:#d8deea; font-size:16px; font-weight:650; }.auth-brand-panel h1 { margin:0; max-width:250px; color:#fff; font-size:30px; line-height:1.25; }.auth-brand-note { margin:16px 0 0; color:#aeb9ca; font-size:13px; }.auth-brand-footer { padding-top:24px; border-top:1px solid #303b4d; color:#98a4b7; font-size:12px; }.auth-panel { padding:54px 64px 36px; display:flex; flex-direction:column; min-width:0; }.auth-kicker { margin:0 0 30px; color:#b4232f; font-size:12px; font-weight:650; }.auth-panel h2 { margin:0; color:#172033; font-size:28px; }.auth-intro { margin:8px 0 28px; color:var(--muted); font-size:14px; }.auth-form { padding:0; gap:18px; }.auth-form label { gap:8px; color:#303c50; font-weight:600; }.auth-form input { width:100%; height:46px; padding:0 13px; border-color:#c8d0dc; border-radius:5px; font-weight:400; }.auth-form input:focus { border-color:#2463eb; outline:3px solid #e3edff; }.password-field { position:relative; }.password-field input { padding-right:64px; }.password-toggle { position:absolute; top:1px; right:1px; width:58px; height:44px; border:0; background:transparent; color:#536074; font-size:12px; }.password-toggle:hover { color:#1748ae; }.auth-submit { width:100%; min-height:46px; margin-top:4px; }.auth-error { color:var(--red); min-height:20px; margin-top:10px; font-size:13px; }.auth-copyright { margin:auto 0 0; padding-top:22px; color:#98a1b0; font-size:11px; text-align:center; }.account-table td:first-child { display:grid; gap:2px; }.account-table .tag { min-width:72px; justify-content:center; }
.page { padding:26px 32px 48px; max-width:1720px; }.toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:18px; }.toolbar h2 { margin:0; font-size:16px; }.toolbar p { margin:3px 0 0; color:var(--muted); font-size:13px; }.toolbar-note { margin:0 !important; color:var(--muted); font-size:13px; }.filters { display:flex; gap:8px; flex-wrap:wrap; }.filter-chip { border:1px solid var(--line); background:#fff; color:#475268; min-height:32px; padding:0 10px; border-radius:6px; }.filter-chip.selected { color:#1748ae; border-color:#91b6ff; background:#edf4ff; }.primary { background:var(--blue); color:#fff; border:1px solid var(--blue); border-radius:6px; min-height:36px; padding:0 14px; font-weight:600; }.secondary { background:#fff; color:#263247; border:1px solid var(--line); border-radius:6px; min-height:34px; padding:0 11px; }.danger { color:var(--red); }
.metrics { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-bottom:22px; }.metric { background:var(--surface); border:1px solid var(--line); padding:16px; min-height:112px; border-radius:var(--radius); }.metric-label { color:var(--muted); font-size:13px; }.metric-value { margin-top:10px; font-size:30px; font-weight:750; letter-spacing:0; }.metric-note { margin-top:4px; font-size:12px; color:#7c8798; }.metric.alert .metric-value { color:var(--red); }.metric.green .metric-value { color:var(--green); }.metric.orange .metric-value { color:var(--orange); }
.content-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(300px,.8fr); gap:16px; }.panel { background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }.panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 16px; border-bottom:1px solid var(--line); }.panel-head h3 { font-size:15px; margin:0; }.panel-head a { color:var(--blue); font-size:13px; cursor:pointer; }.flow { display:grid; grid-template-columns:repeat(6,1fr); padding:19px 14px; gap:4px; }.flow-step { text-align:center; position:relative; color:#687386; font-size:12px; }.flow-step:not(:last-child)::after { content:""; position:absolute; top:11px; left:64%; width:74%; height:1px; background:#d9dee8; }.flow-dot { position:relative; z-index:1; margin:0 auto 8px; width:22px; height:22px; display:grid; place-items:center; color:#fff; border-radius:50%; background:#a8b2c0; font-size:11px; }.flow-step.done .flow-dot { background:var(--green); }.flow-step.active .flow-dot { background:var(--blue); box-shadow:0 0 0 4px #e7f0ff; }.feed { list-style:none; padding:2px 16px 12px; margin:0; }.feed li { display:flex; gap:10px; padding:11px 0; border-bottom:1px solid #eef0f4; }.feed li:last-child { border-bottom:0; }.feed-mark { width:8px; height:8px; margin-top:6px; border-radius:50%; background:#5a88e9; flex:0 0 auto; }.feed-title { font-size:13px; }.feed-meta { font-size:12px; color:var(--muted); margin-top:2px; }.feed-change { margin-top:4px; color:#355b99; font-size:12px; }
.dashboard-toolbar { min-height:44px; display:flex; align-items:center; gap:18px; margin:-4px 0 14px; padding-bottom:12px; border-bottom:1px solid var(--line); }.dashboard-toolbar > div { display:grid; gap:2px; margin-right:auto; }.dashboard-toolbar > div strong { font-size:14px; }.dashboard-toolbar > div span,.dashboard-updated { color:var(--muted); font-size:12px; }.dashboard-toolbar label { display:flex; align-items:center; gap:8px; color:#4f5c70; font-size:12px; white-space:nowrap; }.dashboard-toolbar select { min-width:132px; min-height:34px; padding:0 9px; border:1px solid #cbd3df; border-radius:5px; background:#fff; color:var(--ink); }
.dashboard-modules,.dashboard-attention { margin-bottom:16px; }.dashboard-modules { overflow:auto; }.dashboard-modules > .panel-head,.dashboard-module-head,.dashboard-module-row { min-width:850px; }.panel-head > div { display:grid; gap:2px; }.compact-button { min-height:30px; font-size:12px; }.dashboard-module-head,.dashboard-module-row { display:grid; grid-template-columns:130px 72px 72px 72px 72px minmax(220px,1fr) 60px; gap:12px; align-items:center; }.dashboard-module-head { min-height:38px; padding:0 16px; color:#7a8596; background:#f8f9fc; border-bottom:1px solid var(--line); font-size:11px; font-weight:600; }.dashboard-module-head span:not(:first-child) { text-align:center; }.dashboard-module-row { min-height:64px; padding:10px 16px; border-bottom:1px solid #edf0f4; }.dashboard-module-row:last-child { border-bottom:0; }.dashboard-module-row > strong { text-align:center; font-size:17px; }.dashboard-module-name { display:grid; gap:1px; padding:0; border:0; background:transparent; color:var(--ink); text-align:left; font-size:15px; font-weight:700; }.dashboard-module-name span { color:var(--blue); font-size:10px; font-weight:500; }.done-count { color:var(--green); }.doing-count { color:var(--orange); }.module-progress { display:grid; grid-template-columns:minmax(100px,1fr) 42px; align-items:center; gap:10px; }.module-progress > span { color:#536074; text-align:right; font-size:12px; font-weight:650; }.module-progress-bar { height:8px; display:flex; overflow:hidden; border-radius:4px; background:#edf0f4; }.module-progress-bar i { height:100%; }.module-progress-bar .done { background:#269353; }.module-progress-bar .doing { background:#dc791d; }.risk-count { min-width:34px; min-height:30px; justify-self:center; border:1px solid #dce2eb; border-radius:5px; background:#fff; color:#7a8596; font-weight:700; }.risk-count.has-risk { color:var(--red); border-color:#efb9c0; background:#fff3f4; }
.attention-grid { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); }.attention-item { min-height:78px; display:grid; align-content:center; gap:4px; padding:12px; border:0; border-right:1px solid #edf0f4; background:#fff; text-align:left; }.attention-item:last-child { border-right:0; }.attention-item:hover { background:#f8faff; }.attention-item span { color:#667286; font-size:11px; }.attention-item strong { color:#263247; font-size:22px; }
.dashboard-lower { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr); gap:16px; }.dashboard-risks,.dashboard-activity { min-height:260px; }.risk-list { display:grid; }.risk-item { width:100%; min-height:56px; display:grid; grid-template-columns:44px minmax(0,1fr) 110px; gap:10px; align-items:center; padding:9px 16px; border:0; border-bottom:1px solid #edf0f4; background:#fff; text-align:left; }.risk-item:last-child { border-bottom:0; }.risk-item:hover { background:#fbfcff; }.risk-level { width:38px; min-height:22px; display:grid; place-items:center; border-radius:4px; color:#9d4d0f; background:#fff1df; font-size:10px; }.risk-level.overdue { color:#ae2637; background:#ffeaed; }.risk-copy { min-width:0; display:grid; gap:2px; }.risk-copy strong { font-size:12px; }.risk-copy small,.risk-owner small { color:var(--muted); font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.risk-owner { display:grid; gap:2px; color:#435066; text-align:right; font-size:11px; }.dashboard-empty { min-height:175px; }.dashboard-lower .dashboard-activity .feed { display:grid; grid-template-columns:1fr; padding:0 16px; }.dashboard-lower .dashboard-activity .feed li { min-width:0; border-right:0; border-bottom:1px solid #eef0f4; padding:12px 2px; }.dashboard-lower .dashboard-activity .feed li:last-child { border-bottom:0; }.dashboard-lower .dashboard-activity .feed-title,.dashboard-lower .dashboard-activity .feed-meta { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.empty-state.compact { padding:18px 20px; grid-template-columns:auto 1fr; justify-content:center; align-items:center; }
.alert-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); }.risk-table { min-width:880px; }.risk-table td:nth-child(2) { width:auto; }.risk-table td:nth-child(4) { min-width:250px; }
.table-wrap { overflow:auto; }.product-table { width:100%; border-collapse:collapse; min-width:970px; }.product-table th { background:#f8f9fc; color:#5d6879; font-weight:600; font-size:12px; white-space:nowrap; padding:11px 12px; border-bottom:1px solid var(--line); text-align:left; }.product-table td { padding:10px 12px; border-bottom:1px solid #edf0f4; vertical-align:middle; }.product-table td:nth-child(2) { width:100px; }.product-table tr:hover td { background:#fbfcff; }.product-table tr:last-child td { border-bottom:0; }.style-code { color:#1748ae; font-weight:700; white-space:nowrap; }.product-image { width:76px; height:104px; object-fit:cover; object-position:center; background:#fff; border:1px solid #e2e6ee; display:block; border-radius:5px; }.previewable-image { cursor:zoom-in; transition:border-color .15s ease,box-shadow .15s ease; }.previewable-image:hover,.previewable-image:focus-visible { border-color:#78a4ff; box-shadow:0 0 0 3px #dce9ff; outline:0; }.tag { display:inline-flex; align-items:center; min-height:23px; padding:0 8px; border-radius:12px; font-size:12px; white-space:nowrap; }.tag.blue { color:#1748ae; background:#eaf2ff; }.tag.green { color:#117538; background:#e7f7ed; }.tag.orange { color:#a34d0d; background:#fff1df; }.tag.red { color:#b72d3c; background:#ffeaed; }.tag.gray { color:#536074; background:#eef1f5; }.action-link { border:0; background:transparent; color:var(--blue); font-weight:600; padding:5px 0; }.stack { display:grid; gap:2px; }.subtle { color:var(--muted); font-size:12px; }.empty-state { padding:46px 20px; text-align:center; display:grid; gap:6px; color:var(--muted); }.empty-state strong { color:#344052; }
.pagination { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 16px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }.pagination-actions { display:flex; gap:8px; }.pagination button:disabled { opacity:.45; cursor:not-allowed; }
.row-actions { display:flex; flex-wrap:wrap; align-items:center; gap:7px; min-width:126px; }.row-actions .primary { min-height:32px; padding:0 10px; font-size:12px; }.row-actions .action-link { white-space:nowrap; }
.role-banner { border:1px solid #b9d0ff; background:#eff5ff; padding:12px 14px; display:flex; align-items:center; gap:12px; margin-bottom:16px; border-radius:6px; }.role-banner strong { color:#1748ae; }.role-banner span { color:#4f5e72; font-size:13px; }.role-banner button { margin-left:auto; }
.work-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:16px; }.work-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:16px; transition:border-color .15s ease,box-shadow .15s ease; }.work-card.is-drilldown { border-color:#8eb3f5; box-shadow:0 0 0 3px #e6efff; }.work-card h3 { margin:0; font-size:15px; }.work-card p { margin:7px 0 14px; color:var(--muted); min-height:38px; font-size:13px; }.work-card .number { margin-top:4px; font-size:25px; font-weight:750; }.work-card-number { display:inline-flex; align-items:baseline; gap:9px; padding:0; border:0; background:transparent; color:var(--ink); text-align:left; cursor:pointer; }.work-card-number span { color:var(--blue); font-size:12px; font-weight:650; opacity:.72; }.work-card-number:hover,.work-card-number:focus-visible,.work-card-number.active { color:#1748ae; outline:0; }.work-card-number:hover span,.work-card-number:focus-visible span,.work-card-number.active span { opacity:1; text-decoration:underline; }.work-card-number:focus-visible { box-shadow:0 0 0 3px #dce9ff; border-radius:3px; }.work-card-zero { color:#172033; cursor:default; }.work-detail-anchor { scroll-margin-top:16px; }.two-columns { display:grid; grid-template-columns:1.2fr .8fr; gap:16px; }
.work-filter-bar { display:grid; gap:12px; margin-bottom:16px; padding:14px 16px; background:#fff; border:1px solid var(--line); border-radius:var(--radius); }.work-filter-title { display:flex; align-items:baseline; gap:10px; }.work-filter-title strong { font-size:14px; }.work-filter-title span,.work-filter-result { color:var(--muted); font-size:12px; }.work-filter-controls { display:grid; grid-template-columns:minmax(360px,1.45fr) minmax(170px,.7fr) minmax(190px,.8fr) auto; gap:10px; align-items:end; }.work-filter-field { display:grid; gap:6px; color:#405066; font-size:12px; }.work-filter-field input,.work-filter-field select { width:100%; min-height:38px; border:1px solid #cbd3df; border-radius:5px; padding:7px 9px; color:var(--ink); background:#fff; }.date-range { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:7px; }.date-range i { color:var(--muted); font-style:normal; font-size:12px; }.work-filter-reset { min-height:38px; }.work-filter-reset:disabled { opacity:.45; cursor:not-allowed; }.work-filter-result { text-align:right; }.work-filter-result strong { color:#1748ae; font-size:14px; }
.order-toolbar { margin:4px 0 10px; }.order-toolbar .filters { align-items:center; }.order-table { min-width:1750px; }.order-table td:nth-child(2) { width:100px; }.compact-order-lines { display:block; min-width:155px; max-width:240px; line-height:1.55; white-space:normal; color:#44546b; }.order-product-picker { display:grid; gap:6px; position:relative; }.order-product-picker > label { display:block; }.order-product-search { height:42px; display:flex; align-items:center; gap:8px; padding:0 10px; border:1px solid #cbd3df; border-radius:6px; background:#fff; color:#7c899b; }.order-product-search:focus-within { border-color:var(--blue); outline:3px solid #e3edff; }.order-product-search > span { font-size:20px; line-height:1; }.order-product-search input { min-width:0; flex:1; height:38px; padding:0; border:0; outline:0; }.order-product-search input.has-selection { color:#1748ae; font-weight:650; }.order-search-clear { width:24px; height:24px; padding:0; border:0; border-radius:50%; background:#e9edf3; color:#536074; font-size:17px; line-height:1; }.order-search-clear:hover { background:#dce4f0; }.order-product-results { position:absolute; left:0; right:0; top:70px; z-index:4; display:grid; max-height:330px; overflow:auto; padding:5px; border:1px solid #cbd5e3; border-radius:7px; background:#fff; box-shadow:0 12px 30px #25334a24; }.order-product-result { display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:9px; width:100%; padding:7px 8px; border:0; border-radius:5px; background:#fff; text-align:left; }.order-product-result:hover,.order-product-result:focus-visible { background:#eef5ff; outline:0; }.order-product-result img { width:38px; height:48px; object-fit:cover; border:1px solid var(--line); border-radius:4px; background:#f5f7fa; }.order-product-result span { min-width:0; display:grid; gap:2px; }.order-product-result strong,.order-product-result small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.order-product-result strong { color:#1e4fa8; font-size:13px; }.order-product-result small { color:#687386; font-size:11px; }.order-product-result em { color:#687386; font-size:11px; font-style:normal; white-space:nowrap; }.order-product-empty { padding:12px; color:#687386; font-size:12px; text-align:center; }.order-product-hint { margin:0; color:var(--muted); font-size:12px; }.order-product-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:11px 12px; background:#f7f9fc; border:1px solid var(--line); border-radius:6px; color:#4f5e72; font-size:13px; }.order-product-summary span { min-width:0; }
.order-material-card,.order-lines-card { display:grid; gap:10px; padding:13px 14px; border:1px solid var(--line); border-radius:7px; background:#fbfcfe; }.order-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }.order-section-head h3 { margin:0; font-size:14px; }.order-section-head p { margin:3px 0 0; color:var(--muted); font-size:12px; }.material-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; color:#536074; font-size:12px; }.material-grid b { color:var(--ink); font-weight:650; }.inline-warning { padding:8px 10px; color:#8d4311; background:#fff6e8; border:1px solid #f2d3a8; border-radius:5px; font-size:12px; }.inline-success { padding:8px 10px; color:#17663a; background:#edf9f1; border:1px solid #b9e3c7; border-radius:5px; font-size:12px; }.order-line-table { width:100%; min-width:560px; border-collapse:collapse; }.order-line-table th,.order-line-table td { padding:8px 9px; border-bottom:1px solid #e9edf3; text-align:left; font-size:12px; }.order-line-table th { color:#607087; font-weight:600; background:#f4f7fb; }.order-line-table tr:last-child td { border-bottom:0; }.order-line-quantity { width:110px; border:1px solid #cbd3df; border-radius:5px; padding:6px 8px; }.order-line-table code { color:#315fa9; font-size:11px; }.order-calc-note { padding:9px 11px; color:#4b5d75; background:#f3f7ff; border-left:3px solid #75a1ef; font-size:12px; }.order-calc-note strong { color:#1748ae; font-size:14px; }
.dialog { width:min(860px,calc(100% - 28px)); max-height:min(760px,calc(100% - 28px)); border:0; border-radius:8px; padding:0; box-shadow:0 18px 60px #19263b40; }.dialog::backdrop { background:#19223680; }.dialog-inner { background:#fff; }.dialog-head { display:flex; justify-content:space-between; align-items:center; padding:18px 20px; border-bottom:1px solid var(--line); }.dialog-head h2 { margin:0; font-size:18px; }.dialog-head .close { border:0; background:transparent; color:#687386; font-size:23px; width:32px; height:32px; padding:0; }.details { padding:20px; }.detail-top { display:grid; grid-template-columns:190px minmax(0,1fr); gap:18px; align-items:start; }.image-block { display:grid; gap:8px; width:190px; }.image-caption { display:flex; justify-content:center; }.image-upload { min-height:30px; font-size:12px; }.detail-image { width:190px; height:228px; object-fit:cover; object-position:center; background:#f2f3f7; border:1px solid var(--line); border-radius:6px; }.detail-title { margin:0; font-size:21px; }.detail-meta { margin:8px 0; color:var(--muted); }.detail-actions { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-start; padding-top:2px; }.section-title { margin:22px 0 9px; color:#2a3548; font-size:14px; }.fields { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:6px; overflow:hidden; }.field { min-height:73px; padding:11px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }.field:nth-child(3n) { border-right:0; }.field:nth-last-child(-n+3) { border-bottom:0; }.field label { display:block; color:var(--muted); font-size:12px; margin-bottom:5px; }.field strong { font-weight:600; }.field input,.field select,.field textarea { width:100%; border:1px solid #cbd3df; border-radius:4px; padding:6px 7px; outline-color:#8bb4ff; }.field textarea { height:54px; resize:vertical; }.timeline { margin:0; padding:0; list-style:none; }.timeline li { padding:8px 0 8px 16px; border-left:2px solid #dbe5f8; position:relative; }.timeline li::before { content:""; width:7px; height:7px; border-radius:50%; background:#4d80df; position:absolute; left:-4.5px; top:14px; }.timeline time { color:var(--muted); font-size:12px; margin-left:5px; }
.form { padding:20px; display:grid; gap:15px; }.form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }.form label { display:grid; gap:6px; color:#405066; font-size:13px; }.form input,.form select,.form textarea { border:1px solid #cbd3df; border-radius:5px; padding:9px; color:var(--ink); background:#fff; }.form textarea { min-height:76px; resize:vertical; }.size-picker { display:flex; gap:7px; flex-wrap:wrap; }.size-picker label { display:flex; align-items:center; gap:5px; border:1px solid var(--line); padding:5px 8px; border-radius:5px; }.form-footer { display:flex; justify-content:flex-end; align-items:center; gap:8px; padding-top:4px; }.form-footer button { min-width:80px; white-space:nowrap; }
.image-field { align-content:start; }.image-drop { min-height:82px; display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px dashed #aebbd0; border-radius:6px; background:#fafcff; cursor:pointer; outline:none; transition:border-color .15s ease,background .15s ease,box-shadow .15s ease; }.image-drop:hover,.image-drop:focus,.image-drop.drag-over { border-color:var(--blue); background:#eef5ff; box-shadow:0 0 0 3px #dce9ff; }.image-drop.has-image { border-style:solid; border-color:#6db586; background:#f2faf5; }.image-drop img { width:56px; height:56px; flex:0 0 56px; object-fit:contain; border-radius:4px; background:#fff; border:1px solid #dfe6e3; }.image-drop-icon { width:30px; height:30px; flex:0 0 30px; display:grid; place-items:center; border-radius:50%; background:#e8f0ff; color:#1d5bd1; font-size:20px; font-weight:700; }.image-drop.has-image .image-drop-icon { display:none; }.image-drop-copy { min-width:0; display:grid; gap:3px; }.image-drop-copy strong { color:#263247; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.image-drop-copy small { color:var(--muted); font-size:12px; }
.full-field { grid-column:1/-1; }.edit-product { margin-top:12px; }.details .fields + .edit-product { display:block; }
.detail-focus-section { margin-top:22px; padding-top:16px; border-top:1px solid var(--line); }.detail-focus-section .section-title { margin-top:0; margin-bottom:4px; }.detail-fields-empty { padding:16px; border:1px dashed #d6dde8; border-radius:6px; color:var(--muted); background:#fbfcfe; font-size:13px; }.detail-more-fields { margin-top:10px; border:1px solid var(--line); border-radius:6px; background:#fbfcfe; overflow:hidden; }.detail-more-fields summary { padding:10px 12px; color:#44536b; font-size:13px; font-weight:650; cursor:pointer; list-style:none; }.detail-more-fields summary::-webkit-details-marker { display:none; }.detail-more-fields summary::after { content:"展开"; float:right; color:var(--blue); font-weight:600; }.detail-more-fields[open] summary::after { content:"收起"; }.detail-more-fields .fields { border:0; border-top:1px solid var(--line); border-radius:0; }.detail-compact-edit { display:block; margin-top:10px; }
.activity-panel { position:fixed; top:80px; right:0; width:380px; height:calc(100vh - 80px); background:#fff; border-left:1px solid var(--line); z-index:3; padding:18px; transform:translateX(100%); transition:transform .18s ease; box-shadow:-6px 0 22px #2637520d; overflow:auto; }.activity-panel.open { transform:translateX(0); }.activity-panel h2 { font-size:16px; margin:0 0 12px; }.activity-panel .feed { padding:0; }.activity-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:12px; }.activity-head h2 { margin:0; }.activity-head > div:first-child { display:grid; gap:3px; }.activity-summary { color:var(--muted); font-size:11px; }.activity-head-actions { display:flex; align-items:center; gap:6px; flex-wrap:wrap; justify-content:flex-end; }.activity-panel .feed-item[data-open] { cursor:pointer; border-radius:5px; padding-left:7px; padding-right:7px; margin-left:-7px; margin-right:-7px; }.activity-panel .feed-item[data-open]:hover,.activity-panel .feed-item[data-open]:focus-visible { background:#f3f8f7; outline:0; }.activity-panel .feed-item.unread { background:#fffaf2; }.notification-item { padding:11px 8px; border-bottom:1px solid #edf0f4; }.notification-item:last-child { border-bottom:0; }.notification-message { margin-top:6px; color:#435066; font-size:12px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }.notification-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:8px; }.notification-dialog { width:min(720px, calc(100vw - 28px)); }.notification-recipient-fieldset { border:1px solid var(--line); border-radius:8px; padding:12px; margin:0; }.notification-recipient-fieldset legend { padding:0 5px; color:var(--ink); font-size:13px; font-weight:700; }.notification-recipient-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-height:260px; overflow:auto; padding:2px; }.notification-recipient-option { display:flex; align-items:flex-start; gap:8px; min-width:0; padding:9px 10px; border:1px solid var(--line); border-radius:7px; background:#fbfcfe; cursor:pointer; }.notification-recipient-option:hover { border-color:#9ccfc8; background:#f4fbfa; }.notification-recipient-option input { margin-top:2px; accent-color:#2f8f86; }.notification-recipient-option span { display:grid; gap:2px; min-width:0; }.notification-recipient-option strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }.notification-recipient-option small { color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.audit-table { min-width:760px; }.activity-record-id { color:#315fa9; font-size:11px; }.history-actions { display:flex; align-items:center; gap:8px; margin-top:9px; }.audit-toolbar { align-items:flex-end; }.audit-lookup { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }.audit-lookup input { min-width:220px; }
.activity-button { position:relative; }.activity-badge { position:absolute; top:-5px; right:-7px; min-width:17px; height:17px; padding:0 4px; display:grid; place-items:center; border:2px solid #fff; border-radius:9px; color:#fff; background:#c2414f; font-size:10px; font-weight:750; line-height:1; }
.notification-context { margin-top:6px; color:#236c65; font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.sku-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }.sku-chip { display:grid; gap:3px; min-width:0; padding:9px 10px; border:1px solid var(--line); border-radius:5px; background:#fafbfe; }.sku-chip strong { overflow-wrap:anywhere; font-size:13px; }.sku-chip small { color:var(--muted); }.activity-panel .activity-heading { margin-top:24px; padding-top:18px; border-top:1px solid var(--line); }
.work-attention-list { display:grid; gap:4px; margin-top:5px; }.work-attention { display:grid; gap:1px; padding:4px 6px; border-left:3px solid #c88a32; border-radius:3px; background:#fff8ed; line-height:1.35; }.work-attention strong { color:#8a5414; font-size:11px; }.work-attention small { color:#765f42; font-size:10px; white-space:normal; overflow-wrap:anywhere; }.work-attention-return { border-left-color:#c2414f; background:#fff3f4; }.work-attention-return strong { color:#9f2e3b; }.work-attention-task { border-left-color:#347e77; background:#eef8f5; }.work-attention-task strong { color:#17655d; }.pattern-requirement-preview { max-width:250px; white-space:normal; overflow-wrap:anywhere; }
.sku-section-heading { margin-top:22px; }.sku-section-heading .section-title { margin:0 0 4px; }.assortment-dialog { max-width:760px; }.assortment-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; padding:12px; border:1px solid #e1e6ee; border-radius:7px; background:#f8faff; }.assortment-summary > div { display:grid; align-content:start; gap:5px; min-width:0; }.assortment-summary span,.assortment-summary small { color:var(--muted); font-size:12px; }.assortment-summary strong { color:#17243a; font-size:20px; }.assortment-chips { display:flex; flex-wrap:wrap; gap:4px; }.assortment-chips i { padding:3px 6px; border-radius:4px; color:#345277; background:#eaf2ff; font-size:11px; font-style:normal; }.assortment-size-picker { padding-top:3px; }.assortment-size { display:flex !important; align-items:center; gap:5px; padding:7px 9px !important; }.assortment-size.existing { color:#7c8797; background:#f4f6f9; }.assortment-size small { color:#8792a3; font-size:10px; }.assortment-preview { padding:10px 12px; border:1px solid #d6e3fa; border-radius:5px; color:#355579; background:#f3f7ff; font-size:12px; line-height:1.5; }.assortment-preview strong { color:#1c55b4; }
.create-assortment-preview { min-height:48px; display:flex; align-items:center; flex-wrap:wrap; gap:5px 7px; padding:8px 10px; border:1px solid #dce4f0; border-radius:5px; color:#718096; background:#f8faff; font-size:11px; line-height:1.4; }.create-assortment-preview .assortment-chips { display:contents; }.create-assortment-preview .assortment-chips i { padding:4px 7px; color:#254e86; background:#e9f1ff; }.create-assortment-preview .create-color-preview-label { color:#687386; }.create-assortment-preview strong { margin-left:auto; color:#1748ae; font-size:12px; white-space:nowrap; }.create-assortment-preview small { flex:0 0 100%; color:#7c8798; }
.dialog-head-actions { display:flex; align-items:center; gap:8px; }.product-history-trigger { white-space:nowrap; }.product-history-panel { padding:16px 20px; background:#f8f9fc; border-bottom:1px solid var(--line); max-height:360px; overflow:auto; }.history-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:10px; }.history-head h3 { margin:0; font-size:15px; }.history-head p { margin:3px 0 0; color:var(--muted); font-size:12px; }.history-feed { padding:0; }.history-feed li { background:#fff; padding:11px 12px; border:1px solid #e4e8ef; border-radius:6px; margin-bottom:8px; }.history-feed li:last-child { border-bottom:1px solid #e4e8ef; }.history-changes { display:grid; gap:5px; margin-top:8px; }.history-change { display:grid; grid-template-columns:90px minmax(0,1fr) 14px minmax(0,1fr); gap:6px; align-items:start; font-size:12px; }.history-change span { color:#526075; font-weight:600; }.history-change del { color:#9a3f49; text-decoration:none; background:#fff0f2; padding:2px 5px; border-radius:3px; overflow-wrap:anywhere; }.history-change b { color:#8a95a5; text-align:center; }.history-change ins { color:#16713b; text-decoration:none; background:#edf9f1; padding:2px 5px; border-radius:3px; overflow-wrap:anywhere; }.detail-image-drop { width:190px; min-height:0; padding:8px; display:grid; grid-template-columns:1fr; justify-items:center; gap:8px; }.detail-image-drop img { width:172px; height:210px; flex:0 0 auto; object-fit:cover; object-position:center; }.detail-image-drop .image-drop-copy { text-align:center; }.detail-image-drop .image-drop-copy strong { white-space:normal; line-height:1.35; }.detail-image-drop.uploading { opacity:.72; pointer-events:none; }
.image-preview-dialog { position:fixed; inset:0; width:100vw; max-width:none; height:100dvh; max-height:none; margin:0; padding:0; border:0; background:transparent; overflow:hidden; }.image-preview-dialog[open] { display:grid; place-items:center; }.image-preview-dialog::backdrop { background:#0b111ddd; }.image-preview-stage { max-width:100vw; max-height:100dvh; padding:32px 56px 48px; display:grid; place-items:center; gap:10px; pointer-events:none; }.image-preview-stage img { display:block; width:auto; height:auto; max-width:calc(100vw - 112px); max-height:calc(100dvh - 104px); object-fit:contain; object-position:center; background:#111827; border-radius:4px; box-shadow:0 18px 64px #0009; }.image-preview-stage p { min-height:18px; margin:0; color:#eef2f8; font-size:13px; text-align:center; }.image-preview-close { position:fixed; top:18px; right:20px; z-index:2; width:42px; height:42px; padding:0; display:grid; place-items:center; border:1px solid #ffffff55; border-radius:50%; background:#111827cc; color:#fff; font-size:28px; line-height:1; }.image-preview-close:hover,.image-preview-close:focus-visible { background:#25324a; border-color:#fff; outline:2px solid #8db4ff; outline-offset:2px; }
@media (max-width:760px) { .dialog-head-actions { gap:3px; }.product-history-trigger { padding:0 8px; }.product-history-panel { padding:14px; }.history-change { grid-template-columns:74px 1fr; }.history-change b { display:none; }.history-change ins { grid-column:2; }.detail-top { grid-template-columns:112px 1fr; gap:12px; }.image-block,.detail-image-drop { width:112px; }.detail-image { width:112px; height:144px; }.detail-image-drop img { width:94px; height:122px; }.detail-image-drop .image-drop-copy small { display:none; } }
@media (max-width:760px) { .image-preview-stage { padding:62px 14px 44px; }.image-preview-stage img { max-width:calc(100vw - 28px); max-height:calc(100dvh - 116px); }.image-preview-close { top:12px; right:12px; } }
@media (max-width:1080px) { .metrics { grid-template-columns:repeat(3,1fr); }.content-grid,.two-columns,.dashboard-lower { grid-template-columns:1fr; }.attention-grid { grid-template-columns:repeat(4,1fr); }.attention-item:nth-child(4) { border-right:0; }.attention-item:nth-child(-n+4) { border-bottom:1px solid #edf0f4; }.work-cards { grid-template-columns:repeat(2,1fr); }.work-filter-controls { grid-template-columns:1fr 1fr; }.work-filter-date { grid-column:1/-1; }.work-filter-reset { justify-self:start; min-width:88px; } }
@media (max-width:760px) { .app-shell { display:block; }.sidebar { min-height:auto; height:auto; position:static; padding:10px; }.brand { padding:0; }.nav { display:flex; overflow:auto; margin-top:10px; }.nav-item { width:auto; white-space:nowrap; }.sidebar-footer { display:none; }.topbar { height:auto; min-height:72px; padding:12px 16px; align-items:flex-start; gap:12px; }.top-actions { flex-wrap:wrap; justify-content:flex-end; }.search { width:190px; }.page { padding:18px 16px 34px; }.dashboard-toolbar { align-items:flex-start; flex-wrap:wrap; }.dashboard-toolbar > div { width:100%; }.dashboard-updated { order:3; }.metrics { grid-template-columns:repeat(2,1fr); }.metric { min-height:96px; }.toolbar { align-items:flex-start; flex-direction:column; }.attention-grid { grid-template-columns:repeat(2,1fr); }.attention-item:nth-child(2n) { border-right:0; }.attention-item:nth-child(-n+6) { border-bottom:1px solid #edf0f4; }.risk-item { grid-template-columns:44px minmax(0,1fr); }.risk-owner { grid-column:2; text-align:left; }.empty-state.compact { grid-template-columns:1fr; }.work-cards { grid-template-columns:1fr; }.work-filter-title { display:grid; gap:3px; }.work-filter-controls { grid-template-columns:1fr; }.work-filter-date { grid-column:auto; }.date-range { grid-template-columns:1fr; }.date-range i { display:none; }.work-filter-reset { width:100%; }.work-filter-result { text-align:left; }.order-product-summary { grid-template-columns:1fr 1fr; }.material-grid { grid-template-columns:1fr 1fr; }.detail-top { grid-template-columns:112px 1fr; }.image-block,.detail-image-drop { width:112px; }.detail-image { width:112px; height:144px; }.detail-image-drop img { width:94px; height:122px; }.detail-actions { grid-column:1/-1; justify-content:flex-start; }.fields,.form-grid,.sku-grid { grid-template-columns:1fr; }.field { border-right:0; }.field:nth-last-child(-n+3) { border-bottom:1px solid var(--line); }.field:last-child { border-bottom:0; } }

/* Recall requests are business events, not implementation payloads. */
.history-recall-card { display:grid; gap:7px; margin-top:8px; padding:10px 12px; border:1px solid #cfe4dc; border-left:3px solid #2f8f86; border-radius:7px; background:#f4fbf8; }
.history-recall-card > div { display:grid; grid-template-columns:72px minmax(0,1fr); gap:8px; align-items:start; font-size:12px; }
.history-recall-card span { color:#55716c; font-weight:650; }
.history-recall-card strong { color:#243f3b; font-weight:600; overflow-wrap:anywhere; }
.recall-request-section { margin:16px 0 22px; padding:14px 16px; border:1px solid #d9e5ee; border-radius:10px; background:#f8fafc; }
.recall-request-section.is-pending { border-color:#efd4a4; background:#fffaf0; }
.recall-request-section .section-heading { margin:0; }
@media (max-width:760px) { .styling-layout { grid-template-columns:1fr; }.styling-image-wrap,.styling-image { width:100%; }.match-picker { grid-template-columns:1fr; }.matching-product { grid-template-columns:44px auto; }.matching-product > span { grid-column:2; }.match-style-list { max-width:120px; } }
.design-image-strip { display:flex; flex-wrap:wrap; gap:6px; width:100%; }
.design-image-thumb-wrap { position:relative; display:inline-flex; width:48px; min-height:60px; align-items:flex-start; justify-content:center; cursor:grab; touch-action:none; }
.design-image-thumb-wrap:active { cursor:grabbing; }
.design-image-thumb-wrap.is-dragging { opacity:.45; }
.design-image-thumb-wrap.drag-over { transform:translateY(-2px); }
.design-image-strip.is-saving { opacity:.65; pointer-events:none; }
.design-image-thumb { position:relative; width:42px; height:52px; padding:2px; border:1px solid var(--line); border-radius:5px; background:#fff; cursor:pointer; }
.design-image-thumb img { display:block; width:100%; height:100%; object-fit:cover; border-radius:3px; }
.design-image-thumb span { position:absolute; right:2px; bottom:2px; padding:1px 3px; border-radius:3px; color:#fff; background:#173331cc; font-size:9px; line-height:1.2; }
.design-image-thumb.is-cover,.design-image-thumb.active { border-color:var(--primary); box-shadow:0 0 0 2px var(--primary-soft); }
.design-image-delete { position:absolute; top:-7px; right:-3px; width:19px; height:19px; padding:0; border:1px solid #e2b4bb; border-radius:50%; color:#a93647; background:#fff; font-size:0; line-height:1; box-shadow:0 2px 7px #23352f1c; }
.design-image-delete::after { content:"×"; font-size:14px; font-weight:700; }
.design-image-delete:hover,.design-image-delete:focus-visible { color:#fff; border-color:#a93647; background:#a93647; outline:2px solid #f4d5d9; outline-offset:1px; }
.design-image-delete:disabled { opacity:.55; cursor:wait; }
.design-image-replace { position:absolute; left:50%; bottom:-7px; transform:translateX(-50%); min-height:18px; padding:0 4px; border:1px solid #c7ddd8; border-radius:4px; color:#176f67; background:#fff; font-size:9px; line-height:16px; white-space:nowrap; box-shadow:0 2px 7px #23352f1c; }
.design-image-replace:hover,.design-image-replace:focus-visible { color:#fff; border-color:#176f67; background:#176f67; outline:2px solid #cde9e3; outline-offset:1px; }
.design-image-replace:disabled { opacity:.55; cursor:wait; }
.design-image-keep-one,.design-image-order-hint { display:block; margin-top:5px; color:var(--muted); font-size:11px; }
.effect-status.stale { color:#7a5a23; background:#fff3d9; }
.design-image-keep-one { color:#8a5b24; }
.design-image-picker-list { display:flex; flex-wrap:wrap; gap:7px; margin-top:7px; }
.design-image-picker-chip { position:relative; display:inline-flex; width:60px; height:72px; padding:2px; border:1px solid #c7ddd8; border-radius:6px; background:#f7fbfa; }
.design-image-picker-chip img { width:100%; height:100%; object-fit:cover; border-radius:4px; }
.design-image-picker-chip b { position:absolute; left:4px; bottom:4px; padding:1px 3px; border-radius:3px; color:#fff; background:#173331cc; font-size:9px; }
.design-image-picker-chip button { position:absolute; top:-7px; right:-7px; width:20px; height:20px; padding:0; border:1px solid #d7e4e1; border-radius:50%; color:#315d58; background:#fff; cursor:pointer; line-height:17px; }
.design-image-picker-chip button:hover { color:#b13c4a; border-color:#e9aeb5; }

/* Executive dashboard sales layer: platform actuals and internal order estimates stay separate. */
.dashboard-kpi-grid { grid-template-columns:repeat(7,minmax(0,1fr)); }
.dashboard-kpi-card.sales { border-color:#b9d2ff; background:linear-gradient(145deg,#f7faff,#fff); }
.dashboard-kpi-card.sales > span { color:#315fa9; font-weight:650; }
.dashboard-kpi-card.sales > strong { color:#1858c7; font-size:27px; overflow-wrap:anywhere; }
.dashboard-sales-panel { margin-bottom:16px; }
.dashboard-sales-panel > .panel-head { min-height:62px; }
.dashboard-sales-panel > .panel-head > a { color:var(--blue); font-size:12px; cursor:pointer; white-space:nowrap; }
.dashboard-sales-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:14px 16px 12px; }
.dashboard-sales-card { min-width:0; display:grid; gap:5px; padding:13px 14px; border:1px solid #e1e7f0; border-radius:7px; background:#fbfcfe; }
.dashboard-sales-card.platform { border-color:#bfd5ff; background:#f7faff; }
.dashboard-sales-card.order { border-color:#dccaf5; background:#fbf9ff; }
.dashboard-sales-card > span { color:#667386; font-size:11px; }
.dashboard-sales-card > strong { color:#263247; font-size:23px; line-height:1.15; overflow-wrap:anywhere; }
.dashboard-sales-card.platform > strong { color:#1858c7; }
.dashboard-sales-card.order > strong { color:#7152c8; }
.dashboard-sales-card > small { min-height:30px; color:#7b8798; font-size:11px; line-height:1.45; }
.dashboard-sales-definition { margin:0; padding:0 16px 14px; color:#687386; font-size:11px; line-height:1.6; }
@media (max-width:1250px) {
  .dashboard-kpi-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .dashboard-sales-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .dashboard-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-sales-grid { grid-template-columns:1fr; gap:8px; padding:12px; }
  .dashboard-sales-panel > .panel-head { align-items:flex-start; }
  .dashboard-sales-panel > .panel-head > a { margin-top:2px; }
}

/* 2026-08-29 notification-priority=20260829 */
.activity-filter-note {
  margin:10px 0 2px;
  color:var(--muted);
  font-size:12px;
  line-height:1.5;
}

.tenant-switcher { display:flex; align-items:center; }
.tenant-switcher select { min-width:190px; max-width:260px; font-weight:650; }
@media (max-width:760px) {
  .tenant-switcher { width:100%; order:4; }
  .tenant-switcher select { width:100%; max-width:none; }
}

/* Procurement execution sheet: dense enough for buyers, readable on mobile. */
.procurement-materials-section { margin:24px 0; padding:20px; border:1px solid rgba(35,108,101,.16); border-radius:18px; background:linear-gradient(135deg,rgba(247,252,250,.96),#fff); }
.design-materials-section { margin:24px 0; padding:20px; border:1px solid #dce5ef; border-radius:12px; background:#fbfcfe; }
.design-materials-section .section-heading { align-items:flex-start; }
.design-material-status { display:inline-flex; align-items:center; min-height:28px; padding:4px 10px; border-radius:999px; font-size:12px; font-weight:700; }
.design-material-status.ready { color:#126a4d; background:#e8f8f0; border:1px solid #a9dfc7; }
.design-material-status.pending { color:#8a5a18; background:#fff7e7; border:1px solid #efd39a; }
.design-material-table { min-width:680px; }
.design-material-dialog { max-width:1120px; }
.design-material-editor-wrap { overflow-x:auto; }
.design-material-editor { width:100%; min-width:860px; border-collapse:collapse; }
.design-material-editor th,.design-material-editor td { padding:8px; border-bottom:1px solid #e8edf3; vertical-align:top; text-align:left; }
.design-material-editor th { color:#5c6d83; font-size:12px; font-weight:700; background:#f3f6fa; }
.design-material-editor input,.design-material-editor select { width:100%; min-width:92px; border:1px solid #cbd5e1; border-radius:6px; padding:7px 8px; color:var(--ink); background:#fff; }
.design-material-editor td:first-child { min-width:190px; }
.design-material-editor td:last-child { width:58px; }
.design-material-dialog .dialog-help { margin:0 20px 4px; color:#66758a; line-height:1.6; }
.procurement-materials-section .section-heading { align-items:flex-start; }
.procurement-material-table td { vertical-align:top; }
.procurement-material-table td strong, .procurement-material-table td .subtle { display:block; }
.procurement-material-dialog { max-width:820px; }
.procurement-material-dialog .dialog-help { max-width:700px; }
.procurement-bulk-toolbar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:12px 14px; border:1px solid #dbe3ec; border-radius:8px; background:#f8fafc; }
.procurement-bulk-toolbar span { flex:1 1 280px; color:var(--muted); font-size:12px; line-height:1.5; }
.procurement-bulk-row { margin-top:14px; padding:14px; border:1px solid #dfe6ee; border-radius:8px; background:#fff; }
.procurement-bulk-row-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; color:#263247; }
.procurement-bulk-row .form-grid { gap:12px; }
.procurement-bulk-row label { min-width:0; }
.procurement-material-sources { border:1px solid #e4e9ef; border-radius:8px; background:#fbfcfe; }
.procurement-material-sources > summary { padding:11px 14px; color:#46536a; font-weight:700; cursor:pointer; }
.procurement-material-sources[open] > summary { border-bottom:1px solid #e4e9ef; }
.procurement-material-sources > .procurement-material-group { margin:12px; }
.procurement-materials-section .section-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.procurement-material-groups { display:grid; gap:12px; }
.procurement-material-group { overflow:hidden; border:1px solid #e4e9ef; border-radius:12px; background:#fff; }
.procurement-material-group.design { border-color:#d9e1ec; background:#fbfcfe; }
.procurement-material-group.actual { border-color:#c8e4d7; background:#fcfffd; }
.procurement-material-group-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border-bottom:1px solid #e8edf2; }
.procurement-material-group-heading h4 { margin:0 0 3px; color:#263247; font-size:13px; }
.procurement-material-group-heading span { color:var(--muted); font-size:11px; }
.procurement-material-group-heading > strong { color:#516174; font-size:12px; white-space:nowrap; }
.procurement-material-group.actual .procurement-material-group-heading > strong { color:#157747; }
.procurement-material-group .table-wrap { border-radius:0; }
.procurement-material-scroll { overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scrollbar-gutter:stable; }
.procurement-material-wide-table { min-width:1320px; table-layout:auto; }
.procurement-material-wide-table th,
.procurement-material-wide-table td { padding:11px 14px; line-height:1.45; white-space:normal; }
.procurement-material-wide-table th:nth-child(1), .procurement-material-wide-table td:nth-child(1) { min-width:180px; }
.procurement-material-wide-table th:nth-child(2), .procurement-material-wide-table td:nth-child(2) { min-width:110px; }
.procurement-material-wide-table th:nth-child(3), .procurement-material-wide-table td:nth-child(3) { min-width:125px; white-space:nowrap; }
.procurement-material-wide-table th:nth-child(4), .procurement-material-wide-table td:nth-child(4) { min-width:150px; }
.procurement-material-wide-table th:nth-child(5), .procurement-material-wide-table td:nth-child(5) { min-width:145px; }
.procurement-material-wide-table th:nth-child(6), .procurement-material-wide-table td:nth-child(6) { min-width:120px; }
.procurement-material-wide-table th:nth-child(7), .procurement-material-wide-table td:nth-child(7) { min-width:135px; }
.procurement-material-wide-table th:nth-child(8), .procurement-material-wide-table td:nth-child(8) { min-width:155px; }
.procurement-material-wide-table th:nth-child(9), .procurement-material-wide-table td:nth-child(9) { min-width:220px; }
.procurement-material-wide-table th:nth-child(10), .procurement-material-wide-table td:nth-child(10) { min-width:150px; }
.procurement-progress-cell { display:grid; gap:5px; min-width:120px; }
.procurement-material-wide-table .row-actions { display:flex; flex-wrap:wrap; gap:8px; min-width:130px; }
.procurement-source-badge { display:inline-flex !important; width:max-content; margin-top:3px; padding:2px 6px; border-radius:9px; font-size:10px !important; line-height:1.2; }
.procurement-source-badge.design { color:#536074; background:#edf1f5; }
.procurement-source-badge.actual { color:#157747; background:#e3f5ea; }
.procurement-material-group.design .procurement-material-table td { color:#536074; }
@media (max-width:760px) { .procurement-materials-section { padding:14px; overflow:hidden; } .procurement-material-table { min-width:760px; } .procurement-material-wide-table { min-width:1320px; } }

/* Dealer material handoff: downstream production needs the source supplier
   when one was provided, while an omitted supplier remains visibly optional. */
.dealer-material-list-section { margin:24px 0; padding:20px; border:1px solid #d8e6ee; border-radius:12px; background:#fbfdff; }
.dealer-material-list-section .section-heading { align-items:flex-start; }
.dealer-material-list-section .section-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.dealer-material-list-table { min-width:760px; }
.dealer-material-list-table td { vertical-align:top; }
.dealer-material-list-table td strong, .dealer-material-list-table td .subtle { display:block; }
.dealer-material-list-table td:nth-child(3) { color:#2e556b; font-weight:650; }
.dealer-material-preview { grid-template-columns:repeat(2,minmax(0,1fr)); }
.dealer-material-preview span { display:grid; gap:3px; padding:8px 10px; border:1px solid #e2e9f0; border-radius:7px; background:#fff; min-width:0; }
.dealer-material-preview strong { color:var(--ink); overflow-wrap:anywhere; }
.dealer-material-preview b { color:#233b58; font-weight:700; }
.dealer-material-preview small { color:var(--muted); overflow-wrap:anywhere; }
@media (max-width:760px) {
  .dealer-material-list-section { padding:14px; overflow:hidden; }
  .dealer-material-list-table { min-width:760px; }
  .dealer-material-preview { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .permission-empty { align-items:flex-start; flex-direction:column; min-height:220px; padding:28px 22px; }
}

/* Employee picker: replace the platform-native select sheet with a compact,
   searchable surface that keeps name, number and team visually separated. */
.hr-employee-field { min-width:0; position:relative; display:grid; gap:6px; }
.hr-employee-field > label { display:block; color:#405b58; font-size:13px; }
.hr-employee-picker { position:relative; min-width:0; }
.hr-employee-trigger-wrap { display:flex; align-items:stretch; gap:6px; min-width:0; }
.hr-employee-trigger { min-width:0; flex:1 1 auto; min-height:52px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 11px; border:1px solid #cfdedb; border-radius:10px; color:var(--ink); background:#fff; text-align:left; transition:border-color .15s ease,box-shadow .15s ease,background .15s ease; }
.hr-employee-trigger:hover { border-color:#8dbeb6; background:#fbfefd; }
.hr-employee-trigger:focus-visible,.hr-employee-picker.is-open .hr-employee-trigger { border-color:#5b9f97; outline:0; box-shadow:0 0 0 3px #e4f2ef; }
.hr-employee-trigger-copy { min-width:0; display:grid; gap:3px; }
.hr-employee-trigger-copy strong { overflow:hidden; color:#244742; font-size:13px; font-weight:720; text-overflow:ellipsis; white-space:nowrap; }
.hr-employee-trigger-copy small { overflow:hidden; color:#82928f; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.hr-employee-trigger.has-value .hr-employee-trigger-copy small { color:#5f7d77; }
.hr-employee-trigger-icon { flex:0 0 auto; color:#6a8c86; font-size:18px; line-height:1; transform:translateY(-1px); transition:transform .15s ease; }
.hr-employee-picker.is-open .hr-employee-trigger-icon { transform:rotate(180deg) translateY(1px); }
.hr-employee-clear,.hr-employee-search-clear { flex:0 0 auto; width:34px; min-height:34px; align-self:center; padding:0; border:1px solid #d9e6e3; border-radius:9px; color:#76908b; background:#f7fbfa; font-size:18px; line-height:1; }
.hr-employee-clear:hover,.hr-employee-search-clear:hover { color:#b23e4e; border-color:#efc6cc; background:#fff5f6; }
.hr-employee-popover { position:fixed; z-index:100; display:grid; gap:8px; min-width:260px; padding:10px; border:1px solid #c9ded9; border-radius:12px; background:#fff; box-shadow:0 18px 38px rgba(23,67,62,.16); }
.hr-employee-search { display:flex; align-items:center; gap:7px; min-height:38px; padding:0 8px; border:1px solid #d4e4e0; border-radius:9px; background:#f8fcfb; color:#77918b; }
.hr-employee-search:focus-within { border-color:#6eafa6; box-shadow:0 0 0 3px #e5f3f0; background:#fff; }
.hr-employee-search > span { flex:0 0 auto; font-size:18px; line-height:1; }
.hr-employee-search input { min-width:0; flex:1; height:34px; padding:0; border:0; outline:0; color:var(--ink); background:transparent; }
.hr-employee-search input::placeholder { color:#9aaba7; }
.hr-employee-options { display:grid; gap:4px; max-height:min(260px,38vh); overflow-y:auto; overscroll-behavior:contain; padding:1px; }
.hr-employee-option { width:100%; min-width:0; display:grid; grid-template-columns:32px minmax(0,1fr) 18px; align-items:center; gap:9px; min-height:52px; padding:7px 8px; border:1px solid transparent; border-radius:9px; color:var(--ink); background:#fff; text-align:left; }
.hr-employee-option:hover,.hr-employee-option.is-active { border-color:#cce5df; background:#f2faf8; }
.hr-employee-option.is-selected { border-color:#9fcfc5; background:#eaf6f3; }
.hr-employee-avatar { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; color:#17645c; background:#dff1ed; font-size:13px; font-weight:750; }
.hr-employee-option-copy { min-width:0; display:grid; gap:3px; }
.hr-employee-option-copy strong { overflow:hidden; color:#244742; font-size:13px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.hr-employee-option-copy small { overflow:hidden; color:#738883; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.hr-employee-option-check { visibility:hidden; color:#13806f; font-size:15px; font-weight:800; text-align:center; }
.hr-employee-option.is-selected .hr-employee-option-check { visibility:visible; }
.hr-employee-options-empty { padding:15px 10px; color:#879894; font-size:12px; text-align:center; }
.hr-employee-picker-hint { color:#8a9a97; font-size:10px; line-height:1.4; }
.hr-employee-field.has-validation-error .hr-employee-trigger { border-color:#d8717d; box-shadow:0 0 0 3px #fff0f2; }
@media (max-width:760px) {
  .hr-employee-trigger { min-height:50px; }
  .hr-employee-popover { min-width:0; max-height:min(430px,calc(100dvh - 28px)); padding:11px; box-shadow:0 20px 50px rgba(23,67,62,.24); }
  .hr-employee-options { max-height:min(290px,42dvh); }
}

/* HR payslip identity: keep the name readable and the generated number
   visually separate without adding a second tall line on narrow screens. */
.hr-payslip-employee-cell { min-width:150px; }
.hr-payslip-employee { display:inline-flex; align-items:baseline; gap:8px; min-width:0; white-space:nowrap; }
.hr-payslip-employee strong { color:#173b37; font-size:13px; font-weight:740; }
.hr-payslip-employee small { display:inline-flex; align-items:center; min-height:21px; padding:0 7px; border:1px solid #d6e8e3; border-radius:999px; color:#64817b; background:#f1f8f6; font-size:11px; line-height:1; }
@media (max-width:760px) {
  .hr-payslip-employee-cell { min-width:138px; }
  .hr-payslip-employee { gap:6px; }
  .hr-payslip-employee small { padding:0 6px; }
}

/* Management cockpit: structure, contribution and execution at a glance */
.dashboard-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:22px; margin:-3px 0 18px; padding:4px 0 17px; border-bottom:1px solid var(--line); }.dashboard-kicker { color:#315fa9; font-size:12px; font-weight:700; letter-spacing:.04em; }.dashboard-hero h2 { margin:2px 0 3px; font-size:25px; letter-spacing:0; }.dashboard-hero p { margin:0; color:var(--muted); font-size:13px; }.dashboard-hero-controls { display:flex; align-items:flex-end; gap:14px; }.dashboard-hero-controls label { display:grid; gap:5px; color:#536074; font-size:12px; }.dashboard-hero-controls select { min-width:148px; min-height:36px; padding:0 10px; border:1px solid #cbd3df; border-radius:6px; background:#fff; color:var(--ink); }.dashboard-hero-controls .dashboard-updated { padding-bottom:9px; white-space:nowrap; }
.dashboard-kpi-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }.dashboard-kpi-card { min-width:0; min-height:120px; display:grid; align-content:start; gap:3px; padding:15px 16px; border:1px solid var(--line); border-radius:8px; background:#fff; box-shadow:0 1px 0 #1f30420a; }.dashboard-kpi-card > span { color:#687386; font-size:12px; }.dashboard-kpi-card > strong { margin-top:5px; color:#172033; font-size:30px; line-height:1.1; }.dashboard-kpi-card > small { color:#7c8798; font-size:11px; line-height:1.45; }.dashboard-kpi-card.green > strong { color:#168346; }.dashboard-kpi-card.blue > strong { color:#2463eb; }.dashboard-kpi-card.violet > strong { color:#7152c8; }.dashboard-kpi-card.alert { border-color:#f0c6cb; background:#fffafb; }.dashboard-kpi-card.alert > strong { color:#c63748; }
.dashboard-intelligence { margin-bottom:16px; border:1px solid #d9e4f3; border-radius:8px; background:linear-gradient(135deg,#f7fbff,#fff); overflow:hidden; }.dashboard-intelligence .panel-head { min-height:64px; padding:14px 16px; }.dashboard-intelligence-badge { padding:4px 8px; border-radius:12px; color:#176b62; background:#e5f5f1; font-size:10px; white-space:nowrap; }.dashboard-intelligence-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:0 14px 14px; }.dashboard-intelligence-card { min-width:0; display:grid; align-content:start; gap:8px; padding:12px; border:1px solid #e1e8f2; border-radius:7px; background:#fff; }.dashboard-intelligence-card.urgent { border-color:#f1c4c9; background:#fff9fa; }.dashboard-intelligence-card.focus { border-color:#ecd6ae; background:#fffdf8; }.dashboard-intelligence-card.time { border-color:#cbdcf6; background:#f9fbff; }.dashboard-intelligence-card.progress { border-color:#cce6dd; background:#f8fcfa; }.dashboard-intelligence-card-head { display:flex; align-items:baseline; justify-content:space-between; gap:8px; }.dashboard-intelligence-card-head span { color:#67758a; font-size:11px; }.dashboard-intelligence-card-head strong { color:#25334a; font-size:20px; line-height:1.1; }.dashboard-intelligence-card.urgent .dashboard-intelligence-card-head strong { color:#b42336; }.dashboard-intelligence-card p { min-height:34px; margin:0; overflow-wrap:anywhere; color:#526075; font-size:11px; line-height:1.5; }.dashboard-intelligence-card .compact-button { justify-self:start; min-height:28px; padding:0 9px; }
.dashboard-overview-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:16px; }.dashboard-detail-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:16px; }.dashboard-chart-panel { min-width:0; min-height:255px; }.dashboard-chart-panel .panel-head { min-height:70px; }.dashboard-distribution-list { display:grid; gap:14px; padding:17px 16px 19px; }.dashboard-distribution-row { display:grid; gap:6px; }.dashboard-distribution-label { display:flex; justify-content:space-between; align-items:baseline; gap:10px; min-width:0; }.dashboard-distribution-label strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#263247; font-size:13px; }.dashboard-distribution-label span { flex:0 0 auto; color:#7b8798; font-size:11px; }.dashboard-bar { height:8px; overflow:hidden; border-radius:4px; background:#edf1f6; }.dashboard-bar i { display:block; height:100%; min-width:0; border-radius:4px; background:#4d80df; }.dashboard-chart-panel:nth-child(2) .dashboard-bar i { background:#7a66c7; }.dashboard-detail-grid .dashboard-chart-panel:nth-child(1) .dashboard-bar i { background:#4d9d7a; }.dashboard-detail-grid .dashboard-chart-panel:nth-child(2) .dashboard-bar i { background:#d28a3d; }.dashboard-chart-empty { min-height:175px; display:grid; place-items:center; padding:18px; color:#8792a3; font-size:12px; }.dashboard-influencer-grid { display:grid; gap:11px; padding:14px 16px 18px; }.dashboard-influencer-card { display:grid; gap:7px; padding:11px 12px; border:1px solid #e6eaf1; border-radius:6px; background:#fbfcfe; }.dashboard-influencer-head { display:flex; align-items:start; justify-content:space-between; gap:10px; }.dashboard-influencer-head div { display:grid; gap:2px; min-width:0; }.dashboard-influencer-head strong { color:#263247; font-size:13px; }.dashboard-influencer-head small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#7b8798; font-size:11px; }.dashboard-influencer-head b { color:#2463eb; font-size:20px; line-height:1; }.dashboard-influencer-card > span { color:#7b8798; font-size:11px; }.dashboard-influencer-card .dashboard-bar i { background:#2d72e8; }
.dashboard-attention-panel { min-height:255px; }.dashboard-attention-panel .panel-head { min-height:70px; }.dashboard-attention-panel .attention-grid { height:calc(100% - 70px); grid-template-columns:repeat(2,1fr); align-content:stretch; }.dashboard-attention-panel .attention-item { min-height:75px; }.dashboard-attention-panel .attention-item:nth-child(2n) { border-right:0; }.dashboard-attention-panel .attention-item:nth-child(-n+6) { border-bottom:1px solid #edf0f4; }.dashboard-modules { margin-bottom:16px; overflow:visible; }.dashboard-modules > .panel-head { min-width:0; }.dashboard-module-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:15px; }.dashboard-module-card { min-width:0; display:grid; gap:10px; padding:13px; border:1px solid #e2e6ee; border-radius:7px; background:#fbfcfe; }.dashboard-module-card-head { display:flex; align-items:start; justify-content:space-between; gap:12px; }.dashboard-module-card-head > strong { color:#263247; font-size:20px; line-height:1; }.dashboard-module-progress .module-progress-bar { height:9px; }.dashboard-module-stats { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; color:#7c8798; font-size:11px; }.dashboard-module-stats b { color:#344158; font-size:13px; }.dashboard-module-stats .done-count b { color:var(--green); }.dashboard-module-stats .doing-count b { color:var(--orange); }.dashboard-module-stats .risk-count { margin-left:auto; min-height:24px; padding:0 7px; font-size:10px; }.dashboard-module-stats .risk-count.has-risk { color:var(--red); }
@media (max-width:1250px) { .dashboard-kpi-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.dashboard-overview-grid,.dashboard-detail-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.dashboard-influencer-panel { grid-column:1/-1; }.dashboard-module-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.dashboard-intelligence-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .dashboard-hero { align-items:flex-start; flex-direction:column; gap:12px; }.dashboard-hero h2 { font-size:22px; }.dashboard-hero-controls { width:100%; align-items:flex-start; justify-content:space-between; }.dashboard-hero-controls .dashboard-updated { padding-bottom:9px; }.dashboard-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.dashboard-kpi-card { min-height:102px; padding:12px; }.dashboard-kpi-card > strong { font-size:25px; }.dashboard-overview-grid,.dashboard-detail-grid,.dashboard-module-grid { grid-template-columns:1fr; gap:12px; }.dashboard-influencer-panel { grid-column:auto; }.dashboard-chart-panel { min-height:0; }.dashboard-attention-panel .attention-grid { height:auto; }.dashboard-module-grid { padding:12px; }.dashboard-module-card { padding:12px; }.dashboard-intelligence-grid { grid-template-columns:1fr; }.dashboard-hero-controls select { min-width:132px; } }
.business-timeline { display:grid; }.business-milestone { width:100%; display:grid; grid-template-columns:86px minmax(0,1fr) 44px; gap:10px; align-items:center; min-height:58px; padding:9px 16px; border:0; border-bottom:1px solid #eef0f4; background:#fff; text-align:left; }.business-milestone:last-child { border-bottom:0; }.business-milestone:hover { background:#fbfcff; }.business-milestone-date,.business-milestone-copy { min-width:0; display:grid; gap:2px; }.business-milestone-date strong { color:#263247; font-size:13px; }.business-milestone-date small,.business-milestone-copy small { color:var(--muted); font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.business-milestone-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }.business-milestone-status { justify-self:end; padding:3px 5px; border-radius:4px; color:#6f7b8d; background:#f0f3f7; font-size:10px; white-space:nowrap; }.business-milestone.overdue .business-milestone-date strong,.business-milestone.overdue .business-milestone-status { color:#ae2637; }.business-milestone.overdue .business-milestone-status { background:#ffeaed; }.business-milestone.today .business-milestone-date strong,.business-milestone.today .business-milestone-status { color:#b45b0b; }.business-milestone.today .business-milestone-status,.business-milestone.soon .business-milestone-status { background:#fff1df; }
/* Required-field guidance and submit-time validation */
.required-legend { margin:-5px 0 -2px; color:#687386; font-size:12px; line-height:1.5; }
.required-symbol,.required-field::after { color:#c73446; font-weight:750; }
.required-field { position:relative; }
.required-field::after { content:"*"; position:absolute; top:0; left:-9px; font-size:15px; line-height:1; }
.form-validation-summary { padding:9px 11px; border:1px solid #f0b8c0; border-radius:5px; color:#a42336; background:#fff4f5; font-size:12px; line-height:1.5; }
.form-validation-summary[hidden] { display:none; }
.has-validation-error > input,.has-validation-error > select,.has-validation-error > textarea,
.has-validation-error .order-product-search,.has-validation-error .size-picker { border-color:#c73446 !important; box-shadow:0 0 0 3px #fbe1e4; }
.has-validation-error .size-picker { border-radius:5px; padding:5px; }
.field-error { display:block; grid-column:1/-1; color:#b42336; font-size:12px; line-height:1.4; }
.required-field.has-validation-error { color:#a42336; }
.order-lines-card.required-field::after { top:13px; left:auto; right:14px; }
.order-lines-card.has-validation-error { border-color:#c73446; box-shadow:0 0 0 3px #fbe1e4; }
@media (max-width:760px) { .required-field::after { left:-7px; } }
@media (max-width:760px) { .auth-workspace #page { min-height:100dvh; padding:16px; align-items:start; }.auth-shell { width:100%; min-height:calc(100dvh - 32px); grid-template-columns:1fr; }.auth-brand-panel { min-height:190px; padding:24px 24px 22px; border-left:0; border-top:5px solid #b4232f; }.auth-brand-mark { width:40px; height:40px; margin-bottom:18px; font-size:19px; }.auth-company { margin-bottom:4px; font-size:14px; }.auth-brand-panel h1 { font-size:23px; }.auth-brand-note { margin-top:8px; }.auth-brand-footer { display:none; }.auth-panel { padding:30px 24px 24px; }.auth-kicker { margin-bottom:20px; }.auth-panel h2 { font-size:24px; }.auth-intro { margin-bottom:22px; }.auth-copyright { padding-top:24px; } }
.dialog { overflow:hidden; max-height:min(760px,calc(100dvh - 28px)); }
.dialog-inner { max-height:inherit; overflow:auto; }
.order-product-results { max-height:min(330px,42vh); }
.role-panel { margin-bottom:16px; }.role-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:16px; }.role-card { min-width:0; padding:16px; border:1px solid #e0e5ed; border-radius:7px; background:#fff; display:grid; gap:12px; }.role-card-admin { border-color:#c7d8ff; background:#f8fbff; }.role-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }.role-card-head h3 { margin:0 0 4px; font-size:16px; }.role-card-head span { color:var(--muted); font-size:12px; }.role-card-badges { display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:flex-start; gap:5px; flex:0 0 auto; max-width:52%; }.role-permission-count { flex:0 0 auto; padding:4px 8px; border-radius:12px; background:#eaf2ff; color:#1748ae !important; font-weight:650; white-space:nowrap; }.role-mapping-count { display:inline-flex; align-items:center; min-height:20px; padding:2px 7px; border:1px solid #dfe5ee; border-radius:999px; color:#6c7788 !important; background:#f8fafc; font-size:10px !important; white-space:nowrap; }.role-mapping-count.has-references { border-color:#c9dafc; color:#265ab9 !important; background:#f0f5ff; }.role-card p { min-height:38px; margin:0; color:#627086; font-size:12px; line-height:1.6; }.role-capability { padding:8px 10px; border:1px solid #e5eaf2; border-radius:5px; background:#f8fafc; color:#53627a; font-size:12px; }.role-capability strong { color:#263b61; }.role-card-foot { min-height:25px; display:flex; align-items:center; gap:12px; border-top:1px solid #edf0f4; padding-top:10px; }.role-protected { color:#6a7688; font-size:11px; }.role-dialog { max-height:min(850px,calc(100vh - 28px)); overflow:auto; }.permission-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; padding-top:4px; }.permission-toolbar > div { display:flex; gap:7px; }.permission-groups { display:grid; gap:12px; }.permission-group { border:1px solid #e1e6ee; border-radius:7px; background:#fbfcfe; overflow:hidden; }.permission-group-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding:12px 14px; border-bottom:1px solid #e8ebf1; background:#f4f7fb; }.permission-group-head h4 { margin:0 0 3px; color:#263247; font-size:14px; }.permission-group-head span { color:var(--muted); font-size:11px; }.permission-select-all { display:flex !important; align-items:center; gap:5px; white-space:nowrap; color:#1748ae !important; font-size:12px !important; }.permission-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:12px; }.permission-option { display:flex !important; align-items:flex-start; gap:8px; min-width:0; padding:9px 10px; border:1px solid #e2e7ef; border-radius:5px; background:#fff; cursor:pointer; }.permission-option:has(input:checked) { border-color:#9abbff; background:#f1f6ff; }.permission-option input { margin-top:3px; flex:0 0 auto; }.permission-option span { min-width:0; display:grid; gap:3px; }.permission-option strong { color:#344158; font-size:12px; }.permission-option small { color:var(--muted); font-size:11px; line-height:1.45; }.account-table .row-actions { min-width:170px; }.account-table .subtle { display:block; }
.account-sync-state { margin:0 0 16px; min-height:42px; display:flex; align-items:center; gap:10px; padding:10px 14px; border:1px solid #d8e4fb; border-radius:6px; background:#f5f8ff; color:#52627b; font-size:12px; }.account-sync-state strong { color:#b4232f; }.account-sync-state button { margin-left:auto; flex:0 0 auto; }.account-sync-ok { border-color:#d9eadd; background:#f6fbf7; color:#287344; }.account-sync-error { border-color:#f2c7cc; background:#fff7f8; color:#7b3c43; }.loading-dot { width:9px; height:9px; flex:0 0 auto; border-radius:50%; background:#2463eb; box-shadow:0 0 0 4px #dce8ff; animation:account-sync-pulse 1.2s ease-in-out infinite; } @keyframes account-sync-pulse { 0%,100% { opacity:.45; transform:scale(.85); } 50% { opacity:1; transform:scale(1); } }
@media (max-width:1080px) { .role-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .role-grid,.permission-grid { grid-template-columns:1fr; padding:12px; }.permission-group-head { display:grid; }.permission-toolbar { align-items:flex-start; flex-direction:column; }.account-table .row-actions { min-width:130px; } }
@media (max-width:760px) { .hr-account-provisioning-head,.hr-role-mapping-head { display:grid; }.hr-role-mapping-row { grid-template-columns:1fr; } }
/* Product color and assortment presentation */
.match-style-list { display:flex; flex-wrap:wrap; gap:4px 7px; max-width:180px; }.match-style-link { border:0; background:transparent; padding:0; color:var(--blue); font-size:12px; font-weight:650; cursor:pointer; }.match-style-link:hover { text-decoration:underline; }.styling-section { margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }.section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }.section-heading .section-title { margin-top:0; margin-bottom:4px; }.styling-layout { display:grid; grid-template-columns:190px minmax(0,1fr); gap:16px; align-items:start; }.styling-image-wrap { min-height:130px; display:grid; place-items:center; border:1px solid var(--line); border-radius:6px; background:#fafbfe; overflow:hidden; }.styling-image { display:block; width:190px; height:150px; object-fit:contain; background:#fff; }.styling-image-empty { display:grid; gap:5px; padding:16px; text-align:center; color:#536074; font-size:12px; }.styling-image-empty span { color:var(--muted); }.matching-list { display:grid; gap:8px; }.matching-product { display:grid; grid-template-columns:44px auto minmax(0,1fr); align-items:center; gap:8px; min-height:44px; padding:6px 8px; border-bottom:1px solid #edf0f4; }.matching-product:last-child { border-bottom:0; }.matching-product-image { width:44px; height:52px; object-fit:cover; border:1px solid var(--line); border-radius:4px; }.matching-product > span { color:var(--muted); font-size:12px; }.styling-dialog { max-height:min(850px,calc(100vh - 28px)); overflow:auto; }.match-picker { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; max-height:310px; overflow:auto; padding:2px; }.match-option { display:grid !important; grid-template-columns:auto 42px minmax(0,1fr); align-items:center; gap:7px; min-width:0; padding:7px; border:1px solid #e1e6ee; border-radius:5px; background:#fff; cursor:pointer; }.match-option:has(input:checked) { border-color:#9abbff; background:#f1f6ff; }.match-option input { margin:0; }.match-option span { display:grid; grid-template-columns:42px minmax(0,1fr); align-items:center; gap:6px; min-width:0; }.match-option strong,.match-option small { grid-column:2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.match-option small { color:var(--muted); font-size:11px; }.match-option-image { grid-row:1 / span 2; width:42px; height:50px; object-fit:cover; border:1px solid var(--line); border-radius:3px; }
/* Pattern responsibility, revision notes and return-to-design workflow */
.revision-opinions-section { display:grid; gap:9px; margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }.revision-opinions-section > .section-heading { margin-bottom:2px; }.revision-opinions-section > .section-heading > strong { padding:4px 8px; border-radius:12px; color:#1748ae; background:#eaf2ff; font-size:11px; }.pending-opinion-badge, .revision-alert-badge { display:inline-flex; align-items:center; gap:4px; color:#a33d09 !important; background:#fff0e6 !important; border:1px solid #f4b184; font-weight:700; }.revision-alert-badge { width:max-content; padding:2px 6px; border-radius:10px; font-size:11px; }.revision-opinion-item { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:10px 12px; border:1px solid #e4e8ef; border-radius:6px; background:#fbfcfe; }.revision-opinion-item.unread { border-color:#f4b184; background:#fffaf5; box-shadow:inset 3px 0 #ef7d28; }.revision-opinion-item > div { min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; }.revision-opinion-item strong { color:#1748ae; white-space:nowrap; }.revision-opinion-item span { color:#354257; white-space:pre-wrap; }.revision-opinion-item small { flex:0 0 auto; color:var(--muted); white-space:nowrap; }.return-notice { display:grid; gap:3px; padding:10px 12px; border-left:3px solid var(--red); color:#8e2936; background:#fff5f6; }.return-notice span { color:#5f4650; }.revision-history-preview { display:grid; gap:7px; max-height:210px; overflow:auto; padding:10px; border:1px solid #e2e7ef; border-radius:6px; background:#f8faff; }.revision-history-preview > div { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:9px; padding-bottom:7px; border-bottom:1px solid #e3e8f0; }.revision-history-preview > div:last-child { padding-bottom:0; border-bottom:0; }.revision-history-preview strong { color:#1748ae; }.revision-history-preview span { white-space:pre-wrap; }.revision-history-preview small { color:var(--muted); white-space:nowrap; }
@media (max-width:760px) { .revision-opinion-item { display:grid; }.revision-opinion-item small { white-space:normal; }.revision-history-preview > div { grid-template-columns:auto minmax(0,1fr); }.revision-history-preview small { grid-column:2; white-space:normal; } }

/* Procurement execution is handed back as a read-only product archive. */
.procurement-archive-section { display:grid; gap:10px; margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }
.procurement-archive-section .section-heading { align-items:flex-start; }
.procurement-archive-section .section-heading strong { color:#157747; font-size:12px; }
.archive-version-badge { display:inline-flex; align-items:center; min-height:24px; padding:0 8px; border:1px solid #bddbd0; border-radius:12px; color:#176d5f; background:#effaf6; font-size:11px; white-space:nowrap; }
.procurement-archive-table td { vertical-align:top; }
.procurement-archive-table td > strong,.procurement-archive-table td > span { display:block; }
.procurement-archive-history { border:1px solid #e3e8ef; border-radius:7px; background:#fbfcfe; }
.procurement-archive-history summary { padding:9px 11px; color:#2463eb; cursor:pointer; font-size:12px; }
.archive-history-list { display:grid; gap:7px; padding:0 11px 11px; }
.archive-history-list > div { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:9px; align-items:center; padding-top:7px; border-top:1px solid #edf0f4; font-size:11px; }
.archive-history-list strong { color:#344158; white-space:nowrap; }
.archive-history-list span { color:#536074; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.archive-history-list small { color:var(--muted); white-space:nowrap; }
@media (max-width:760px) { .procurement-archive-section .section-heading { display:grid; }.archive-history-list > div { grid-template-columns:auto minmax(0,1fr); }.archive-history-list small { grid-column:2; white-space:normal; } }

/* Operational data center: targets stay separate from connector actuals. */
.operation-data-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin:-3px 0 16px; padding:4px 0 17px; border-bottom:1px solid var(--line); }.operation-data-hero h2 { margin:3px 0 5px; font-size:25px; }.operation-data-hero p { margin:0; color:var(--muted); font-size:13px; }.operation-data-hero-actions { display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap; }.operation-data-hero-actions label { display:grid; gap:5px; color:#536074; font-size:12px; }.operation-data-hero-actions input { min-height:36px; padding:0 10px; border:1px solid #cbd3df; border-radius:6px; background:#fff; color:var(--ink); }.operation-data-filters { display:grid; gap:12px; margin-bottom:16px; padding:14px 16px; }.operation-data-filter-group { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }.operation-data-filter-group > strong { min-width:40px; color:#344158; font-size:13px; }.operation-data-filter-group .filters { display:flex; flex-wrap:wrap; gap:7px; }.operation-data-all-months { margin-left:auto; border:0; background:transparent; color:#2463eb; font-size:12px; cursor:pointer; }.operation-data-all-months.selected { font-weight:700; }.operation-data-kpis { grid-template-columns:repeat(6,minmax(0,1fr)); margin-bottom:16px; }.operation-data-dashboard-grid { display:grid; grid-template-columns:1.35fr 1fr; gap:16px; margin-bottom:16px; }.operation-data-bars { display:grid; gap:19px; padding:19px 18px 22px; }.operation-data-bar-row { display:grid; gap:7px; }.operation-data-bar-label { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }.operation-data-bar-label strong { color:#263247; font-size:13px; }.operation-data-bar-label span,.operation-data-bar-row small { color:var(--muted); font-size:11px; }.operation-data-bar { height:10px; overflow:hidden; border-radius:5px; background:#edf1f6; }.operation-data-bar i { display:block; height:100%; border-radius:5px; background:#2d72e8; }.operation-data-bar-row:nth-child(2) .operation-data-bar i { background:#8a63c7; }.operation-data-bar-row:nth-child(3) .operation-data-bar i { background:#dc8b45; }.operation-data-bar-row:nth-child(4) .operation-data-bar i { background:#29916a; }.operation-data-influencer-summary { display:grid; gap:10px; padding:18px; }.operation-data-influencer-summary > div { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:12px; align-items:center; padding:12px; border:1px solid #e4e8ef; border-radius:6px; background:#fbfcfe; }.operation-data-influencer-summary span { color:var(--muted); font-size:11px; }.operation-data-influencer-summary b { color:#2463eb; font-size:18px; }.operation-data-table-panel { margin-bottom:16px; }.operation-data-table th,.operation-data-table td { white-space:nowrap; }.operation-data-status { display:inline-flex; align-items:center; min-height:22px; padding:0 7px; border-radius:11px; color:#a86713; background:#fff2dc; font-size:11px; }.operation-data-status.connected { color:#157747; background:#e3f5ea; }.operation-data-connectors { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:16px; }.operation-connector-card { display:grid; gap:8px; min-height:112px; padding:13px; border:1px solid #e1e6ee; border-radius:7px; background:#fbfcfe; }.operation-connector-card > div { display:flex; justify-content:space-between; align-items:center; gap:8px; }.operation-connector-card strong { color:#263247; font-size:14px; }.operation-connector-card p,.operation-connector-card small { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }.operation-data-note { margin:0; padding:0 16px 16px; color:#687386; font-size:12px; line-height:1.6; }.operation-data-empty { display:grid; place-items:center; min-height:100px; padding:18px; color:#8792a3; font-size:12px; text-align:center; }.operation-goal-dialog { min-width:min(620px,calc(100vw - 30px)); }.dialog-help { margin:0 0 16px; color:var(--muted); font-size:12px; line-height:1.6; }
@media (max-width:1250px) { .operation-data-kpis { grid-template-columns:repeat(3,minmax(0,1fr)); }.operation-data-connectors { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .operation-data-hero { align-items:flex-start; flex-direction:column; gap:12px; }.operation-data-hero h2 { font-size:22px; }.operation-data-hero-actions { width:100%; align-items:flex-start; }.operation-data-hero-actions label { flex:1; }.operation-data-dashboard-grid { grid-template-columns:1fr; }.operation-data-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.operation-data-connectors { grid-template-columns:1fr; }.operation-data-filter-group { align-items:flex-start; flex-direction:column; gap:7px; }.operation-data-all-months { margin-left:0; }.operation-data-table { min-width:870px; } }

/* Influencer outfit workbench and protected virtual try-on references. */
.section-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; }
.styling-flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:16px; }
.styling-flow section { display:grid; grid-template-columns:26px minmax(0,1fr); column-gap:8px; align-items:center; min-height:54px; padding:8px 10px; border:1px solid #e0e6ef; border-radius:6px; background:#f8faff; }
.styling-flow section > span { grid-row:1 / span 2; display:grid; place-items:center; width:25px; height:25px; border-radius:50%; color:#fff; background:#98a5b8; font-size:12px; font-weight:700; }
.styling-flow section strong { color:#344158; font-size:12px; }.styling-flow section small { color:var(--muted); font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.styling-flow section.ready { border-color:#a8ddc2; background:#f3fbf6; }.styling-flow section.ready > span { background:#20895b; }.styling-flow section.waiting { border-color:#f2d4a5; background:#fffaf1; }.styling-flow section.waiting > span { background:#c88325; }
.styling-editor-section { display:grid; gap:11px; margin-top:14px; padding:14px; border:1px solid #e1e6ee; border-radius:7px; background:#fff; }.styling-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }.styling-section-head h3 { margin:0 0 4px; color:#263247; font-size:15px; }.styling-section-head p { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }.styling-section-head > strong { flex:0 0 auto; padding:4px 8px; border-radius:12px; color:#1748ae; background:#eaf2ff; font-size:11px; white-space:nowrap; }.compact-search { margin:0 !important; }.compact-search input { min-height:34px; }
.model-image-action { color:#7b4db2; }
.model-image-section { margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }
.model-image-section .section-heading { margin-bottom:12px; }
.model-image-inline-grid { display:grid; grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr); align-items:start; gap:18px; width:100%; max-width:none; }
.model-image-inline-source,.model-image-inline-output { display:grid; gap:6px; min-width:0; }
.model-image-pose-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; width:100%; align-items:start; }
.model-image-pose-grid-count-1 { grid-template-columns:minmax(0,1fr); }
.model-image-pose-grid-count-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.model-image-pose-card { min-width:0; border:1px solid #dfe9e6; border-radius:10px; background:#fbfdfc; overflow:hidden; }
.model-image-pose-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 10px; color:#315b55; font-size:13px; }
.model-image-pose-card img { display:block; width:100%; min-height:320px; aspect-ratio:2 / 3; object-fit:cover; background:#edf3f1; }
.model-image-inline-output .model-image-pose-card img,.model-image-output .model-image-pose-card img { height:auto; min-height:320px; aspect-ratio:2 / 3; object-fit:cover; border:0; border-radius:0; background:transparent; }
.model-image-delete-all { margin-top:10px; }
.model-scene-reference { display:grid; gap:9px; margin:0 0 16px; padding:13px 14px; border:1px solid #dfe9e6; border-radius:10px; background:#fbfdfc; }
.model-scene-reference-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.model-scene-reference-head > div { display:grid; gap:4px; min-width:0; }
.model-scene-reference-head strong { color:#294d48; font-size:13px; }
.model-scene-reference-head span { color:#6d827d; font-size:11px; line-height:1.45; }
.model-scene-reference-head b { flex:0 0 auto; padding:4px 8px; border-radius:999px; color:#23786b; background:#e6f5f0; font-size:10px; font-weight:700; white-space:nowrap; }
.model-scene-reference .image-drop { min-height:74px; border-color:#c7d7d4; background:#fff; }
.model-scene-reference .image-drop img { width:78px; height:58px; object-fit:cover; }
.model-scene-reference .image-drop.has-image { border-color:#6db586; background:#f2faf5; }
.design-image-picker-chip select { max-width:82px; border:1px solid #d5e4df; border-radius:6px; padding:4px 5px; background:#fff; color:#41625d; font-size:11px; }
.catalog-model-profile-list { display:grid; gap:10px; }
.catalog-model-profile-row { display:grid; grid-template-columns:38px minmax(0,1fr) auto auto; align-items:center; gap:12px; padding:12px 14px; border:1px solid #e0eae7; border-radius:10px; background:#fbfdfc; }
.catalog-model-avatar { display:grid; place-items:center; width:38px; height:38px; border-radius:50%; background:#dceee9; color:#23786b; font-weight:800; }
.catalog-model-copy { display:grid; gap:3px; min-width:0; }
.catalog-model-copy strong { color:#294d48; font-size:14px; }
.catalog-model-copy span { color:#56716b; font-size:12px; }
.catalog-model-copy small { color:#879894; font-size:11px; line-height:1.45; }
.catalog-model-status { padding:5px 9px; border-radius:999px; background:#eef3f1; color:#70827e; font-size:11px; white-space:nowrap; }
.catalog-model-status.ready { background:#e2f4ed; color:#237867; }
.catalog-model-status.waiting { background:#fff3df; color:#9a713c; }
.model-image-inline-source > span,.model-image-inline-output > span { color:var(--muted); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.model-image-inline-source > img,.model-image-inline-output > img { display:block; width:100%; aspect-ratio:2 / 3; height:auto; object-fit:cover; border:0; border-radius:10px; background:#f7faf9; }
.model-image-inline-empty { display:grid; place-items:center; width:100%; min-height:0; aspect-ratio:2 / 3; height:auto; padding:12px; border:1px dashed #c7d7d4; border-radius:10px; color:var(--muted); background:#f8fbfa; font-size:12px; text-align:center; }
.model-image-inline-arrow,.model-image-arrow { color:var(--primary); font-size:24px; font-weight:700; text-align:center; }
.model-image-dialog { width:min(900px,calc(100vw - 28px)); max-width:900px; }
.model-image-intro { display:grid; gap:5px; margin-bottom:14px; padding:12px 14px; border-left:3px solid #7b4db2; border-radius:7px; background:#f8f4fd; color:#3e3155; }
.model-image-intro strong { font-size:13px; }
.model-image-intro span { color:#786c8c; font-size:11px; }
.model-image-provider-notice { margin-bottom:14px; }
.model-image-workspace { display:grid; grid-template-columns:minmax(220px,280px) 42px minmax(500px,1fr); align-items:start; gap:16px; margin-bottom:16px; width:100%; }
.model-image-source,.model-image-output { display:grid; gap:7px; min-width:0; }
.model-image-section-head { display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.model-image-source-preview,.model-image-output-preview { display:block; width:100%; height:330px; object-fit:contain; border:1px solid var(--line); border-radius:9px; background:#f8fbfa; }
.model-image-output-empty { display:grid; place-items:center; height:330px; padding:20px; border:1px dashed #c7d7d4; border-radius:9px; background:#fbfcfc; text-align:center; }
.model-image-output-empty strong { color:var(--ink); font-size:13px; }
.model-image-output-empty span,.model-image-source small,.model-image-output small { color:var(--muted); font-size:11px; }
.model-image-footnote { display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:8px; color:var(--muted); font-size:11px; }
.effect-status.running { color:#6b4ba1; background:#f0eaff; }
.styling-output-section { background:#fbfcff; }.styling-output-grid { display:grid; grid-template-columns:minmax(220px, .9fr) minmax(0,1.1fr); gap:14px; align-items:start; }.styling-output-preview { display:grid; place-items:center; min-height:230px; overflow:hidden; border:1px dashed #b8c6dc; border-radius:6px; background:#f4f7fb; text-align:center; }.styling-output-preview > div { display:grid; gap:5px; padding:20px; }.styling-output-preview strong { color:#536074; font-size:13px; }.styling-output-preview small { color:var(--muted); font-size:11px; }.styling-output-preview img { display:block; width:100%; height:320px; object-fit:contain; background:#fff; cursor:zoom-in; }.styling-output-preview > span { align-self:end; margin-top:-28px; padding:3px 7px; border-radius:4px; color:#fff; background:#263247cc; font-size:10px; pointer-events:none; }.effect-status { display:inline-flex; align-items:center; min-height:24px; padding:0 8px; border-radius:12px; color:#667386; background:#eef2f7; font-size:11px; white-space:nowrap; }.effect-status.ready { color:#157747; background:#e3f5ea; }.effect-status.failed { color:#a42336; background:#ffeaed; }.effect-error { display:block; color:#a42336; font-size:11px; line-height:1.5; }.manual-styling-upload { padding-top:2px; }.manual-styling-upload summary { color:#2463eb; cursor:pointer; font-size:12px; }.model-profile-dialog { max-width:760px; }.privacy-notice { display:grid; gap:4px; padding:11px 13px; border-left:3px solid #2d72e8; color:#344158; background:#eef5ff; font-size:12px; line-height:1.5; }.privacy-notice span { color:#5c6b80; font-size:11px; }.model-reference-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.model-reference-slot { display:grid; grid-template-columns:82px minmax(0,1fr); align-items:center; gap:10px; padding:10px; border:1px dashed #b8c6dc; border-radius:6px; background:#fbfcff; cursor:pointer; }.model-reference-slot:hover,.model-reference-slot:focus-visible { border-color:#5184ee; background:#f3f7ff; }.model-reference-image { display:grid; place-items:center; width:82px; height:100px; overflow:hidden; border-radius:4px; background:#edf1f6; }.model-reference-image img { width:100%; height:100%; object-fit:cover; }.model-reference-image span { color:#8792a3; font-size:11px; }.model-reference-slot > div:last-of-type { display:grid; gap:5px; }.model-reference-slot strong { color:#344158; font-size:12px; }.model-reference-slot small { color:var(--muted); font-size:11px; line-height:1.4; }.consent-check { display:flex !important; align-items:flex-start; gap:8px; padding:10px 12px; border:1px solid #e2e7ef; border-radius:6px; background:#fbfcfe; }.consent-check input { margin-top:3px; }.consent-check span { display:grid; gap:3px; }.consent-check strong { color:#344158; font-size:12px; }.consent-check small { color:var(--muted); font-size:11px; }
.provider-notice { display:grid; gap:3px; padding:10px 12px; border-left:3px solid #d38b28; color:#7a511d; background:#fff8ed; font-size:12px; line-height:1.5; }.provider-notice span { color:#6f604d; font-size:11px; }
.contract-detail-section { display:grid; gap:10px; margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }.contract-detail-section .section-heading { margin-bottom:0; }.contract-actions { display:inline-flex; align-items:center; gap:7px; flex-wrap:wrap; }.contract-summary { display:inline-grid; gap:2px; min-width:150px; padding:6px 8px; border:1px solid #eadfb9; border-radius:6px; background:#fffaf0; }.contract-summary strong { color:#7a5a12; font-size:12px; }.contract-summary small { color:#8b7950; font-size:10px; white-space:nowrap; }.contract-summary.ready { border-color:#b9dfc7; background:#f0fbf4; }.contract-summary.ready strong { color:#157747; }.contract-summary.failed { border-color:#efc2c9; background:#fff3f4; }.contract-summary.failed strong { color:#a42336; }.contract-summary.compact { min-width:124px; padding:4px 6px; }.contract-detail-meta { display:flex; flex-wrap:wrap; gap:7px 14px; color:var(--muted); font-size:11px; }.contract-print-button { white-space:nowrap; }.contract-esign-button[disabled] { color:#7d8796; border-color:#dce1e8; background:#f5f7fa; cursor:not-allowed; }.contract-detail-section .contract-summary:not(.compact) { width:max-content; max-width:100%; }
.contract-center-toolbar { align-items:flex-end; }
.contract-toolbar-controls { display:flex; align-items:flex-end; gap:10px; }
.contract-toolbar-controls label { display:grid; gap:5px; color:var(--muted); font-size:12px; }
.contract-toolbar-controls select { min-width:150px; }
.contract-metrics { margin-top:14px; }
.contract-list-panel { margin-top:14px; }
.contract-table td { vertical-align:top; }
.contract-table .contract-actions { justify-content:flex-start; }
.contract-table .contract-summary { min-width:132px; }
@media (max-width:760px) {
  .contract-center-toolbar { align-items:stretch; }
  .contract-toolbar-controls { width:100%; }
  .contract-toolbar-controls label, .contract-toolbar-controls select { width:100%; }
}
@media (max-width:760px) { .styling-flow { grid-template-columns:1fr; }.styling-output-grid,.model-reference-grid { grid-template-columns:1fr; }.styling-section-head { align-items:flex-start; flex-direction:column; }.section-actions { justify-content:flex-start; }.styling-output-preview img { height:280px; } }
@media (max-width:1100px) { .model-image-workspace { grid-template-columns:1fr; }.model-image-arrow { transform:rotate(90deg); }.model-image-inline-grid { grid-template-columns:1fr; max-width:none; }.model-image-inline-arrow { transform:rotate(90deg); } }
@media (max-width:900px) { .model-image-inline-grid { grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr); gap:12px; }.model-image-pose-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.model-image-pose-grid-count-1 { grid-template-columns:minmax(0,1fr); }.model-image-pose-card img { min-height:280px; } }
@media (max-width:720px) { .model-image-inline-grid { grid-template-columns:1fr; }.model-image-pose-grid { grid-template-columns:1fr; }.model-image-pose-card img { min-height:0; aspect-ratio:4 / 5; } }
@media (max-width:640px) { .catalog-model-profile-row { grid-template-columns:38px minmax(0,1fr); }.catalog-model-status,.catalog-model-profile-row > button { grid-column:2; justify-self:start; } }
@media (max-width:560px) { .model-scene-reference-head { flex-direction:column; gap:7px; }.model-scene-reference-head b { justify-self:start; } }

/* Monthly product scheduling board. */
.schedule-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:16px; padding:24px 26px; border:1px solid #dce5f3; border-radius:8px; background:#f7faff; }
.schedule-hero h2 { margin:2px 0 6px; color:#18243a; font-size:26px; }
.schedule-hero p { margin:0; color:#5e6c83; }
.schedule-hero .eyebrow { margin:0 0 5px; color:#2463eb; font-size:12px; font-weight:700; }
.schedule-toolbar { display:flex; align-items:flex-end; gap:8px; flex-wrap:wrap; }
.schedule-toolbar label { display:grid; gap:5px; color:#5e6c83; font-size:12px; }
.schedule-toolbar input,.schedule-toolbar select { min-height:36px; padding:0 9px; border:1px solid #cbd4e3; border-radius:6px; background:#fff; color:#172033; }
.schedule-toolbar .icon-button { display:inline-grid; place-items:center; min-width:36px; height:36px; padding:0 8px; border:1px solid #ccd5e4; border-radius:6px; color:#536074; background:#fff; }
.schedule-toolbar .icon-button:hover { border-color:#2463eb; color:#2463eb; }
.schedule-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.schedule-kpi { display:grid; gap:6px; min-height:112px; padding:17px 18px; border:1px solid #e0e6ef; border-radius:8px; background:#fff; }
.schedule-kpi span { color:#667386; font-size:12px; }
.schedule-kpi strong { color:#1d2a41; font-size:28px; line-height:1.1; }
.schedule-kpi small { color:#8a95a5; font-size:11px; }
.schedule-kpi.warning { border-color:#f0d49d; background:#fffaf2; }
.schedule-kpi.warning strong { color:#b06a11; }
.schedule-kpi.ok strong { color:#20895b; }
.schedule-board { overflow:hidden; }
.schedule-board-count { color:#2463eb; font-size:12px; }
.schedule-card { padding:18px 20px 20px; border-top:1px solid #e5e9f0; }
.schedule-card:first-of-type { border-top:0; }
.schedule-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.schedule-period { display:flex; align-items:center; gap:10px; }
.schedule-period span { display:inline-flex; align-items:center; min-height:26px; padding:0 9px; border-radius:13px; color:#1748ae; background:#eaf2ff; font-weight:700; }
.schedule-influencer { display:inline-flex; align-items:center; min-height:24px; padding:0 8px; border:1px solid #d8e4fa; border-radius:12px; color:#49658e; background:#f5f8fd; font-size:11px; font-style:normal; font-weight:600; }
.schedule-period strong { color:#28364f; font-size:15px; }
.schedule-card-head p { margin:7px 0 0; color:#788498; font-size:12px; }
.schedule-card-note { margin:13px 0 0; padding:9px 11px; border-left:3px solid #81a7f3; color:#5a687c; background:#f6f9ff; font-size:12px; }
.schedule-card-actions { display:flex; gap:8px; align-items:center; }
.schedule-card-actions .compact-button { min-height:32px; }
.schedule-product-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:16px; }
.schedule-product { display:grid; gap:10px; min-width:0; padding:10px; border:1px solid #e1e7ef; border-radius:7px; background:#fbfcfe; }
.schedule-product-head { display:flex; align-items:center; gap:10px; min-width:0; }
.schedule-product-image { flex:0 0 50px; width:50px; height:64px; object-fit:cover; border-radius:4px; background:#edf1f6; cursor:zoom-in; }
.schedule-product-copy { min-width:0; display:grid; gap:3px; }
.schedule-product-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#2463eb; font-size:13px; }
.schedule-product-copy span,.schedule-product-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#6e7b8f; font-size:11px; }
.schedule-product-status { display:flex; align-items:center; gap:4px; overflow:visible !important; white-space:normal !important; }
.schedule-product-status .tag { min-height:20px; padding:0 6px; font-size:10px; }
.schedule-product-details { border-top:1px solid #e5e9f0; padding-top:8px; }
.schedule-product-details summary { color:#2463eb; cursor:pointer; font-size:11px; font-weight:650; list-style-position:inside; }
.schedule-product-details summary:hover { color:#1748ae; }
.schedule-product-detail-layout { display:block; margin-top:9px; }
.schedule-info-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 10px; min-width:0; }
.schedule-info-item { min-width:0; display:grid; gap:2px; }
.schedule-info-item dt { color:#8792a3; font-size:10px; }
.schedule-info-item dd { margin:0; overflow-wrap:anywhere; color:#344158; font-size:11px; line-height:1.4; }
.schedule-communication-notes { display:grid; gap:4px; margin-top:9px; padding:8px 9px; border-left:3px solid #81a7f3; color:#536074; background:#f6f9ff; }
.schedule-communication-notes strong { color:#315d58; font-size:11px; }
.schedule-communication-notes p { margin:0; font-size:11px; line-height:1.45; }
.schedule-communication-empty { margin-top:9px; color:#8792a3; font-size:11px; }
.schedule-empty { display:grid; place-items:center; min-height:90px; padding:20px; color:#8792a3; text-align:center; font-size:12px; }
.schedule-empty-board { min-height:220px; gap:6px; }
.schedule-empty-board strong { color:#536074; font-size:15px; }
.schedule-dialog { max-width:980px; }
.schedule-dialog .dialog-help { margin-bottom:14px; }
.schedule-picker-heading { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-top:16px; }
.schedule-picker-heading strong { color:#344158; }
.schedule-picker-heading small { color:#8792a3; font-size:11px; }
.schedule-product-picker { display:grid; gap:10px; margin-top:7px; padding:12px; border:1px solid #dfe5ee; border-radius:7px; background:#fbfcfe; }
.schedule-product-search input { width:100%; min-height:36px; padding:0 10px; border:1px solid #cbd4e3; border-radius:6px; background:#fff; }
.schedule-selected-products { display:flex; flex-wrap:wrap; gap:7px; min-height:30px; }
.schedule-selected-chip { display:inline-flex; align-items:center; gap:6px; min-height:30px; padding:3px 5px 3px 4px; border:1px solid #c5d6f6; border-radius:15px; color:#1748ae; background:#edf4ff; font-size:12px; }
.schedule-selected-chip img { width:23px; height:23px; object-fit:cover; border-radius:3px; background:#dfe7f4; }
.schedule-selected-chip .icon-button { width:22px; min-width:22px; height:22px; padding:0; border:0; background:transparent; color:#58729b; }
.schedule-picker-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-height:360px; overflow:auto; padding-right:3px; }
.schedule-product-option { display:grid; grid-template-columns:18px 42px minmax(0,1fr); align-items:center; gap:8px; min-width:0; padding:8px; border:1px solid #e1e7ef; border-radius:6px; background:#fff; cursor:pointer; }
.schedule-product-option.selected { border-color:#8db1f4; background:#f3f7ff; }
.schedule-product-option input { margin:0; }
.schedule-product-option img { width:42px; height:54px; object-fit:cover; border-radius:4px; background:#edf1f6; }
.schedule-product-option span { display:grid; gap:3px; min-width:0; }
.schedule-product-option strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#2463eb; font-size:12px; }
.schedule-product-option small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#788498; font-size:10px; }
@media (max-width:1000px) { .schedule-product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px) { .schedule-hero { align-items:flex-start; flex-direction:column; padding:18px; }.schedule-toolbar { width:100%; align-items:flex-start; }.schedule-toolbar label { flex:1; }.schedule-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }.schedule-product-grid,.schedule-picker-list { grid-template-columns:1fr; }.schedule-card-head { flex-direction:column; }.schedule-card-actions { width:100%; }.schedule-card-actions button { flex:1; }.schedule-info-grid { grid-template-columns:1fr; } }

/* 2026 visual system refresh: charcoal, teal and neutral enterprise palette. */
:root {
  --ink:#183033;
  --muted:#647574;
  --line:#dbe5e2;
  --surface:#fff;
  --canvas:#f3f6f5;
  --blue:#0f766e;
  --green:#177457;
  --orange:#b46b18;
  --red:#c2414f;
  --violet:#526f8f;
  --radius:8px;
  --primary:#0f766e;
  --primary-strong:#0b5f59;
  --primary-soft:#e8f4f1;
  --sidebar:#132628;
  --sidebar-hover:#1b3536;
  --sidebar-active:#234b49;
}
html,body { background:var(--canvas); }
body { color:var(--ink); }
::selection { color:#fff; background:#247f77; }
button,input,select,textarea { letter-spacing:0; }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible { outline:3px solid #9bcac4; outline-offset:2px; }
.app-shell { grid-template-columns:228px minmax(0,1fr); }
.sidebar { padding:20px 14px; color:#dbe7e5; background:var(--sidebar); box-shadow:10px 0 28px rgba(21,50,49,.08); min-height:100vh; height:100vh; overflow:hidden; }
.brand { gap:11px; padding:0 8px 18px; border-bottom:1px solid rgba(218,235,232,.14); }
.brand-mark { width:40px; height:40px; flex-basis:40px; border:1px solid #a9cbc5; border-radius:7px; background:#e4f1ee; box-shadow:none; }
.brand-mark::after { right:6px; bottom:5px; width:10px; height:2px; border-radius:2px; background:#33877e; }
.brand-mark b { color:#174b47; font-size:13px; font-weight:800; }
.brand-copy strong { color:#f7fbfa; font-size:16px; }
.brand-copy small { color:#91aaa7; font-size:10px; }
.nav { gap:5px; margin-top:16px; flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; scrollbar-color:rgba(143,199,190,.45) transparent; padding-right:3px; }
.nav::-webkit-scrollbar { width:7px; }
.nav::-webkit-scrollbar-track { background:transparent; }
.nav::-webkit-scrollbar-thumb { border-radius:8px; background:rgba(143,199,190,.45); }
.nav-group { display:grid; gap:3px; }
.nav-group-trigger { width:100%; min-height:40px; display:flex; align-items:center; gap:10px; padding:0 12px; border:0; border-radius:6px; color:#e0eeeb; background:transparent; text-align:left; font-weight:720; }
.nav-group-trigger span { width:16px; color:#86a5a1; text-align:center; }
.nav-group-trigger i { margin-left:auto; color:#86a5a1; font-style:normal; font-size:14px; transition:transform .16s ease; }
.nav-group-trigger:hover { color:#fff; background:var(--sidebar-hover); }
.nav-group.is-collapsed .nav-group-trigger i { transform:rotate(-90deg); }
.nav-group.is-collapsed .nav-group-menu { display:none; }
.nav-group-menu { display:grid; gap:3px; padding-left:10px; border-left:1px solid rgba(144,184,177,.24); margin-left:19px; }
.nav-group-menu .nav-item { min-height:36px; padding-left:12px; font-size:13px; }
.nav-top-level { margin-top:3px; }
.nav-dashboard-entry { margin-bottom:6px; border:1px solid rgba(129,190,181,.24); background:rgba(41,91,87,.32); font-weight:760; }
.nav-dashboard-entry:hover { background:var(--sidebar-hover); }
.nav-dashboard-entry.active { background:var(--sidebar-active); }
.nav-group-menu .nav-item.active { box-shadow:inset 2px 0 0 #66b8ad; }
.nav-item { min-height:42px; padding:0 12px; border-radius:6px; color:#c2d2d0; }
.nav-item span { color:#86a5a1; }
.nav-item:hover { color:#fff; background:var(--sidebar-hover); }
.nav-item.active { color:#fff; background:var(--sidebar-active); box-shadow:inset 3px 0 0 #66b8ad; }
.nav-item.active span { color:#a9ded7; }
.nav-item b { background:#b93343; }
.sidebar-footer { color:#8fa9a5; border-top-color:rgba(218,235,232,.14); }
.hr-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:16px; padding:22px 24px; border:1px solid #cfe1dd; border-radius:8px; background:#f4faf8; }
.hr-hero h2 { margin:3px 0 6px; color:#183033; font-size:25px; }
.hr-hero p:not(.eyebrow) { margin:0; color:#637775; }
.hr-hero-meta { display:grid; gap:4px; justify-items:end; color:#6d8180; font-size:11px; text-align:right; }
.hr-hero-actions { display:flex; gap:8px; margin-top:14px; flex-wrap:wrap; }
.hr-import-dialog { width:min(760px,calc(100vw - 30px)); }
.hr-import-toolbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:0 0 13px; }
.hr-import-toolbar span { color:#718482; font-size:11px; }
.hr-import-dropzone { display:grid; place-items:center; gap:5px; min-height:126px; padding:18px; border:1px dashed #9bcac4; border-radius:8px; color:#245a55; background:#f5fbf9; text-align:center; cursor:pointer; transition:border-color .15s ease,background .15s ease; }
.hr-import-dropzone:hover,.hr-import-dropzone:focus-within,.hr-import-dropzone.is-dragging { border-color:#0f766e; background:#edf8f5; box-shadow:0 0 0 3px rgba(15,118,110,.08); }
.hr-import-dropzone input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.hr-import-dropzone strong { font-size:14px; }
.hr-import-dropzone small { color:#718482; font-size:11px; }
.hr-import-preview { display:grid; gap:10px; min-height:116px; margin-top:14px; padding:12px; border:1px solid #dce9e6; border-radius:7px; background:#fbfdfc; }
.hr-import-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.hr-import-summary span { display:grid; gap:2px; padding:9px 10px; border:1px solid #e4eeeb; border-radius:6px; color:#718482; background:#fff; font-size:11px; }
.hr-import-summary b { color:#245a55; font-size:18px; }
.hr-import-summary b.has-error { color:#c2414f; }
.hr-import-success,.hr-import-errors { display:grid; gap:4px; padding:11px 12px; border-radius:6px; font-size:12px; line-height:1.5; }
.hr-import-success { border:1px solid #bfe0d2; color:#17645c; background:#effaf5; }
.hr-import-success span { color:#5b7772; font-size:11px; }
.hr-import-errors { border:1px solid #efc2c9; color:#9b3f4a; background:#fff5f6; }
.hr-import-errors span,.hr-import-errors small { color:#916f74; font-size:11px; }
.hr-import-errors ul { display:grid; gap:3px; max-height:120px; overflow:auto; margin:2px 0 0; padding-left:18px; }
.hr-import-preview-table { max-height:190px; overflow:auto; }
.hr-import-preview-table .product-table { min-width:560px; font-size:11px; }
.hr-import-preview-table .product-table th,.hr-import-preview-table .product-table td { padding:7px 8px; }
.hr-import-preview-table > small { display:block; margin-top:6px; }
.hr-import-loading { display:grid; place-items:center; gap:8px; min-height:90px; color:#637775; font-size:12px; }
.hr-employee-dialog { width:100%; max-width:100%; box-sizing:border-box; }
.hr-account-provisioning { display:grid; gap:12px; margin:14px 0 4px; padding:14px; border:1px solid #d9cbea; border-radius:8px; background:#fbf9ff; }
.hr-account-provisioning-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.hr-account-provisioning-head > div { display:grid; gap:4px; }
.hr-account-provisioning-head strong { color:#4c3b70; font-size:13px; }
.hr-account-provisioning-head small,.hr-role-recommendation { color:#786b88; font-size:11px; line-height:1.5; }
.hr-account-toggle { display:flex !important; align-items:center; gap:6px; flex:0 0 auto; color:#644d87 !important; font-weight:700; white-space:nowrap; }
.hr-account-fields { margin-top:2px; }
.hr-account-fields[hidden] { display:none; }
.hr-account-fields small { grid-column:1 / -1; margin-top:-5px; }
.hr-organization-dialog { width:min(820px,calc(100vw - 30px)); max-height:min(850px,calc(100vh - 28px)); overflow:auto; }
.hr-role-mapping-editor { display:grid; gap:10px; margin-top:4px; padding:13px; border:1px solid #dce9e6; border-radius:8px; background:#f8fcfb; }
.hr-role-mapping-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.hr-role-mapping-head > div { display:grid; gap:3px; }
.hr-role-mapping-head strong { color:#245a55; font-size:13px; }
.hr-role-mapping-head small { color:#718482; font-size:11px; }
.hr-role-mapping-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1.3fr) auto; align-items:center; gap:8px; padding:9px; border:1px solid #dce9e6; border-radius:7px; background:#fff; }
.hr-role-mapping-row.has-legacy { border-color:#e3c98f; background:#fffdf5; }
.hr-role-mapping-row select { min-width:0; }
.hr-role-mapping-warning { grid-column:1 / -1; color:#9a6a1c; font-size:11px; line-height:1.45; }
.hr-role-mapping-empty { padding:14px; border:1px dashed #c9dcd8; border-radius:6px; color:#718482; background:#fff; text-align:center; font-size:12px; }
.hr-role-mapping-panel { margin-top:16px; }
.hr-role-mapping-panel .hr-table { min-width:520px; }
.hr-directory-editor { display:grid; gap:10px; margin-top:4px; padding:13px; border:1px solid #dce9e6; border-radius:8px; background:#fbfdfd; }
.hr-directory-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.hr-directory-head > div:first-child { display:grid; gap:3px; }
.hr-directory-head strong { color:#245a55; font-size:13px; }
.hr-directory-head small,.hr-directory-hint { color:#718482; font-size:11px; line-height:1.5; }
.hr-directory-actions { display:flex; flex-wrap:wrap; gap:7px; }
.hr-directory-editor textarea { min-height:170px; }
.hr-directory-hint { margin:0; }
.hr-supervisor-editor { display:grid; gap:10px; margin-top:4px; padding:13px; border:1px solid #dce9e6; border-radius:8px; background:#f8fcfb; }
.hr-supervisor-list { display:grid; gap:8px; }
.hr-supervisor-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,1fr); align-items:center; gap:12px; padding:9px 11px; border:1px solid #dce9e6; border-radius:7px; background:#fff; }
.hr-supervisor-row > span { display:grid; gap:2px; color:#245a55; font-weight:600; }
.hr-supervisor-row > span small { color:#718482; font-size:11px; font-weight:400; }
.hr-supervisor-row select:disabled { color:#9aa9a7; background:#f3f6f5; }
@media (max-width:760px) { .hr-directory-head { display:grid; } .hr-directory-actions { width:100%; } }
.inline-edit-value { display:inline; padding:0; border:0; border-bottom:1px dashed transparent; color:inherit; background:transparent; text-align:left; font:inherit; cursor:pointer; }
.inline-edit-value:hover { color:var(--primary-strong); border-bottom-color:currentColor; }
.hr-organization-quick-dialog { width:min(620px,calc(100vw - 30px)); }
.hr-organization-quick-person { display:grid; gap:4px; padding:14px 16px; border:1px solid #dce9e6; border-radius:10px; background:#f7fbfa; }
.hr-organization-quick-person strong { color:#245a55; font-size:17px; }
.hr-organization-quick-person span { color:#718482; font-size:12px; }
.hr-organization-quick-role { padding:10px 12px; border:1px solid #dce9e6; border-radius:9px; color:#617572; background:#fbfdfd; font-size:12px; }
.hr-organization-quick-role strong { color:var(--primary-strong); }
.hr-directory-editor { max-height:340px; overflow:auto; }
.hr-directory-editor textarea { min-height:120px; }
.hr-role-mapping-editor { max-height:320px; overflow:auto; }
.hr-org-guide { display:flex; align-items:center; gap:10px; margin-bottom:14px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:linear-gradient(105deg,#f8fbfa,#fff); }
.hr-org-guide-step { display:flex; align-items:center; gap:8px; min-width:0; }
.hr-org-guide-step > b { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; color:#fff; background:var(--primary); font-size:12px; }
.hr-org-guide-step span { display:grid; gap:2px; }
.hr-org-guide-step strong { color:var(--ink); font-size:12px; }
.hr-org-guide-step small { color:var(--muted); font-size:10px; }
.hr-org-guide-arrow { color:#9ab4ae; font-size:17px; }
.hr-department-card { border-color:var(--line); border-radius:12px; background:#fff; }
.hr-department-card > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; cursor:pointer; list-style:none; }
.hr-department-card > summary::-webkit-details-marker { display:none; }
.hr-department-card > summary::after { content:"⌄"; color:#91aaa5; transition:transform .18s ease; }
.hr-department-card[open] > summary::after { transform:rotate(180deg); }
.hr-department-card > summary > span { display:grid; gap:4px; min-width:0; }
.hr-department-card > summary .eyebrow { margin:0; }
.hr-department-card > summary strong { color:var(--ink); font-size:17px; }
.hr-department-card > summary em { overflow:hidden; color:var(--muted); font-size:11px; font-style:normal; text-overflow:ellipsis; white-space:nowrap; }
.hr-department-card > summary b { flex:0 0 auto; color:var(--primary); font-size:16px; }
.hr-department-card > ul { border-top:1px solid var(--line); }
.hr-collapsible-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px; cursor:pointer; list-style:none; }
.hr-collapsible-head::-webkit-details-marker { display:none; }
.hr-collapsible-head > span:first-child { display:grid; gap:3px; }
.hr-collapsible-head strong { color:var(--ink); font-size:14px; }
.hr-collapsible-head small { color:var(--muted); font-size:11px; }
.hr-collapsible-head::after { content:"⌄"; color:#91aaa5; transition:transform .18s ease; }
.hr-role-mapping-panel[open] .hr-collapsible-head::after { transform:rotate(180deg); }
.hr-role-mapping-body { padding:0 16px 4px; }
@media (max-width:760px) {
  .hr-org-guide { align-items:flex-start; flex-direction:column; }
  .hr-org-guide-arrow { display:none; }
  .hr-org-guide-step { width:100%; }
}
.hr-status-dialog { width:min(560px,calc(100vw - 30px)); }
.hr-generated-number-box { display:flex; align-items:center; gap:8px; min-height:39px; padding:8px 10px; border:1px solid #cbdad7; border-radius:5px; background:#f4faf8; }
.hr-generated-number-box small { color:#718482; font-size:11px; }
.hr-generated-number { color:#17645c; font-size:18px; font-weight:750; letter-spacing:.04em; }
.hr-generated-number.pending { color:#708783; font-size:13px; font-weight:650; letter-spacing:0; }
.hr-employee-more { margin-top:14px; padding:11px 13px; border:1px solid #dce9e6; border-radius:7px; background:#f8fcfb; }
.hr-employee-more summary { color:#245a55; cursor:pointer; font-size:12px; font-weight:700; }
.hr-employee-more .form-grid { margin-top:13px; }
.hr-privacy-badge { display:inline-flex; align-items:center; min-height:24px; padding:0 8px; border:1px solid #afd1c9; border-radius:12px; color:#17645c; background:#e5f4ef; font-size:11px; font-weight:700; }
.hr-privacy-badge.limited { color:#76581d; border-color:#e3c98f; background:#fff8e9; }
.hr-table-wrap { margin-bottom:16px; }
.hr-section-title { margin:20px 0 8px; color:#245a55; font-size:16px; }
.hr-table { min-width:940px; }
.hr-table td,.hr-table th { white-space:nowrap; }
.hr-metrics { grid-template-columns:repeat(5,minmax(0,1fr)); }
.hr-dashboard-grid { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr); gap:16px; }
.hr-module-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:16px; }
.hr-module-links button { display:flex; justify-content:space-between; align-items:center; min-height:48px; text-align:left; }
.hr-module-links b { color:var(--primary); }
.hr-source-list { display:grid; gap:12px; margin:0; padding:16px; }
.hr-source-list div { display:grid; gap:3px; }
.hr-source-list dt { color:#80918f; font-size:11px; }
.hr-source-list dd { margin:0; overflow-wrap:anywhere; color:#355452; font-size:12px; }
.hr-placeholder { margin-top:16px; }
.hr-performance-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:16px; }
.hr-performance-grid article { display:grid; gap:5px; min-height:98px; padding:13px; border:1px solid #dce9e6; border-radius:7px; background:#f8fcfb; }
.hr-performance-grid strong { color:#245a55; }
.hr-performance-grid span { color:#718482; font-size:12px; }
.center-placeholder { margin-top:8px; }
.center-placeholder-body { display:grid; gap:7px; min-height:180px; place-content:center; padding:24px; color:#738482; text-align:center; }
.center-placeholder-body strong { color:#315b57; font-size:16px; }
.finance-invoice-toolbar { align-items:flex-end; }
.finance-invoice-toolbar p { max-width:760px; }
.finance-invoice-metrics { grid-template-columns:repeat(4,minmax(0,1fr)); }
.finance-invoice-preview { display:flex; flex-wrap:wrap; gap:10px 22px; padding:11px 13px; border:1px solid #e4e8f0; border-radius:8px; background:#fafbfe; color:#66738a; font-size:12px; }
.finance-invoice-preview strong { color:#263b61; }
.finance-invoice-table td { vertical-align:top; }
.finance-invoice-table td > .subtle { display:block; margin-top:4px; }
.finance-invoice-table .row-actions { margin-top:8px; min-width:0; }
@media (max-width:760px) { .finance-invoice-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }.finance-invoice-toolbar { align-items:flex-start; flex-direction:column; } }
.permission-empty { display:flex; align-items:center; gap:18px; min-height:260px; padding:42px 48px; border:1px solid #e5e2f4; background:linear-gradient(135deg,#fff 0%,#faf9ff 100%); }
.permission-empty-icon { display:grid; place-items:center; width:54px; height:54px; flex:0 0 54px; border:1px solid #ddd7f1; border-radius:16px; color:#7666ae; background:#f1effb; font-size:24px; }
.permission-empty-copy { display:grid; gap:8px; }
.permission-empty-copy .status-tag { width:max-content; color:#7666ae; border-color:#ddd7f1; background:#f1effb; }
.permission-empty-copy h2 { margin:0; color:#2f3550; font-size:21px; }
.permission-empty-copy p { margin:0; color:#4f5870; font-size:15px; font-weight:650; }
.permission-empty-copy small { color:#8790a3; font-size:12px; }
.hr-loading,.hr-error { display:grid; gap:9px; place-content:center; min-height:220px; padding:24px; text-align:center; }
.hr-error h2 { margin:0; color:#9b3f4a; }
.hr-error p { margin:0; color:#6d7778; }
.workspace,.page { background:var(--canvas); }
.topbar { height:76px; padding:0 30px; border-color:var(--line); background:rgba(255,255,255,.98); box-shadow:0 1px 0 rgba(22,57,54,.03); }
.topbar h1 { color:var(--ink); font-size:20px; font-weight:720; }
.search,.top-actions select,.user-menu,.icon-button,.secondary { color:#304d4d; border-color:#d6e2df; background:#fff; }
.search:focus-within { border-color:#5fa69e; box-shadow:0 0 0 3px #e4f2ef; }
.search span { color:#77908e; }
.search input::placeholder { color:#98aaa8; }
.user-menu:hover,.icon-button:hover,.secondary:hover { color:#0b5f59; border-color:#91bbb5; background:#f5faf9; }
.primary,.auth-submit { color:#fff; border-color:var(--primary); background:var(--primary); box-shadow:0 1px 2px rgba(13,93,86,.18); }
.primary:hover,.auth-submit:hover { border-color:var(--primary-strong); background:var(--primary-strong); }
.action-link,a,.panel-head a { color:var(--primary); }
.action-link:hover,a:hover,.panel-head a:hover { color:var(--primary-strong); }
.panel,.metric,.metric-card,.summary-card,.role-card,.schedule-kpi,.operation-connector-card { border-color:var(--line); background:#fff; box-shadow:0 1px 2px rgba(21,50,49,.035); }
.metric:hover,.metric-card:hover,.summary-card:hover { border-color:#b7d2cd; }
.panel-head { border-color:var(--line); }
.product-table thead th,table thead th { color:#556c6b; border-color:var(--line); background:#f5f8f7; }
.product-table td,table td { border-color:#e6ecea; }
.product-table tbody tr:hover,table tbody tr:hover { background:#f8fbfa; }
.status-tag,.chip,.effect-status { color:#55716e; border-color:#dbe7e4; background:#f0f5f4; }
.filter-chip.selected,.filters button.selected { color:#0b5f59; border-color:#72aaa3; background:var(--primary-soft); }
.form input,.form select,.form textarea,.dialog input,.dialog select,.dialog textarea { color:var(--ink); border-color:#cfdedb; background:#fff; }
.form input:focus,.form select:focus,.form textarea:focus,.dialog input:focus,.dialog select:focus,.dialog textarea:focus { border-color:#5b9f97; outline:0; box-shadow:0 0 0 3px #e4f2ef; }
.dialog { border-color:var(--line); background:#fff; box-shadow:0 28px 70px rgba(16,42,41,.22); }
.dialog::backdrop { background:rgba(15,35,35,.54); backdrop-filter:blur(2px); }
.toolbar-note,.subtle,.metric-note { color:var(--muted); }
.schedule-hero,.styling-output-section,.operation-data-filter-group,.privacy-notice { border-color:#cfe1dd; background:#f4faf8; }
.schedule-hero .eyebrow,.operation-data-all-months,.manual-styling-upload summary,.schedule-product-copy strong,.schedule-product-option strong { color:var(--primary); }
.schedule-period span,.schedule-selected-chip,.styling-section-head>strong { color:#155e57; border-color:#c5ded9; background:#eaf5f2; }
.schedule-toolbar .icon-button:hover { color:var(--primary); border-color:var(--primary); }
.schedule-period-hint { margin:0 0 14px; padding:10px 12px; border-left:3px solid #76bcb1; border-radius:7px; color:#456864; background:#f0f9f7; line-height:1.55; }
.schedule-period-hint.schedule-period-conflict { border-left-color:#c33f4d; color:#9c2e3d; background:#fff1f3; }
.operation-data-bar i { background:#0f766e; }
.operation-data-bar-row:nth-child(2) .operation-data-bar i { background:#3c7d8a; }
.operation-data-bar-row:nth-child(3) .operation-data-bar i { background:#b47a32; }
.operation-data-bar-row:nth-child(4) .operation-data-bar i { background:#4f7b5b; }
.operation-data-influencer-summary b { color:var(--primary); }
.privacy-notice { border-left-color:#4e9a91; }
.model-profile-avatar { background:#347e77; }
.model-reference-slot:hover,.model-reference-slot:focus-visible { border-color:#68a69f; background:#f2f9f7; }
.auth-workspace { background:#eef3f1; }
.auth-workspace .topbar { display:none; }
.auth-workspace #page { min-height:100vh; padding:32px; display:grid; place-items:center; background:#eef3f1; }
.auth-shell { width:min(1040px,100%); min-height:620px; display:grid; grid-template-columns:minmax(330px,.82fr) minmax(440px,1.18fr); overflow:hidden; border:1px solid #d6e2df; border-radius:8px; background:#fff; box-shadow:0 30px 80px rgba(18,48,46,.12); }
.auth-brand-panel { min-height:620px; padding:52px 46px 40px; color:#fff; border:0; background:#142928; }
.auth-brand-mark { display:grid; place-items:center; width:58px; height:58px; margin:0 0 34px; color:#164c47; border:1px solid #75aaa4; border-radius:8px; background:#e4f2ef; box-shadow:none; font-size:16px; font-weight:850; }
.auth-company { margin:0 0 10px; color:#8cc4bd; font-size:14px; font-weight:700; }
.auth-brand-panel h1 { max-width:260px; margin:0; color:#fff; font-size:34px; line-height:1.25; }
.auth-brand-note { max-width:280px; margin:18px 0 0; color:#a9bfbc; font-size:14px; line-height:1.8; }
.auth-brand-footer { color:#91aaa7; }
.auth-panel { width:100%; max-width:520px; margin:auto; padding:66px 64px 48px; }
.auth-kicker { color:#0f766e; font-size:12px; font-weight:750; }
.auth-panel h2 { margin-top:18px; color:#183033; font-size:31px; }
.auth-intro { color:#71817f; }
.auth-form { gap:20px; margin-top:38px; }
.auth-form label { color:#304d4d; font-weight:650; }
.auth-form input { height:50px; border-color:#cbdad7; border-radius:6px; }
.auth-form input:focus { border-color:#5b9f97; outline:0; box-shadow:0 0 0 3px #e4f2ef; }
.password-toggle,.password-toggle:hover { color:#0f766e; }
.auth-submit { min-height:50px; border-radius:6px; font-weight:700; }
.auth-error { color:#bd3849; }
.auth-copyright { color:#9aa8a6; }
@media (max-width:760px) {
  .app-shell { grid-template-columns:1fr; }
  .sidebar { box-shadow:none; }
  .nav { display:flex; overflow:auto; align-items:flex-start; }
  .nav-group { display:flex; flex:0 0 auto; align-items:flex-start; position:relative; }
  .nav-group-trigger { width:auto; min-height:38px; white-space:nowrap; padding:0 10px; }
  .nav-group-trigger i { margin-left:4px; }
  .nav-group-menu { position:absolute; z-index:4; display:none; min-width:190px; margin:38px 0 0; padding:7px; border:1px solid #315253; border-radius:7px; background:#17302f; box-shadow:0 12px 26px rgba(0,0,0,.2); }
  .nav-group:not(.is-collapsed):focus-within .nav-group-menu,.nav-group:hover .nav-group-menu { display:grid; }
  .nav-group-menu .nav-item { width:100%; white-space:nowrap; }
  .nav-group.is-collapsed .nav-group-menu { display:none; }
  .nav-top-level { width:auto; white-space:nowrap; margin-top:0; }
  .auth-workspace #page { min-height:100dvh; padding:14px; align-items:center; }
  .auth-shell { min-height:auto; grid-template-columns:1fr; }
  .auth-brand-panel { min-height:150px; padding:28px; border:0; border-top:4px solid #4f9a91; }
  .auth-brand-mark { width:42px; height:42px; margin-bottom:18px; font-size:12px; }
  .auth-company { margin-bottom:6px; }
  .auth-brand-panel h1 { font-size:24px; }
  .auth-brand-note { margin-top:8px; font-size:12px; }
  .auth-brand-footer { display:none; }
  .auth-panel { max-width:none; padding:34px 26px 30px; }
  .auth-panel h2 { font-size:26px; }
  .auth-form { margin-top:28px; }
  .hr-hero { align-items:flex-start; flex-direction:column; padding:18px; }
  .hr-hero h2 { font-size:22px; }
  .hr-hero-meta { justify-items:start; text-align:left; }
  .hr-dashboard-grid { grid-template-columns:1fr; }
  .hr-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .hr-performance-grid { grid-template-columns:1fr 1fr; }
  .hr-import-summary { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .hr-import-summary span { padding:8px 6px; }
  .hr-import-summary b { font-size:16px; }
}

/* Multi-module workspace: keep opened business areas available as lightweight tabs. */
.workspace-tabs { display:flex; align-items:center; gap:6px; min-height:48px; padding:7px 30px; overflow-x:auto; border-bottom:1px solid var(--line); background:#fbfdfc; scrollbar-width:thin; }
.workspace-tab { display:flex; align-items:stretch; flex:0 0 auto; min-height:32px; border:1px solid #d6e2df; border-radius:6px; background:#fff; color:#4d6563; box-shadow:0 1px 1px rgba(21,50,49,.03); }
.workspace-tab:hover { border-color:#91bbb5; background:#f5faf9; }
.workspace-tab.active { border-color:#5fa69e; color:#0b5f59; background:#eaf5f2; box-shadow:0 0 0 2px #d8eeea; }
.workspace-tab-main { min-width:0; max-width:190px; padding:0 12px; overflow:hidden; border:0; border-radius:5px 0 0 5px; background:transparent; color:inherit; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:650; }
.workspace-tab-main:focus-visible { outline-offset:-3px; }
.workspace-tab-close { width:30px; min-height:30px; padding:0; border:0; border-left:1px solid #e3ece9; border-radius:0 5px 5px 0; background:transparent; color:#76908d; font-size:18px; line-height:1; }
.workspace-tab-close:hover { color:#b13c4a; background:#fff0f1; }
.workspace-tab-close:focus-visible { outline-offset:-3px; }
.auth-workspace .workspace-tabs { display:none; }
@media (max-width:760px) {
  .workspace-tabs { min-height:44px; padding:6px 16px; gap:5px; }
  .workspace-tab-main { max-width:150px; padding:0 10px; }
  .workspace-tab-close { width:28px; min-height:28px; }
}

/* Controlled pattern and fitting attachments: preview in place, never force a download. */
.attachment-picker { display:grid; gap:4px; min-height:72px; place-content:center; margin-top:7px; padding:12px 14px; border:1px dashed #a9c8c2; border-radius:7px; color:#315d58; background:#f6fbfa; cursor:pointer; text-align:center; }
.attachment-picker:hover,.attachment-picker:focus-visible,.attachment-picker.drag-over { border-color:#4e9a91; background:#e8f4f1; }
.attachment-picker strong { font-size:12px; }
.attachment-picker small { color:var(--muted); font-size:11px; line-height:1.4; }
.attachment-picker-list { display:flex; flex-wrap:wrap; gap:6px; min-height:28px; margin-top:7px; }
.attachment-picker-chip { display:inline-flex; align-items:center; gap:5px; min-height:27px; max-width:100%; padding:3px 7px 3px 9px; border:1px solid #c7ddd8; border-radius:14px; color:#315d58; background:#f1f8f6; font-size:11px; }
.attachment-picker-chip button { width:19px; height:19px; padding:0; border:0; border-radius:50%; color:#6b8581; background:transparent; cursor:pointer; font-size:15px; line-height:1; }
.attachment-picker-chip button:hover { color:#b13c4a; background:#fff0f1; }
.attachment-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:10px; margin-top:10px; }
.attachment-card { min-width:0; overflow:hidden; border:1px solid #dbe5e2; border-radius:7px; background:#fbfdfc; }
.attachment-video { display:block; width:100%; max-height:260px; background:#132628; }
.attachment-image { display:block; width:100%; height:180px; object-fit:contain; background:#f1f5f4; cursor:zoom-in; }
.attachment-meta { display:grid; gap:3px; padding:8px 9px 9px; }
.attachment-meta strong { overflow:hidden; color:#315d58; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.attachment-meta small { color:var(--muted); font-size:11px; }
@media (max-width:760px) {
  .attachment-list { grid-template-columns:1fr; }
  .attachment-image { height:220px; }
  .attachment-picker { min-height:64px; }
}

/* 2026-08-25 visual refresh: high-contrast navigation, calmer surfaces and a focused sign-in experience. */
:root {
  --canvas:#f3f7f6;
  --surface:#ffffff;
  --surface-soft:#f8fbfa;
  --line:#dbe8e5;
  --ink:#173331;
  --muted:#6a817d;
  --primary:#0f766e;
  --primary-strong:#0a5b55;
  --primary-soft:#e6f4f1;
  --sidebar:#102c2b;
  --sidebar-hover:#1b403e;
  --sidebar-active:#215c57;
  --radius:12px;
}
html,body { min-height:100%; background:var(--canvas); }
body { color:var(--ink); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; -webkit-font-smoothing:antialiased; }
.app-shell { grid-template-columns:248px minmax(0,1fr); background:linear-gradient(135deg,#f8fbfa 0%,#f1f6f5 100%); }
.sidebar { padding:18px 14px; background:var(--sidebar); box-shadow:12px 0 34px rgba(16,44,43,.12); }
.brand { min-height:72px; padding:4px 9px 18px; border-bottom-color:rgba(197,227,221,.16); }
.brand-mark { width:42px; height:42px; flex-basis:42px; border:1px solid #8fc7be; border-radius:12px; background:linear-gradient(145deg,#e9f7f4,#bfe0d9); box-shadow:0 6px 18px rgba(0,0,0,.12); }
.brand-mark::after { right:7px; bottom:6px; width:11px; height:3px; background:#2f887f; }
.brand-mark b { color:#15504b; font-size:14px; }
.brand-copy strong { color:#f2fbf9; font-size:17px; letter-spacing:.01em; }
.brand-copy small { color:#91b1ac; }
.nav { gap:5px; margin-top:17px; }
.nav-item { min-height:42px; padding:0 12px; border:1px solid transparent; border-radius:9px; color:#b8d0cc; font-size:13px; font-weight:590; transition:background .16s ease,color .16s ease,border-color .16s ease,transform .16s ease; }
.nav-item span { color:#84aaa4; }
.nav-item:hover { color:#f5fbfa; background:var(--sidebar-hover); border-color:rgba(150,209,199,.12); transform:translateX(1px); }
.nav-item.active { color:#fff; background:linear-gradient(100deg,#276e67,#1f5652); border-color:#63b7ab; box-shadow:inset 3px 0 0 #8bd2c7,0 6px 16px rgba(5,42,39,.18); }
.nav-item.active span { color:#b9e7df; }
.nav-group { gap:4px; }
.nav-group-trigger { min-height:42px; padding:0 12px; border-radius:9px; color:#d1e5e1; font-size:13px; }
.nav-group-trigger span,.nav-group-trigger i { color:#83aaa4; }
.nav-group-trigger:hover { color:#fff; background:var(--sidebar-hover); }
.nav-group-menu { gap:4px; padding:6px 0 6px 11px; margin-left:20px; border-left-color:rgba(144,201,191,.24); }
.nav-group-menu .nav-item { min-height:38px; padding-left:13px; color:#a9c5c0; font-size:12px; }
.nav-group-menu .nav-item:hover { color:#f4fbf9; }
.nav-group-menu .nav-item.active { background:rgba(39,110,103,.72); box-shadow:inset 3px 0 0 #7fcbbf; }
.nav-dashboard-entry { margin-bottom:8px; border-color:rgba(141,205,194,.25); background:linear-gradient(100deg,rgba(41,102,96,.62),rgba(26,68,65,.55)); font-weight:720; }
.nav-dashboard-entry.active { background:linear-gradient(100deg,#2b746c,#215852); }
.sidebar-footer { color:#8eaaa5; border-top-color:rgba(197,227,221,.16); }
.workspace { min-width:0; background:transparent; }
.topbar { height:78px; padding:0 34px; border-bottom-color:rgba(208,226,222,.9); background:rgba(255,255,255,.86); box-shadow:0 1px 0 rgba(17,52,48,.03); backdrop-filter:blur(14px); }
.topbar h1 { color:var(--ink); font-size:20px; font-weight:760; }
.search { width:300px; border-color:#d2e2df; border-radius:10px; background:rgba(249,252,251,.9); }
.search:focus-within { border-color:#76bcb1; box-shadow:0 0 0 4px #e5f4f1; }
.user-menu,.icon-button { border-color:#d2e2df; border-radius:10px; background:rgba(255,255,255,.9); }
.page { max-width:1760px; padding:30px 34px 54px; }
.panel,.metric,.metric-card,.summary-card,.role-card,.schedule-kpi,.operation-connector-card { border-color:var(--line); border-radius:var(--radius); box-shadow:0 8px 24px rgba(23,68,63,.045); }
.panel-head { padding:17px 19px; border-bottom-color:#e3eeeb; }
.panel-head h3 { color:#1a3b38; font-size:15px; font-weight:740; }
.metrics { gap:14px; }
.metric { padding:18px; }
.metric-value { color:#173b37; }
.primary,.auth-submit { border-radius:10px; background:var(--primary); box-shadow:0 7px 16px rgba(15,118,110,.18); }
.primary:hover,.auth-submit:hover { background:var(--primary-strong); transform:translateY(-1px); }
.secondary { border-color:#d2e2df; border-radius:9px; color:#31534f; background:#fff; }
.secondary:hover { border-color:#89beb6; color:#0d665e; background:#f4faf8; }
.product-table { border-spacing:0; }
.product-table th,table thead th { padding:13px 14px; color:#58706c; background:#f4f9f7; border-bottom-color:#dceae6; font-weight:720; }
.product-table td,table td { padding:12px 14px; border-bottom-color:#e7efed; }
.product-table tbody tr:hover,table tbody tr:hover { background:#f4faf8; }
.tag { border-radius:999px; font-weight:650; }
.workspace-tabs { min-height:52px; padding:8px 34px; border-bottom-color:#dceae7; background:rgba(248,252,251,.86); }
.workspace-tab { border-color:#d4e3df; border-radius:9px; }
.workspace-tab.active { border-color:#69b3aa; background:#e7f5f2; box-shadow:0 0 0 3px #d8efeb; }
.auth-workspace { background:radial-gradient(circle at 12% 12%,#d9f0eb 0%,transparent 34%),linear-gradient(135deg,#eff7f5 0%,#e4efed 100%); }
.auth-workspace #page { min-height:100dvh; padding:clamp(18px,4vw,56px); }
.auth-shell { width:min(1080px,100%); min-height:640px; grid-template-columns:minmax(340px,.86fr) minmax(450px,1.14fr); border:1px solid rgba(185,215,209,.85); border-radius:22px; box-shadow:0 28px 80px rgba(20,66,61,.16); }
.auth-brand-panel { position:relative; min-height:640px; padding:58px 52px 42px; overflow:hidden; background:linear-gradient(145deg,#123533 0%,#0b5851 100%); }
.auth-brand-panel::before,.auth-brand-panel::after { content:""; position:absolute; border:1px solid rgba(190,239,230,.17); border-radius:50%; pointer-events:none; }
.auth-brand-panel::before { width:430px; height:430px; right:-220px; top:-160px; box-shadow:0 0 0 30px rgba(186,234,226,.04),0 0 0 60px rgba(186,234,226,.025); }
.auth-brand-panel::after { width:270px; height:270px; left:-160px; bottom:-120px; }
.auth-brand-panel > * { position:relative; z-index:1; }
.auth-brand-mark { width:62px; height:62px; margin-bottom:42px; border:1px solid #9ed5cd; border-radius:16px; background:linear-gradient(145deg,#ebfaf7,#b8ddd5); box-shadow:0 10px 24px rgba(0,0,0,.15); }
.auth-company { color:#a8d8d0; font-size:14px; letter-spacing:.04em; }
.auth-brand-panel h1 { max-width:290px; font-size:36px; letter-spacing:.01em; }
.auth-brand-note { max-width:300px; color:#b8d7d1; line-height:1.9; }
.auth-brand-footer { border-top-color:rgba(185,239,230,.18); color:#9bc4be; }
.auth-panel { max-width:540px; padding:74px 72px 52px; }
.auth-kicker { margin-bottom:12px; color:#168076; letter-spacing:.04em; }
.auth-panel h2 { margin-top:0; color:#173b37; font-size:32px; letter-spacing:-.02em; }
.auth-intro { margin:10px 0 32px; color:#728783; }
.auth-form { gap:20px; margin-top:0; }
.auth-form label { color:#34514d; font-weight:680; }
.auth-form input { height:52px; border-color:#c9dcd7; border-radius:10px; background:#fbfefd; }
.auth-form input:hover { border-color:#9fc6bf; }
.auth-form input:focus { border-color:#4faaa0; box-shadow:0 0 0 4px #e2f3ef; }
.password-field input { padding-right:70px; }
.password-toggle { top:2px; right:2px; height:48px; color:#43857c; }
.auth-submit { min-height:52px; margin-top:6px; font-size:14px; }
.auth-error { padding:9px 11px; border-radius:9px; background:#fff4f5; }
.auth-copyright { color:#96aaa6; }
@media (max-width:760px) {
  .app-shell { display:block; }
  .sidebar { position:sticky; top:0; z-index:20; height:100dvh; min-height:100dvh; overflow:hidden; padding:10px; box-shadow:0 8px 22px rgba(16,44,43,.14); }
  .brand { min-height:58px; padding:0 4px 10px; }
  .nav { position:relative; z-index:21; display:block; overflow-y:auto; overflow-x:hidden; margin-top:10px; padding-right:2px; }
  .nav-group { display:block; }
  .nav-group-menu { position:static; z-index:auto; display:grid; min-width:0; max-height:none; overflow:visible; margin:0 0 4px 20px; padding:6px 0 6px 10px; border:0; border-left:1px solid rgba(144,201,191,.24); border-radius:0; background:transparent; box-shadow:none; }
  .nav-group-menu .nav-item { min-height:38px; padding-left:12px; }
  .nav-group.is-collapsed .nav-group-menu { display:none; }
  .workspace { position:relative; z-index:1; }
  .topbar { min-height:72px; padding:12px 16px; }
  .page { padding:22px 16px 38px; }
  .search { width:210px; }
  .auth-workspace #page { padding:14px; }
  .auth-shell { min-height:auto; border-radius:18px; grid-template-columns:1fr; }
  .auth-brand-panel { min-height:200px; padding:30px 26px 26px; border-top:4px solid #8dd0c5; }
  .auth-brand-mark { width:46px; height:46px; margin-bottom:22px; border-radius:12px; }
  .auth-brand-panel h1 { font-size:27px; }
  .auth-brand-note { margin-top:8px; font-size:12px; }
  .auth-brand-footer { display:none; }
  .auth-panel { max-width:none; padding:34px 26px 30px; }
  .auth-panel h2 { font-size:27px; }
}

/* Sidebar scroll contract: keep every navigation item inside the dark rail. */
.sidebar {
  --sidebar-vh:100vh;
  height:var(--sidebar-vh);
  min-height:var(--sidebar-vh);
  max-height:var(--sidebar-vh);
  overflow:hidden;
}
.nav {
  height:0;
  min-height:0;
  flex:1 1 auto;
  align-content:start;
  grid-auto-rows:max-content;
  overflow-y:scroll;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  scrollbar-gutter:stable;
}
.nav-group-menu {
  position:static;
}
.visually-hidden {
  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;
}
@supports (height:100dvh) {
  .sidebar {
    --sidebar-vh:100dvh;
  }
}

/* Neutral product branding: a white rail keeps the workspace calm and lets the
   teal active state carry the hierarchy without showing a company identity. */
:root {
  --sidebar:#fff;
  --sidebar-hover:#f2f8f7;
  --sidebar-active:#e5f4f1;
}
.sidebar {
  color:#3a5752;
  background:#fff;
  border-right:1px solid #e2eeeb;
  box-shadow:8px 0 28px rgba(22,67,61,.06);
}
.brand {
  color:#173b37;
  border-bottom-color:#e1ece9;
}
.brand-mark {
  color:#15504b;
  border-color:#8fc7be;
  background:linear-gradient(145deg,#effaf8,#cdebe5);
  box-shadow:0 7px 18px rgba(22,91,83,.12);
}
.brand-mark b { color:#15504b; }
.brand-mark::after { background:#2f887f; }
.brand-copy strong { color:#173b37; font-size:15px; }
.brand-copy small { color:#78928d; }
.nav { scrollbar-color:#b8d8d2 #f7fbfa; }
.nav::-webkit-scrollbar-track { background:#f7fbfa; }
.nav::-webkit-scrollbar-thumb { background:#b8d8d2; }
.nav-group-trigger { color:#3a5752; }
.nav-group-trigger span,.nav-group-trigger i { color:#73a39b; }
.nav-group-trigger:hover { color:#0f625a; background:var(--sidebar-hover); }
.nav-group-menu { border-left-color:#d8e9e5; }
.nav-item { color:#54716c; }
.nav-item span { color:#77a39c; }
.nav-item:hover { color:#0f625a; background:var(--sidebar-hover); }
.nav-item.active { color:#0d5e56; background:var(--sidebar-active); border-color:#98d0c6; box-shadow:inset 3px 0 0 #3d9d91; }
.nav-item.active span { color:#238277; }
.nav-dashboard-entry { color:#155f58; border-color:#c4e4de; background:#f0f9f7; }
.nav-dashboard-entry:hover { background:#e7f5f2; }
.nav-dashboard-entry.active { color:#0d5e56; background:#dff1ed; }
.nav-group-menu .nav-item { color:#6a8781; }

/* Tenant-aware in-app identity: the authenticated workspace names the
   registered company主体, while the sign-in screen keeps the shared product
   name. The mark is intentionally abstract so no tenant code or initials are
   mistaken for the current company identity. */
.brand {
  align-items:center;
}
.brand-mark {
  position:relative;
  overflow:hidden;
}
.brand-mark::before {
  content:"";
  position:absolute;
  width:17px;
  height:9px;
  border:3px solid #2f887f;
  border-radius:999px;
  transform:rotate(-14deg);
}
.brand-mark b { display:none; }
.brand-copy strong {
  display:-webkit-box;
  max-width:170px;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  color:#173b37;
  font-size:14px;
  line-height:1.32;
  white-space:normal;
  overflow-wrap:anywhere;
}
.brand-copy small {
  margin-top:3px;
  color:#78928d;
  font-size:10px;
}
.auth-brand-mark {
  position:relative;
  overflow:hidden;
}
.auth-brand-mark::before {
  content:"";
  position:absolute;
  width:26px;
  height:13px;
  border:4px solid #8066a3;
  border-radius:999px;
  transform:rotate(-14deg);
}
.auth-brand-mark::after {
  content:"";
  position:absolute;
  right:12px;
  bottom:12px;
  width:16px;
  height:4px;
  border-radius:999px;
  background:#8066a3;
}
.nav-group-menu .nav-item:hover { color:#0f625a; }
.nav-group-menu .nav-item.active { background:#eaf6f3; box-shadow:inset 3px 0 0 #58aa9f; }
.nav-item b { color:#fff; background:#c43d50; }
.sidebar-footer { color:#78928d; border-top-color:#e1ece9; }
@media (max-width:760px) {
  .sidebar { box-shadow:0 8px 22px rgba(22,67,61,.08); }
}
@media (max-width:760px) {
  .sidebar {
    width:100%;
    position:sticky;
    top:0;
  }
  .nav {
    height:auto;
    max-height:calc(var(--sidebar-vh) - 82px);
    display:block;
  }
  .nav-group {
    display:block;
  }
  .nav-group-menu {
    display:grid;
    min-width:0;
    max-height:none;
    overflow:visible;
    margin:0 0 4px 20px;
    padding:6px 0 6px 10px;
    border:0;
    border-left:1px solid rgba(144,201,191,.24);
    background:transparent;
    box-shadow:none;
  }
}

/* Login refinement: single-line brand title with a calm lavender palette. */
.auth-workspace {
  overflow-x:hidden;
  background:radial-gradient(circle at 12% 10%,#eee4fa 0%,transparent 34%),linear-gradient(135deg,#fbf9fe 0%,#eee8f7 100%);
}
.auth-shell {
  width:min(1120px,100%);
  grid-template-columns:minmax(420px,.92fr) minmax(440px,1.08fr);
  border-color:#ded3eb;
  box-shadow:0 28px 80px rgba(78,57,105,.16);
}
.auth-brand-panel {
  min-width:0;
  padding:58px 48px 42px;
  background:linear-gradient(145deg,#5d4b78 0%,#8e78aa 100%);
}
.auth-brand-panel::before,.auth-brand-panel::after {
  border-color:rgba(244,235,255,.22);
}
.auth-brand-panel::before {
  box-shadow:0 0 0 30px rgba(239,224,255,.06),0 0 0 60px rgba(239,224,255,.035);
}
.auth-brand-mark {
  color:#503d6f;
  border-color:#d8c0ed;
  background:linear-gradient(145deg,#fbf5ff,#dcc9ef);
  box-shadow:0 10px 24px rgba(44,29,65,.18);
}
.auth-company { color:#eadff7; }
.auth-brand-panel h1 {
  max-width:none;
  white-space:nowrap;
  overflow:visible;
  color:#fff;
  font-size:clamp(28px,3vw,36px);
  letter-spacing:0;
}
.auth-brand-note { color:#eadff7; }
.auth-brand-footer {
  border-top-color:rgba(244,235,255,.24);
  color:#ddcdec;
}
.auth-kicker { color:#8066a3; }
.auth-panel h2 { color:#403354; }
.auth-intro { color:#7c718b; }
.auth-form label { color:#514362; }
.auth-form input {
  border-color:#d8cce8;
  background:#fefcff;
}
.auth-form input:hover { border-color:#bda8d7; }
.auth-form input:focus {
  border-color:#8066a3;
  box-shadow:0 0 0 4px #eee6f7;
}
.password-toggle { color:#8066a3; }
.password-toggle:hover { color:#5e467e; }
.auth-submit {
  border-color:#8066a3;
  background:#8066a3;
  box-shadow:0 7px 16px rgba(128,102,163,.24);
}
.auth-submit:hover { background:#6e568f; }
.auth-copyright { color:#9b8eaa; }
@media (max-width:980px) {
  .auth-shell { grid-template-columns:1fr; }
  .auth-brand-panel { min-height:230px; }
}
@media (max-width:760px) {
  .auth-brand-panel {
    min-height:200px;
    padding:30px 26px 26px;
    border-top-color:#cdb5e4;
  }
  .auth-brand-panel h1 {
    font-size:clamp(24px,7vw,28px);
  }
}

/* Dashboard milestone list: make the multi-style drill-down readable on desktop and mobile. */
.dashboard-milestone-dialog { width:min(780px,calc(100vw - 28px)); }
.dashboard-milestone-dialog-intro { padding:13px 20px 0; color:#687386; font-size:12px; line-height:1.6; }
.dashboard-milestone-list { display:grid; gap:8px; max-height:min(560px,calc(100vh - 190px)); overflow:auto; padding:14px 20px 20px; }
.dashboard-milestone-row { width:100%; display:grid; grid-template-columns:minmax(130px,1fr) minmax(170px,1.2fr) 110px; gap:12px; align-items:center; padding:12px; border:1px solid #e2e7ef; border-radius:8px; background:#fff; color:var(--ink); text-align:left; transition:border-color .15s ease,background .15s ease,box-shadow .15s ease; }
.dashboard-milestone-row:hover,.dashboard-milestone-row:focus-visible { border-color:#8eb3f5; background:#f8fbff; box-shadow:0 0 0 3px #e6efff; outline:0; }
.dashboard-milestone-style,.dashboard-milestone-node,.dashboard-milestone-due { min-width:0; display:grid; gap:3px; }
.dashboard-milestone-style strong,.dashboard-milestone-node strong,.dashboard-milestone-due strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.dashboard-milestone-style small,.dashboard-milestone-node small,.dashboard-milestone-due small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font-size:11px; }
.dashboard-milestone-node strong { color:#2463eb; }
.dashboard-milestone-due { text-align:right; }
.dashboard-milestone-due strong { color:#6f7b8d; }
.dashboard-milestone-due small { text-align:right; }
@media (max-width:760px) {
  .dashboard-milestone-row { grid-template-columns:1fr; gap:7px; }
  .dashboard-milestone-due,.dashboard-milestone-due small { text-align:left; }
  .dashboard-milestone-dialog-intro { padding-left:14px; padding-right:14px; }
  .dashboard-milestone-list { padding-left:14px; padding-right:14px; }
}

/* Sales KPI overrides are intentionally last so they win over the legacy dashboard grid rules. */
.dashboard-kpi-grid { grid-template-columns:repeat(7,minmax(0,1fr)); }
.dashboard-kpi-card.sales { border-color:#b9d2ff; background:linear-gradient(145deg,#f7faff,#fff); }
.dashboard-kpi-card.sales > span { color:#315fa9; font-weight:650; }
.dashboard-kpi-card.sales > strong { color:#1858c7; font-size:27px; overflow-wrap:anywhere; }
.dashboard-sales-panel { margin-bottom:16px; }
.dashboard-sales-panel > .panel-head { min-height:62px; }
.dashboard-sales-panel > .panel-head > a { color:var(--blue); font-size:12px; cursor:pointer; white-space:nowrap; }
.dashboard-sales-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:14px 16px 12px; }
.dashboard-sales-card { min-width:0; display:grid; gap:5px; padding:13px 14px; border:1px solid #e1e7f0; border-radius:7px; background:#fbfcfe; }
.dashboard-sales-card.platform { border-color:#bfd5ff; background:#f7faff; }
.dashboard-sales-card.order { border-color:#dccaf5; background:#fbf9ff; }
.dashboard-sales-card > span { color:#667386; font-size:11px; }
.dashboard-sales-card > strong { color:#263247; font-size:23px; line-height:1.15; overflow-wrap:anywhere; }
.dashboard-sales-card.platform > strong { color:#1858c7; }
.dashboard-sales-card.order > strong { color:#7152c8; }
.dashboard-sales-card > small { min-height:30px; color:#7b8798; font-size:11px; line-height:1.45; }
.dashboard-sales-definition { margin:0; padding:0 16px 14px; color:#687386; font-size:11px; line-height:1.6; }
@media (max-width:1250px) {
  .dashboard-kpi-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .dashboard-sales-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .dashboard-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-sales-grid { grid-template-columns:1fr; gap:8px; padding:12px; }
  .dashboard-sales-panel > .panel-head { align-items:flex-start; }
  .dashboard-sales-panel > .panel-head > a { margin-top:2px; }
}
/* Tenant registration and platform-admin review */
.tenant-table { min-width:820px; }
.tenant-registration-dialog { max-width:760px; }
.platform-current-tenant { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:0 0 16px; padding:18px 20px; border:1px solid #dcd2ef; border-radius:14px; background:linear-gradient(135deg,#fbf9ff,#fff); box-shadow:0 8px 24px rgba(89,64,130,.06); }
.platform-current-tenant h3 { margin:5px 0 7px; color:#3f315d; font-size:18px; }
.platform-current-tenant p { margin:0; color:#697486; font-size:12px; }
.platform-current-tenant p strong { color:#5f4a82; letter-spacing:.04em; }
.platform-boundary-note { max-width:410px; color:#706b7f; font-size:12px; line-height:1.6; text-align:right; }
.tenant-current-tag { display:inline-flex; width:max-content; margin:5px 0 2px; color:#624b87 !important; background:#f0eafe !important; border-color:#ddd0f4 !important; }
.auth-register-link { margin-top:16px; align-self:center; border:0; background:transparent; color:#8066a3; font-size:13px; font-weight:700; cursor:pointer; }
.auth-register-link:hover { color:#634d82; text-decoration:underline; }
@media (max-width:760px) { .platform-current-tenant { display:grid; gap:10px; padding:15px; }.platform-boundary-note { max-width:none; text-align:left; } }

/* Login reliability and HR-backed employee account management. */
.auth-submit:disabled { cursor:wait; opacity:.72; transform:none; box-shadow:none; }
.auth-error:not(:empty) { padding:9px 11px; border:1px solid #f1cbd1; border-radius:8px; background:#fff5f6; line-height:1.55; }
.account-table { min-width:1160px; }
.account-table td:first-child { display:table-cell; }
.account-person,.account-login-identity { min-width:0; display:grid; gap:4px; }
.account-person strong,.account-login-identity strong { color:#25374a; font-size:13px; }
.account-person small,.account-login-identity small { color:var(--muted); font-size:11px; }
.account-binding-state { width:max-content; max-width:100%; padding:3px 7px; border-radius:999px; font-size:11px; white-space:nowrap; }
.account-binding-state.is-bound { color:#276a50; background:#e9f7f0; }
.account-binding-state.is-unbound { color:#a15b16; background:#fff3df; }
.account-login-aliases { display:flex; flex-wrap:wrap; gap:4px; }
.account-login-aliases span { display:inline-flex; align-items:center; min-height:22px; padding:2px 7px; border:1px solid #d9cbea; border-radius:999px; color:#67517f; background:#faf7fd; font-size:11px; }
.account-login-status { display:inline-flex; width:max-content; align-items:center; min-height:21px; padding:2px 7px; border-radius:999px; font-size:11px; font-weight:650; }
.account-login-status.is-phone { color:#216b50; background:#e8f6ef; }
.account-login-status.is-account { color:#5d6879; background:#eef2f7; }
.account-admin-protected { display:inline-flex; align-items:center; min-height:28px; width:max-content; max-width:100%; padding:0 10px; border:1px solid #d7e5e2; border-radius:999px; color:#1d665e; background:#f3f8f7; font-size:12px; font-weight:700; white-space:nowrap; }
.account-table .row-actions { min-width:220px; align-items:flex-start; }
.account-dialog { max-width:760px; }
.account-dialog-hint { padding:10px 12px; border:1px solid #e2d8ee; border-radius:8px; color:#675a75; background:#faf8fd; font-size:12px; line-height:1.55; }
.account-profile-action { grid-column:1/-1; display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:10px 12px; border:1px solid #d5e5f3; border-radius:8px; background:#f6faff; }
.account-profile-action small { color:#5a7087; font-size:11px; line-height:1.45; }
.account-profile-dialog { max-width:820px; }
.account-profile-dialog .dialog-help { margin:0 0 16px; padding:11px 13px; border:1px solid #d5e5f3; border-radius:8px; background:#f6faff; color:#4f667d; font-size:12px; line-height:1.55; }
.account-profile-hint { margin-top:2px; padding:10px 12px; border:1px solid #d8e8df; border-radius:8px; background:#f5fbf7; color:#4f705e; font-size:12px; line-height:1.55; }
.credentials-dialog { max-width:680px; }
.credentials-dialog-hint { display:grid; gap:4px; margin:0 0 16px; padding:11px 13px; border:1px solid #d8e6f6; border-radius:8px; background:#f6faff; color:#53657c; font-size:12px; line-height:1.55; }
.credentials-dialog-hint strong { color:#214e86; font-size:13px; }
.credentials-dialog small { color:var(--muted); font-size:11px; line-height:1.45; }
.credentials-dialog-warning { margin:0; padding:10px 12px; border:1px solid #f1c98b; border-radius:8px; background:#fff8e9; color:#8b5a13; font-size:12px; line-height:1.5; }
.user-menu { cursor:pointer; }
.user-menu:hover { border-color:#b6c5d8; background:#f8fafc; }
.dialog-inline-error { min-height:20px; color:#bd3849; font-size:12px; line-height:1.5; }
.dialog-inline-error:not(:empty) { padding:8px 10px; border:1px solid #f1cbd1; border-radius:7px; background:#fff5f6; }
.label-section { margin:18px 0; padding:16px; border:1px solid #e3def2; border-radius:14px; background:#fcfbff; }
.label-preview-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:12px; }
.label-preview-grid > div { display:flex; flex-direction:column; gap:5px; padding:12px; border:1px solid #ebe8f4; border-radius:10px; background:#fff; }
.label-preview-grid strong { color:#4e3f73; }
.label-preview-grid span { color:#27324a; font-size:13px; }
.label-preview-grid small { color:#7b8190; line-height:1.5; }
.label-editor-block { margin:14px 0; padding:14px; border:1px solid #ebe8f4; border-radius:12px; background:#fff; }
@media (max-width:760px) { .label-preview-grid { grid-template-columns:1fr; } }
@media (max-width:760px) {
  .account-dialog .form-grid { grid-template-columns:1fr; }
  .account-table .row-actions { min-width:160px; }
  .account-profile-action { align-items:flex-start; flex-direction:column; }
}
.tag-editor{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.tag-editor .status-tag{display:inline-flex;align-items:center;gap:6px}.tag-editor button{border:0;background:transparent;color:inherit;cursor:pointer;font-size:16px}.inline-form{display:flex;gap:8px;max-width:420px}.inline-form input{flex:1}.tenant-code-optional{opacity:.82}
.tenant-login-details { margin:0; padding:0; border:1px solid #ebe8f4; border-radius:10px; background:#fcfbff; }
.tenant-login-details summary { padding:10px 12px; color:#6f5b8c; cursor:pointer; font-size:13px; font-weight:700; list-style-position:inside; }
.tenant-login-details[open] summary { border-bottom:1px solid #ebe8f4; }
.tenant-login-details label { margin:12px; }
.tenant-login-details small { display:block; margin:0 12px 12px; color:#7b8190; font-size:12px; line-height:1.5; }
.tenant-selection-dialog { width:min(560px,calc(100vw - 28px)); }
.tenant-selection-list { display:grid; gap:9px; margin:4px 0 14px; }
.tenant-selection-option { display:flex !important; align-items:flex-start; gap:10px; padding:13px 14px; border:1px solid #e3dcef; border-radius:10px; background:#fff; cursor:pointer; }
.tenant-selection-option:has(input:checked) { border-color:#bda9df; background:#faf7ff; box-shadow:0 0 0 3px #f0e9fb; }
.tenant-selection-option input { margin-top:3px; flex:0 0 auto; accent-color:#7656a3; }
.tenant-selection-option span { display:grid; gap:4px; min-width:0; }
.tenant-selection-option strong { color:#44335c; font-size:14px; }
.tenant-selection-option small { color:#7b8190; font-size:11px; }
.hr-account-summary,.hr-org-account { display:inline-flex; width:max-content; max-width:100%; padding:4px 8px; border-radius:999px; font-size:11px; line-height:1.35; }
.hr-account-summary.is-bound,.hr-org-account.is-bound { color:#276a50; background:#e9f7f0; }
.hr-account-summary.is-unbound,.hr-org-account.is-unbound { color:#9a5c18; background:#fff3df; }
.hr-department-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:16px; }
.hr-department-card { overflow:hidden; border:1px solid #e2ddec; border-radius:12px; background:#fff; }
.hr-department-card > div { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:3px 12px; align-items:center; padding:14px 16px; border-bottom:1px solid #eee9f4; background:#faf8fd; }
.hr-department-card .eyebrow { grid-column:1; }
.hr-department-card h3 { grid-column:1; margin:0; color:#44375a; font-size:17px; }
.hr-department-card > div b { grid-column:2; grid-row:1 / span 2; color:#765a9b; font-size:18px; }
.hr-department-card ul { display:grid; margin:0; padding:0; list-style:none; }
.hr-department-card li { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 14px; border-bottom:1px solid #f0edf4; }
.hr-department-card li:last-child { border-bottom:0; }
.hr-department-card li > span:first-child { display:grid; gap:3px; min-width:0; }
.hr-department-card li strong { color:#354052; font-size:13px; }
.hr-department-card li small { color:#7b8190; font-size:11px; }
.hr-performance-dialog { width:min(820px,calc(100vw - 28px)); }
.hr-performance-metrics { grid-template-columns:repeat(4,minmax(0,1fr)); }
@media (max-width:900px) { .hr-department-grid { grid-template-columns:1fr; }.hr-performance-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.auth-method-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; margin:0 0 24px; padding:4px; border:1px solid #e5ddef; border-radius:8px; background:#faf8fd; }
.auth-method-tab { min-height:36px; border:0; border-radius:6px; color:#756b83; background:transparent; font-size:13px; font-weight:700; cursor:pointer; }
.auth-method-tab.active { color:#4f3a6d; background:#fff; box-shadow:0 2px 7px rgba(83,57,111,.12); }
.auth-method-tab:disabled { color:#aaa2b1; cursor:not-allowed; }
.sms-code-field { display:grid; grid-template-columns:minmax(0,1fr) 122px; gap:8px; }
.sms-code-button { min-height:46px; white-space:nowrap; }
.sms-code-button:disabled { cursor:wait; opacity:.7; }
.auth-form-hint { color:#897f95; font-size:12px; line-height:1.5; }
.auth-success { color:#287454; border-color:#bce5d0; background:#f2fbf6; }
.auth-warning { color:#8b5a13; border-color:#f1c98b; background:#fff8e9; }
@media (max-width:420px) { .sms-code-field { grid-template-columns:1fr; } .sms-code-button { width:100%; } }

/* 2026-08-27 visual polish: a quieter operations workspace with a single
   lavender accent. This layer intentionally stays CSS-only so the existing
   workflow, permissions and data contracts remain untouched. */
:root {
  --canvas:#f5f8f7;
  --surface:#ffffff;
  --surface-soft:#fbfdfc;
  --line:#dfe9e6;
  --line-strong:#cbdcd8;
  --ink:#243b39;
  --muted:#6f817e;
  --primary:#287d73;
  --primary-strong:#1d665e;
  --primary-soft:#e9f5f2;
  --radius:12px;
}
html { background:var(--canvas); }
body {
  color:var(--ink);
  background:var(--canvas);
  font-family:Inter,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  letter-spacing:.005em;
}
button,input,select,textarea { font-family:inherit; }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
a:focus-visible { outline:3px solid #e8def5; outline-offset:2px; }
::selection { color:#3f2d5b; background:#e5daf5; }

.app-shell { grid-template-columns:232px minmax(0,1fr); }
.sidebar {
  border-right:1px solid #e8e3ed;
  background:#fff;
  box-shadow:8px 0 28px rgba(48,35,67,.055);
}
.brand { min-height:72px; padding:6px 12px 17px; border-bottom-color:#ece8f0; }
.brand-mark {
  width:40px; height:40px; flex-basis:40px; border-radius:12px;
  border-color:#b9d9d3; background:linear-gradient(145deg,#f1fbf8,#d7eee9);
  box-shadow:0 6px 15px rgba(32,99,90,.10);
}
.brand-mark::before { border-color:#398d82; }
.brand-mark::after { background:#398d82; }
.brand-copy strong { color:#2e4945; font-size:14px; font-weight:760; }
.brand-copy small { color:#819692; }
.nav { gap:5px; margin-top:16px; scrollbar-color:#b8d8d2 #f8fcfb; }
.nav::-webkit-scrollbar-track { background:#f8fcfb; }
.nav::-webkit-scrollbar-thumb { background:#b8d8d2; border-radius:8px; }
.nav-group-trigger { min-height:34px; padding:0 11px; color:#607571; font-size:12px; font-weight:720; }
.nav-group-trigger span,.nav-group-trigger i { color:#87a9a3; }
.nav-group-trigger:hover { color:#1d665e; background:#f3faf8; }
.nav-group-menu { border-left-color:#e2efec; }
.nav-item { min-height:38px; border:1px solid transparent; border-radius:9px; color:#54706b; }
.nav-item span { color:#84aaa2; }
.nav-item:hover { color:#1d665e; background:#f3faf8; }
.nav-item.active {
  color:#1d665e; background:#e9f5f2; border-color:#c5e3dd;
  box-shadow:inset 3px 0 0 #398d82;
}
.nav-item.active span { color:#287d73; }
.nav-group-menu .nav-item.active { background:#f1f9f7; box-shadow:inset 3px 0 0 #61a79d; }
.nav-dashboard-entry { color:#246c64; border-color:#cde7e2; background:#f0f9f7; }
.nav-dashboard-entry:hover,.nav-dashboard-entry.active { color:#1d665e; background:#e5f4f1; }
.sidebar-footer { color:#958aa0; border-top-color:#ece8f0; }

.workspace,.page { background:var(--canvas); }
.topbar {
  height:72px; padding:0 34px; border-bottom:1px solid #ebe7ef;
  background:rgba(255,255,255,.92); box-shadow:0 1px 0 rgba(55,39,75,.025);
}
.topbar h1 { color:#302640; font-size:19px; font-weight:760; }
.eyebrow { color:#91879d; letter-spacing:.04em; }
.top-actions { gap:8px; }
.search { width:280px; height:38px; border-color:#e2dce8; border-radius:10px; background:#fcfbfd; }
.search:focus-within { border-color:#b9a4d2; box-shadow:0 0 0 4px #f1ebf8; }
.top-actions select,.user-menu,.icon-button,.secondary {
  border-color:#e2dce8; border-radius:9px; color:#514761; background:#fff;
}
.icon-button:hover,.secondary:hover { border-color:#cbb9df; background:#fbf9fd; color:#60458e; }
.page { max-width:1760px; padding:28px 34px 50px; }
.toolbar { margin-bottom:16px; }
.toolbar h2 { color:#2b4441; font-size:18px; letter-spacing:-.015em; }
.toolbar p,.toolbar-note { color:#788b87; }
.filters { gap:7px; }
.filter-chip { min-height:34px; border-color:#e2dce8; border-radius:9px; color:#655c73; }
.filter-chip:hover { border-color:#b7d6d0; background:#f7fcfb; }
.filter-chip.selected { color:#1d665e; border-color:#add3cc; background:#eaf6f3; }
.primary,.auth-submit {
  border-color:var(--primary); border-radius:9px; background:var(--primary);
  box-shadow:0 6px 14px rgba(115,86,166,.17);
}
.primary:hover,.auth-submit:hover { border-color:var(--primary-strong); background:var(--primary-strong); transform:translateY(-1px); }
.primary:active,.auth-submit:active { transform:translateY(0); }
.panel,.metric,.metric-card,.summary-card,.role-card,.schedule-kpi,.operation-connector-card {
  border-color:var(--line); border-radius:var(--radius); box-shadow:0 5px 18px rgba(48,35,67,.045);
}
.panel-head { min-height:58px; padding:16px 19px; border-bottom-color:#eeeaf2; }
.panel-head h3 { color:#304946; font-size:15px; font-weight:760; }
.panel-head a,.action-link,a { color:var(--primary); }
.panel-head a:hover,.action-link:hover,a:hover { color:var(--primary-strong); }
.metric { padding:17px 18px; min-height:108px; background:linear-gradient(180deg,#fff 0%,#fbfdfc 100%); }
.metric:hover,.metric-card:hover,.summary-card:hover { border-color:#bedbd5; box-shadow:0 8px 22px rgba(31,91,83,.07); }
.metric-label { color:#81768d; }
.metric-value { color:#352a45; font-size:28px; }
.metric-note { color:#988ea2; }
.table-wrap { scrollbar-color:#d6cbe3 #faf9fc; }
.product-table th,.data-table th { color:#786e84; background:#faf9fc; border-bottom-color:#ece8f0; }
.product-table td,.data-table td { border-bottom-color:#f0edf3; }
.product-table tr:hover td,.data-table tr:hover td { background:#fdfbff; }
.tag.blue { color:#286f67; background:#e9f5f2; }
.style-code { color:#286f67; }
.empty-state { color:#8b8196; }
.empty-state strong { color:#514561; }

/* Supplier master data and procurement performance */
.supplier-toolbar { align-items:flex-end; gap:24px; }
.supplier-toolbar > div { max-width:820px; }
.supplier-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:0 0 16px; }
.supplier-metrics .metric-value { font-size:25px; }
.supplier-table { min-width:1320px; }
.supplier-table td { vertical-align:middle; }
.supplier-dialog { width:min(900px,calc(100vw - 32px)); }
.supplier-receipt-summary { display:flex; flex-direction:column; gap:5px; padding:14px 16px; border:1px solid #d7e8e4; border-radius:11px; background:#f4faf8; color:#41615c; }
.supplier-receipt-summary strong { color:#244a44; font-size:15px; }
.supplier-recommendation { display:grid; gap:4px; padding:12px 14px; border:1px solid #dfe4f0; border-left:3px solid #8b78c8; border-radius:10px; background:#faf9ff; color:#4e5870; }
.supplier-recommendation strong { color:#3c4560; }
.supplier-recommendation span { color:#1e2940; font-weight:650; }
.supplier-recommendation small { color:#748097; line-height:1.5; }
.hr-document-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:14px; }
.hr-document-card { display:flex; min-height:180px; flex-direction:column; gap:8px; padding:13px; border:1px dashed #c8dcd8; border-radius:12px; background:#fbfefd; color:#345954; }
.hr-document-card > span:first-child { display:flex; flex-direction:column; gap:3px; font-weight:720; }
.hr-document-card small { color:#8a9b98; font-size:12px; font-weight:500; }
.hr-document-thumb { width:108px !important; height:72px !important; object-fit:cover !important; align-self:flex-start; border:1px solid #d4e4e0; border-radius:8px; background:#f1f6f4; cursor:zoom-in; }
.hr-document-hint { color:#77918b !important; font-size:11px !important; }
.hr-document-empty { display:grid; flex:1; min-height:128px; place-items:center; color:#9aa9a6; background:#f5f9f8; border-radius:8px; }
.hr-document-card input[type="file"] { font-size:12px; color:#5d746f; }
.hr-document-status { color:#718783; font-size:12px; white-space:nowrap; }
#hrTrialMonthsField small { display:block; }
@media (max-width:680px) { .hr-document-grid { grid-template-columns:1fr; } }
@media (max-width:1100px) {
  .supplier-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px) {
  .supplier-toolbar { align-items:stretch; flex-direction:column; }
  .supplier-metrics { grid-template-columns:1fr; }
}

.auth-workspace { background:radial-gradient(circle at 8% 8%,#e3f1ee 0%,transparent 32%),#f4f8f7; }
.auth-workspace #page { padding:clamp(20px,4vw,54px); }
.auth-shell {
  width:min(1080px,100%); min-height:590px;
  grid-template-columns:minmax(360px,.88fr) minmax(440px,1.12fr);
  border:1px solid #d8e7e3; border-radius:20px;
  box-shadow:0 24px 70px rgba(30,78,71,.13);
}
.auth-brand-panel {
  min-height:590px; padding:52px 48px 38px;
  background:linear-gradient(150deg,#173b37 0%,#2e6a61 100%);
}
.auth-brand-panel::before,.auth-brand-panel::after { border-color:rgba(255,255,255,.2); }
.auth-brand-panel::before { box-shadow:0 0 0 26px rgba(255,255,255,.05),0 0 0 52px rgba(255,255,255,.028); }
.auth-brand-mark { width:58px; height:58px; margin-bottom:38px; border-radius:15px; border-color:#9ed5cd; background:linear-gradient(145deg,#effbf8,#cae8e2); box-shadow:0 9px 20px rgba(16,52,47,.17); }
.auth-brand-mark::before { border-color:#398d82; }
.auth-brand-mark::after { background:#398d82; }
.auth-company { color:#c9e5df; }
.auth-brand-panel h1 { color:#fff; font-size:34px; }
.auth-brand-note { color:#c9e5df; line-height:1.8; }
.auth-brand-footer { border-top-color:rgba(210,241,235,.2); color:#a8cec7; }
.auth-panel { max-width:520px; padding:62px 66px 44px; }
.auth-kicker { color:#287d73; margin-bottom:13px; }
.auth-panel h2 { color:#304946; font-size:29px; }
.auth-intro { color:#748783; margin-bottom:27px; }
.auth-form { gap:17px; }
.auth-form label { color:#3f5955; font-weight:680; }
.auth-form input { height:48px; border-color:#d4e2df; border-radius:9px; background:#fcfefd; }
.auth-form input:hover { border-color:#a8cdc6; }
.auth-form input:focus { border-color:#4b9a90; box-shadow:0 0 0 4px #e5f4f1; }
.password-toggle { color:#287d73; }
.auth-submit { min-height:48px; }
.auth-error { padding:0; border:0; background:transparent; }
.auth-error:not(:empty) { border-color:#f0ccd3; background:#fff6f7; }
.auth-error { min-height:0; margin-top:0; }
.auth-error:not(:empty) { margin-top:10px; }
.auth-copyright { color:#a397ad; }

@media (max-width:1080px) {
  .app-shell { grid-template-columns:216px minmax(0,1fr); }
  .page { padding-left:24px; padding-right:24px; }
}
@media (max-width:760px) {
  .app-shell { display:block; }
  .sidebar { box-shadow:0 6px 18px rgba(48,35,67,.08); }
  .topbar { min-height:68px; padding:11px 16px; }
  .page { padding:20px 16px 36px; }
  .search { width:200px; }
  .auth-workspace #page { padding:14px; }
  .auth-shell { min-height:auto; border-radius:16px; }
  .auth-brand-panel { min-height:190px; padding:28px 25px 24px; border-top:0; }
  .auth-brand-mark { width:45px; height:45px; margin-bottom:19px; border-radius:12px; }
  .auth-brand-panel h1 { font-size:26px; }
  .auth-brand-note { margin-top:8px; font-size:12px; }
  .auth-brand-footer { display:none; }
  .auth-panel { max-width:none; padding:32px 25px 27px; }
  .auth-panel h2 { font-size:26px; }
}

/* 2026-08-26 full visual system
   This is the actual redesign pass: the product uses one clear work surface,
   an editorial rail for navigation, and task-oriented surfaces instead of
   a stack of unrelated rounded cards. */
:root {
  --canvas:#f2f6f5;
  --surface:#ffffff;
  --surface-quiet:#f7faf9;
  --surface-tint:#edf6f3;
  --line:#dce8e5;
  --line-strong:#bfd6d0;
  --ink:#183532;
  --ink-2:#36524d;
  --muted:#728682;
  --primary:#147a70;
  --primary-strong:#0b5d55;
  --primary-soft:#e1f1ed;
  --warm:#c98a3d;
  --danger:#bc3f53;
  --radius:12px;
}

html { background:var(--canvas); }
body { min-width:320px; background:
  linear-gradient(180deg,rgba(255,255,255,.8) 0 82px,transparent 82px),
  radial-gradient(circle at 96% 0%,rgba(214,236,231,.6),transparent 34%),
  var(--canvas); color:var(--ink); }
button,input,select,textarea { font:inherit; }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
a:focus-visible { outline:3px solid rgba(20,122,112,.28); outline-offset:2px; }

.app-shell { grid-template-columns:264px minmax(0,1fr); gap:0; background:transparent; }
.sidebar { position:sticky; z-index:4; padding:22px 15px 16px; background:#fbfdfc; border-right:1px solid var(--line); box-shadow:8px 0 28px rgba(28,73,67,.045); }
.brand { min-height:72px; padding:1px 12px 19px; }
.brand-mark { width:44px; height:44px; border-radius:14px; background:#e5f4f0; box-shadow:none; }
.brand-copy strong { font-size:15px; letter-spacing:-.015em; }
.brand-copy small { margin-top:3px; font-size:10px; letter-spacing:.05em; }
.nav { gap:12px; margin-top:22px; padding:0 2px; }
.nav-group { gap:5px; }
.nav-group-trigger { min-height:28px; padding:0 11px; font-size:10px; letter-spacing:.11em; }
.nav-group-menu { margin:0 0 4px 7px; padding-left:8px; }
.nav-item { min-height:42px; padding:0 13px; border-radius:9px; font-size:13px; }
.nav-item.active { box-shadow:inset 3px 0 0 var(--primary),0 7px 16px rgba(20,122,112,.08); }
.nav-dashboard-entry { margin-bottom:2px; }
.sidebar-footer { padding:15px 12px 0; }

.workspace { min-width:0; background:transparent; }
.topbar { position:sticky; top:0; z-index:3; height:82px; padding:0 42px; background:rgba(255,255,255,.9); border-bottom:1px solid var(--line); box-shadow:0 8px 24px rgba(28,73,67,.045); }
.topbar h1 { font-size:21px; letter-spacing:-.035em; }
.topbar > div:first-child { display:grid; gap:3px; }
.topbar > div:first-child::before { content:"WORKSPACE"; color:#97aaa6; font-size:9px; font-weight:800; letter-spacing:.16em; }
.top-actions { gap:10px; }
.search { width:320px; height:42px; border-radius:10px; background:#f8fbfa; }
.user-menu { min-height:40px; padding:5px 13px; border-radius:10px; }
.icon-button { min-width:40px; min-height:40px; border-radius:10px; }
.workspace-tabs { min-height:54px; padding:9px 42px; gap:8px; background:rgba(247,251,250,.92); border-bottom:1px solid var(--line); }
.workspace-tab { min-height:34px; border-radius:8px; border-color:#d5e5e1; background:#fff; }
.workspace-tab.active { color:var(--primary-strong); border-color:#78b7ad; background:var(--primary-soft); box-shadow:0 3px 10px rgba(20,122,112,.09); }
.workspace-tab-main { padding:0 13px; font-size:12px; }
.workspace-tab-close { width:28px; min-height:32px; }

.page { max-width:1700px; padding:34px 42px 70px; }
.toolbar { min-height:55px; margin-bottom:25px; align-items:flex-end; }
.toolbar h2 { font-size:25px; letter-spacing:-.04em; }
.toolbar p { max-width:62ch; margin-top:6px; font-size:13px; }
.section-heading { margin:28px 0 12px; }
.section-heading .section-title,.section-title { color:var(--ink); font-size:16px; font-weight:780; letter-spacing:-.02em; }
.section-heading small { color:#8a9d98; font-size:11px; }
.toolbar .primary { min-width:128px; }

.metrics,.dashboard-kpi-grid,.dashboard-sales-grid,.dashboard-module-grid,.schedule-kpis { gap:16px; }
.metric,.metric-card,.dashboard-kpi-card { min-height:128px; border-radius:var(--radius); box-shadow:0 8px 22px rgba(28,73,67,.05); }
.metric-label { text-transform:uppercase; letter-spacing:.08em; font-size:10px; }
.metric-value { font-size:32px; }
.metric-note { font-size:11px; }
.panel,.summary-card,.role-card,.schedule-kpi,.operation-connector-card { border-radius:var(--radius); box-shadow:0 8px 22px rgba(28,73,67,.05); }
.panel-head { min-height:63px; padding:18px 21px; }
.panel-head h3 { font-size:14px; letter-spacing:-.01em; }
.table-wrap { border-radius:0 0 var(--radius) var(--radius); }
.product-table th,.data-table th { padding:12px 15px; text-transform:uppercase; letter-spacing:.08em; }
.product-table td,.data-table td { padding:14px 15px; }
.product-table tbody tr,.data-table tbody tr { transition:background .15s ease; }
.product-table tbody tr:hover,.data-table tbody tr:hover { background:#f6fbf9; }

.work-cards { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.work-card { min-height:164px; padding:21px 22px; border-radius:var(--radius); box-shadow:0 8px 22px rgba(28,73,67,.05); }
.work-card::before { width:42px; height:3px; margin-bottom:17px; }
.work-card h3 { font-size:16px; }
.work-card .number { font-size:33px; }
.work-filter-bar { padding:14px 16px; border-radius:var(--radius); box-shadow:0 6px 18px rgba(28,73,67,.04); }

.dashboard-hero,.dashboard-overview-grid,.dashboard-lower { gap:16px; }
.dashboard-hero { border-radius:16px; }
.dashboard-kpi-card { background:#fff; }
.dashboard-kpi-card:first-child { border-color:#b9ddd6; background:#f3fbf8; }
.dashboard-kpi-card:first-child .dashboard-kpi-value { color:var(--primary-strong); }
.dashboard-intelligence-card,.dashboard-sales-card,.dashboard-module-card { border-radius:10px; box-shadow:none; }
.dashboard-intelligence-card { padding:15px 16px; }
.dashboard-sales-definition { color:#7b908b; font-size:11px; }
.dashboard-chart-empty { min-height:210px; display:grid; place-items:center; color:#94a5a1; background:repeating-linear-gradient(0deg,#fbfdfc,#fbfdfc 35px,#f1f6f4 36px); }
.risk-item,.attention-item { padding:13px 14px; border-radius:9px; }

.schedule-card,.schedule-product-card { border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:0 8px 22px rgba(28,73,67,.045); }
.schedule-card { padding:20px 21px; }
.schedule-card + .schedule-card { margin-top:12px; border-top:1px solid var(--line); }
.schedule-card-note { border-left:0; border:1px solid #e1eeeb; border-radius:8px; background:#f7fbfa; }
.schedule-info-item { border-bottom:1px solid #edf3f1; }
.detail-top { gap:22px; padding-bottom:24px; border-bottom:1px solid var(--line); }
.detail-title { font-size:26px; letter-spacing:-.04em; }
.detail-meta { color:#78908a; font-size:12px; }
.detail-focus-section { margin-top:22px; padding:20px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:0 8px 22px rgba(28,73,67,.04); }

.activity-panel { top:82px; height:calc(100vh - 82px); width:380px; padding:22px; border-left:1px solid var(--line); box-shadow:-16px 0 36px rgba(24,62,57,.1); }
.activity-head { padding-bottom:15px; border-bottom:1px solid var(--line); }
.activity-heading { color:var(--ink); font-size:18px; letter-spacing:-.025em; }
.activity-panel .feed-item { padding:14px 4px; border-bottom:1px solid #edf3f1; }
.activity-panel .feed-item.unread { padding-left:10px; border-radius:8px; background:#f8fbf9; }

.dialog-inner { width:min(680px,calc(100vw - 34px)); border-radius:16px; }
.dialog-head { padding:22px 24px 18px; }
.dialog-head h2 { font-size:21px; }
.form { padding:20px 24px 24px; gap:18px; }
.form-grid { gap:15px 17px; }
.season-code-settings { margin-top:16px; padding-top:14px; border-top:1px solid var(--line); display:grid; gap:9px; }
.season-code-settings > label { display:flex; align-items:center; gap:8px; color:var(--ink); font-weight:600; }
.season-code-toggle { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.season-code-toggle > label { display:flex; align-items:center; gap:8px; color:var(--ink); font-weight:600; }
.season-code-state { color:var(--muted); font-size:12px; }
.season-code-state[data-state="enabled"] { color:#147d6b; }
.season-code-state[data-state="pending"] { color:#a66000; font-weight:600; }
.season-code-hint { margin-top:0; }
.create-season-state { display:block; margin-top:4px; color:var(--muted); font-size:12px; }
.create-season-state.is-required { color:#147d6b; font-weight:600; }
.season-code-settings input[type="checkbox"] { width:auto; }
.season-code-map { display:flex; flex-wrap:wrap; gap:8px; }
.season-code-map span { display:inline-flex; align-items:center; gap:5px; padding:5px 9px; border:1px solid #dfe6ef; border-radius:5px; background:#f8fafc; color:#53627a; font-size:12px; }
.season-code-map b { color:#1748ae; font-weight:700; }
.form-footer { margin:0 -24px -24px; padding:16px 24px; border-top:1px solid #e8f0ee; background:#f9fcfb; }
.permission-empty { min-height:310px; border:1px dashed #bdd7d1; border-radius:var(--radius); background:#f8fcfb; }
.permission-empty-icon { width:58px; height:58px; border-radius:14px; color:var(--primary); border-color:#c5dfd8; background:var(--primary-soft); }

.toast,.notice,.alert { border-radius:10px; box-shadow:0 8px 22px rgba(28,73,67,.08); }
.status-tag,.chip,.effect-status { border-radius:999px; }
.empty-state { min-height:190px; display:grid; place-items:center; align-content:center; gap:6px; border:1px dashed #cfe0dc; border-radius:var(--radius); background:#fbfdfc; }
.empty-state strong { font-size:15px; }

@media (max-width:1180px) {
  .app-shell { grid-template-columns:232px minmax(0,1fr); }
  .page { padding-left:28px; padding-right:28px; }
  .topbar,.workspace-tabs { padding-left:28px; padding-right:28px; }
  .search { width:260px; }
}
@media (max-width:760px) {
  body { background:var(--canvas); }
  .sidebar { position:relative; height:auto; min-height:0; padding:12px; }
  .nav { max-height:270px; overflow:auto; }
  .topbar { height:auto; min-height:74px; padding:13px 16px; align-items:flex-start; }
  .topbar > div:first-child::before { display:none; }
  .top-actions { flex-wrap:wrap; justify-content:flex-end; }
  .search { order:3; width:100%; }
  .workspace-tabs { padding:8px 16px; }
  .page { padding:22px 16px 42px; }
  .toolbar { align-items:flex-start; gap:15px; flex-direction:column; }
  .toolbar .primary { width:100%; }
  .work-cards { grid-template-columns:1fr; }
  .metrics,.dashboard-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .activity-panel { top:0; height:100dvh; width:min(380px,100vw); }
  .dialog-inner { width:calc(100vw - 20px); }
  .form { padding:18px; }
  .form-footer { margin:0 -18px -18px; padding:14px 18px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; transition-duration:0s !important; animation-duration:0s !important; }
}

/* Cost accounting stays compact: one neutral formula panel and a clear
   permission state are enough to distinguish the two calculation paths. */
.order-calc-note {
  display:grid;
  gap:4px;
  padding:12px 14px;
  color:#48605c;
  background:#f2f8f6;
  border:1px solid #cfe2dc;
  border-radius:8px;
  font-size:12px;
}
.order-calc-note strong { color:#143f38; font-size:14px; }
.cost-locked {
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:3px 8px;
  border:1px solid #dfe7e4;
  border-radius:999px;
  color:#71817d;
  background:#f6f8f7;
  font-size:12px;
  white-space:nowrap;
}

/* 2026-08-26 complete interface direction
   The earlier pass only retuned colors. This layer changes the visual grammar:
   a calm editorial shell, clear workbench hierarchy, fewer nested boxes and
   stronger states. It deliberately avoids a single purple theme. */
:root {
  --canvas:#f4f7f8;
  --surface:#fff;
  --surface-soft:#f8fbfb;
  --line:#dfe9e7;
  --line-strong:#c8dbd6;
  --ink:#193331;
  --ink-soft:#36514d;
  --muted:#718581;
  --muted-light:#9aaba8;
  --primary:#1d8176;
  --primary-strong:#14645d;
  --primary-soft:#e7f4f1;
  --accent:#dca85b;
  --danger:#c44758;
  --radius:14px;
}
* { scrollbar-width:thin; scrollbar-color:#b9d3ce transparent; }
body {
  background:var(--canvas);
  color:var(--ink);
  font-family:"Avenir Next","SF Pro Display","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:14px;
  line-height:1.5;
}
.app-shell { grid-template-columns:250px minmax(0,1fr); background:var(--canvas); }
.sidebar {
  background:rgba(255,255,255,.96);
  border-right:1px solid #dce8e5;
  box-shadow:10px 0 34px rgba(30,76,69,.055);
  padding:20px 14px 15px;
}
.brand {
  min-height:76px;
  padding:4px 12px 18px;
  gap:12px;
  border-bottom:1px solid #e7efed;
}
.brand-mark {
  width:42px;
  height:42px;
  flex-basis:42px;
  border-radius:13px;
  border:1px solid #aad1c9;
  background:linear-gradient(145deg,#f4fcfa,#d6eee8);
  box-shadow:0 8px 18px rgba(28,105,94,.12);
}
.brand-mark::before { width:18px; height:10px; border-width:3px; border-color:#31877d; }
.brand-mark::after { right:7px; bottom:7px; width:9px; height:3px; border-radius:99px; background:#31877d; }
.brand-copy strong { color:#1b3e3a; font-size:14px; font-weight:760; letter-spacing:.01em; }
.brand-copy small { color:#829692; font-size:10px; }
.nav { gap:7px; margin-top:18px; padding-right:2px; }
.nav-group { display:grid; gap:4px; }
.nav-group-trigger {
  min-height:33px;
  padding:0 11px;
  color:#78908b;
  border-radius:9px;
  font-size:11px;
  font-weight:760;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.nav-group-trigger span,.nav-group-trigger i { color:#99b2ad; }
.nav-group-trigger:hover { color:#226c63; background:#f1f8f6; }
.nav-group-menu { margin-left:7px; padding-left:9px; border-left:1px solid #e3efec; }
.nav-item {
  min-height:40px;
  border:1px solid transparent;
  border-radius:10px;
  color:#55716c;
  gap:11px;
  padding:0 12px;
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}
.nav-item span { width:18px; color:#8bada6; font-size:15px; }
.nav-item:hover { color:#1d665e; background:#f2f9f7; border-color:#e0efeb; transform:translateX(2px); }
.nav-item.active {
  color:#145f57;
  background:linear-gradient(90deg,#e5f4f0,#f2faf8);
  border-color:#b9ddd5;
  box-shadow:inset 3px 0 0 #2e8d81,0 4px 10px rgba(43,123,112,.07);
  font-weight:700;
}
.nav-item.active span { color:#2a877b; }
.nav-group-menu .nav-item.active { background:#f0f8f6; box-shadow:inset 3px 0 0 #6eafa4; }
.nav-dashboard-entry { color:#206b62; border-color:#cae5df; background:#eef9f6; font-weight:750; }
.nav-dashboard-entry:hover,.nav-dashboard-entry.active { color:#145f57; background:#e1f3ef; }
.nav-item b { min-width:20px; height:20px; border-radius:10px; background:#c44758; font-size:10px; box-shadow:0 0 0 3px #fff; }
.sidebar-footer { padding:14px 12px 0; color:#8ba09c; border-top-color:#e5eeec; font-size:11px; }

.workspace { background:var(--canvas); }
.topbar {
  height:78px;
  padding:0 38px;
  border-bottom:1px solid #e0ebe8;
  background:rgba(255,255,255,.9);
  box-shadow:0 3px 18px rgba(28,73,67,.035);
  backdrop-filter:blur(16px);
}
.topbar h1 { color:#193b37; font-size:20px; font-weight:780; letter-spacing:-.02em; }
.eyebrow { color:#92a29f; font-size:10px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.top-actions { gap:9px; }
.search {
  width:300px;
  height:40px;
  padding:0 12px;
  border:1px solid #d9e6e3;
  border-radius:12px;
  background:#fbfdfd;
  box-shadow:inset 0 1px 2px rgba(27,72,65,.025);
}
.search:focus-within { border-color:#7fb8ae; box-shadow:0 0 0 4px #e7f4f1; }
.search input::placeholder { color:#a2b1af; }
.top-actions select,.user-menu,.icon-button,.secondary {
  min-height:38px;
  border:1px solid #d9e6e3;
  border-radius:10px;
  color:#3f5a55;
  background:#fff;
}
.user-menu { padding:5px 12px; }
.user-menu small { color:#8ba09b; }
.icon-button:hover,.secondary:hover { color:#1d665e; border-color:#9bc8bf; background:#f6fbfa; }
.page { max-width:1820px; padding:32px 38px 60px; }
.toolbar { margin-bottom:22px; }
.toolbar h2 { color:#193b37; font-size:22px; font-weight:780; letter-spacing:-.025em; }
.toolbar p { color:#718581; }
.primary,.auth-submit {
  min-height:40px;
  border-radius:10px;
  border-color:var(--primary);
  background:var(--primary);
  box-shadow:0 7px 16px rgba(29,129,118,.18);
  font-weight:720;
}
.primary:hover,.auth-submit:hover { background:var(--primary-strong); border-color:var(--primary-strong); transform:translateY(-1px); box-shadow:0 10px 20px rgba(29,129,118,.22); }
.primary:active,.auth-submit:active { transform:none; }
.filter-chip { min-height:35px; border-radius:10px; border-color:#d9e6e3; color:#55716c; }
.filter-chip.selected { color:#17665d; border-color:#a7d0c7; background:#e7f4f1; box-shadow:0 3px 8px rgba(41,119,108,.08); }

.metrics { gap:14px; margin-bottom:22px; }
.metric {
  min-height:122px;
  padding:19px 20px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:linear-gradient(150deg,#fff 0%,#fbfdfd 100%);
  box-shadow:0 6px 22px rgba(35,83,76,.045);
}
.metric-label { color:#7e928e; font-size:12px; font-weight:650; }
.metric-value { margin-top:12px; color:#1e3c38; font-size:31px; font-weight:790; letter-spacing:-.035em; }
.metric-note { color:#9aa9a6; }
.metric:hover { border-color:#bbd9d3; box-shadow:0 10px 24px rgba(34,99,89,.08); transform:translateY(-1px); }
.panel,.metric-card,.summary-card,.role-card,.schedule-kpi,.operation-connector-card {
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  box-shadow:0 6px 22px rgba(35,83,76,.045);
}
.panel-head { min-height:62px; padding:17px 20px; border-bottom:1px solid #eaf0ef; }
.panel-head h3 { color:#284641; font-size:15px; font-weight:780; }
.panel-head a,.action-link,a { color:#247b70; }
.panel-head a:hover,.action-link:hover,a:hover { color:#145f57; }
.table-wrap { scrollbar-color:#b9d3ce #f6faf9; }
.product-table th,.data-table th { padding:13px 14px; color:#7c908c; background:#f8fbfa; border-bottom:1px solid #e4eeec; font-size:11px; font-weight:750; letter-spacing:.025em; }
.product-table td,.data-table td { padding:13px 14px; border-bottom:1px solid #edf2f1; color:#3a5651; }
.product-table tr:hover td,.data-table tr:hover td { background:#f8fcfb; }
.product-table tr:last-child td,.data-table tr:last-child td { border-bottom:0; }
.tag { min-height:24px; padding:0 9px; border-radius:999px; font-size:11px; font-weight:650; }
.tag.blue { color:#286d66; background:#e7f4f1; }
.tag.green { color:#277051; background:#e9f7ef; }
.tag.orange { color:#98601b; background:#fff3df; }
.tag.red { color:#a93245; background:#ffedf0; }
.tag.gray { color:#647773; background:#edf3f1; }
.empty-state { min-height:150px; padding:42px 22px; color:#8a9b98; }
.empty-state strong { color:#536b66; font-size:14px; }
.pagination { padding:15px 19px; border-top:1px solid #eaf0ef; }
.row-actions { gap:8px; }
.row-actions .primary,.row-actions .secondary { min-height:32px; border-radius:8px; font-size:12px; }

/* Workbench pages: turn the three status cards into a clear task rail. */
.work-cards { gap:14px; margin-bottom:20px; }
.work-card {
  min-height:150px;
  padding:20px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:0 6px 20px rgba(35,83,76,.04);
}
.work-card::before { content:""; display:block; width:32px; height:3px; margin-bottom:15px; border-radius:2px; background:#c7ddd8; }
.work-card:nth-child(2)::before { background:#d9b171; }
.work-card:nth-child(3)::before { background:#79b9ae; }
.work-card h3 { color:#2c4844; font-size:15px; font-weight:780; }
.work-card p { color:#7c908c; min-height:42px; margin:7px 0 13px; font-size:12px; }
.work-card .number { color:#1e4f49; font-size:30px; }
.work-card-number span { color:#6ca39a; font-size:11px; }
.work-card.is-drilldown { border-color:#8bc0b6; box-shadow:0 0 0 4px #e4f2ef,0 10px 25px rgba(33,102,92,.08); }
.work-filter-bar { margin-bottom:20px; padding:16px 18px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:0 5px 18px rgba(35,83,76,.035); }
.pattern-return-guide { display:inline-flex; align-items:center; gap:6px; min-height:30px; padding:0 10px; border:1px solid #cfe5df; border-radius:999px; color:#2f6f66; background:#f3faf8; font-size:11px; font-weight:650; white-space:nowrap; }
.workflow-return-button { border-color:#bc8b52; background:#9a6a35; box-shadow:0 5px 12px rgba(154,106,53,.16); }
.workflow-return-button:hover { border-color:#835626; background:#835626; box-shadow:0 7px 16px rgba(131,86,38,.22); }

/* Dashboard: stronger reading order without turning every element into a card. */
.dashboard-toolbar { min-height:52px; margin:-6px 0 18px; padding-bottom:14px; border-bottom:1px solid #dfeae7; }
.dashboard-toolbar > div strong { color:#2a4642; font-size:15px; }
.dashboard-intelligence,.dashboard-sales-panel,.dashboard-modules,.dashboard-risks,.dashboard-activity,.dashboard-chart-panel,.dashboard-attention-panel { box-shadow:0 6px 22px rgba(35,83,76,.045); }
.dashboard-intelligence .panel-head,.dashboard-sales-panel > .panel-head,.dashboard-chart-panel .panel-head,.dashboard-attention-panel .panel-head { min-height:64px; }
.dashboard-intelligence-badge { color:#28776d; background:#e7f4f1; border:1px solid #c9e4de; }
.dashboard-intelligence-card { border-color:#e3ecea; border-radius:11px; background:#fbfdfd; }
.dashboard-intelligence-card.urgent { border-color:#efc8ce; background:#fffafb; }
.dashboard-intelligence-card.focus { border-color:#ead7b3; background:#fffdf8; }
.dashboard-intelligence-card.time { border-color:#cbdedb; background:#f9fcfb; }
.dashboard-intelligence-card.progress { border-color:#c9e5dd; background:#f8fcfa; }
.dashboard-sales-card { border-radius:11px; border-color:#e3ecea; background:#fbfdfd; }
.dashboard-sales-card.platform { border-color:#c7e0db; background:#f7fcfb; }
.dashboard-sales-card.order { border-color:#ddd2eb; background:#fbf9fd; }
.dashboard-module-card { border-radius:11px; border-color:#e2ecea; background:#fbfdfd; }
.risk-item:hover,.attention-item:hover { background:#f7fcfb; }

/* Dialogs and forms: a deliberate sheet instead of a generic floating box. */
.dialog::backdrop { background:rgba(24,49,46,.35); backdrop-filter:blur(4px); }
.dialog-inner { border:1px solid #dbe8e5; border-radius:18px; box-shadow:0 24px 70px rgba(25,62,57,.18); }
.dialog-head { padding:20px 22px 17px; border-bottom:1px solid #e9f0ee; }
.dialog-head h2 { color:#25433f; font-size:20px; letter-spacing:-.02em; }
.form { gap:17px; }
.form label { color:#4e6964; font-size:12px; font-weight:680; }
.form input,.form select,.form textarea { min-height:40px; border:1px solid #d3e2df; border-radius:9px; background:#fcfefe; color:#26443f; }
.form input:focus,.form select:focus,.form textarea:focus { border-color:#5fa79d; outline:0; box-shadow:0 0 0 4px #e5f3f0; }
.form-footer { padding-top:5px; }

/* Login: premium but restrained, with the same product language as the app. */
.auth-workspace { background:radial-gradient(circle at 8% 7%,#dcefeb 0%,transparent 33%),#f3f7f6; }
.auth-workspace #page { padding:clamp(20px,4vw,64px); }
.auth-shell { width:min(1160px,100%); min-height:620px; grid-template-columns:minmax(410px,.88fr) minmax(460px,1.12fr); border:1px solid #d4e4e0; border-radius:24px; box-shadow:0 28px 90px rgba(23,70,63,.15); }
.auth-brand-panel { min-height:620px; padding:62px 56px 42px; background:linear-gradient(145deg,#153936 0%,#2d7066 100%); }
.auth-brand-panel::before { width:520px; height:520px; right:-270px; top:-200px; border-color:rgba(222,247,240,.19); box-shadow:0 0 0 30px rgba(222,247,240,.045),0 0 0 60px rgba(222,247,240,.025); }
.auth-brand-panel::after { width:300px; height:300px; left:-180px; bottom:-140px; border-color:rgba(222,247,240,.18); }
.auth-brand-mark { width:64px; height:64px; margin-bottom:46px; border-radius:17px; border-color:#a9d8cf; background:linear-gradient(145deg,#f2fcfa,#c9e9e1); box-shadow:0 12px 24px rgba(4,33,29,.2); }
.auth-brand-mark::before { width:27px; height:14px; border-width:4px; border-color:#2c897d; }
.auth-brand-mark::after { right:13px; bottom:12px; width:16px; height:4px; background:#2c897d; }
.auth-company { color:#c2e4dd; font-size:13px; letter-spacing:.06em; }
.auth-brand-panel h1 { max-width:none; color:#fff; font-size:clamp(32px,3.2vw,42px); font-weight:780; letter-spacing:-.035em; }
.auth-brand-note { max-width:320px; color:#c8e4df; font-size:13px; line-height:1.9; }
.auth-brand-footer { border-top-color:rgba(210,241,235,.2); color:#a8cec7; }
.auth-panel { max-width:540px; padding:78px 78px 48px; }
.auth-kicker { color:#2d8177; margin-bottom:15px; letter-spacing:.08em; }
.auth-panel h2 { color:#274641; font-size:31px; font-weight:780; }
.auth-intro { color:#778b87; margin:10px 0 30px; }
.auth-method-tabs { margin-bottom:26px; padding:4px; border:1px solid #e0ebe8; border-radius:11px; background:#f7fbfa; }
.auth-method-tab { min-height:37px; border-radius:8px; color:#7a8f8a; }
.auth-method-tab.active { color:#21695f; box-shadow:0 2px 8px rgba(24,84,75,.1); }
.auth-form { gap:18px; }
.auth-form label { color:#45625d; }
.auth-form input { height:50px; border-color:#d1e0dd; border-radius:10px; }
.auth-form input:focus { border-color:#559e94; box-shadow:0 0 0 4px #e4f3ef; }
.auth-submit { min-height:50px; margin-top:5px; }
.auth-form-hint { color:#81928f; line-height:1.6; }
.auth-error { min-height:0; margin-top:0; }
.auth-error:empty { display:none; }
.auth-error:not(:empty) { margin-top:10px; padding:10px 12px; border:1px solid #efcdd2; border-radius:9px; background:#fff6f7; }
.auth-register-link { color:#2c796f; }
.auth-register-link:hover { color:#165e56; }
.auth-password-actions { display:flex; justify-content:flex-end; margin-top:-10px; }
.auth-forgot-button { padding:2px 0; border:0; color:#2c796f; background:transparent; font-size:13px; font-weight:700; cursor:pointer; text-decoration:underline; text-decoration-color:transparent; text-underline-offset:4px; }
.auth-forgot-button:hover { color:#165e56; text-decoration-color:currentColor; }
.auth-forgot-button:focus-visible { outline:2px solid #559e94; outline-offset:4px; border-radius:2px; }
.password-reset-dialog { width:min(600px,calc(100vw - 28px)); }
.password-reset-dialog .dialog-head p { max-width:44ch; margin:5px 0 0; color:#778b87; font-size:13px; line-height:1.6; }
.password-reset-identity,
.password-reset-selection { display:grid; min-width:0; margin:0; padding:0; border:0; gap:18px; }
.password-reset-selection legend { margin-bottom:10px; color:#365b55; font-size:14px; font-weight:750; }
.password-reset-dialog .form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.password-reset-dialog .dialog-inline-error.auth-success { color:#287454; border-color:#bce5d0; background:#f2fbf6; }
.password-reset-dialog .dialog-inline-error.auth-warning { color:#8b5a13; border-color:#f1c98b; background:#fff8e9; }

@media (max-width:1180px) {
  .app-shell { grid-template-columns:226px minmax(0,1fr); }
  .page { padding-left:26px; padding-right:26px; }
  .topbar { padding-left:26px; padding-right:26px; }
  .auth-panel { padding-left:58px; padding-right:58px; }
}
@media (max-width:760px) {
  .app-shell { display:block; }
  .sidebar { padding:11px; box-shadow:0 6px 20px rgba(24,70,64,.09); }
  .brand { min-height:64px; padding:0 8px 11px; }
  .nav { margin-top:11px; }
  .topbar { min-height:70px; padding:11px 16px; }
  .page { padding:21px 16px 38px; }
  .toolbar h2 { font-size:20px; }
  .search { width:205px; }
  .auth-workspace #page { padding:14px; }
  .password-reset-dialog .form-grid { grid-template-columns:1fr; }
  .auth-shell { min-height:auto; border-radius:18px; }
  .auth-brand-panel { min-height:205px; padding:30px 26px 25px; }
  .auth-brand-mark { width:46px; height:46px; margin-bottom:20px; border-radius:13px; }
  .auth-brand-panel h1 { font-size:27px; }
  .auth-brand-note { margin-top:9px; font-size:12px; }
  .auth-brand-footer { display:none; }
  .auth-panel { max-width:none; padding:33px 25px 28px; }
  .auth-panel h2 { font-size:26px; }
}
/* Platform connector detail and sync history */
.operation-connector-meta { display:grid; gap:5px; margin:0; }
.operation-connector-meta > div { display:flex; gap:6px; align-items:baseline; }
.operation-connector-meta dt { min-width:52px; color:#8a94a4; font-size:10px; }
.operation-connector-meta dd { margin:0; color:#536074; font-size:10px; line-height:1.4; }
.operation-connector-error { color:#b44b4b !important; }
.operation-sync-log-panel { margin-top:16px; }
.operation-sync-log-table td { white-space:normal; vertical-align:top; line-height:1.5; }
/* Supply-chain backward plan */
.supply-plan-panel { margin:16px 0; }
.supply-plan-list { display:grid; gap:0; margin:0; padding:0 18px 18px; list-style:none; }
.supply-plan-row { display:grid; grid-template-columns:16px minmax(0,1fr) auto; gap:10px; align-items:start; position:relative; padding:12px 0; }
.supply-plan-row:not(:last-child)::after { content:""; position:absolute; left:7px; top:28px; bottom:-12px; width:1px; background:#dce4ee; }
.supply-plan-marker { width:14px; height:14px; margin-top:2px; border:3px solid #aebbd0; border-radius:50%; background:#fff; z-index:1; }
.supply-plan-row.active .supply-plan-marker { border-color:#3d7de8; }
.supply-plan-row.done .supply-plan-marker { border-color:#2e9a70; background:#2e9a70; }
.supply-plan-row.overdue .supply-plan-marker { border-color:#d25252; }
.supply-plan-main { display:grid; gap:3px; min-width:0; }
.supply-plan-main strong { color:#263247; font-size:13px; }
.supply-plan-main small { color:var(--muted); font-size:11px; line-height:1.45; }
.supply-plan-status { white-space:nowrap; color:#59677c; font-size:11px; }
.supply-plan-row.overdue .supply-plan-status { color:#b44747; font-weight:700; }
.dashboard-module-health { display:inline-flex; align-items:center; min-height:22px; padding:0 8px; border-radius:11px; font-size:11px; font-weight:700; }
.dashboard-module-health.healthy { color:#23765a; background:#e6f5ee; }
.dashboard-module-health.active { color:#2f66b4; background:#e8f0ff; }
.dashboard-module-health.warning { color:#a66916; background:#fff3dc; }
.dashboard-module-health.alert { color:#b04545; background:#fde9e9; }

/* Pattern progress: one compact vocabulary for internal and external hand-offs. */
.pattern-progress-section { display:grid; gap:10px; margin:18px 0 4px; padding:16px 0 2px; border-top:1px solid var(--line); }
.pattern-progress { display:grid; gap:9px; min-width:0; padding:12px 14px; border:1px solid #d9e8e4; border-radius:12px; background:#fbfefd; color:#365650; }
.pattern-progress.is-compact { gap:5px; padding:8px 9px; border-radius:9px; background:#f8fcfb; }
.pattern-progress-head { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:7px; }
.pattern-progress-head strong { min-width:0; color:#294b45; font-size:12px; line-height:1.35; }
.pattern-progress-head b { color:#2d776d; font-size:11px; font-variant-numeric:tabular-nums; }
.pattern-progress-mode { display:inline-flex; align-items:center; min-height:20px; padding:0 7px; border-radius:999px; background:#e5f3ef; color:#28776c; font-size:10px; font-weight:750; white-space:nowrap; }
.pattern-progress-mode.external { background:#f7eee3; color:#9b652d; }
.pattern-progress-track { height:5px; overflow:hidden; border-radius:999px; background:#e8efed; }
.pattern-progress-track i { display:block; height:100%; border-radius:inherit; background:#3c9789; transition:width .24s ease; }
.pattern-progress.is-overdue { border-color:#e8b9bc; background:#fff9f9; }
.pattern-progress.is-overdue .pattern-progress-track i { background:#c34d58; }
.pattern-progress.is-soon { border-color:#ead5a9; background:#fffdf6; }
.pattern-progress.is-soon .pattern-progress-track i { background:#bd8236; }
.pattern-progress-meta { display:flex; flex-wrap:wrap; gap:4px 10px; color:#7a918c; font-size:10px; line-height:1.4; }
.pattern-progress-next { display:grid; grid-template-columns:auto minmax(0,1fr); gap:7px; margin:1px 0 0; color:#496963; font-size:12px; line-height:1.5; }
.pattern-progress-next span { color:#839691; font-weight:700; white-space:nowrap; }
.pattern-timeline { display:grid; gap:0; margin:3px 0 0; padding:4px 0 0 2px; list-style:none; border-top:1px solid #e6efec; }
.pattern-timeline li { display:grid; grid-template-columns:12px minmax(0,1fr); gap:8px; position:relative; padding:8px 0 0; }
.pattern-timeline li:not(:last-child)::after { content:""; position:absolute; left:5px; top:18px; bottom:-8px; width:1px; background:#dce9e5; }
.pattern-timeline-dot { width:9px; height:9px; margin-top:3px; border:2px solid #a8bdb8; border-radius:50%; background:#fff; z-index:1; }
.pattern-timeline li.done .pattern-timeline-dot { border-color:#3c9789; background:#3c9789; }
.pattern-timeline li.current .pattern-timeline-dot { border-color:#bd8236; background:#fff6e7; box-shadow:0 0 0 3px #fff1d8; }
.pattern-timeline li > div { display:grid; gap:2px; min-width:0; }
.pattern-timeline strong { color:#3b5b55; font-size:11px; }
.pattern-timeline small { color:#82938f; font-size:10px; line-height:1.35; }
.pattern-progress.is-compact .pattern-progress-meta { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pattern-progress.is-compact .pattern-progress-meta span + span { display:none; }
.pattern-progress.is-compact .pattern-progress-head strong { font-size:11px; }
.pattern-progress.is-compact {
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  overflow:hidden;
}
.pattern-progress.is-compact .pattern-progress-head {
  min-width:0;
  grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto;
}
.pattern-progress.is-compact .pattern-progress-mode {
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}
.pattern-progress.is-compact .pattern-progress-head strong,
.pattern-progress.is-compact .pattern-progress-head b {
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.risk-table td:nth-child(4) { min-width:190px; }
@media (max-width:760px) {
  .pattern-progress { min-width:0; }
  .pattern-progress-head { grid-template-columns:auto minmax(0,1fr); }
  .pattern-progress-head b { grid-column:2; }
  .pattern-progress.is-compact .pattern-progress-head { grid-template-columns:auto minmax(0,1fr) auto; }
  .pattern-progress.is-compact .pattern-progress-head b { grid-column:auto; }
}

/* Read-only intelligent knowledge base */
.knowledge-page { display:grid; gap:18px; }
.knowledge-hero { display:flex; justify-content:space-between; gap:20px; align-items:flex-end; padding:24px 26px; border:1px solid #dfe8e5; border-radius:16px; background:linear-gradient(135deg,#f7fbfa 0%,#fff 72%); }
.knowledge-hero h2 { margin:0; color:#1f3a37; font-size:28px; letter-spacing:-.02em; }
.knowledge-hero p { max-width:68ch; margin:8px 0 0; color:#62736f; line-height:1.65; }
.knowledge-boundary { display:grid; gap:4px; max-width:330px; padding:12px 14px; border:1px solid #d6e8e2; border-radius:12px; background:#f5fbf9; color:#2e7368; font-size:12px; line-height:1.5; }
.knowledge-boundary strong { font-size:13px; }
.knowledge-ask { display:grid; gap:14px; padding:22px; }
.knowledge-ask-head, .knowledge-library-head { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.knowledge-ask-tools { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px; }
.knowledge-ask-head h3, .knowledge-library-head h3 { margin:0; color:#263b3b; font-size:18px; }
.knowledge-ask-head span, .knowledge-library-head span { color:#82918e; font-size:12px; line-height:1.5; }
.knowledge-ai-hint { padding:9px 12px; border:1px solid #e6e8f2; border-radius:10px; background:#fafaff; color:#66708a; font-size:12px; line-height:1.5; }
.knowledge-role-chip { flex:0 0 auto; padding:6px 10px; border-radius:999px; background:#eef5f3; color:#32796f !important; font-weight:700; }
.knowledge-ask-form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:end; }
.knowledge-ask-form textarea { min-height:92px; resize:vertical; }
.knowledge-ask-form .primary { min-width:116px; min-height:46px; }
.knowledge-suggestions { display:flex; flex-wrap:wrap; gap:8px; }
.knowledge-suggestion { border:1px solid #dce8e4; border-radius:999px; background:#fff; color:#47716c; padding:7px 11px; font-size:12px; cursor:pointer; transition:background .18s ease,border-color .18s ease,color .18s ease; }
.knowledge-suggestion:hover, .knowledge-suggestion:focus-visible { border-color:#7eb8ad; background:#eff9f6; color:#21685e; }
.knowledge-answer { min-height:120px; padding:16px 18px; border:1px solid #e3ebe9; border-radius:12px; background:#fbfdfc; }
.knowledge-answer-copy p { margin:10px 0 0; color:#344c49; line-height:1.75; white-space:normal; }
.knowledge-answer-status { display:flex; align-items:center; flex-wrap:wrap; gap:8px; color:#2d7d70; font-size:12px; font-weight:700; }
.knowledge-source-list { display:flex; flex-wrap:wrap; align-items:center; gap:5px; color:#81928f; font-weight:400; }
.knowledge-source { display:inline-flex; padding:3px 7px; border-radius:6px; background:#edf6f3; color:#39746c; }
.knowledge-answer-empty, .knowledge-loading, .knowledge-error { display:grid; gap:5px; align-content:center; min-height:88px; color:#778986; line-height:1.55; }
.knowledge-answer-empty strong, .knowledge-error strong { color:#3d5955; }
.knowledge-error { grid-template-columns:1fr auto; align-items:center; padding:12px; border:1px solid #f0d7d7; border-radius:10px; background:#fff9f9; color:#945c5c; }
.knowledge-error strong { color:#9b4d4d; }
.knowledge-library { display:grid; gap:14px; }
.knowledge-article-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.knowledge-article { display:grid; gap:10px; padding:18px; border:1px solid #e1e9e6; border-radius:14px; background:#fff; }
.knowledge-article-head, .knowledge-article-foot { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.knowledge-article h3 { margin:0; color:#29423f; font-size:15px; line-height:1.4; }
.knowledge-article-head span { display:block; margin-top:3px; color:#8a9996; font-size:11px; }
.knowledge-article p { margin:0; color:#536a66; font-size:13px; line-height:1.7; }
.knowledge-system-badge, .knowledge-custom-badge { flex:0 0 auto; padding:4px 7px; border-radius:6px; font-size:10px !important; font-weight:700; }
.knowledge-system-badge { background:#eef4ff; color:#4c6eaa !important; }
.knowledge-custom-badge { background:#f8f1e7; color:#a17135 !important; }
.knowledge-tags { display:flex; flex-wrap:wrap; gap:5px; }
.knowledge-tags span { padding:3px 7px; border-radius:5px; background:#f4f7f6; color:#83918e; font-size:10px; }
.knowledge-editor-dialog { width:min(680px,calc(100vw - 28px)); }
.knowledge-manager-dialog { width:min(900px,calc(100vw - 28px)); }
.knowledge-manager-dialog .knowledge-article-grid { max-height:min(62vh,680px); overflow:auto; padding:2px; }
.knowledge-manager-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.knowledge-editor-dialog textarea { min-height:180px; resize:vertical; }
@media (max-width:760px) {
  .knowledge-hero, .knowledge-ask-head, .knowledge-library-head { display:grid; align-items:start; }
  .knowledge-ask-tools { justify-content:flex-start; }
  .knowledge-ask-form { grid-template-columns:1fr; }
  .knowledge-ask-form .primary { width:100%; }
  .knowledge-article-grid { grid-template-columns:1fr; }
}

/* AI-first question workspace: one clear path, no preloaded article wall. */
.ai-chat-page { gap:16px; min-height:calc(100vh - 150px); }
.ai-chat-hero { align-items:center; padding:20px 24px; background:#f8fcfb; border-color:#d8e9e4; }
.ai-chat-kicker { display:block; margin-bottom:6px; color:#1d8176; font-size:10px; font-weight:800; letter-spacing:.16em; }
.ai-chat-hero h2 { font-size:30px; letter-spacing:0; }
.ai-chat-hero p { margin-top:6px; max-width:58ch; }
.knowledge-hero-meta { display:grid; justify-items:end; gap:9px; }
.ai-live-status { display:inline-flex; align-items:center; gap:7px; color:#69807c; font-size:12px; }
.ai-live-status i { width:7px; height:7px; border-radius:50%; background:#b7c6c2; }
.ai-live-status:has(i[style]) i, .ai-live-status i { background:#28a58e; }
.ai-chat-panel { display:grid; grid-template-rows:auto minmax(390px,1fr) auto auto; gap:16px; min-height:540px; padding:0; overflow:hidden; background:#fff; border-color:#dce8e5; }
.ai-chat-session-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 24px 0; }
.ai-chat-session-bar > div { display:grid; gap:3px; }
.ai-chat-session-bar strong { color:#294541; font-size:14px; }
.ai-chat-session-bar span { color:#8a9a96; font-size:11px; }
.ai-chat-session-bar .compact-button { min-height:34px; padding:7px 12px; font-size:12px; }
.ai-chat-stage { display:grid; align-content:center; justify-items:center; gap:18px; min-height:390px; padding:44px 8%; background:linear-gradient(180deg,#f7fbfa 0%,#fff 74%); }
.ai-chat-stage.has-transcript { align-content:start; justify-items:stretch; padding:24px max(7%,24px); background:#fbfdfc; }
.ai-chat-orbit { display:grid; place-items:center; width:66px; height:66px; border:1px solid #b9ddd4; border-radius:50%; background:#e9f7f3; color:#18786d; font-size:19px; font-weight:800; box-shadow:0 10px 28px rgba(29,129,118,.12); }
.ai-chat-welcome, .ai-chat-question { width:min(680px,100%); text-align:center; }
.ai-chat-welcome h3 { margin:0; color:#203b38; font-size:25px; letter-spacing:0; }
.ai-chat-welcome p { margin:9px 0 0; color:#71837f; line-height:1.6; }
.ai-chat-quick-prompts { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:18px; }
.ai-chat-quick-prompt { min-height:32px; padding:7px 11px; border:1px solid #d5e7e2; border-radius:8px; color:#39746c; background:#f7fcfa; font-size:11px; cursor:pointer; transition:border-color .15s ease,background .15s ease,color .15s ease,transform .15s ease; }
.ai-chat-quick-prompt:hover,.ai-chat-quick-prompt:focus-visible { border-color:#2b9c8e; color:#166b61; background:#effaf7; transform:translateY(-1px); }
.ai-chat-question { text-align:left; }
.ai-chat-question span { color:#1d8176; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.ai-chat-question p { margin:8px 0 0; color:#294541; font-size:18px; line-height:1.55; }
.ai-chat-transcript { display:grid; gap:12px; width:min(760px,100%); max-height:390px; overflow:auto; padding:4px 8px 4px 2px; scrollbar-color:#b9d8d1 transparent; }
.ai-chat-stage.has-transcript .ai-chat-transcript { width:min(820px,100%); max-height:430px; margin:0 auto; }
.ai-chat-turn { display:grid; gap:5px; width:min(86%,680px); }
.ai-chat-turn.user { justify-self:end; justify-items:end; }
.ai-chat-turn.assistant { justify-self:start; }
.ai-chat-turn > span { color:#1d8176; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.ai-chat-turn > p { margin:0; padding:11px 14px; border:1px solid #e2ece9; border-radius:12px 12px 12px 3px; color:#304b47; background:#fff; line-height:1.7; box-shadow:0 5px 16px rgba(26,62,57,.04); }
.ai-chat-turn.user > p { border-color:#cfe9e2; border-radius:12px 12px 3px 12px; color:#245e56; background:#edf9f6; }
.ai-chat-turn-meta { display:flex; align-items:center; gap:8px; color:#8a9a96; font-size:10px; }
.ai-chat-turn-meta time { color:#a0aeaa; }
.ai-chat-turn.user .ai-chat-turn-meta { justify-content:flex-end; }
.ai-chat-stage .knowledge-answer { width:min(760px,100%); min-height:0; padding:0; border:0; background:transparent; }
.ai-chat-stage .knowledge-answer-empty { display:none; }
.knowledge-answer-copy { width:100%; padding:18px 20px; border:1px solid #e2ece9; border-radius:12px; background:#fff; box-shadow:0 8px 24px rgba(26,62,57,.05); }
.knowledge-answer-copy p { margin:10px 0 0; color:#304b47; line-height:1.8; }
.knowledge-source-count { color:#829591; font-weight:500; }
.ai-chat-composer { position:relative; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:end; margin:0 24px; padding:14px 0 0; border-top:1px solid #e4eeeb; }
.ai-chat-composer textarea { min-height:64px; max-height:180px; padding:16px 18px; resize:vertical; border-color:#c9ded9; border-radius:12px; background:#fbfefd; font-size:15px; }
.ai-chat-composer textarea:focus { border-color:#2d998b; box-shadow:0 0 0 3px rgba(45,153,139,.12); }
.ai-chat-composer .primary { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-width:112px; min-height:50px; border-radius:11px; }
.ai-chat-composer .primary b { font-size:18px; font-weight:500; }
.ai-chat-composer small { grid-column:1 / -1; color:#91a09c; font-size:11px; }
.ai-assistant-mode { display:inline-flex; grid-column:1 / -1; gap:4px; padding:3px; width:max-content; border:1px solid #dce9e5; border-radius:10px; background:#f5faf8; }
.ai-assistant-mode button { min-height:30px; padding:6px 14px; border:0; border-radius:7px; color:#6b817c; background:transparent; font-size:12px; cursor:pointer; }
.ai-assistant-mode button.active { color:#fff; background:#16877b; box-shadow:0 4px 10px rgba(22,135,123,.16); }
.ai-image-reference-picker { display:grid; grid-column:1; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:7px 9px; padding:9px 12px; border:1px dashed #bfd9d2; border-radius:10px; color:#4f726b; background:#f8fcfb; cursor:pointer; transition:border-color .15s ease,background .15s ease,box-shadow .15s ease; }
.ai-image-reference-picker:hover,.ai-image-reference-picker:focus-visible,.ai-image-reference-picker.is-dragging { border-color:#2b9c8e; background:#effaf7; box-shadow:0 0 0 3px rgba(43,156,142,.1); }
.ai-image-reference-picker > span { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; color:#fff; background:#2b9c8e; font-size:18px; line-height:1; }
.ai-image-reference-picker > div { display:grid; gap:3px; min-width:0; }
.ai-image-reference-picker strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }
.ai-image-reference-picker small { color:#8b9e99; font-size:10px; }
.ai-image-reference-clear { display:grid; place-items:center; width:24px; height:24px; border:0; border-radius:50%; color:#7b8f8a; background:transparent; font-size:18px; cursor:pointer; }
.ai-image-reference-clear:hover,.ai-image-reference-clear:focus-visible { color:#a42336; background:#ffedf0; }
.ai-chat-composer.is-image-mode > .primary { grid-column:2; grid-row:2 / span 2; align-self:stretch; }
.ai-chat-composer.is-file-mode > .primary { grid-column:2; grid-row:2 / span 2; align-self:stretch; }
.ai-chat-image-wrap { display:grid; gap:7px; width:min(360px,100%); padding:9px; border:1px solid #dce9e5; border-radius:12px; background:#fbfefd; }
.ai-chat-image { display:block; width:100%; max-height:420px; aspect-ratio:2 / 3; object-fit:cover; border-radius:8px; background:#eef5f2; cursor:zoom-in; }
.ai-chat-image-delete { justify-self:start; }
.ai-chat-image-pending { display:flex; align-items:center; gap:8px; padding:12px 14px; border:1px dashed #bcd9d1; border-radius:11px; color:#60817a; background:#f8fcfb; }
.ai-chat-file-pending { display:flex; align-items:center; gap:8px; padding:12px 14px; border:1px dashed #bfd4e8; border-radius:11px; color:#52708c; background:#f7fbff; }
.ai-chat-file-card { display:flex; align-items:center; justify-content:space-between; gap:14px; width:min(520px,100%); padding:12px 14px; border:1px solid #d7e3ee; border-radius:11px; background:#f8fbfe; }
.ai-chat-file-card > div { display:grid; gap:4px; min-width:0; }
.ai-chat-file-card strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#294b62; font-size:13px; }
.ai-chat-file-card small { color:#8196a5; font-size:10px; }
.ai-chat-file-card .compact-button { flex:0 0 auto; min-height:32px; padding:7px 12px; color:#176b62; text-decoration:none; }
.knowledge-loading-dot { width:8px; height:8px; border-radius:50%; background:#2b9c8e; box-shadow:0 0 0 5px rgba(43,156,142,.12); animation:knowledgePulse 1s ease-in-out infinite; }
.ai-chat-footnote { display:flex; justify-content:space-between; gap:12px; margin:0 24px; padding:0 0 18px; color:#8a9a96; font-size:11px; }
.knowledge-loading-inline { display:flex; justify-content:center; gap:6px; padding:18px; }
.knowledge-loading-inline span { width:7px; height:7px; border-radius:50%; background:#4da99b; animation:knowledgePulse 1s ease-in-out infinite; }
.knowledge-loading-inline span:nth-child(2) { animation-delay:.14s; }
.knowledge-loading-inline span:nth-child(3) { animation-delay:.28s; }
@keyframes knowledgePulse { 0%,100% { opacity:.25; transform:translateY(0); } 50% { opacity:1; transform:translateY(-3px); } }
@media (max-width:760px) {
  .ai-chat-page { min-height:calc(100vh - 110px); }
  .ai-chat-hero { padding:18px; }
  .knowledge-hero-meta { justify-items:start; }
  .ai-chat-panel { min-height:500px; }
  .ai-chat-session-bar { padding:14px 16px 0; }
  .ai-chat-stage { min-height:360px; padding:32px 18px; }
  .ai-chat-stage.has-transcript { padding:18px 16px; }
  .ai-chat-stage.has-transcript .ai-chat-transcript { max-height:420px; }
  .ai-chat-welcome h3 { font-size:22px; }
  .ai-chat-composer { grid-template-columns:1fr; margin:0 16px; }
  .ai-chat-composer.is-image-mode > .primary { grid-column:1; grid-row:auto; }
  .ai-chat-composer.is-file-mode > .primary { grid-column:1; grid-row:auto; }
  .ai-image-reference-picker { grid-column:1; }
  .ai-chat-quick-prompts { justify-content:flex-start; }
  .ai-chat-composer .primary { width:100%; }
  .ai-chat-footnote { display:grid; gap:5px; margin:0 16px; padding-bottom:14px; }
}

/* 2026-08-27 visual motion layer
   The interface is an operational workspace, so motion is reserved for
   orientation and feedback: panels enter with a short lift, metrics cascade
   once, controls give tactile press feedback, and the login surface breathes
   quietly. No looping motion is used on business data. */
:root {
  --motion-ease:cubic-bezier(.22,.8,.24,1);
  --focus-ring:rgba(29,129,118,.24);
}

body::before {
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 84% 8%, rgba(194,228,220,.20), transparent 27%),
    radial-gradient(circle at 10% 92%, rgba(223,234,247,.18), transparent 30%);
  opacity:.9;
}

.view-panel,
.view-panel-enter {
  animation:view-panel-enter .34s var(--motion-ease) both;
}
@keyframes view-panel-enter {
  from { opacity:0; transform:translateY(8px); filter:blur(2px); }
  to { opacity:1; transform:none; filter:none; }
}

.panel,
.metric,
.work-card,
.dashboard-kpi-card,
.dashboard-intelligence-card,
.dashboard-sales-card,
.dashboard-module-card,
.schedule-card,
.knowledge-article {
  transition:transform .22s var(--motion-ease), box-shadow .22s var(--motion-ease), border-color .22s ease, background-color .22s ease;
}
.panel:hover,
.dashboard-kpi-card:hover,
.dashboard-intelligence-card:hover,
.dashboard-sales-card:hover,
.dashboard-module-card:hover,
.schedule-card:hover,
.knowledge-article:hover {
  transform:translateY(-2px);
  box-shadow:0 14px 32px rgba(28,73,67,.08);
}
.work-card:hover { transform:translateY(-3px); box-shadow:0 16px 30px rgba(28,73,67,.09); }
.work-card:nth-child(1), .metrics > :nth-child(1) { animation:stagger-in .38s .03s var(--motion-ease) both; }
.work-card:nth-child(2), .metrics > :nth-child(2) { animation:stagger-in .38s .08s var(--motion-ease) both; }
.work-card:nth-child(3), .metrics > :nth-child(3) { animation:stagger-in .38s .13s var(--motion-ease) both; }
.metrics > :nth-child(4) { animation:stagger-in .38s .18s var(--motion-ease) both; }
.metrics > :nth-child(5) { animation:stagger-in .38s .23s var(--motion-ease) both; }
@keyframes stagger-in {
  from { opacity:0; transform:translateY(10px); }
  to { opacity:1; transform:none; }
}

button,
.filter-chip,
.workspace-tab,
.nav-item,
.nav-group-trigger,
.search,
.user-menu,
.icon-button,
.secondary,
input,
select,
textarea {
  transition:transform .16s ease, box-shadow .18s ease, border-color .18s ease, background-color .18s ease, color .18s ease;
}
button:active:not(:disabled),
.filter-chip:active,
.workspace-tab:active { transform:scale(.98); }
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
a:focus-visible { outline:3px solid var(--focus-ring); outline-offset:3px; }

.nav-item.active::after {
  content:"";
  width:4px;
  height:4px;
  margin-left:auto;
  border-radius:50%;
  background:var(--primary);
  box-shadow:0 0 0 4px rgba(29,129,118,.10);
  animation:nav-pulse 2.6s ease-in-out infinite;
}
.nav-item.active b { margin-left:0; }
@keyframes nav-pulse {
  0%,100% { opacity:.55; transform:scale(.85); }
  50% { opacity:1; transform:scale(1.05); }
}

.activity-badge,
#alertBadge {
  animation:badge-pop .28s var(--motion-ease) both;
}
@keyframes badge-pop {
  from { opacity:0; transform:scale(.7); }
  to { opacity:1; transform:scale(1); }
}

.activity-panel.open { animation:activity-slide .24s var(--motion-ease) both; }
@keyframes activity-slide {
  from { opacity:.35; transform:translateX(100%); }
  to { opacity:1; transform:translateX(0); }
}

.dialog[open] { animation:dialog-enter .22s var(--motion-ease) both; }
@keyframes dialog-enter {
  from { opacity:0; transform:translateY(10px) scale(.985); }
  to { opacity:1; transform:none; }
}
.dialog::backdrop { animation:backdrop-in .2s ease both; }
@keyframes backdrop-in { from { opacity:0; } to { opacity:1; } }

.auth-shell { animation:auth-enter .62s var(--motion-ease) both; }
.auth-brand-mark { animation:brand-float 5s ease-in-out 1.1s infinite; }
.auth-brand-panel::before { animation:halo-drift 12s ease-in-out 1s infinite alternate; }
.auth-brand-panel::after { animation:halo-drift 15s ease-in-out 1.5s infinite alternate-reverse; }
@keyframes auth-enter {
  from { opacity:0; transform:translateY(18px) scale(.985); filter:blur(4px); }
  to { opacity:1; transform:none; filter:none; }
}
@keyframes brand-float {
  0%,100% { transform:translateY(0) rotate(0); }
  50% { transform:translateY(-4px) rotate(-1deg); }
}
@keyframes halo-drift {
  from { transform:translate3d(0,0,0) scale(1); }
  to { transform:translate3d(12px,8px,0) scale(1.04); }
}
.auth-submit:disabled {
  cursor:wait;
  background-image:linear-gradient(100deg, rgba(255,255,255,.12) 0 18%, rgba(255,255,255,.28) 32%, rgba(255,255,255,.12) 46%);
  background-size:220% 100%;
  animation:button-sheen 1.15s linear infinite;
}
@keyframes button-sheen { to { background-position:-220% 0; } }

.center-placeholder-body strong::after,
.hr-loading strong::after,
.knowledge-loading strong::after {
  content:"";
  display:inline-block;
  width:1.1em;
  overflow:hidden;
  vertical-align:bottom;
  animation:loading-dots 1.2s steps(4,end) infinite;
}
@keyframes loading-dots { 0% { content:""; } 25% { content:"."; } 50% { content:".."; } 75%,100% { content:"..."; } }

@media (prefers-reduced-motion:reduce) {
  body::before,
  .view-panel,
  .panel,
  .metric,
  .work-card,
  .dashboard-kpi-card,
  .dashboard-intelligence-card,
  .dashboard-sales-card,
  .dashboard-module-card,
  .schedule-card,
  .knowledge-article,
  .auth-shell,
  .auth-brand-mark,
  .auth-brand-panel::before,
  .auth-brand-panel::after,
  .dialog[open],
  .dialog::backdrop,
  .activity-panel.open,
  .nav-item.active::after,
  .activity-badge,
  #alertBadge,
  .auth-submit:disabled,
  .center-placeholder-body strong::after,
  .hr-loading strong::after,
  .knowledge-loading strong::after {
    animation:none !important;
    transition:none !important;
  }
}

/* Final visual system pass: a quieter, more editorial operational shell. */
:root {
  --canvas:#f4f7f6;
  --surface:#ffffff;
  --surface-soft:#f8fbfa;
  --line:#dfeae7;
  --line-strong:#c3d9d4;
  --ink:#173532;
  --ink-soft:#395650;
  --muted:#748a85;
  --primary:#147d73;
  --primary-strong:#0d625a;
  --primary-soft:#e6f4f0;
  --accent:#cf9451;
  --danger:#bf4657;
  --radius:14px;
}

html { scroll-behavior:smooth; }
body { overflow-x:hidden; }
body::before { z-index:0; opacity:.72; }
.app-shell { position:relative; z-index:1; }

.sidebar {
  background:rgba(255,255,255,.88);
  box-shadow:10px 0 36px rgba(26,74,67,.07);
  backdrop-filter:blur(18px);
}
.brand { position:relative; }
.brand::after {
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:-1px;
  height:1px;
  background:linear-gradient(90deg,transparent,#b9d9d3 20%,#b9d9d3 80%,transparent);
}
.brand-mark { transition:transform .24s var(--motion-ease), box-shadow .24s ease; }
.brand:hover .brand-mark { transform:rotate(-4deg) translateY(-2px); box-shadow:0 12px 24px rgba(28,105,94,.16); }
.nav { padding-bottom:12px; }
.nav-group-menu { transition:opacity .2s ease, transform .2s var(--motion-ease); }
.nav-group.is-collapsed .nav-group-menu { opacity:0; transform:translateY(-4px); pointer-events:none; }
.nav-group:not(.is-collapsed) .nav-group-menu { animation:menu-reveal .22s var(--motion-ease) both; }
@keyframes menu-reveal { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:none; } }
.nav-item.active { position:relative; }
.nav-item.active::after { flex:0 0 auto; }

.topbar {
  background:rgba(255,255,255,.76);
  box-shadow:0 10px 28px rgba(26,74,67,.055);
  backdrop-filter:blur(18px) saturate(1.12);
}
.topbar h1 { text-wrap:balance; }
.topbar h1::after {
  content:"";
  display:block;
  width:28px;
  height:3px;
  margin-top:7px;
  border-radius:99px;
  background:var(--primary);
  opacity:.65;
}
.search:focus-within { transform:translateY(-1px); box-shadow:0 0 0 4px var(--primary-soft),0 8px 18px rgba(28,105,94,.08); }
.activity-button { position:relative; }
.activity-button:hover { transform:translateY(-1px) rotate(-3deg); }

.page { position:relative; }
.page::before {
  content:"";
  position:absolute;
  top:0;
  right:42px;
  width:96px;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--line-strong));
  opacity:.7;
}
.toolbar h2 { text-wrap:balance; }
.panel-head h3 { text-wrap:balance; }
.panel-head > div > .subtle { max-width:72ch; }

.metric,
.work-card,
.dashboard-kpi-card { position:relative; overflow:hidden; }
.metric::after,
.work-card::after,
.dashboard-kpi-card::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 0 42%,rgba(255,255,255,.58) 50%,transparent 58%);
  transform:translateX(-120%);
  transition:transform .7s var(--motion-ease);
}
.metric:hover::after,
.work-card:hover::after,
.dashboard-kpi-card:hover::after { transform:translateX(120%); }
.metric-value,
.dashboard-kpi-value,
.work-card .number { font-variant-numeric:tabular-nums; }

.product-table tbody tr { transition:background-color .16s ease,transform .16s ease; }
.product-table tbody tr:hover { transform:translateX(2px); }
.product-table tbody tr:focus-within { background:#f3faf8; }
.status-tag,.tag { transition:transform .16s ease, box-shadow .16s ease; }
.status-tag:hover,.tag:hover { transform:translateY(-1px); box-shadow:0 3px 8px rgba(28,105,94,.08); }

.primary,.secondary,.filter-chip,.icon-button,.user-menu { will-change:transform; }
.primary:hover,.secondary:hover,.filter-chip:hover,.icon-button:hover,.user-menu:hover { transform:translateY(-1px); }
.primary:disabled,.secondary:disabled,.filter-chip:disabled { transform:none; }

.dialog::backdrop { background:rgba(18,45,42,.42); backdrop-filter:blur(7px) saturate(.9); }
.dialog-inner { border-color:#cfe2dd; }
.dialog-head { background:linear-gradient(180deg,#fff,#fbfefd); }
.form-footer { background:linear-gradient(180deg,#fbfefd,#f5faf8); }

.auth-workspace {
  position:relative;
  isolation:isolate;
  background:
    radial-gradient(circle at 12% 18%,rgba(167,216,205,.34),transparent 28%),
    radial-gradient(circle at 89% 86%,rgba(208,224,241,.34),transparent 31%),
    #f2f7f5;
}
.auth-workspace::before,
.auth-workspace::after {
  content:"";
  position:absolute;
  z-index:-1;
  border:1px solid rgba(28,116,105,.10);
  border-radius:50%;
  pointer-events:none;
}
.auth-workspace::before { width:52vw; height:52vw; left:-34vw; top:-28vw; }
.auth-workspace::after { width:42vw; height:42vw; right:-26vw; bottom:-22vw; border-color:rgba(70,120,160,.10); }
.auth-shell { border-radius:26px; box-shadow:0 34px 100px rgba(23,70,63,.17); }
.auth-brand-panel { position:relative; isolation:isolate; overflow:hidden; }
.auth-brand-panel > * { position:relative; z-index:1; }
.auth-brand-panel h1 { text-wrap:balance; }
.auth-brand-panel::before { opacity:.85; }
.auth-panel { position:relative; }
.auth-panel::before {
  content:"";
  position:absolute;
  top:38px;
  right:52px;
  width:46px;
  height:4px;
  border-radius:99px;
  background:var(--primary-soft);
}
.auth-method-tab { transition:color .18s ease,background-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.auth-method-tab:hover { transform:translateY(-1px); color:var(--primary-strong); }
.auth-method-tab.active { background:#fff; }
.auth-form input { box-shadow:inset 0 1px 2px rgba(28,73,67,.025); }
.auth-form input:hover { border-color:#a9cbc4; }
.auth-submit { position:relative; overflow:hidden; }
.auth-submit::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,transparent 28%,rgba(255,255,255,.20) 45%,transparent 62%);
  transform:translateX(-120%);
  transition:transform .65s var(--motion-ease);
}
.auth-submit:hover::after { transform:translateX(120%); }

@media (max-width:760px) {
  .page::before { right:16px; }
  .topbar h1::after { margin-top:4px; }
  .auth-panel::before { top:22px; right:26px; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .nav-group-menu,
  .brand-mark,
  .metric::after,
  .work-card::after,
  .dashboard-kpi-card::after,
  .auth-submit::after { transition:none !important; }
}

/* Mobile layout guard: the historical desktop grid must not win over the
   single-column login composition at narrow widths. */
@media (max-width:760px) {
  .auth-shell,
  .auth-brand-panel,
  .auth-panel,
  .auth-method-tabs,
  .auth-form {
    width:100%;
    min-width:0;
    box-sizing:border-box;
  }
  .auth-shell { grid-template-columns:1fr; }
  .auth-panel { padding-left:20px; padding-right:20px; }
  .auth-form input,
  .auth-form select,
  .auth-form textarea { max-width:100%; }
}

/* Product details use the whole dialog surface. The generic dialog-inner
   width is intentionally narrow for forms, but left a large dead zone inside
   the wider product dialog on high-DPI screens. */
#productDialog .dialog-inner.product-detail-shell {
  width:100%;
  max-width:none;
  box-sizing:border-box;
}
#productDialog .details {
  max-width:none;
}

/* The model-image sheet is rendered inside createDialog.  The generic
   .dialog-inner width is intentionally compact for forms, but it left this
   two-panel workspace stranded on the left with a dead white column.  Fill
   the owning dialog only for this wide, image-heavy task; other dialogs keep
   their compact reading measure. */
#createDialog .dialog-inner.model-image-dialog {
  width:100%;
  max-width:none;
  box-sizing:border-box;
  padding-bottom:30px;
}
#createDialog .dialog-inner.model-image-dialog > :not(.dialog-head) {
  margin-left:30px;
  margin-right:30px;
}
#createDialog .dialog-inner.model-image-dialog .model-image-intro {
  margin-top:24px;
  margin-bottom:20px;
  padding:16px 18px;
}
#createDialog .model-image-workspace {
  grid-template-columns:minmax(220px,280px) 42px minmax(500px,1fr);
  width:auto;
  gap:22px;
  margin-bottom:22px;
}
#createDialog .dialog-inner.model-image-dialog .model-scene-reference {
  margin-bottom:22px;
  padding:16px 17px;
}
#createDialog .dialog-inner.model-image-dialog #modelImageForm {
  padding-top:2px;
}
@media (max-width:1100px) {
  #createDialog .model-image-workspace { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  #createDialog .dialog-inner.model-image-dialog > :not(.dialog-head) {
    margin-left:16px;
    margin-right:16px;
  }
  #createDialog .dialog-inner.model-image-dialog {
    padding-bottom:20px;
  }
  #createDialog .dialog-inner.model-image-dialog .model-image-intro {
    margin-top:16px;
    margin-bottom:16px;
  }
}

/* Tenant identity is useful after sign-in, but it should read as one calm
   workspace card rather than a logo lockup. The account/session remains the
   source of truth; the sidebar only surfaces the current company's name. */
.brand {
  min-height:0;
  display:block;
  padding:14px 15px 15px;
  border:1px solid #deebe7;
  border-radius:14px;
  background:linear-gradient(145deg,#fff 0%,#f5fbf9 100%);
  box-shadow:0 8px 22px rgba(26,82,74,.07);
}
.brand-mark { display:none; }
.brand-copy { display:block; min-width:0; }
.brand-copy strong {
  display:block;
  max-width:none;
  color:#214b46;
  font-size:15px;
  font-weight:760;
  line-height:1.45;
  letter-spacing:-.02em;
  white-space:normal;
  overflow-wrap:anywhere;
}
.brand-copy small { display:none; }

/* Unified HR entry: keep the organization directory and account controls in
   one calm surface. The old step banner and wide card grid remain available
   only to the legacy renderer; this layout is intentionally denser and easier
   to scan on both desktop and mobile. */
.org-account-hero { margin-bottom:14px; }
.org-account-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:14px; }
.org-account-summary > div { display:grid; gap:5px; min-width:0; padding:13px 15px; border:1px solid #e3e9f0; border-radius:10px; background:#fff; }
.org-account-summary span { color:#718093; font-size:11px; }
.org-account-summary strong { color:#24364a; font-size:19px; line-height:1.1; }
.org-account-layout { display:grid; grid-template-columns:minmax(260px,.72fr) minmax(0,1.58fr); gap:14px; align-items:start; }
.org-directory-panel,.org-members-panel { min-width:0; }
.org-department-list { display:grid; gap:8px; padding:14px; }
.org-department-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 13px; border:1px solid #e5eaf0; border-radius:9px; background:#fbfcfe; }
.org-department-main { display:flex; align-items:center; gap:10px; min-width:0; }
.org-department-main > div { display:grid; gap:3px; min-width:0; }
.org-department-main strong { color:#2d4054; font-size:14px; }
.org-department-main small { overflow:hidden; color:#7b8796; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.org-department-icon { display:grid; place-items:center; flex:0 0 auto; width:28px; height:28px; border-radius:8px; color:#2a7180; background:#eaf5f7; font-size:15px; }
.org-members-table { min-width:860px; }
.org-members-table td,.org-members-table th { vertical-align:middle; }
.org-employee-cell,.org-account-cell { display:grid; gap:3px; min-width:100px; }
.org-employee-cell strong,.org-account-cell strong { color:#2b3d52; font-size:13px; }
.org-employee-cell small,.org-account-cell small { color:#7a8797; font-size:11px; }
.org-account-state { display:inline-flex; width:max-content; max-width:100%; padding:3px 7px; border-radius:999px; font-size:10px; white-space:nowrap; }
.org-account-state.is-bound { color:#276a50; background:#e8f6ef; }
.org-account-state.is-paused { color:#94611d; background:#fff2dc; }
.org-account-state.is-unbound { color:#7a6a81; background:#f1eef5; }
.org-members-table .row-actions { min-width:190px; }
.org-roles-panel { margin-top:14px; }
.org-role-list { display:grid; gap:8px; padding:14px; }
.org-role-row { display:grid; grid-template-columns:minmax(180px,1fr) auto auto; align-items:center; gap:12px; padding:11px 13px; border:1px solid #e5eaf0; border-radius:9px; background:#fff; }
.org-role-row > div:first-child { display:grid; gap:3px; min-width:0; }
.org-role-row strong { color:#2d4054; font-size:13px; }
.org-role-row small { color:#7b8796; font-size:11px; }
.org-role-map-count { color:#6b7888; font-size:11px; white-space:nowrap; }
.org-role-row .row-actions { justify-content:flex-end; }
@media (max-width:980px) {
  .org-account-layout { grid-template-columns:1fr; }
  .org-directory-panel { order:0; }
  .org-members-panel { order:1; }
}
@media (max-width:680px) {
  .org-account-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .org-account-hero .hr-hero-actions { display:grid; grid-template-columns:1fr; }
  .org-account-hero .hr-hero-actions button { width:100%; }
  .org-department-row { align-items:flex-start; flex-direction:column; }
  .org-department-row button { width:100%; }
  .org-role-row { grid-template-columns:1fr; align-items:flex-start; }
  .org-role-row .row-actions { justify-content:flex-start; }
}

/* Department-driven directory: the left rail is a real filter, while the
   employee table stays inside its own scroll container instead of pushing the
   whole page wider than the viewport. */
.org-account-layout { grid-template-columns:minmax(220px,.62fr) minmax(0,1.38fr); }
.org-directory-panel,.org-members-panel { overflow:hidden; }
.org-department-list { gap:6px; padding:10px; }
.org-department-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0; padding:0; overflow:hidden; background:#fff; transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease; }
.org-department-row.is-selected { border-color:#79b9ae; background:#f3fbf8; box-shadow:0 0 0 3px rgba(121,185,174,.12); }
.org-department-select { display:flex; align-items:center; gap:8px; width:100%; min-width:0; padding:10px 11px; border:0; background:transparent; color:inherit; text-align:left; cursor:pointer; }
.org-department-select:hover { background:#f7fbfa; }
.org-department-select:focus-visible { outline:2px solid var(--primary); outline-offset:-2px; }
.org-department-main { flex:1 1 auto; min-width:0; }
.org-department-main > span:last-child { display:grid; gap:3px; min-width:0; }
.org-department-main strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.org-department-main small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.org-department-count { flex:0 0 auto; min-width:22px; color:#287b70; font-size:12px; font-weight:720; text-align:right; }
.org-department-chevron { flex:0 0 auto; color:#80a49e; font-size:18px; line-height:1; transform:translateX(2px); }
.org-department-row > .compact-button { margin:8px 8px 8px 0; white-space:nowrap; }
.org-members-panel .panel-head { align-items:flex-start; }
.org-members-context { display:flex; align-items:center; gap:8px; min-height:34px; padding:0 14px; border-top:1px solid #edf2f1; border-bottom:1px solid #edf2f1; background:#fbfdfc; color:#7b8c88; font-size:11px; }
.org-members-context strong { color:#21685f; font-size:12px; }
.org-members-context .action-link { margin-left:auto; font-size:11px; }
.org-members-table { width:100%; min-width:720px; table-layout:fixed; }
.org-members-table th,.org-members-table td { overflow:hidden; text-overflow:ellipsis; }
.org-members-table th:nth-child(1) { width:18%; }
.org-members-table th:nth-child(2) { width:13%; }
.org-members-table th:nth-child(3) { width:13%; }
.org-members-table th:nth-child(4) { width:20%; }
.org-members-table th:nth-child(5) { width:16%; }
.org-members-table th:nth-child(6) { width:20%; }
.org-members-table .row-actions { min-width:0; gap:5px; }
.org-members-table .row-actions .action-link { min-width:0; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:980px) {
  .org-account-layout { grid-template-columns:1fr; }
}
@media (max-width:680px) {
  .org-department-row { grid-template-columns:1fr; }
  .org-department-row > .compact-button { width:calc(100% - 16px); margin:0 8px 8px; }
  .org-members-table { min-width:680px; }
}
/* Product/workbench tables: keep row actions compact and move secondary work into one menu. */
.product-table .product-actions-cell {
  width:250px;
  min-width:250px;
  vertical-align:middle;
  overflow:visible;
}
.product-row-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  min-width:0;
  padding:2px 0;
}
.product-row-actions .action-button {
  box-sizing:border-box;
  min-width:0;
  min-height:34px;
  margin:0;
  padding:0 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:8px;
  font-size:12px;
  line-height:1.2;
  text-align:center;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.product-row-actions > .row-primary-action {
  flex:1 1 auto;
  max-width:150px;
}
.product-row-actions > .action-detail {
  flex:0 0 auto;
}
.product-row-actions .action-button.action-link {
  border:1px solid #d2e2df;
  color:#31534f;
  background:#fff;
}
.product-row-actions .action-button.action-link:hover,
.product-row-actions .action-button.action-link:focus-visible {
  color:#0d665e;
  border-color:#89beb6;
  background:#f4faf8;
}
.product-row-actions .action-image-needed {
  border-color:#e0b66b;
  color:#8a5a12;
  background:#fffaf0;
  font-weight:700;
}
.product-row-actions .action-image-needed:hover,
.product-row-actions .action-image-needed:focus-visible {
  border-color:#c98d2c;
  color:#704509;
  background:#fff4d9;
}
.product-row-actions .action-button.action-secondary,
.product-row-actions .action-detail {
  border-color:#d2e2df;
  color:#31534f;
  background:#fff;
}
.product-row-actions .action-button.action-secondary:hover,
.product-row-actions .action-detail:hover,
.product-row-actions .action-button.action-secondary:focus-visible,
.product-row-actions .action-detail:focus-visible {
  border-color:#89beb6;
  color:#0d665e;
  background:#f4faf8;
}
.product-row-actions .action-button.action-danger {
  border:1px solid #e8b9c0;
  color:#a93647;
  background:#fff8f9;
}
.product-row-actions .action-button.action-danger:hover,
.product-row-actions .action-button.action-danger:focus-visible {
  border-color:#c97884;
  color:#8f2637;
  background:#fff0f2;
}
.row-action-menu {
  position:relative;
  flex:0 0 auto;
  z-index:4;
}
.row-action-menu[open] {
  align-self:flex-start;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}
.row-action-menu-trigger {
  box-sizing:border-box;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  padding:0 10px;
  border:1px solid #cfe1de;
  border-radius:8px;
  background:#f8fbfa;
  color:#31534f;
  cursor:pointer;
  font-size:12px;
  font-weight:700;
  list-style:none;
  white-space:nowrap;
}
.row-action-menu-trigger::-webkit-details-marker { display:none; }
.row-action-menu-trigger::after { content:"⌄"; font-size:12px; line-height:1; }
.row-action-menu[open] .row-action-menu-trigger,
.row-action-menu-trigger:hover,
.row-action-menu-trigger:focus-visible {
  border-color:#89beb6;
  background:#edf8f5;
  color:#0d665e;
  outline:none;
}
.row-action-menu-panel {
  position:static;
  z-index:1;
  width:max-content;
  min-width:190px;
  max-width:250px;
  margin-top:6px;
  display:grid;
  gap:4px;
  padding:8px;
  border:1px solid #cfe1de;
  border-radius:8px;
  background:#fff;
  box-shadow:0 14px 30px rgba(31,76,70,.16);
}
.row-action-menu-panel .action-button,
.row-action-menu-panel .contract-actions,
.row-action-menu-panel .contract-status-wrap,
.row-action-menu-panel .contract-summary {
  width:100%;
  min-width:0;
}
.row-action-menu-panel .action-button {
  min-height:32px;
  justify-content:flex-start;
  padding:0 10px;
  text-align:left;
}
.row-action-menu-panel .contract-actions {
  display:grid;
  gap:4px;
}
.product-row-actions .contract-status-wrap {
  min-width:0;
  display:block;
}
.product-row-actions .contract-summary {
  box-sizing:border-box;
  width:100%;
  min-width:0;
  min-height:34px;
  display:grid;
  align-content:center;
  overflow:hidden;
}
.product-row-actions .contract-summary strong,
.product-row-actions .contract-summary small {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@media (max-width:900px) {
  .product-table .product-actions-cell { width:230px; min-width:230px; }
  .product-row-actions > .row-primary-action { max-width:132px; }
}
@media (max-width:760px) {
  .product-table .product-actions-cell { width:220px; min-width:220px; }
  .product-row-actions > .row-primary-action { max-width:120px; }
  .row-action-menu-panel { max-width:min(250px,calc(100vw - 32px)); }
}

/* 2026-08-28 unified dialog surface contract.
   Dialog sizing belongs to the outer sheet; the inner surface must never
   re-introduce a narrower max-width and leave a dead column beside forms. */
.dialog {
  width:min(860px,calc(100vw - 32px));
  max-width:calc(100vw - 32px);
  max-height:min(860px,calc(100dvh - 32px));
  min-width:0;
  overflow:hidden;
}
.dialog > .dialog-inner {
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
  max-height:inherit;
  overflow:auto;
}
.dialog > .dialog-inner > * { min-width:0; }
.dialog-inner .form,
.dialog-inner .form-grid,
.dialog-inner .form-grid > label,
.dialog-inner input,
.dialog-inner select,
.dialog-inner textarea { min-width:0; max-width:100%; }
.dialog-inner .form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.dialog-inner input,
.dialog-inner select,
.dialog-inner textarea { width:100%; }
.dialog-inner textarea { overflow-wrap:anywhere; }

/* 2026-09-02 product-detail-scroll=r45
   A detail record can contain review history, videos and long workflow
   modules. Keep one explicit scroll owner so the lower sections remain
   reachable instead of being clipped by the dialog sheet. */
#productDialog:has(> .dialog-inner.product-detail-shell) {
  height:min(92dvh,980px);
  max-height:min(92dvh,980px);
  overflow:hidden;
}
#productDialog > .dialog-inner.product-detail-shell {
  height:100%;
  max-height:100%;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior-y:contain;
  scrollbar-gutter:stable;
  -webkit-overflow-scrolling:touch;
}
#productDialog > .product-detail-shell .dialog-head {
  position:sticky;
  top:0;
  z-index:3;
}
#productDialog > .product-detail-shell .details {
  min-height:0;
  padding-bottom:28px;
}
#productDialog > .product-detail-shell :is(.revision-opinions-section,.design-image-strip,.detail-module) {
  scroll-margin-top:74px;
}

/* Wide work surfaces use the same available-width rule while compact
   confirmation forms retain a comfortable reading measure. */
.dialog:has(> .dialog-inner.hr-organization-dialog,
            > .dialog-inner.hr-performance-dialog,
            > .dialog-inner.supplier-dialog,
            > .dialog-inner.schedule-dialog,
            > .dialog-inner.model-image-dialog,
            > .dialog-inner.product-detail-shell,
            > .dialog-inner.knowledge-manager-dialog) {
  width:min(1120px,calc(100vw - 32px));
}
.dialog:has(> .dialog-inner.hr-import-dialog,
            > .dialog-inner.notification-dialog,
            > .dialog-inner.procurement-material-dialog,
            > .dialog-inner.assortment-dialog,
            > .dialog-inner.model-profile-dialog,
            > .dialog-inner.styling-dialog,
            > .dialog-inner.account-dialog,
            > .dialog-inner.tenant-registration-dialog,
            > .dialog-inner.knowledge-editor-dialog) {
  width:min(900px,calc(100vw - 32px));
}
.dialog:has(> .dialog-inner.hr-status-dialog,
            > .dialog-inner.hr-organization-quick-dialog,
            > .dialog-inner.hr-sensitive-dialog,
            > .dialog-inner.tenant-selection-dialog,
            > .dialog-inner.credentials-dialog) {
  width:min(620px,calc(100vw - 32px));
}

/* Organization editor: two stable directory columns, then a full-width
   mapping table. Sections remain readable without nested scroll traps. */
.hr-organization-dialog > .dialog-help {
  margin:0;
  padding:18px 26px 0;
  max-width:none;
}
.hr-organization-dialog > .form {
  padding:18px 26px 26px;
  gap:18px;
}
.hr-organization-dialog .hr-directory-editor,
.hr-organization-dialog .hr-role-mapping-editor {
  margin:0;
  padding:17px;
  border-radius:12px;
  max-height:none;
  overflow:visible;
}
.hr-organization-dialog .hr-directory-head { align-items:center; }
.hr-organization-dialog .hr-directory-head > div:first-child { min-width:0; }
.hr-organization-dialog .hr-directory-head small { max-width:76ch; }
.hr-organization-dialog .hr-directory-actions { flex:0 0 auto; }
.hr-organization-dialog .hr-directory-editor .form-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.hr-organization-dialog .hr-directory-editor textarea {
  min-height:156px;
  max-height:230px;
  resize:vertical;
}
.hr-organization-dialog .hr-supervisor-editor { margin:0; padding:17px; border-radius:12px; }
.hr-organization-dialog .hr-role-mapping-head { align-items:center; }
.hr-organization-dialog #hrRoleMappingRows {
  display:grid;
  gap:8px;
}
.hr-organization-dialog .hr-role-mapping-row {
  grid-template-columns:minmax(0,.9fr) minmax(0,1fr) minmax(0,1.25fr) auto;
}
.hr-organization-dialog .hr-role-mapping-row select {
  width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}
.hr-organization-dialog .form-footer {
  margin:0 -26px -26px;
  padding:16px 26px;
}

@media (max-width:900px) {
  .dialog:has(> .dialog-inner.hr-organization-dialog,
              > .dialog-inner.hr-performance-dialog,
              > .dialog-inner.supplier-dialog,
              > .dialog-inner.schedule-dialog,
              > .dialog-inner.model-image-dialog,
              > .dialog-inner.product-detail-shell,
              > .dialog-inner.knowledge-manager-dialog) {
    width:calc(100vw - 24px);
    max-width:calc(100vw - 24px);
  }
  .hr-organization-dialog .hr-role-mapping-row {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .hr-organization-dialog .hr-role-mapping-row > .action-link {
    grid-column:1/-1;
    justify-self:start;
  }
}
@media (max-width:760px) {
  .dialog {
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px);
    max-height:calc(100dvh - 20px);
  }
  .dialog-inner .form-grid,
  .hr-organization-dialog .hr-directory-editor .form-grid {
    grid-template-columns:1fr;
  }
  .hr-organization-dialog .hr-supervisor-row { grid-template-columns:1fr 1.25fr; }
  .hr-organization-dialog > .dialog-help { padding:15px 18px 0; }
  .hr-organization-dialog > .form { padding:15px 18px 18px; }
  .hr-organization-dialog .hr-directory-editor,
  .hr-organization-dialog .hr-role-mapping-editor { padding:14px; }
  .hr-organization-dialog .hr-directory-head {
    display:grid;
    align-items:start;
  }
  .hr-organization-dialog .hr-directory-actions { width:100%; }
  .hr-organization-dialog .hr-directory-actions button { flex:1 1 180px; }
  .hr-organization-dialog .hr-role-mapping-head {
    display:grid;
    align-items:start;
  }
  .hr-organization-dialog .hr-role-mapping-head .compact-button { width:100%; }
  .hr-organization-dialog .hr-role-mapping-row { grid-template-columns:1fr; }
  .hr-organization-dialog .hr-supervisor-row { grid-template-columns:1fr; }
  .hr-organization-dialog .hr-role-mapping-row > .action-link { grid-column:auto; }
  .hr-organization-dialog .form-footer {
    margin:0 -18px -18px;
    padding:14px 18px;
  }
}

/* Tenant entry picker: keep the dialog content-sized and the choices compact.
   This prevents grid stretching from turning each company into a viewport-tall card. */
.dialog > .dialog-inner.tenant-selection-dialog {
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  overflow:visible;
}
.tenant-selection-dialog > .dialog-head,
.tenant-selection-dialog > .dialog-help,
.tenant-selection-dialog > .form {
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}
.tenant-selection-dialog > .dialog-help {
  margin:0;
  padding:14px 22px 0;
  overflow-wrap:anywhere;
}
.tenant-selection-dialog > .form {
  display:grid;
  grid-template-rows:auto auto auto;
  align-content:start;
  min-height:0;
  height:auto;
  max-height:none;
  padding:16px 22px 22px;
  gap:14px;
}
.tenant-selection-dialog .tenant-selection-list {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-auto-rows:minmax(0,auto);
  align-content:start;
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:0;
  height:auto;
  gap:10px;
  margin:0;
}
.tenant-selection-dialog .tenant-selection-option {
  display:flex !important;
  align-items:center;
  align-self:start;
  width:100%;
  min-width:0;
  min-height:60px;
  height:auto;
  box-sizing:border-box;
  padding:12px 14px;
  overflow:hidden;
}
.tenant-selection-dialog .tenant-selection-option input {
  width:18px;
  height:18px;
  margin:0 10px 0 0;
  flex:0 0 18px;
}
.tenant-selection-dialog .tenant-selection-option > span {
  display:grid;
  min-width:0;
  max-width:100%;
  gap:3px;
}
.tenant-selection-dialog .tenant-selection-option strong,
.tenant-selection-dialog .tenant-selection-option small {
  display:block;
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
}
@media (max-width:760px) {
  .dialog:has(> .dialog-inner.tenant-selection-dialog) {
    width:calc(100vw - 24px) !important;
    max-width:calc(100vw - 24px);
    max-height:calc(100dvh - 24px);
  }
  .tenant-selection-dialog > .dialog-head { padding:16px 18px 14px; }
  .tenant-selection-dialog > .dialog-help { padding:12px 18px 0; }
  .tenant-selection-dialog > .form { padding:14px 18px 18px; }
}

.dialog:has(> .dialog-inner.duplicate-archive-dialog),.dialog:has(> .dialog-inner.archive-result-dialog) { width:min(620px,calc(100vw - 28px)); }
.dialog > .dialog-inner.duplicate-archive-dialog,.dialog > .dialog-inner.archive-result-dialog { width:100%; min-width:0; max-width:100%; }
.duplicate-candidate-list { display:grid; gap:8px; max-height:360px; overflow:auto; margin:14px 0 18px; }
.duplicate-candidate { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; padding:12px; border:1px solid var(--line); border-radius:7px; background:#fbfcfe; cursor:pointer; }
.duplicate-candidate:hover,.duplicate-candidate:has(input:checked) { border-color:#78aaa4; background:#f1f9f7; }
.duplicate-candidate input { accent-color:#287f77; }
.duplicate-candidate-main { display:grid; gap:4px; min-width:0; }
.duplicate-candidate-main strong { color:var(--ink); font-size:14px; }
.duplicate-candidate-main small { color:var(--muted); line-height:1.5; overflow-wrap:anywhere; }
.archive-result-summary { display:grid; gap:7px; padding:16px; border:1px solid #b9d9d3; border-radius:7px; background:#f1f9f7; }
.archive-result-summary strong { color:#174f49; font-size:22px; }
.archive-result-summary span { color:#244a47; font-weight:700; }
.archive-result-summary small { color:#5e716f; line-height:1.6; }
@media (max-width:600px) { .duplicate-candidate { grid-template-columns:auto minmax(0,1fr); }.duplicate-candidate > .status-tag { grid-column:2; justify-self:start; } }

/* Model profile gallery: optional references stay visually secondary to the two identity anchors. */
.model-reference-auxiliary { display:grid; gap:10px; padding-top:2px; }
.model-reference-auxiliary-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.model-reference-auxiliary-head > div { display:grid; gap:4px; }
.model-reference-auxiliary-head strong { color:#344158; font-size:13px; }
.model-reference-auxiliary-head span { color:var(--muted); font-size:11px; line-height:1.45; }
.model-reference-auxiliary-head b { flex:0 0 auto; padding:4px 8px; border-radius:999px; color:#23786b; background:#e6f5f0; font-size:11px; }
.model-reference-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.model-reference-gallery-item { display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:8px; min-width:0; padding:8px; border:1px solid #e2e7ef; border-radius:6px; background:#fbfcfe; }
.model-reference-gallery-item.is-removed { opacity:.55; border-color:#e1a4aa; background:#fff5f5; }
.model-reference-gallery-item img,.model-reference-queue-item img { width:48px; height:58px; object-fit:cover; border-radius:4px; background:#edf1f6; }
.model-reference-gallery-item > div,.model-reference-queue-item > div { display:grid; gap:3px; min-width:0; }
.model-reference-gallery-item strong,.model-reference-queue-item strong { overflow:hidden; color:#344158; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.model-reference-gallery-item small { color:var(--muted); font-size:10px; }
.model-reference-gallery-item .action-link { padding:2px 0; font-size:11px; }
.model-reference-upload { display:flex !important; align-items:center; gap:10px; padding:10px 12px; border:1px dashed #b8c6dc; border-radius:6px; color:#344158; background:#fbfcff; cursor:pointer; }
.model-reference-upload:hover { border-color:#5184ee; background:#f3f7ff; }
.model-reference-upload input { width:16px; height:16px; }
.model-reference-upload span { display:grid; gap:3px; }
.model-reference-upload strong { font-size:12px; }
.model-reference-upload small { color:var(--muted); font-size:11px; }
.model-reference-queue { display:grid; gap:8px; }
.model-reference-queue-item { display:grid; grid-template-columns:48px minmax(0,1fr); gap:8px; align-items:center; padding:8px; border:1px solid #d8e4f2; border-radius:6px; background:#f7faff; }
.model-reference-queue-item label { display:flex; align-items:center; gap:5px; color:var(--muted); font-size:10px; }
.model-reference-queue-item select { min-width:0; padding:3px 5px; border:1px solid #d5e0ef; border-radius:4px; background:#fff; color:#344158; font-size:11px; }
@media (max-width:640px) { .model-reference-gallery { grid-template-columns:1fr; }.model-reference-auxiliary-head { flex-direction:column; }.model-reference-auxiliary-head b { justify-self:start; } }

/* Workspace language menu is an overlay, never an inline row. */
.workspace-language { position:relative; display:inline-flex; align-items:center; flex:0 0 auto; z-index:30; }
.workspace-language-trigger { display:inline-flex; align-items:center; gap:6px; min-height:38px; padding:8px 12px; border:1px solid #cbd6e5; border-radius:8px; background:#fff; color:#344158; font:inherit; white-space:nowrap; cursor:pointer; }
.workspace-language-trigger:hover,.workspace-language-trigger:focus-visible { border-color:#6d95d8; outline:2px solid rgba(64,112,205,.18); outline-offset:1px; }
.workspace-language-menu { position:absolute; top:calc(100% + 6px); right:0; display:grid; min-width:150px; padding:6px; border:1px solid #d5deeb; border-radius:10px; background:#fff; box-shadow:0 12px 28px rgba(30,52,84,.18); }
.workspace-language-menu[hidden] { display:none; }
.workspace-language-menu button { width:100%; padding:9px 12px; border:0; border-radius:6px; background:transparent; color:#344158; text-align:left; font:inherit; cursor:pointer; }
.workspace-language-menu button:hover,.workspace-language-menu button:focus-visible { background:#eef4ff; color:#1f5dcc; outline:none; }
@media (max-width:700px) { .workspace-language-menu { right:auto; left:0; } }

/* END frontend/assets/styles.css */

/* BEGIN frontend/assets/detail-image-overrides.css */
/* Keep the single-product image complete, large, and calm inside the detail dialog. */
.detail-top { grid-template-columns:280px minmax(0,1fr); gap:24px; }
.image-block { width:280px; }
.image-block-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; min-height:38px; }
.image-block-head > div { display:grid; gap:1px; min-width:0; }
.image-block-head strong { color:#1d3030; font-size:14px; line-height:1.35; }
.image-block-head small { color:#6e807d; font-size:11px; line-height:1.35; }
.image-permission-badge { flex:0 0 auto; padding:4px 7px; border:1px solid #b9cfca; border-radius:999px; font-size:11px; line-height:1.1; white-space:nowrap; }
.image-permission-ready { color:#0f766e; background:#e8f6f2; border-color:#abd8cf; }
.image-permission-locked { color:#8b4a56; background:#fff0f2; border-color:#efc5cc; }
.detail-image-drop { width:280px; padding:12px; gap:10px; border:1px solid #d9e1ec; border-radius:10px; background:#fbfcfe; box-shadow:0 8px 22px #24344d0d; }
.detail-image-drop.has-image { border-color:#d9e1ec; background:#fbfcfe; }
.detail-image-drop:hover,.detail-image-drop:focus,.detail-image-drop.drag-over { border-color:#8eb4f6; background:#f8fbff; box-shadow:0 0 0 3px #dce9ff,0 8px 22px #24344d12; }
.detail-image-frame { position:relative; width:256px; height:330px; display:grid; place-items:center; overflow:hidden; border:1px solid #e1e6ee; border-radius:7px; background:#f1f3f7; }
.detail-image-drop img,.detail-image { width:256px; height:330px; object-fit:cover; object-position:center; background:#f1f3f7; border:0; border-radius:6px; }
.image-block > .detail-image-frame { width:280px; height:360px; padding:10px; background:#fbfcfe; box-shadow:0 8px 22px #24344d0d; }
.image-block > .detail-image-frame .detail-image { width:258px; height:338px; object-fit:cover; object-position:center; }
.detail-image-badge { position:absolute; right:8px; bottom:8px; padding:4px 7px; border:1px solid #ffffffaa; border-radius:4px; background:#172033bf; color:#fff; font-size:11px; line-height:1; pointer-events:none; }
.detail-image-drop .image-drop-copy { width:100%; gap:2px; padding:0 2px; text-align:left; }
.detail-image-drop .image-drop-copy strong { color:#263247; font-size:13px; line-height:1.35; white-space:normal; }
.detail-image-drop .image-drop-copy small { color:var(--muted); font-size:11px; line-height:1.4; white-space:normal; }
.image-main-action-row { width:100%; display:flex; align-items:center; gap:8px; padding-top:2px; }
.image-main-action-row .image-main-action { flex:0 0 auto; min-height:34px; padding:0 14px; }
.image-main-action-row > span { color:#6e807d; font-size:11px; line-height:1.35; }
.image-permission-note { display:block; font-size:11px; line-height:1.4; }
.image-block > .image-permission-note { padding:0 2px; }
@media (max-width:760px) {
  .detail-top { grid-template-columns:1fr; gap:16px; }
  .image-block,.detail-image-drop { width:100%; }
  .image-block-head { min-height:0; }
  .detail-image-drop .detail-image-frame { width:100%; height:min(78vw,360px); }
  .detail-image-drop img,.detail-image { width:100%; height:min(78vw,360px); }
  .image-block > .detail-image-frame { width:100%; height:min(84vw,390px); padding:10px; }
  .image-block > .detail-image-frame .detail-image { width:100%; height:100%; }
  .image-main-action-row { align-items:flex-start; flex-direction:column; }
  .image-main-action-row .image-main-action { width:100%; }
}

/* END frontend/assets/detail-image-overrides.css */

/* BEGIN frontend/assets/visual-system.css */
/* 2026-08-29 datatoken-inspired dark visual system
   The current frontend intentionally stays build-free. This layer borrows the
   discipline of mature enterprise UI systems without replacing the existing
   HTML/JavaScript contracts or forcing a framework migration. */
:root {
  --canvas:#f3f6f6;
  --surface:#ffffff;
  --surface-quiet:#f8faf9;
  --surface-tint:#edf6f4;
  --line:#d8e2e0;
  --line-strong:#b9cfca;
  --ink:#1d3030;
  --ink-soft:#3e5654;
  --muted:#6e807d;
  --muted-light:#96a6a3;
  --primary:#0f766e;
  --primary-strong:#0a5b55;
  --primary-soft:#dff1ed;
  --blue:#2563eb;
  --blue-soft:#eaf1ff;
  --warm:#b97927;
  --warm-soft:#fff4df;
  --danger:#b93c50;
  --danger-soft:#fff0f2;
  --sidebar:#142825;
  --sidebar-2:#19332f;
  --sidebar-ink:#e4f0ee;
  --sidebar-muted:#9bb5b0;
  --radius:8px;
  --radius-sm:6px;
  --shadow-1:0 1px 2px rgba(20,50,47,.04),0 8px 22px rgba(20,50,47,.045);
}

html { background:var(--canvas); }
body {
  min-width:320px;
  color:var(--ink);
  background:var(--canvas);
  font-family:"Avenir Next","SF Pro Display","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:14px;
  line-height:1.5;
}
button,input,select,textarea { font:inherit; }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible {
  outline:3px solid rgba(37,99,235,.23);
  outline-offset:2px;
}
::selection { color:#123f3a; background:#cfe9e4; }

/* Shell: a quiet instrument panel with an explicit navigation rail. */
.app-shell { grid-template-columns:248px minmax(0,1fr); background:var(--canvas); }
.sidebar {
  z-index:4;
  padding:20px 14px 15px;
  color:var(--sidebar-ink);
  background:var(--sidebar);
  border-right:1px solid #23433e;
  box-shadow:10px 0 30px rgba(16,43,39,.12);
}
.brand {
  min-height:64px;
  padding:2px 8px 16px;
  background:transparent;
  border:0;
  border-bottom:1px solid rgba(211,235,230,.16);
  border-radius:0;
  box-shadow:none;
}
.brand-mark {
  width:42px;
  height:42px;
  flex-basis:42px;
  border:1px solid #8ec7bd;
  border-radius:10px;
  background:#dff1ed;
  box-shadow:none;
}
.brand-mark::before { border-color:#147a70; }
.brand-mark::after { background:#147a70; }
.brand-copy strong { color:#eff8f6; font-size:14px; letter-spacing:.01em; }
.brand-copy small { color:#9eb9b4; }
.nav { gap:7px; margin-top:18px; padding-right:2px; scrollbar-color:#4d756e #1a3430; }
.nav::-webkit-scrollbar-track { background:#1a3430; }
.nav::-webkit-scrollbar-thumb { background:#4d756e; border-radius:8px; }
.nav-group { gap:4px; }
.nav-group-trigger {
  min-height:32px;
  padding:0 11px;
  color:var(--sidebar-muted);
  border-radius:7px;
  font-size:11px;
  font-weight:760;
  letter-spacing:.06em;
}
.nav-group-trigger span,.nav-group-trigger i { color:#7fa49d; }
.nav-group-trigger:hover { color:#fff; background:var(--sidebar-2); }
.nav-group-menu { margin-left:7px; padding-left:9px; border-left-color:rgba(145,193,184,.25); }
.nav-item {
  min-height:39px;
  padding:0 12px;
  color:#bad0cb;
  border:1px solid transparent;
  border-radius:7px;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
.nav-item span { color:#83a9a1; }
.nav-item:hover { color:#fff; background:var(--sidebar-2); border-color:rgba(145,193,184,.2); transform:translateX(1px); }
.nav-item.active {
  color:#fff;
  background:#1b776e;
  border-color:#3a9b90;
  box-shadow:inset 3px 0 0 #a4ded4,0 5px 14px rgba(4,35,31,.18);
}
.nav-item.active span { color:#d1f2eb; }
.nav-group-menu .nav-item.active { background:#1d665f; box-shadow:inset 3px 0 0 #9bd6cc; }
.nav-dashboard-entry { color:#d3e7e3; background:transparent; border-color:rgba(145,193,184,.18); }
.nav-dashboard-entry:hover,.nav-dashboard-entry.active { color:#fff; background:#1b776e; }
.nav-item b { color:#fff; background:#c23d52; }
.sidebar-footer { color:#9bb5b0; border-top-color:rgba(211,235,230,.15); }
.online-dot { background:#70d1a1; }

.workspace,.page { background:var(--canvas); }
.topbar {
  height:76px;
  padding:0 34px;
  background:rgba(255,255,255,.97);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 0 rgba(20,50,47,.03);
}
.topbar h1 { color:var(--ink); font-size:20px; font-weight:760; letter-spacing:-.02em; }
.topbar > div:first-child::before { color:#81928f; }
.top-actions { gap:8px; }
.search { width:300px; height:40px; border-color:var(--line); border-radius:var(--radius-sm); background:var(--surface-quiet); }
.search:focus-within { border-color:#74a9a1; box-shadow:0 0 0 3px #e0f0ed; background:#fff; }
.top-actions select,.user-menu,.icon-button,.secondary {
  border-color:var(--line);
  border-radius:var(--radius-sm);
  color:var(--ink-soft);
  background:#fff;
}
.icon-button:hover,.secondary:hover { color:var(--primary-strong); border-color:#9dc4bd; background:#f7fbfa; }
.user-menu:hover { border-color:#9dc4bd; background:#f7fbfa; }
.workspace-tabs { min-height:50px; padding:8px 34px; background:#eef4f2; border-bottom-color:var(--line); }
.workspace-tab { min-height:33px; border-color:#cdded9; border-radius:var(--radius-sm); }
.workspace-tab.active { color:var(--primary-strong); border-color:#6eaea4; background:var(--primary-soft); box-shadow:0 2px 8px rgba(15,118,110,.1); }
.workspace-tab-close { border-left-color:#d5e3e0; }

.page { max-width:1760px; padding:30px 34px 56px; }
.toolbar { margin-bottom:20px; }
.toolbar h2 { color:var(--ink); font-size:22px; letter-spacing:-.025em; }
.toolbar p,.toolbar-note { max-width:70ch; color:var(--muted); }
.section-heading { margin:24px 0 11px; }
.section-heading .section-title,.section-title { color:var(--ink); font-size:16px; font-weight:760; }

.panel,.metric,.metric-card,.summary-card,.role-card,.schedule-kpi,.operation-connector-card {
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  box-shadow:var(--shadow-1);
}
.panel-head { min-height:58px; padding:15px 18px; border-bottom-color:#e5edeb; }
.panel-head h3 { color:var(--ink); font-size:14px; font-weight:760; }
.panel-head a,.action-link,a { color:var(--primary); }
.panel-head a:hover,.action-link:hover,a:hover { color:var(--primary-strong); }
.primary,.auth-submit {
  min-height:36px;
  padding:0 14px;
  color:#fff;
  background:var(--primary);
  border:1px solid var(--primary);
  border-radius:var(--radius-sm);
  box-shadow:0 4px 10px rgba(15,118,110,.13);
  transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.primary:hover,.auth-submit:hover { color:#fff; background:var(--primary-strong); border-color:var(--primary-strong); box-shadow:0 6px 14px rgba(15,118,110,.18); transform:translateY(-1px); }
.primary:active,.auth-submit:active { transform:translateY(0); }
.secondary { min-height:34px; padding:0 12px; }
.danger { color:var(--danger); }
.filter-chip { min-height:32px; border-color:var(--line); border-radius:var(--radius-sm); color:var(--ink-soft); }
.filter-chip:hover { border-color:#9dc4bd; background:#f7fbfa; }
.filter-chip.selected { color:var(--primary-strong); border-color:#8dbeb6; background:var(--primary-soft); }

.metrics,.dashboard-kpi-grid,.dashboard-sales-grid,.dashboard-module-grid,.schedule-kpis { gap:12px; }
.metric,.metric-card,.dashboard-kpi-card { min-height:112px; padding:15px 16px; border-radius:var(--radius); box-shadow:var(--shadow-1); }
.metric-label { color:#7b8d8a; font-size:11px; letter-spacing:.075em; text-transform:uppercase; }
.metric-value { margin-top:8px; color:var(--ink); font-size:29px; font-variant-numeric:tabular-nums; }
.metric-note { color:var(--muted); font-size:11px; }
.metric:hover,.metric-card:hover,.summary-card:hover { border-color:#aacac3; box-shadow:0 10px 26px rgba(20,76,69,.08); }
.dashboard-kpi-card:first-child { border-color:#9fcfc7; background:#eff9f6; }
.dashboard-kpi-card:first-child .dashboard-kpi-value { color:var(--primary-strong); }
.dashboard-kpi-value,.dashboard-sales-card > strong,.number { font-variant-numeric:tabular-nums; }

.product-table,.data-table { border-collapse:separate; border-spacing:0; }
.product-table th,.data-table th { padding:11px 14px; color:#647773; background:#eef4f2; border-bottom:1px solid var(--line-strong); font-size:11px; letter-spacing:.06em; text-transform:uppercase; }
.product-table td,.data-table td { padding:12px 14px; border-bottom-color:#e8efed; }
.product-table tbody tr:hover td,.data-table tbody tr:hover td { background:#f5faf8; }
.style-code { color:var(--primary-strong); }
.tag.blue { color:#2356b8; background:var(--blue-soft); }
.tag.green { color:#17704b; background:#e8f7ef; }
.tag.orange { color:#9a5c15; background:var(--warm-soft); }
.tag.red { color:#ad3046; background:var(--danger-soft); }
.tag.gray { color:#61716f; background:#edf1f0; }
.status-tag,.chip,.effect-status { border-radius:999px; }

.work-card,.schedule-card,.schedule-product-card { border-color:var(--line); border-radius:var(--radius); box-shadow:var(--shadow-1); }
.work-card { min-height:150px; padding:18px 19px; }
.work-card::before { width:36px; height:2px; margin-bottom:14px; background:var(--primary); }
.work-card h3 { color:var(--ink); font-size:15px; }
.work-card .number { color:var(--ink); font-size:30px; }
.work-filter-bar { padding:13px 15px; border-color:var(--line); border-radius:var(--radius); box-shadow:var(--shadow-1); }
.dashboard-hero { border-radius:var(--radius); box-shadow:var(--shadow-1); }
.dashboard-intelligence-card,.dashboard-sales-card,.dashboard-module-card { border-color:var(--line); border-radius:var(--radius-sm); box-shadow:none; }
.dashboard-chart-empty { background:#f8fbfa; }
.risk-item,.attention-item { border-radius:var(--radius-sm); }

.detail-top { gap:20px; padding-bottom:22px; border-bottom-color:var(--line); }
.detail-title { color:var(--ink); font-size:25px; letter-spacing:-.025em; }
.detail-meta { color:var(--muted); }
.detail-focus-section { margin-top:20px; padding:18px; border-color:var(--line); border-radius:var(--radius); box-shadow:var(--shadow-1); }
.product-detail-shell .details { scroll-behavior:smooth; }
.detail-actions-note { display:inline-flex; align-items:center; min-height:32px; color:var(--muted); font-size:12px; }
.detail-module-nav {
  position:sticky;
  top:0;
  z-index:3;
  display:flex;
  gap:6px;
  overflow-x:auto;
  margin:0 -22px 18px;
  padding:10px 22px;
  border-top:1px solid #edf3f1;
  border-bottom:1px solid var(--line);
  background:rgba(247,250,249,.97);
  scrollbar-width:thin;
}
.detail-module-nav-item {
  flex:0 0 auto;
  min-height:32px;
  padding:0 11px;
  color:var(--ink-soft);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:#fff;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
  cursor:pointer;
}
.detail-module-nav-item:hover { color:var(--primary-strong); border-color:#9dc4bd; background:#f7fbfa; }
.detail-module-nav-item.is-active { color:var(--primary-strong); border-color:#6eaea4; background:var(--primary-soft); box-shadow:inset 0 -2px 0 var(--primary); }
.detail-module {
  margin-top:16px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  box-shadow:var(--shadow-1);
  scroll-margin-top:66px;
}
.detail-module-head {
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:14px 16px;
  border-bottom:1px solid #e5edeb;
  background:#f7faf9;
}
.detail-module-index {
  display:grid;
  flex:0 0 27px;
  place-items:center;
  width:27px;
  height:27px;
  color:var(--primary-strong);
  border-radius:50%;
  background:var(--primary-soft);
  font-size:10px;
  font-weight:800;
  letter-spacing:.03em;
}
.detail-module-head h3 { margin:0; color:var(--ink); font-size:15px; font-weight:780; }
.detail-module-head p { margin:3px 0 0; color:var(--muted); font-size:11px; line-height:1.55; }
.detail-module-content { padding:0 16px 18px; }
.detail-module-content > section { margin-top:18px; padding-top:16px; border-top:1px solid #edf2f1; }
.detail-module-content > section:first-child { margin-top:0; padding-top:0; border-top:0; }
.detail-module-content > .detail-focus-section { margin-top:18px; padding:18px 0 0; border-right:0; border-bottom:0; border-left:0; border-radius:0; box-shadow:none; }
.detail-module-actions { margin-top:16px; padding:11px 12px 12px; border:1px solid #cfe2de; border-radius:var(--radius-sm); background:#f4faf8; }
.detail-module-actions-head { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:8px; }
.detail-module-actions-head strong { color:var(--ink-soft); font-size:12px; }
.detail-module-actions-head span { color:var(--muted); font-size:11px; text-align:right; }
.detail-module-action-list { display:flex; flex-wrap:wrap; gap:7px; }
.detail-module-action-list .action-button { min-height:34px; }
.detail-module-contract-actions { background:#fffaf0; border-color:#eadfb9; }
.detail-module-contract-actions .contract-actions { display:flex; flex-wrap:wrap; align-items:center; gap:7px; }
.detail-module-contract-actions .contract-status-wrap { display:inline-flex; }
.activity-panel { top:76px; height:calc(100vh - 76px); width:360px; padding:20px; border-left-color:var(--line); box-shadow:-14px 0 30px rgba(20,50,47,.12); }
.activity-heading { color:var(--ink); }
.activity-panel .feed-item { border-bottom-color:#e8efed; }

.dialog { border:1px solid var(--line); border-radius:10px; box-shadow:0 24px 70px rgba(18,49,45,.18); }
.dialog-inner { border-radius:10px; }
.dialog-head { padding:20px 22px 16px; border-bottom:1px solid #e6eeec; }
.dialog-head h2 { color:var(--ink); font-size:20px; }
.form { padding:18px 22px 22px; gap:16px; }
.form-grid { gap:13px 15px; }
.form-footer { margin:0 -22px -22px; padding:14px 22px; border-top-color:#e4ecea; background:#f7faf9; }
input,select,textarea { border-color:#cddbd8; border-radius:var(--radius-sm); }
input:hover,select:hover,textarea:hover { border-color:#97bcb5; }
input:focus,select:focus,textarea:focus { border-color:#4d9a90; box-shadow:0 0 0 3px #e2f1ee; }
.empty-state { min-height:170px; border-color:#c4d9d4; border-radius:var(--radius); background:#fbfdfc; }
.empty-state strong { color:var(--ink-soft); }
.permission-empty { border-color:#c4d9d4; border-radius:var(--radius); background:#f8fbfa; }

/* Auth inherits the same system but keeps a clear branded dark panel. */
.auth-workspace { background:#edf3f2; }
.auth-shell { border-color:#d2e1de; border-radius:12px; box-shadow:0 24px 70px rgba(18,49,45,.16); }
.auth-brand-panel {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#142825;
}
.auth-brand-panel::before,
.auth-brand-panel::after {
  display:none;
}
.auth-brand-panel h1 {
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  text-wrap:balance;
  letter-spacing:0;
}
.auth-company {
  max-width:34ch;
  line-height:1.5;
}
.auth-brand-note {
  max-width:30ch;
  line-height:1.7;
}
.auth-brand-mark { border-color:#8ec7bd; border-radius:11px; background:#dff1ed; box-shadow:none; }
.auth-panel { background:#fff; }

@media (max-width:1180px) {
  .app-shell { grid-template-columns:232px minmax(0,1fr); }
  .page { padding-left:26px; padding-right:26px; }
  .topbar,.workspace-tabs { padding-left:26px; padding-right:26px; }
  .search { width:250px; }
}
@media (max-width:760px) {
  .sidebar { padding:12px; background:var(--sidebar); box-shadow:0 8px 20px rgba(16,43,39,.14); }
  .brand { min-height:56px; padding:2px 6px 12px; }
  .nav { max-height:268px; margin-top:14px; gap:8px; }
  .nav-item { min-height:38px; }
  .topbar { min-height:72px; height:auto; padding:12px 16px; }
  .topbar > div:first-child::before { display:none; }
  .top-actions { flex-wrap:wrap; justify-content:flex-end; }
  .search { order:3; width:100%; }
  .workspace-tabs { padding:7px 16px; }
  .page { padding:20px 16px 38px; }
  .auth-brand-panel h1 { max-width:24ch; }
  .toolbar { align-items:flex-start; gap:13px; flex-direction:column; }
  .toolbar .primary { width:100%; }
  .metrics,.dashboard-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  .metric,.metric-card,.dashboard-kpi-card { min-height:96px; padding:12px; }
  .metric-value { font-size:25px; }
  .work-cards { grid-template-columns:1fr; }
  .activity-panel { top:0; height:100dvh; width:min(360px,100vw); }
  .dialog { border-radius:8px; }
  .dialog-head { padding:17px 18px 14px; }
  .form { padding:16px 18px 18px; }
  .form-footer { margin:0 -18px -18px; padding:13px 18px; }
  .detail-module-nav { margin:0 -18px 15px; padding:9px 18px; }
  .detail-module { margin-top:13px; }
  .detail-module-content { padding:0 12px 14px; }
  .detail-module-head { padding:12px; }
  .detail-module-head p { max-width:34ch; }
  .detail-module-actions-head { display:grid; gap:2px; }
  .detail-module-actions-head span { text-align:left; }
  .detail-module-action-list { display:grid; grid-template-columns:1fr; }
  .detail-module-action-list .action-button { width:100%; }
}

/* 2026-08-30 workflow-role-ui=20260830
   Keep workflow progress cards readable when the surrounding workbench is
   dark. The card intentionally uses a quiet light surface with dark copy so
   stage, owner and next-step text remain legible at a glance. */
.pattern-progress {
  color:#234047;
  background:#f5faf9;
  border-color:#b8d8d2;
}
.pattern-progress-head,
.pattern-progress-meta,
.pattern-progress-next { color:#234047; }
.pattern-progress-head strong { color:#1d3b42; }
.pattern-progress-meta { color:#49676c; }
.pattern-progress-next span { color:#0f766e; }
.pattern-progress-track { background:#c6dcd8; }
.pattern-progress-track i { background:linear-gradient(90deg,#0f766e,#2f9f95); }
.pattern-progress-mode { color:#0f766e; background:#dff2ee; border-color:#b8d8d2; }
.pattern-progress-mode.external { color:#9a5c15; background:#fff1d6; border-color:#e7c98e; }

.role-dialog .role-banner span { max-width:70ch; }
.role-dialog > .form { gap:18px; }
.role-dialog .permission-groups { display:grid; gap:14px; }
.role-dialog .permission-group { background:#17263b; border-color:#304763; }
.role-dialog .permission-option { min-height:58px; }
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; transition-duration:0s !important; animation-duration:0s !important; }
}

/* Dark operational theme: deep navy surfaces with restrained teal actions. */
:root {
  color-scheme:dark;
  --canvas:#020617;
  --surface:#111827;
  --surface-quiet:#1e293b;
  --surface-tint:#16283a;
  --line:#334155;
  --line-strong:#475569;
  --ink:#f1f5f9;
  --ink-soft:#cbd5e1;
  --muted:#94a3b8;
  --muted-light:#64748b;
  --primary:#54d5c4;
  --primary-strong:#2dd4bf;
  --primary-soft:#123b43;
  --blue:#60a5fa;
  --blue-soft:#172f52;
  --warm:#f0b35b;
  --warm-soft:#3b2d18;
  --danger:#fb7185;
  --danger-soft:#421d2b;
  --sidebar:#0f172a;
  --sidebar-2:#162235;
  --sidebar-ink:#f1f5f9;
  --sidebar-muted:#94a3b8;
  --shadow-1:0 1px 2px rgba(0,0,0,.22),0 12px 30px rgba(0,0,0,.16);
}

html,body { background:var(--canvas); }
body { color:var(--ink); }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible { outline-color:rgba(94,234,212,.5); }
::selection { color:#ccfbf1; background:#134e4a; }

.sidebar { border-right-color:#1e293b; box-shadow:10px 0 30px rgba(0,0,0,.18); }
.brand { border-bottom-color:rgba(148,163,184,.18); }
.brand-mark { border-color:#4fd1c5; background:#123b43; }
.brand-mark::before { border-color:#54d5c4; }
.brand-mark::after { background:#54d5c4; }
.brand-copy strong { color:#f8fafc; }
.brand-copy small,.sidebar-footer { color:#94a3b8; }
.nav { scrollbar-color:#475569 #172033; }
.nav::-webkit-scrollbar-track { background:#172033; }
.nav::-webkit-scrollbar-thumb { background:#475569; }
.nav-group-trigger { color:#94a3b8; }
.nav-group-trigger span,.nav-group-trigger i { color:#64748b; }
.nav-group-trigger:hover,.nav-item:hover { color:#f8fafc; background:var(--sidebar-2); border-color:rgba(96,165,250,.18); }
.nav-group-menu { border-left-color:rgba(100,116,139,.34); }
.nav-item { color:#cbd5e1; }
.nav-item span { color:#94a3b8; }
.nav-item.active,.nav-dashboard-entry:hover,.nav-dashboard-entry.active { color:#ecfeff; background:#164e63; border-color:#287d86; box-shadow:inset 3px 0 0 #5eead4,0 5px 14px rgba(0,0,0,.2); }
.nav-group-menu .nav-item.active { background:#123b43; box-shadow:inset 3px 0 0 #54d5c4; }
.nav-item.active span { color:#99f6e4; }
.nav-dashboard-entry { color:#cbd5e1; border-color:rgba(100,116,139,.22); }
.nav-item b { background:#be123c; }
.online-dot { background:#6ee7b7; }
.sidebar-footer { border-top-color:rgba(148,163,184,.16); }

/* Sidebar navigation uses neutral whites for long-session readability. The
   active item keeps teal only as a positional cue, not as body copy color. */
.nav-group-trigger { color:#e2e8f0; }
.nav-group-trigger span,.nav-group-trigger i { color:#a9b8cb; }
.nav-item { color:#f1f5f9; }
.nav-item span { color:#cbd5e1; }
.nav-item:hover,.nav-group-trigger:hover { color:#ffffff; }
.nav-item.active,.nav-dashboard-entry:hover,.nav-dashboard-entry.active { color:#f8fafc; }
.nav-item.active span { color:#99f6e4; }
.nav-group-menu .nav-item.active { color:#f8fafc; }
.nav-group-menu .nav-item { color:#f1f5f9; }
.nav-group-menu .nav-item span { color:#cbd5e1; }
.nav-group-menu .nav-item:hover { color:#ffffff; }

.topbar { background:rgba(15,23,42,.9); border-bottom-color:#1e293b; box-shadow:0 1px 0 rgba(0,0,0,.16); }
.topbar > div:first-child::before { color:#64748b; }
.search,.top-actions select,.user-menu,.icon-button,.secondary { color:var(--ink-soft); background:#1e293b; border-color:#475569; }
.search input { color:var(--ink); }
.search input::placeholder { color:#64748b; }
.search:focus-within { border-color:#2dd4bf; box-shadow:0 0 0 3px rgba(45,212,191,.16); background:#1e293b; }
.icon-button:hover,.secondary:hover,.user-menu:hover { color:#ccfbf1; border-color:#5eead4; background:#243449; }
.workspace-tabs { background:#0f1a2c; border-bottom-color:#334155; }
.workspace-tab { color:#cbd5e1; border-color:#475569; background:#172235; }
.workspace-tab.active { color:#99f6e4; border-color:#2d8b8a; background:#123b43; box-shadow:0 2px 8px rgba(45,212,191,.12); }
.workspace-tab-close { border-left-color:#334155; }

.panel,.metric,.metric-card,.summary-card,.role-card,.schedule-kpi,.operation-connector-card,.detail-module { background:var(--surface); border-color:var(--line); box-shadow:var(--shadow-1); }
.panel-head { border-bottom-color:#263548; }
.panel-head a,.action-link,a { color:#67e8f9; }
.panel-head a:hover,.action-link:hover,a:hover { color:#a5f3fc; }
.primary,.auth-submit { color:#042f2e; background:#5eead4; border-color:#5eead4; box-shadow:0 4px 10px rgba(45,212,191,.16); }
.primary:hover,.auth-submit:hover { color:#022c2b; background:#99f6e4; border-color:#99f6e4; box-shadow:0 6px 14px rgba(45,212,191,.2); }
.filter-chip { color:#cbd5e1; background:#172235; }
.filter-chip:hover { border-color:#5eead4; background:#243449; }
.filter-chip.selected { color:#99f6e4; border-color:#2d8b8a; background:#123b43; }
.metric-label { color:#94a3b8; }
.metric:hover,.metric-card:hover,.summary-card:hover { border-color:#2d8b8a; box-shadow:0 10px 26px rgba(0,0,0,.24); }
.dashboard-kpi-card:first-child { border-color:#2d8b8a; background:#123b43; }
.dashboard-kpi-card:first-child .dashboard-kpi-value { color:#99f6e4; }

.product-table th,.data-table th { color:#cbd5e1; background:#1e293b; border-bottom-color:#475569; }
.product-table td,.data-table td { border-bottom-color:#263548; }
.product-table tbody tr:hover td,.data-table tbody tr:hover td { background:#172235; }
.style-code { color:#67e8f9; }
.tag.blue { color:#bfdbfe; background:#172f52; }
.tag.green { color:#bbf7d0; background:#123b2d; }
.tag.orange { color:#fde68a; background:#3b2d18; }
.tag.red { color:#fecdd3; background:#421d2b; }
.tag.gray { color:#cbd5e1; background:#273449; }
.work-card::before { background:#5eead4; }
.dashboard-chart-empty { background:#172235; }

.detail-module-nav { border-top-color:#1e293b; border-bottom-color:#334155; background:rgba(15,23,42,.94); }
.detail-module-nav-item { color:#cbd5e1; border-color:#475569; background:#172235; }
.detail-module-nav-item:hover { color:#99f6e4; border-color:#5eead4; background:#243449; }
.detail-module-nav-item.is-active { color:#99f6e4; border-color:#2d8b8a; background:#123b43; box-shadow:inset 0 -2px 0 #5eead4; }
.detail-module-head { border-bottom-color:#263548; background:#172235; }
.detail-module-index { color:#99f6e4; background:#123b43; }
.detail-module-content > section { border-top-color:#263548; }
.detail-module-actions { border-color:#245c62; background:#102f38; }
.detail-module-contract-actions { background:#322918; border-color:#6b5124; }

.dialog { background:#111827; border-color:#475569; box-shadow:0 24px 70px rgba(0,0,0,.45); }
.dialog-head { border-bottom-color:#263548; }
.form-footer { border-top-color:#263548; background:#172235; }
input,select,textarea { color:var(--ink); background:#1e293b; border-color:#475569; }
input:hover,select:hover,textarea:hover { border-color:#64748b; }
input:focus,select:focus,textarea:focus { border-color:#2dd4bf; box-shadow:0 0 0 3px rgba(45,212,191,.16); }
input::placeholder,textarea::placeholder { color:#64748b; }
.empty-state,.permission-empty { border-color:#475569; background:#172235; }
.auth-workspace { background:#020617; }
.auth-workspace #page { background:#020617; }
.auth-shell { border-color:#334155; box-shadow:0 24px 70px rgba(0,0,0,.4); }
.auth-shell { background:#111827; }
.auth-brand-panel { background:#0f172a; }
.auth-brand-mark { border-color:#4fd1c5; background:#123b43; }
.auth-panel { background:#111827; }
.auth-panel h2 { color:#f1f5f9; }
.auth-kicker { color:#5eead4; }
.auth-intro,.auth-copyright { color:#94a3b8; }
.auth-form label { color:#cbd5e1; }
.auth-form input { color:#f1f5f9; background:#1e293b; border-color:#475569; }
.auth-form input:focus { border-color:#2dd4bf; outline:0; box-shadow:0 0 0 3px rgba(45,212,191,.16); }
.auth-method-tab.active { color:#99f6e4; background:#123b43; border-color:#2d8b8a; }
.auth-method-tab { color:#94a3b8; border-color:#334155; background:#172235; }
.password-toggle { color:#94a3b8; }
.password-toggle:hover,.auth-register-link { color:#67e8f9; }

/* Legacy surface selectors are normalized here so older modules inherit the theme. */
.filter-chip,.secondary,.top-actions select,.icon-button,.user-menu,
.work-filter-bar,.order-material-card,.order-lines-card,.table-wrap,
.schedule-card,.schedule-product,.schedule-product-picker,.schedule-product-option,
.attachment-card,.hr-directory-editor,.hr-role-mapping-editor,
.hr-role-mapping-row,.hr-import-preview,.hr-import-summary span,
.hr-organization-quick-person,.hr-organization-quick-role,
.hr-department-card,.hr-performance-grid article,.finance-invoice-preview,
.styling-editor-section,.model-scene-reference,.catalog-model-profile-row,
.model-image-pose-card,.model-image-source-preview,.model-image-output-preview,
.model-reference-slot,.consent-check { background:#111827; border-color:#334155; color:#cbd5e1; }
.flow,.feed li,.dashboard-module-head,.dashboard-module-row,.attention-item,.risk-item { background:#111827; }
.dashboard-module-head { color:#94a3b8; border-bottom-color:#334155; }
.dashboard-module-row,.feed li,.risk-item,.attention-item { border-bottom-color:#263548; }
.dashboard-module-row:hover,.attention-item:hover,.risk-item:hover { background:#172235; }
.flow-step { color:#94a3b8; }
.flow-step:not(:last-child)::after { background:#475569; }
.dashboard-toolbar label,.work-filter-field,.risk-owner { color:#cbd5e1; }
.dashboard-toolbar select,.work-filter-field input,.work-filter-field select,
.order-product-search,.schedule-toolbar input,.schedule-toolbar select,
.schedule-product-search input { color:#f1f5f9; background:#1e293b; border-color:#475569; }
.order-product-results,.order-product-result { background:#111827; border-color:#475569; }
.order-product-result:hover,.order-product-result:focus-visible { background:#172235; }
.order-product-result strong,.style-code { color:#67e8f9; }
.compact-order-lines,.material-grid,.risk-owner { color:#cbd5e1; }
.dashboard-module-name { color:#f1f5f9; }
.module-progress-bar { background:#334155; }
.risk-count { background:#1e293b; border-color:#475569; color:#94a3b8; }
.risk-level { background:#3b2d18; color:#fde68a; }
.risk-level.overdue { background:#421d2b; color:#fecdd3; }
.role-banner,.schedule-hero,.styling-output-section,.privacy-notice,
.hr-hero,.hr-import-dropzone,.model-scene-reference .image-drop { background:#16283a; border-color:#334155; color:#cbd5e1; }
.role-banner strong,.role-banner span { color:#cbd5e1; }
.schedule-period span,.schedule-selected-chip,.styling-section-head>strong { color:#99f6e4; background:#123b43; border-color:#2d8b8a; }
.schedule-card-note,.schedule-communication-notes { background:#172f52; color:#bfdbfe; }
.inline-warning,.provider-notice { background:#3b2d18; border-color:#6b5124; color:#fde68a; }
.inline-success { background:#123b2d; border-color:#246b50; color:#bbf7d0; }
.dialog-inner { background:#111827; }
.dialog::backdrop { background:rgba(2,6,23,.78); }
.form input,.form select,.form textarea,.dialog input,.dialog select,.dialog textarea { color:#f1f5f9; background:#1e293b; border-color:#475569; }
.form label { color:#cbd5e1; }
.form-footer { color:#cbd5e1; }

/* AI composer contrast contract: every control owns its foreground and
   placeholder colors instead of inheriting an unrelated page surface. */
.ai-chat-panel,
.knowledge-page {
  --control-bg:#1e293b;
  --control-fg:#f8fafc;
  --control-placeholder:#94a3b8;
  --control-muted:#94a3b8;
  --control-border:#475569;
  --control-focus:#2dd4bf;
  color-scheme:dark;
}
.surface-light,
[data-surface="light"] {
  --control-bg:#ffffff;
  --control-fg:#1f2937;
  --control-placeholder:#64748b;
  --control-muted:#64748b;
  --control-border:#cbd5e1;
  --control-focus:#0f766e;
  color-scheme:light;
}
.surface-dark,
[data-surface="dark"] {
  --control-bg:#1e293b;
  --control-fg:#f8fafc;
  --control-placeholder:#94a3b8;
  --control-muted:#94a3b8;
  --control-border:#475569;
  --control-focus:#2dd4bf;
  color-scheme:dark;
}
.ai-chat-panel { background:#111827; border-color:#334155; color:#f1f5f9; }
.ai-chat-hero { background:#16283a; border-color:#334155; }
.ai-chat-hero h2 { color:#f1f5f9; }
.ai-chat-hero p,.ai-live-status,.ai-chat-session-bar span,.ai-chat-footnote { color:#94a3b8; }
.ai-chat-session-bar strong { color:#f1f5f9; }
.ai-chat-stage { background:#0f172a; }
.ai-chat-stage.has-transcript { background:#0f172a; }
.ai-chat-welcome h3 { color:#f1f5f9; }
.ai-chat-welcome p { color:#94a3b8; }
.ai-chat-quick-prompt { color:#cbd5e1; background:#16283a; border-color:#334155; }
.ai-chat-quick-prompt:hover,.ai-chat-quick-prompt:focus-visible { color:#ccfbf1; background:#123b43; border-color:#2d8b8a; }
.ai-chat-question p { color:#e2e8f0; }
.ai-chat-composer { color:var(--control-fg); }
.ai-chat-composer textarea,
.knowledge-ask-form textarea,
.ai-chat-panel textarea {
  color:var(--control-fg);
  caret-color:var(--control-focus);
  background:var(--control-bg);
  border-color:var(--control-border);
}
.ai-chat-composer textarea::placeholder,
.knowledge-ask-form textarea::placeholder { color:var(--control-placeholder); opacity:1; }
.ai-chat-composer textarea:hover,
.knowledge-ask-form textarea:hover { border-color:#64748b; }
.ai-chat-composer textarea:focus,
.knowledge-ask-form textarea:focus { border-color:var(--control-focus); box-shadow:0 0 0 3px rgba(45,212,191,.18); }
.ai-assistant-mode { background:#172235; border-color:#334155; }
.ai-assistant-mode button { color:#94a3b8; }
.ai-assistant-mode button.active { color:#042f2e; background:#5eead4; }
.ai-image-reference-picker {
  color:var(--control-fg);
  background:#16283a;
  border-color:#2d8b8a;
}
.ai-image-reference-picker > span { color:#042f2e; background:#5eead4; }
.ai-image-reference-picker strong { color:#f1f5f9; }
.ai-image-reference-picker small { color:#94a3b8; }
.ai-image-reference-clear { color:#94a3b8; }
.ai-image-reference-clear:hover,.ai-image-reference-clear:focus-visible { color:#fecdd3; background:#3a1f2a; }
.ai-chat-turn > span { color:#67e8f9; }
.ai-chat-turn > p { color:#e2e8f0; background:#172235; border-color:#334155; box-shadow:none; }
.ai-chat-turn.user > p { color:#ccfbf1; background:#123b43; border-color:#245c62; }
.ai-chat-turn-meta { color:#94a3b8; }
.ai-chat-turn-meta time { color:#64748b; }
.knowledge-answer-copy { color:#e2e8f0; background:#172235; border-color:#334155; box-shadow:none; }
.knowledge-answer-copy p { color:#e2e8f0; }
.ai-chat-image-wrap { background:#172235; border-color:#334155; }
.ai-chat-image-pending { color:#cbd5e1; background:#16283a; border-color:#2d8b8a; }
.ai-chat-file-pending { color:#cbd5e1; background:#16283a; border-color:#3b82a0; }
.ai-chat-file-card { background:#172235; border-color:#334155; }
.ai-chat-file-card strong { color:#e2e8f0; }
.ai-chat-file-card small { color:#94a3b8; }
.ai-chat-file-card .compact-button { color:#ccfbf1; background:#123b43; border-color:#245c62; }
.ai-chat-composer small { color:#94a3b8; }

@media (max-width:760px) {
  .sidebar { background:var(--sidebar); box-shadow:0 8px 20px rgba(0,0,0,.24); }
  .topbar { background:rgba(15,23,42,.96); }
}

/* 2026-08-29 motion and layout stability pass.
   Refreshes keep the user's reading position; only explicit module changes
   animate. Dense tables keep readable column contracts instead of collapsing
   names into one-character vertical stacks. */
html {
  scroll-behavior:auto;
  scrollbar-gutter:stable;
}
body { overflow-x:hidden; }
.view-panel { min-width:0; animation:none; }
.view-panel.view-panel-enter { animation:view-panel-enter .2s var(--motion-ease) both; }
.nav-group-menu { transition:none; }
.nav-group.is-collapsed .nav-group-menu { transform:none; }
.nav-group:not(.is-collapsed) .nav-group-menu { animation:none; }
.table-wrap {
  max-width:100%;
  overflow-x:auto;
  overflow-y:visible;
  overscroll-behavior-x:contain;
  scrollbar-gutter:stable;
}
.product-table {
  width:max-content;
  min-width:1220px;
  table-layout:auto;
}
.product-workbench-table {
  width:100%;
  min-width:1840px;
  table-layout:fixed;
}
.product-workbench-table th:nth-child(1),
.product-workbench-table td:nth-child(1) { width:100px; }
.product-workbench-table th:nth-child(2),
.product-workbench-table td:nth-child(2) { width:118px; }
.product-workbench-table th:nth-child(3),
.product-workbench-table td:nth-child(3) { width:156px; }
.product-workbench-table th:nth-child(4),
.product-workbench-table td:nth-child(4) { width:150px; }
.product-workbench-table th:nth-child(5),
.product-workbench-table td:nth-child(5) { width:132px; }
.product-workbench-table th:nth-child(6),
.product-workbench-table td:nth-child(6) { width:330px; }
.product-workbench-table th:nth-child(7),
.product-workbench-table td:nth-child(7) { width:220px; }
.product-workbench-table th:nth-child(8),
.product-workbench-table td:nth-child(8) { width:220px; }
.product-workbench-table th:nth-child(9),
.product-workbench-table td:nth-child(9) { width:180px; }
.product-workbench-table th:nth-child(10),
.product-workbench-table td:nth-child(10) { width:250px; }
.product-table th:nth-child(1),
.product-table td:nth-child(1) { min-width:96px; }
.product-table th:nth-child(2),
.product-table td:nth-child(2) { width:102px; min-width:102px; }
.product-table th:nth-child(3),
.product-table td:nth-child(3) { min-width:138px; }
.product-table th:nth-child(4),
.product-table td:nth-child(4) { min-width:138px; }
.product-table th:nth-child(6),
.product-table td:nth-child(6) { min-width:190px; }
.product-table th:nth-child(7),
.product-table td:nth-child(7) { min-width:170px; }
.product-table th:nth-child(8),
.product-table td:nth-child(8) { min-width:150px; }
.product-table th:nth-child(9),
.product-table td:nth-child(9) { min-width:150px; }
.product-table th:nth-child(10),
.product-table td:nth-child(10) { min-width:230px; }
.product-table td:nth-child(7) .stack > span,
.product-table td:nth-child(8) .stack > span { white-space:nowrap; }
.product-table tbody tr { transition:background-color .16s ease; }
.product-table tbody tr:hover { transform:none; }

/* 2026-08-29 full-ui-harmony=20260829
   Replace the remaining legacy light islands with one matte operational world.
   Content and workflow stay untouched; only surface hierarchy, contrast and
   responsive behavior are normalized here. */
:root {
  color-scheme:dark;
  --canvas:#0a1220;
  --surface:#111c2d;
  --surface-raised:#17253a;
  --surface-inset:#0d1728;
  --surface-soft:#1c2c43;
  --line:#2a3b55;
  --line-strong:#3d5572;
  --ink:#f4f7fb;
  --ink-soft:#d1dbe8;
  --muted:#95a8bd;
  --muted-light:#6e8199;
  --primary:#56d8c5;
  --primary-strong:#2bc7b2;
  --primary-soft:#123a43;
  --blue:#80b9ff;
  --blue-soft:#183252;
  --warm:#efbd6a;
  --warm-soft:#3a2d1d;
  --danger:#ff8799;
  --danger-soft:#43202d;
  --sidebar:#08111f;
  --sidebar-2:#122137;
  --sidebar-ink:#eef4fb;
  --sidebar-muted:#9cafc4;
  --shadow-1:0 1px 2px rgba(0,0,0,.28),0 14px 34px rgba(0,0,0,.18);
}

html,body { background:var(--canvas); }
body {
  color:var(--ink);
  background:var(--canvas);
  text-rendering:optimizeLegibility;
}
::selection { color:#d7fff7; background:#15524f; }

/* Shell and navigation */
.app-shell { background:var(--canvas); }
.sidebar { background:var(--sidebar); border-right-color:#1d2c43; box-shadow:12px 0 32px rgba(0,0,0,.22); }
.brand { border-bottom-color:#1d2c43; }
.brand-mark { background:#123a43; border-color:#4fcabb; }
.brand-copy strong { color:#f4f7fb; }
.brand-copy small,.sidebar-footer { color:#8ea3bb; }
.nav { scrollbar-color:#3f5874 #0c1728; }
.nav::-webkit-scrollbar-track { background:#0c1728; }
.nav::-webkit-scrollbar-thumb { background:#3f5874; }
.nav-group-trigger { color:#b9c8d9; }
.nav-group-trigger span,.nav-group-trigger i { color:#7890aa; }
.nav-group-trigger:hover { color:#fff; background:#13243a; }
.nav-group-menu { border-left-color:#263a56; }
.nav-item { color:#dce5ef; }
.nav-item span { color:#91a5bc; }
.nav-item:hover { color:#fff; background:#14263e; border-color:#29405c; }
.nav-item.active,.nav-dashboard-entry.active { color:#effffc; background:#124b54; border-color:#287d83; box-shadow:inset 3px 0 0 #63e3d0,0 8px 18px rgba(0,0,0,.22); }
.nav-item.active span { color:#a9f6e6; }
.nav-group-menu .nav-item.active { background:#123d47; }
.nav-item b { color:#fff; background:#b72f4c; }
.online-dot { background:#65d8a5; }

.workspace,.page { background:var(--canvas); }
.topbar { background:#0d1728; border-bottom-color:#22334c; box-shadow:0 1px 0 rgba(0,0,0,.22); }
.topbar h1 { color:var(--ink); }
.topbar > div:first-child::before { color:#6f86a1; }
.search,.top-actions select,.user-menu,.icon-button,.secondary {
  color:var(--ink-soft);
  background:var(--surface-raised);
  border-color:var(--line-strong);
}
.search input { color:var(--ink); background:transparent; }
.search input::placeholder { color:#8094ab; opacity:1; }
.search:focus-within { border-color:var(--primary-strong); box-shadow:0 0 0 3px rgba(43,199,178,.17); background:#1a2b42; }
.icon-button:hover,.secondary:hover,.user-menu:hover { color:#d9fff8; border-color:#58d8c5; background:#203650; }
.workspace-tabs { background:#0d1728; border-bottom-color:#2a3b55; }
.workspace-tab { color:#c8d5e5; background:#15243a; border-color:#3a506b; }
.workspace-tab.active { color:#a8f5e7; background:#123a43; border-color:#2d8e8a; box-shadow:inset 0 -2px 0 #5eead4; }
.workspace-tab-close { border-left-color:#324862; }

/* Shared surfaces */
.panel,.metric,.metric-card,.summary-card,.role-card,.schedule-kpi,
.operation-connector-card,.work-card,.work-filter-bar,.order-material-card,
.order-lines-card,.schedule-card,.schedule-product,.schedule-product-picker,
.attachment-card,.finance-invoice-preview,.detail-module,
.detail-more-fields,.styling-editor-section,.catalog-model-profile-row,
.hr-department-card,.hr-directory-editor,.hr-role-mapping-editor,
.hr-role-mapping-row,.hr-import-preview,.hr-organization-quick-person,
.hr-organization-quick-role,.hr-performance-grid article {
  color:var(--ink-soft);
  background:var(--surface);
  border-color:var(--line);
  box-shadow:var(--shadow-1);
}
.panel-head { border-bottom-color:var(--line); }
.panel-head h3,.section-title,.section-heading .section-title { color:var(--ink); }
.panel-head a,.action-link,a { color:#8ec5ff; }
.panel-head a:hover,.action-link:hover,a:hover { color:#b7dcff; }
.toolbar h2 { color:var(--ink); }
.toolbar p,.toolbar-note,.subtle,.detail-meta,.metric-note { color:var(--muted); }
.primary,.auth-submit { color:#062d2a; background:var(--primary); border-color:var(--primary); box-shadow:0 5px 14px rgba(43,199,178,.18); }
.primary:hover,.auth-submit:hover { color:#052622; background:#9af5e6; border-color:#9af5e6; }
.secondary { box-shadow:none; }
.danger { color:var(--danger); }
.filter-chip { color:var(--ink-soft); background:var(--surface-raised); border-color:var(--line-strong); }
.filter-chip:hover { color:#d9fff8; border-color:var(--primary); background:#203650; }
.filter-chip.selected { color:#a9f6e6; border-color:#2d8e8a; background:var(--primary-soft); }
.metric-label { color:#a4b5c8; }
.metric-value,.work-card .number,.dashboard-kpi-value { color:var(--ink); }
.metric:hover,.metric-card:hover,.summary-card:hover,.work-card:hover { border-color:#3f7d82; box-shadow:0 14px 34px rgba(0,0,0,.26); }
.dashboard-kpi-card:first-child { background:#123a43; border-color:#2d8e8a; }
.dashboard-kpi-card:first-child .dashboard-kpi-value { color:#a9f6e6; }
.dashboard-chart-empty { background:var(--surface-inset); }

/* Tables and dense operational lists */
.table-wrap { background:var(--surface); border-color:var(--line); }
.product-table th,.data-table th,.order-line-table th,.hr-table th { color:#cbd8e7; background:#17263b; border-bottom-color:var(--line-strong); }
.product-table td,.data-table td,.order-line-table td,.hr-table td { color:var(--ink-soft); border-bottom-color:#22334b; }
.product-table tbody tr:hover td,.data-table tbody tr:hover td,.order-line-table tbody tr:hover td,.hr-table tbody tr:hover td { background:#172840; }
.style-code { color:#83d7ff; }
.tag.blue { color:#c8e0ff; background:#183252; }
.tag.green { color:#c3f6d7; background:#123a30; }
.tag.orange { color:#ffe0a0; background:#3a2d1d; }
.tag.red { color:#ffd0d8; background:#43202d; }
.tag.gray { color:#cfdae7; background:#293a50; }
.status-tag,.chip,.effect-status { border-color:transparent; }
.dashboard-module-head,.dashboard-module-row,.attention-item,.risk-item,.feed li { background:var(--surface); border-color:#22334b; }
.dashboard-module-head { color:#9eb0c5; background:#17263b; }
.dashboard-module-row:hover,.attention-item:hover,.risk-item:hover { background:#172840; }
.dashboard-module-name,.attention-item strong,.risk-copy strong { color:var(--ink); }
.dashboard-module-name span,.feed-change { color:#8ec5ff; }
.module-progress-bar { background:#2b3d55; }
.risk-count { color:#b3c2d3; background:var(--surface-raised); border-color:var(--line-strong); }
.risk-count.has-risk { color:#ffd0d8; background:var(--danger-soft); border-color:#8d3e53; }
.risk-level { color:#ffe0a0; background:var(--warm-soft); }
.risk-level.overdue { color:#ffd0d8; background:var(--danger-soft); }

/* Product detail: one readable hierarchy, no white islands. */
.dialog { background:#0d1728; border-color:#415977; box-shadow:0 28px 80px rgba(0,0,0,.52); }
.dialog::backdrop { background:rgba(2,6,23,.82); }
.dialog-inner { color:var(--ink-soft); background:#0f1a2d; }
.product-detail-shell { background:#0f1a2d; }
.dialog-head { background:#111e32; border-bottom-color:#2a3b55; }
.dialog-head h2,.detail-title { color:var(--ink); }
.dialog-head .close,.image-preview-close { color:#9db0c6; }
.dialog-head .close:hover,.image-preview-close:hover { color:#fff; background:#253852; }
.details { background:transparent; }
.detail-top { border-bottom-color:#2a3b55; }
.detail-image,.product-image,.styling-image,.model-image-source-preview,.model-image-output-preview { background:#0b1525; border-color:#3b526f; }
.image-caption,.detail-actions { color:var(--muted); }
.detail-module-nav { border-top-color:#243650; border-bottom-color:#2d405c; background:#0e192b; }
.detail-module-nav-item { color:#cbd8e7; background:#17263b; border-color:#3c5572; }
.detail-module-nav-item:hover { color:#b5fff0; background:#203650; border-color:#59d6c4; }
.detail-module-nav-item.is-active { color:#a9f6e6; background:#123a43; border-color:#2d8e8a; box-shadow:inset 0 -2px 0 #5eead4; }
.detail-module { background:#111e32; border-color:#304763; }
.detail-module-head { background:#17263b; border-bottom-color:#2c405b; }
.detail-module-index { color:#a9f6e6; background:#123a43; }
.detail-module-head h3 { color:var(--ink); }
.detail-module-head p { color:#9cafc4; }
.detail-module-content { background:#111e32; }
.detail-module-content > section { border-top-color:#2a3b55; }
.detail-focus-section { background:#111e32; border-color:#304763; box-shadow:none; }
.detail-module-actions { color:var(--ink-soft); background:#12323c; border-color:#286d72; }
.detail-module-actions-head strong { color:#d7f6f0; }
.detail-module-actions-head span { color:#9cb3c1; }
.detail-module-contract-actions { color:#ffe4ac; background:#342a1b; border-color:#755725; }
.section-heading .subtle,.section-heading p { color:var(--muted); }
.fields { background:#0d1728; border-color:#3b526f; }
.field { background:#111e32; border-right-color:#2b405b; border-bottom-color:#2b405b; }
.field label { color:#9fb1c4; }
.field strong { color:#f4f7fb; }
.field input,.field select,.field textarea { color:var(--ink); background:#17263b; border-color:#425a76; }
.field input:focus,.field select:focus,.field textarea:focus { border-color:var(--primary-strong); box-shadow:0 0 0 3px rgba(43,199,178,.16); }
.detail-fields-empty { color:#a5b5c7; background:#111e32; border-color:#45617d; }
.detail-more-fields summary { color:#b9d5ef; background:#17263b; }
.detail-more-fields summary::after { color:#8ec5ff; }
.sku-grid { background:transparent; }
.sku-chip { color:var(--ink-soft); background:#17263b; border-color:#3b526f; }
.sku-chip:hover { border-color:#4fcabb; background:#1d344d; }
.sku-chip strong { color:#f4f7fb; }
.sku-chip small { color:#a7b8ca; }
.timeline li { border-left-color:#3e5a76; }
.timeline li::before { background:#5eead4; }
.timeline time { color:#91a6bc; }
.pattern-progress-section,.pattern-requirement-section,.revision-opinions-section,
.contract-detail-section,.procurement-materials-section,.procurement-archive-section,
.model-image-section,.styling-section { color:var(--ink-soft); }
.pattern-progress,.pattern-requirement-preview,.revision-history-preview,.revision-opinion-item,
.return-notice,.contract-summary,.styling-output-section,.styling-output-preview,
.model-image-inline-empty,.model-image-output-empty,.model-scene-reference,
.model-reference-slot,.consent-check { color:var(--ink-soft); background:#17263b; border-color:#3b526f; }
.pattern-progress-head,.pattern-progress-meta,.pattern-progress-next { color:#cbd8e7; }
.pattern-progress-track { background:#2c405b; }
.pattern-progress-track i { background:linear-gradient(90deg,#2bc7b2,#80b9ff); }
.revision-opinion-item.unread { background:#342a1b; border-color:#755725; box-shadow:inset 3px 0 #efbd6a; }
.revision-opinion-item strong,.revision-opinions-section > .section-heading > strong { color:#a9f6e6; }
.revision-opinions-section > .section-heading > strong { background:#123a43; }
.return-notice { background:#43202d; border-color:#8d3e53; color:#ffd0d8; }
.contract-summary { background:#342a1b; border-color:#755725; }
.contract-summary strong { color:#ffe0a0; }
.contract-summary small { color:#cbb683; }
.contract-summary.ready { background:#123a30; border-color:#2b775c; }
.contract-summary.ready strong { color:#c3f6d7; }
.contract-summary.failed { background:#43202d; border-color:#8d3e53; }
.contract-summary.failed strong { color:#ffd0d8; }

/* Inputs, empty states and image tools */
input,select,textarea,.order-product-search,.schedule-product-search input { color:var(--ink); background:#17263b; border-color:#425a76; }
input:hover,select:hover,textarea:hover { border-color:#607995; }
input:focus,select:focus,textarea:focus { border-color:var(--primary-strong); box-shadow:0 0 0 3px rgba(43,199,178,.16); }
input::placeholder,textarea::placeholder { color:#8196ad; opacity:1; }
.empty-state,.permission-empty { color:#a5b5c7; background:#111e32; border-color:#425a76; }
.empty-state strong,.permission-empty strong { color:#eef4fb; }
.role-banner,.schedule-hero,.privacy-notice,.hr-hero,.hr-import-dropzone,
.model-scene-reference .image-drop { color:var(--ink-soft); background:#163044; border-color:#315771; }
.role-banner strong,.role-banner span { color:#d6e8f6; }
.inline-warning,.provider-notice { color:#ffe0a0; background:#342a1b; border-color:#755725; }
.inline-success { color:#c3f6d7; background:#123a30; border-color:#2b775c; }
.image-drop,.detail-image-drop { color:#b4c5d7; background:#13233a; border-color:#3d5875; }
.image-drop:hover,.image-drop:focus-visible,.detail-image-drop:hover { border-color:#58d8c5; background:#18384a; }
.image-drop-icon { color:#0a3431; background:#5eead4; }
.image-drop-copy strong { color:#eef4fb; }
.image-drop-copy small { color:#9cafc4; }

/* Other modules inherit the same material ladder. */
.schedule-hero h2,.schedule-card-head strong,.schedule-product-copy strong,
.schedule-info-item dd,.operation-connector-card strong,.operation-data-influencer-summary b,
.order-section-head h3,.order-product-result strong,.hr-section-title,.hr-department-card strong { color:var(--ink); }
.schedule-card-note,.schedule-communication-notes,.schedule-product-details,
.operation-data-note,.finance-invoice-preview,.order-product-summary { color:#b9c9da; background:#172f4b; border-color:#315b7c; }
.schedule-period span,.schedule-selected-chip,.styling-section-head>strong { color:#a9f6e6; background:#123a43; border-color:#2d8e8a; }
.schedule-influencer { color:#c7d7e7; background:#1b2d44; border-color:#38536f; }
.schedule-product-option,.order-product-result,.order-product-results { color:var(--ink-soft); background:#111e32; border-color:#3b526f; }
.schedule-product-option:hover,.schedule-product-option.selected,.order-product-result:hover,.order-product-result:focus-visible { background:#1a304a; border-color:#4b7895; }
.schedule-product-copy span,.schedule-product-copy small,.schedule-info-item dt { color:#91a6bc; }
.operation-data-status { color:#ffe0a0; background:#342a1b; }
.operation-data-status.connected { color:#c3f6d7; background:#123a30; }
.hr-import-summary span,.hr-role-mapping-empty,.hr-document-empty { color:#a5b5c7; background:#17263b; border-color:#3b526f; }
.hr-import-success { color:#c3f6d7; background:#123a30; border-color:#2b775c; }
.hr-import-errors { color:#ffd0d8; background:#43202d; border-color:#8d3e53; }
.form-footer { color:var(--ink-soft); background:#17263b; border-top-color:#2a3b55; }

@media (max-width:760px) {
  .topbar { background:#0d1728; }
  .page { padding-left:16px; padding-right:16px; }
  .detail-module-nav { background:#0d1728; }
  .detail-module-head { gap:8px; }
  .fields { grid-template-columns:1fr; }
  .field { border-right:0; }
  .sku-grid { grid-template-columns:1fr; }
  .detail-module-actions { margin-left:0; margin-right:0; }
}

/* 2026-08-29 responsive-table-cards=20260829
   The product workbench is dense on desktop but must not turn a narrow
   viewport into a cropped slice of one giant table. Large screens use the
   available page width, medium screens get a bounded table scroller, and
   phones receive one compact record card per style. */
.product-workbench-table {
  width:100%;
  min-width:0;
  table-layout:fixed;
}
.product-workbench-table th,
.product-workbench-table td {
  min-width:0 !important;
  overflow-wrap:anywhere;
}
.product-workbench-table th:nth-child(1),.product-workbench-table td:nth-child(1) { width:7%; }
.product-workbench-table th:nth-child(2),.product-workbench-table td:nth-child(2) { width:8%; }
.product-workbench-table th:nth-child(3),.product-workbench-table td:nth-child(3) { width:10%; }
.product-workbench-table th:nth-child(4),.product-workbench-table td:nth-child(4) { width:10%; }
.product-workbench-table th:nth-child(5),.product-workbench-table td:nth-child(5) { width:9%; }
.product-workbench-table th:nth-child(6),.product-workbench-table td:nth-child(6) { width:18%; }
.product-workbench-table th:nth-child(7),.product-workbench-table td:nth-child(7) { width:13%; }
.product-workbench-table th:nth-child(8),.product-workbench-table td:nth-child(8) { width:12%; }
.product-workbench-table th:nth-child(9),.product-workbench-table td:nth-child(9) { width:6%; }
.product-workbench-table th:nth-child(10),.product-workbench-table td:nth-child(10) { width:7%; }
.product-workbench-table .product-actions-cell { width:auto !important; min-width:0 !important; }
.product-workbench-table .stack > span,
.product-workbench-table .stack > strong { overflow-wrap:anywhere; white-space:normal; }

@media (min-width:761px) and (max-width:1280px) {
  .product-workbench-table {
    width:max-content;
    min-width:1320px;
    table-layout:fixed;
  }
  .product-workbench-table th:nth-child(1),.product-workbench-table td:nth-child(1) { width:94px; }
  .product-workbench-table th:nth-child(2),.product-workbench-table td:nth-child(2) { width:104px; }
  .product-workbench-table th:nth-child(3),.product-workbench-table td:nth-child(3) { width:132px; }
  .product-workbench-table th:nth-child(4),.product-workbench-table td:nth-child(4) { width:140px; }
  .product-workbench-table th:nth-child(5),.product-workbench-table td:nth-child(5) { width:118px; }
  .product-workbench-table th:nth-child(6),.product-workbench-table td:nth-child(6) { width:220px; }
  .product-workbench-table th:nth-child(7),.product-workbench-table td:nth-child(7) { width:172px; }
  .product-workbench-table th:nth-child(8),.product-workbench-table td:nth-child(8) { width:190px; }
  .product-workbench-table th:nth-child(9),.product-workbench-table td:nth-child(9) { width:130px; }
  .product-workbench-table th:nth-child(10),.product-workbench-table td:nth-child(10) { width:160px; }
}

@media (max-width:760px) {
  .product-workbench-table {
    display:block;
    width:100%;
    min-width:0;
    table-layout:auto;
  }
  .product-workbench-table thead { display:none; }
  .product-workbench-table tbody {
    display:grid;
    gap:10px;
  }
  .product-workbench-table tbody tr {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    overflow:hidden;
    border:1px solid #304763;
    border-radius:9px;
    background:#111e32;
    box-shadow:0 8px 20px rgba(0,0,0,.16);
  }
  .product-workbench-table tbody td {
    display:block;
    width:auto !important;
    min-width:0 !important;
    padding:9px 11px;
    border-right:1px solid #263b56;
    border-bottom:1px solid #263b56;
    background:transparent;
  }
  .product-workbench-table tbody td::before {
    display:block;
    margin-bottom:4px;
    color:#8fa5bc;
    font-size:10px;
    font-weight:700;
    letter-spacing:.04em;
  }
  .product-workbench-table tbody td:nth-child(1)::before { content:"款号"; }
  .product-workbench-table tbody td:nth-child(2)::before { content:"图片"; }
  .product-workbench-table tbody td:nth-child(3)::before { content:"达人 / 品牌"; }
  .product-workbench-table tbody td:nth-child(4)::before { content:"品类"; }
  .product-workbench-table tbody td:nth-child(5)::before { content:"当前环节"; }
  .product-workbench-table tbody td:nth-child(6)::before { content:"开发状态"; }
  .product-workbench-table tbody td:nth-child(7)::before { content:"负责人"; }
  .product-workbench-table tbody td:nth-child(8)::before { content:"颜色 / 尺码 / SKU"; }
  .product-workbench-table tbody td:nth-child(9)::before { content:"搭配销售"; }
  .product-workbench-table tbody td:nth-child(10)::before { content:"操作"; }
  .product-workbench-table tbody td:nth-child(1),
  .product-workbench-table tbody td:nth-child(2),
  .product-workbench-table tbody td:nth-child(6),
  .product-workbench-table tbody td:nth-child(8),
  .product-workbench-table tbody td:nth-child(10) { grid-column:1/-1; }
  .product-workbench-table tbody td:nth-child(2) { min-height:102px; }
  .product-workbench-table tbody td:nth-child(3n) { border-right:0; }
  .product-workbench-table tbody td:last-child { border-right:0; border-bottom:0; }
  .product-workbench-table .product-image { width:58px; height:78px; }
  .product-workbench-table .product-row-actions { justify-content:flex-start; flex-wrap:wrap; }
  .product-workbench-table .product-row-actions .row-primary-action { max-width:none; }
  .product-workbench-table tbody tr:has(.empty-state) { display:block; }
  .product-workbench-table tbody tr:has(.empty-state) td { border:0; }
  .product-workbench-table tbody tr:has(.empty-state) td::before { display:none; }
}

@media (max-width:460px) {
  .product-workbench-table tbody tr { grid-template-columns:1fr; }
  .product-workbench-table tbody td { grid-column:1/-1 !important; border-right:0; }
  .product-workbench-table tbody td:nth-child(2) { min-height:0; }
}

/* 2026-08-29 responsive-layout-contract=20260829
   Keep every surface inside its own width budget. Tables may scroll only inside
   .table-wrap, while compact tables become readable cards on narrow screens. */
:where(
  .page,
  .view-panel,
  .panel,
  .panel-head,
  .toolbar,
  .toolbar > div,
  .content-grid,
  .two-columns,
  .dashboard-grid,
  .dashboard-overview-grid,
  .dashboard-detail-grid,
  .dashboard-module-grid,
  .dashboard-intelligence-grid,
  .dashboard-sales-grid,
  .dashboard-lower,
  .metrics,
  .work-cards,
  .form,
  .form-grid,
  .details,
  .dialog-inner,
  .table-wrap,
  .operation-data-dashboard-grid,
  .operation-data-connectors,
  .org-account-layout,
  .org-account-summary
) {
  min-width:0;
  max-width:100%;
}

.page,
.view-panel {
  overflow-x:clip;
}

.table-wrap {
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:visible;
  overscroll-behavior-x:contain;
  scrollbar-gutter:stable;
}

.table-wrap > table {
  max-width:none;
}

.table-wrap :where(th, td, .stack, .subtle, .row-actions, button, input, select, textarea) {
  min-width:0;
  max-width:100%;
}

.table-wrap :where(th, td, .stack, .subtle) {
  overflow-wrap:anywhere;
  word-break:break-word;
}

.table-wrap .row-actions {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

table.responsive-table {
  width:100%;
  min-width:0 !important;
  table-layout:fixed;
}

table.responsive-table :where(th, td) {
  min-width:0 !important;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
}

table.wide-table {
  width:max-content;
  min-width:760px;
}

@media (min-width:761px) {
  .table-wrap > table.responsive-table:not(.product-workbench-table) {
    width:100%;
    min-width:0 !important;
    table-layout:fixed;
  }
}

@media (max-width:760px) {
  .table-wrap {
    margin-inline:0;
    padding-bottom:2px;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) {
    display:block;
    width:100% !important;
    min-width:0 !important;
    border-collapse:separate;
    border-spacing:0;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) thead {
    display:none;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody {
    display:grid;
    gap:10px;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody tr {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    overflow:hidden;
    border:1px solid #304763;
    border-radius:9px;
    background:#111e32;
    box-shadow:0 8px 20px rgba(0,0,0,.16);
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody td {
    display:block;
    width:auto !important;
    min-width:0 !important;
    max-width:none;
    padding:9px 11px;
    border-right:1px solid #263b56;
    border-bottom:1px solid #263b56;
    background:transparent;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody td::before {
    content:attr(data-label);
    display:block;
    margin-bottom:4px;
    color:#8fa5bc;
    font-size:10px;
    font-weight:700;
    letter-spacing:.04em;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody tr:has(.empty-state) {
    display:block;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody tr:has(.empty-state) td {
    border:0;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody tr:has(.empty-state) td::before {
    display:none;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody td:last-child {
    border-right:0;
    border-bottom:0;
  }

  .table-wrap > table.wide-table:not(.hr-table) {
    width:max-content !important;
    min-width:760px !important;
  }

  .table-wrap :where(.action-cell, .product-actions-cell, .row-actions) {
    width:auto !important;
    min-width:0 !important;
  }

  /* A wide HR row is still a record, not a horizontal viewport. Keep its
     action area visually anchored after the information fields. */
  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody td[data-label="操作"] {
    grid-column:1/-1;
    display:flex;
    align-items:center;
    min-height:48px;
    padding-block:10px;
    border-top:1px solid #263b56;
    border-right:0;
    border-bottom:0;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody td[data-label="操作"]::before {
    flex:0 0 auto;
    margin:0 12px 0 0;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody td[data-label="操作"] .row-actions {
    flex:1 1 auto;
    justify-content:flex-start;
  }
}

@media (max-width:460px) {
  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody tr {
    grid-template-columns:1fr;
  }

  .table-wrap > table:is(.responsive-table,.hr-table.wide-table) tbody td {
    grid-column:1/-1;
    border-right:0;
  }
}

/* 2026-08-29 hr-table-mobile-cards=20260829
   Wide HR rosters remain tabular on desktop, but collapse into labelled
   records on narrow screens so the action column never becomes a lone slice. */

/* 2026-08-29 label-surface-harmony=20260829
   The care-label / hangtag section lives inside product details. Keep its
   wrapper, previews and headings on the same dark material ladder as the
   surrounding detail module instead of reintroducing a white island. */
.label-section {
  color:var(--ink-soft);
  background:var(--surface);
  border-color:var(--line);
  box-shadow:var(--shadow-1);
}

.label-section .section-title,
.label-section .section-heading h3,
.label-editor-block .section-title {
  color:var(--ink);
}

.label-section .section-heading p,
.label-section .section-heading .subtle,
.label-editor-block .subtle {
  color:var(--muted);
}

.label-section .section-actions .secondary,
.label-editor-block .secondary {
  color:var(--ink-soft);
  background:var(--surface-raised);
  border-color:var(--line-strong);
}

.label-section .section-actions .secondary:hover,
.label-editor-block .secondary:hover {
  color:#d9fff8;
  background:var(--surface-soft);
  border-color:var(--primary);
}

.label-preview-grid > div,
.label-editor-block {
  color:var(--ink-soft);
  background:var(--surface-raised);
  border-color:var(--line);
}

.label-preview-grid > div strong {
  color:#b9d5ef;
}

.label-preview-grid > div span {
  color:#e3edf7;
}

.label-preview-grid > div small {
  color:#9fb2c7;
}

.label-editor-block .section-title {
  color:#d7e6f4;
}

/* 2026-08-29 scroll-flash-stability=20260829
   Scrolling can move the pointer across dense rows. Keep hover/focus states in
   the dark surface family and remove the color tween that exposed a light frame. */
html,
body,
.app-shell,
.workspace,
.page,
.view-panel {
  background:var(--canvas);
}

html,
body {
  overscroll-behavior-y:none;
  scrollbar-color:#3a506a var(--canvas);
}

*::-webkit-scrollbar {
  width:10px;
  height:10px;
}

*::-webkit-scrollbar-track {
  background:var(--canvas);
}

*::-webkit-scrollbar-thumb {
  background:#3a506a;
  border:2px solid var(--canvas);
  border-radius:8px;
}

*::-webkit-scrollbar-thumb:hover {
  background:#4f6988;
}

.product-table tbody tr,
.data-table tbody tr,
.order-line-table tbody tr,
.hr-table tbody tr {
  transition:none !important;
  transform:none !important;
}

.product-table tbody tr:hover,
.product-table tbody tr:focus-within,
.data-table tbody tr:hover,
.data-table tbody tr:focus-within,
.order-line-table tbody tr:hover,
.order-line-table tbody tr:focus-within,
.hr-table tbody tr:hover,
.hr-table tbody tr:focus-within {
  background:var(--surface-raised) !important;
  transform:none !important;
}

.product-table tbody tr:hover td,
.product-table tbody tr:focus-within td,
.data-table tbody tr:hover td,
.data-table tbody tr:focus-within td,
.order-line-table tbody tr:hover td,
.order-line-table tbody tr:focus-within td,
.hr-table tbody tr:hover td,
.hr-table tbody tr:focus-within td {
  background:var(--surface-raised) !important;
}

/* 2026-08-29 global-surface-normalization=20260829
   The application is an operational workspace, not a collection of white
   marketing cards. Legacy module rules used light backgrounds that broke the
   dark shell into disconnected islands. This final layer keeps the existing
   hierarchy and statuses, while giving every module one material ladder. */
body::before {
  display:none !important;
}

.dashboard-hero,
.dashboard-intelligence,
.dashboard-sales-panel,
.dashboard-modules,
.dashboard-risks,
.dashboard-activity,
.dashboard-chart-panel,
.dashboard-attention-panel,
.work-card,
.work-filter-bar,
.schedule-kpi,
.schedule-card,
.schedule-product-card,
.operation-connector-card,
.operation-data-filters,
.hr-document-card,
.hr-department-card,
.hr-role-mapping-row,
.hr-import-preview,
.supplier-receipt-summary,
.supplier-recommendation,
.contract-summary,
.activity-panel {
  color:var(--ink-soft);
  background:var(--surface);
  border-color:var(--line);
  box-shadow:var(--shadow-1);
}

.dashboard-kpi-card,
.dashboard-intelligence-card,
.dashboard-sales-card,
.dashboard-module-card,
.dashboard-influencer-card,
.dashboard-milestone-row,
.business-milestone,
.attention-item,
.risk-item,
.feed-item,
.schedule-product-option,
.order-product-result,
.order-product-results,
.tenant-selection-option,
.label-preview-grid > div,
.label-editor-block,
.model-reference-slot,
.consent-check,
.styling-output-preview {
  color:var(--ink-soft);
  background:var(--surface-raised);
  border-color:var(--line);
  box-shadow:none;
}

.dashboard-hero {
  border-color:var(--line);
}

.dashboard-hero h2,
.dashboard-kpi-card > strong,
.dashboard-intelligence-card strong,
.dashboard-sales-card > strong,
.dashboard-module-card-head > strong,
.dashboard-influencer-head strong,
.business-milestone-copy strong,
.dashboard-milestone-style strong,
.dashboard-milestone-node strong,
.dashboard-milestone-due strong {
  color:var(--ink);
}

.dashboard-hero p,
.dashboard-hero .dashboard-updated,
.dashboard-kpi-card > span,
.dashboard-kpi-card > small,
.dashboard-intelligence-card-head span,
.dashboard-intelligence-card p,
.dashboard-sales-card > span,
.dashboard-sales-card > small,
.dashboard-sales-definition,
.dashboard-module-name span,
.dashboard-module-stats > span,
.dashboard-influencer-card > span,
.business-milestone-copy small,
.business-milestone-date small,
.dashboard-milestone-style small,
.dashboard-milestone-node small,
.dashboard-milestone-due small,
.activity-panel .feed-meta,
.activity-panel .feed-change {
  color:var(--muted);
}

.dashboard-kpi-card:first-child {
  background:var(--primary-soft);
  border-color:#2d8e8a;
}
.dashboard-kpi-card:first-child > span,
.dashboard-kpi-card:first-child > strong,
.dashboard-kpi-card:first-child > small {
  color:#a9f6e6;
}
.dashboard-kpi-card.sales {
  background:var(--blue-soft);
  border-color:#315b7c;
}
.dashboard-kpi-card.sales > span,
.dashboard-kpi-card.sales > strong,
.dashboard-kpi-card.sales > small {
  color:#c8e0ff;
}
.dashboard-kpi-card.alert {
  background:var(--danger-soft);
  border-color:#8d3e53;
}
.dashboard-kpi-card.alert > span,
.dashboard-kpi-card.alert > strong,
.dashboard-kpi-card.alert > small {
  color:#ffd0d8;
}
.dashboard-kpi-card.green { background:#123a30; border-color:#2b775c; }
.dashboard-kpi-card.green > strong { color:#c3f6d7; }
.dashboard-kpi-card.blue { background:var(--blue-soft); border-color:#315b7c; }
.dashboard-kpi-card.blue > strong { color:#c8e0ff; }
.dashboard-kpi-card.violet { background:#2a2140; border-color:#655296; }
.dashboard-kpi-card.violet > strong { color:#e1d4ff; }

.dashboard-intelligence-card.urgent { background:var(--danger-soft); border-color:#8d3e53; }
.dashboard-intelligence-card.focus { background:var(--warm-soft); border-color:#755725; }
.dashboard-intelligence-card.time { background:var(--blue-soft); border-color:#315b7c; }
.dashboard-intelligence-card.progress { background:#123a30; border-color:#2b775c; }
.dashboard-intelligence-card.urgent strong { color:#ffd0d8; }
.dashboard-intelligence-card.focus strong { color:#ffe0a0; }
.dashboard-intelligence-card.time strong { color:#c8e0ff; }
.dashboard-intelligence-card.progress strong { color:#c3f6d7; }

.dashboard-sales-card.platform { background:var(--blue-soft); border-color:#315b7c; }
.dashboard-sales-card.order { background:#2a2140; border-color:#655296; }
.dashboard-sales-card.platform > strong { color:#c8e0ff; }
.dashboard-sales-card.order > strong { color:#e1d4ff; }

.dashboard-module-card-head,
.dashboard-module-progress,
.dashboard-module-stats,
.dashboard-influencer-card,
.business-milestone,
.attention-item,
.risk-item,
.feed-item {
  border-color:var(--line);
}
.dashboard-module-card-head { background:transparent; }
.dashboard-module-name { color:var(--ink); }
.dashboard-module-name span { color:var(--blue); }
.dashboard-module-health.healthy { color:#c3f6d7; background:#123a30; }
.dashboard-module-health.active { color:#c8e0ff; background:var(--blue-soft); }
.dashboard-module-health.warning { color:#ffe0a0; background:var(--warm-soft); }
.dashboard-module-health.alert { color:#ffd0d8; background:var(--danger-soft); }
.dashboard-module-stats .done-count b { color:#c3f6d7; }
.dashboard-module-stats .doing-count b { color:#ffe0a0; }
.risk-item:hover,
.attention-item:hover,
.business-milestone:hover,
.dashboard-milestone-row:hover,
.feed-item:hover {
  background:var(--surface-soft);
  border-color:var(--line-strong);
  box-shadow:none;
}
.dashboard-chart-empty {
  color:var(--muted);
  background:var(--surface-inset);
  border-color:var(--line);
}
.dashboard-bar,
.module-progress-bar {
  background:#2b3d55;
}
.dashboard-bar i.done,
.module-progress-bar i.done { background:var(--primary-strong); }
.dashboard-bar i.doing,
.module-progress-bar i.doing { background:var(--warm); }

.schedule-card,
.schedule-product-card,
.work-card,
.work-filter-bar,
.operation-connector-card,
.hr-document-card,
.hr-department-card,
.hr-role-mapping-row,
.hr-import-preview,
.supplier-receipt-summary,
.supplier-recommendation,
.contract-summary,
.activity-panel {
  box-shadow:var(--shadow-1);
}
.schedule-card-note,
.schedule-communication-notes,
.schedule-product-details,
.operation-data-note,
.order-product-summary {
  color:var(--ink-soft);
  background:var(--surface-raised);
  border-color:var(--line);
}
.schedule-info-item,
.activity-panel .feed-item { border-color:var(--line); }
.activity-panel .feed-item.unread { background:var(--primary-soft); }

/* 2026-08-29 tenant-context-single-source=20260829
   The top bar owns the active tenant context. The sidebar keeps only the
   navigation rail, so a company name is never repeated as decoration. */
#tenantBrand[hidden] { display:none !important; }
.tenant-switcher {
  min-width:220px;
  max-width:290px;
  display:flex;
  align-items:center;
}
.tenant-context-name {
  display:block;
  min-width:0;
  max-width:290px;
  padding:9px 12px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--ink-soft);
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--surface-soft);
  font-size:12px;
  font-weight:650;
}
.tenant-switcher select {
  min-width:0;
  width:100%;
  max-width:none;
  color:var(--ink-soft);
  background:var(--surface-soft);
}
@media (max-width:760px) {
  .tenant-switcher { min-width:0; max-width:none; }
  .tenant-context-name { width:100%; max-width:none; }
}

.hr-document-empty,
.hr-role-mapping-empty,
.empty-state,
.permission-empty,
.dashboard-milestone-list,
.dashboard-chart-empty {
  color:var(--muted);
  background:var(--surface-inset);
  border-color:var(--line);
}
.empty-state strong,
.permission-empty strong { color:var(--ink); }

.dialog-inner,
.form-footer,
.platform-current-tenant,
.notification-dialog,
.model-image-dialog,
.styling-dialog {
  color:var(--ink-soft);
  background:var(--surface);
  border-color:var(--line);
}
.form-footer { background:var(--surface-raised); border-top-color:var(--line); }
.platform-current-tenant { box-shadow:var(--shadow-1); }

.metric::after,
.work-card::after,
.dashboard-kpi-card::after { display:none !important; }
.panel:hover,
.metric:hover,
.metric-card:hover,
.summary-card:hover,
.role-card:hover,
.work-card:hover,
.dashboard-kpi-card:hover,
.dashboard-intelligence-card:hover,
.dashboard-sales-card:hover,
.dashboard-module-card:hover,
.dashboard-influencer-card:hover {
  transform:none !important;
  box-shadow:var(--shadow-1);
}

@media (max-width:760px) {
  .dashboard-hero,
  .dashboard-intelligence,
  .dashboard-sales-panel,
  .dashboard-modules,
  .dashboard-risks,
  .dashboard-activity,
  .dashboard-chart-panel,
  .dashboard-attention-panel,
  .work-card,
  .work-filter-bar,
  .schedule-card,
  .schedule-product-card {
    box-shadow:none;
  }
}

/* 2026-08-29 table-overlap-fix=20260829
   Keep dense workbench content inside its own table cell. The compact pattern
   progress card must shrink with the development-status column, while the
   action cell remains overflow-visible so its menu can open normally. */
.product-workbench-table :where(th, td) {
  box-sizing:border-box;
  min-width:0 !important;
  vertical-align:top;
}
.product-workbench-table tbody td:not(.product-actions-cell) {
  overflow:hidden;
}
.product-workbench-table tbody td:nth-child(6) > .stack,
.product-workbench-table tbody td:nth-child(7) > .stack {
  min-width:0;
  max-width:100%;
  overflow:hidden;
}
.product-workbench-table tbody td:nth-child(6) .pattern-progress {
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  overflow:hidden;
}
.product-workbench-table tbody td:nth-child(6) .pattern-progress-head {
  min-width:0;
  grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto;
}
.product-workbench-table tbody td:nth-child(6) .pattern-progress-mode,
.product-workbench-table tbody td:nth-child(6) .pattern-progress-head strong,
.product-workbench-table tbody td:nth-child(6) .pattern-progress-head b,
.product-workbench-table tbody td:nth-child(6) .pattern-progress-meta {
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}
.product-workbench-table tbody td:nth-child(6) .pattern-progress-mode,
.product-workbench-table tbody td:nth-child(6) .pattern-progress-head strong {
  white-space:nowrap;
}
.product-workbench-table tbody td:nth-child(7) .stack > span,
.product-workbench-table tbody td:nth-child(7) .stack > strong {
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
  white-space:normal;
}

/* 2026-08-29 action-surface-contract=20260829
   Keep the current workflow action visible and render the sole edit action
   inline. Only destructive or maintenance actions belong in the More menu. */
.product-row-actions {
  gap:6px;
  align-items:center;
}
.product-row-actions > .row-primary-action {
  min-width:0;
  max-width:180px;
  flex:1 1 auto;
}
.product-row-actions > .row-action-menu {
  flex:0 0 auto;
}
.product-row-actions .row-action-menu-trigger {
  color:var(--ink-soft);
  background:var(--surface-raised);
  border-color:var(--line-strong);
}
.product-row-actions .row-action-menu-trigger:hover,
.product-row-actions .row-action-menu-trigger:focus-visible,
.product-row-actions .row-action-menu[open] .row-action-menu-trigger {
  color:#d9fff8;
  background:var(--surface-soft);
  border-color:var(--primary);
}
.product-row-actions .row-action-menu-panel {
  background:var(--surface-raised);
  border-color:var(--line-strong);
  box-shadow:0 14px 30px rgba(0,0,0,.28);
}
.product-row-actions .row-action-menu-panel .action-button,
.product-row-actions .row-action-menu-panel .action-detail {
  color:var(--ink-soft);
  background:var(--surface);
  border-color:var(--line-strong);
}
.product-row-actions .row-action-menu-panel .action-button:hover,
.product-row-actions .row-action-menu-panel .action-button:focus-visible,
.product-row-actions .row-action-menu-panel .action-detail:hover,
.product-row-actions .row-action-menu-panel .action-detail:focus-visible {
  color:#d9fff8;
  background:var(--surface-soft);
  border-color:var(--primary);
}
@media (max-width:760px) {
  .product-row-actions {
    justify-content:flex-start;
    align-items:stretch;
  }
  .product-row-actions > .row-primary-action {
    max-width:none;
    flex:1 1 auto;
  }
  .product-row-actions .row-action-menu-trigger {
    min-height:34px;
  }
}

/* 2026-08-29 inline-model-preview-size=20260829
   The detail-page cover/result comparison is a supporting preview, not the
   whole page. Keep both panes readable at a bounded size and let the image
   preview dialog handle full-size inspection when needed. */
.model-image-inline-grid {
  width:min(100%,720px);
  max-width:720px;
  margin-inline:auto;
  grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr);
  gap:12px;
}
.model-image-inline-source > img,
.model-image-inline-output > img,
.model-image-inline-empty {
  height:360px;
  min-height:0;
  aspect-ratio:auto;
  object-fit:contain;
}
.model-image-inline-output .model-image-pose-grid {
  min-width:0;
}
.model-image-inline-output .model-image-pose-card img {
  height:300px;
  min-height:0;
  aspect-ratio:2 / 3;
  object-fit:cover;
}

@media (max-width:900px) and (min-width:721px) {
  .model-image-inline-grid {
    width:min(100%,640px);
    max-width:640px;
    grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr);
    gap:10px;
  }
  .model-image-inline-source > img,
  .model-image-inline-output > img,
  .model-image-inline-empty { height:320px; }
  .model-image-inline-output .model-image-pose-card img { height:260px; }
}

@media (max-width:720px) {
  .model-image-inline-grid {
    width:min(100%,440px);
    max-width:440px;
    grid-template-columns:1fr;
    gap:10px;
  }
  .model-image-inline-source > img,
  .model-image-inline-output > img,
  .model-image-inline-empty { height:320px; }
  .model-image-inline-output .model-image-pose-card img { height:280px; }
}

/* 2026-09-02 cover-preview-framing=20260902-r68
   Cover/result comparison surfaces are fixed media canvases. Fill the
   canvas edge-to-edge so portrait source images do not create side gutters;
   the existing full-size preview dialog remains the lossless inspection path. */
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(
  .model-image-inline-source > img,
  .model-image-inline-output > img,
  .model-image-source-preview,
  .model-image-output-preview
) {
  object-fit:cover !important;
  object-position:center center !important;
}

/* 2026-08-29 button-content-fit=20260829 / action-column-fit=20260829
   Text actions must stay legible even when a parent grid or table is tight.
   Let labels wrap inside their own control, reserve a real desktop budget for
   action cells, and give phone cards the full row so no label is clipped. */
button.primary,
button.secondary,
button.compact-button,
button.action-button,
summary.row-action-menu-trigger {
  box-sizing:border-box;
  min-width:0;
  max-width:100%;
  height:auto;
  min-height:34px;
  padding-block:7px;
  line-height:1.35;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
  text-overflow:clip;
}

.row-actions .action-button,
.row-actions .action-link,
.product-row-actions .action-button,
.product-row-actions .action-link {
  min-width:0;
  max-width:100%;
  height:auto;
  line-height:1.35;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
  text-overflow:clip;
}

.row-actions,
.product-row-actions {
  width:100%;
  max-width:100%;
  min-width:0;
  flex-wrap:wrap;
  align-items:stretch;
}

.row-actions > :where(button, a, .action-button, .action-link, .row-action-menu),
.product-row-actions > :where(button, a, .action-button, .action-link, .row-action-menu) {
  min-width:0;
  max-width:100%;
  flex:0 1 auto;
}

.product-row-actions > .row-primary-action {
  width:auto;
  min-width:0;
  max-width:100%;
  flex:0 1 180px;
}

.product-row-actions > .action-detail {
  flex:0 1 auto;
}

@media (min-width:761px) {
  .table-wrap td:has(.row-actions) {
    min-width:180px !important;
  }

  .product-workbench-table th:nth-child(10),
  .product-workbench-table td:nth-child(10),
  .product-workbench-table .product-actions-cell {
    width:clamp(190px,15%,280px) !important;
    min-width:190px !important;
  }
}

@media (max-width:760px) {
  .table-wrap td:has(.row-actions),
  .product-workbench-table .product-actions-cell {
    width:auto !important;
    min-width:0 !important;
  }

  .row-actions,
  .product-row-actions {
    width:100%;
    justify-content:flex-start;
  }

  .row-actions > :where(button, a, .action-button, .action-link, .row-action-menu),
  .product-row-actions > :where(button, a, .action-button, .action-link, .row-action-menu) {
    flex:1 1 auto;
  }

  .product-row-actions > .row-primary-action {
    width:100%;
    flex:1 1 100%;
  }
}
/* 2026-08-29 contract-document-editor=20260829
   Contract editing is a focused document workspace: the source text stays
   readable, the preview remains bounded, and mobile users do not inherit a
   wide two-column form. */
.dialog:has(> .dialog-inner.contract-editor-dialog) {
  width:min(1080px,calc(100vw - 32px));
}
.contract-editor-dialog {
  min-width:0;
  background:var(--surface, #fff);
}
.contract-editor-context {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:16px 24px 0;
  min-width:0;
}
.contract-editor-context > div {
  display:grid;
  gap:3px;
  min-width:0;
}
.contract-editor-context strong {
  color:var(--text, #20333a);
  font-size:16px;
}
.contract-editor-context span {
  color:var(--muted, #6b8181);
  font-size:12px;
  overflow-wrap:anywhere;
}
.contract-editor-badge {
  flex:0 0 auto;
  border:1px solid #9ed8ce;
  border-radius:999px;
  padding:5px 9px;
  color:#14796e !important;
  background:#effaf7;
  font-size:11px !important;
}
.contract-editor-dialog > .dialog-help {
  margin:0;
  padding:12px 24px 0;
  max-width:none;
}
.contract-editor-dialog > .form {
  display:grid;
  gap:14px;
  padding:16px 24px 24px;
}
.contract-editor-dialog > .form > label {
  min-width:0;
}
.contract-editor-dialog textarea[name="content"] {
  min-height:430px;
  resize:vertical;
  line-height:1.7;
  white-space:pre-wrap;
}
.contract-editor-preview {
  display:grid;
  gap:8px;
  min-width:0;
  padding:14px;
  border:1px solid var(--line, #d9e5e1);
  border-radius:8px;
  background:var(--surface-inset, #f5faf8);
}
.contract-editor-preview .section-title {
  margin:0;
}
.contract-editor-preview-body {
  min-height:150px;
  max-height:300px;
  overflow:auto;
  padding:14px 16px;
  border:1px solid var(--line, #d9e5e1);
  border-radius:6px;
  background:var(--surface, #fff);
  color:var(--text, #20333a);
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  line-height:1.7;
  font-size:13px;
}
.contract-detail-section .contract-actions,
.contract-table .contract-actions {
  align-items:center;
}
.contract-detail-section .contract-actions .action-button,
.contract-table .contract-actions .action-button {
  white-space:nowrap;
}
@media (max-width:760px) {
  .dialog:has(> .dialog-inner.contract-editor-dialog) {
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px);
  }
  .contract-editor-context {
    align-items:flex-start;
    flex-direction:column;
    padding-inline:18px;
  }
  .contract-editor-dialog > .dialog-help,
  .contract-editor-dialog > .form {
    padding-inline:18px;
  }
  .contract-editor-dialog textarea[name="content"] {
    min-height:340px;
  }
  .contract-editor-dialog .form-footer {
    margin:0 -18px -18px;
    padding:14px 18px;
  }
}

/* 2026-08-29 content-overflow-audit=20260829
   An empty table is a message state, not a wide data surface. Collapse only
   empty tables back to their container width; populated wide tables retain
   their internal scroll contract. Long helper copy and contract actions use
   the same wrapping rule so no sentence is pushed outside the viewport. */
.table-wrap > table:has(.empty-state) {
  width:100% !important;
  min-width:0 !important;
  table-layout:fixed;
}
.table-wrap > table:has(.empty-state) td[colspan] {
  width:100% !important;
  min-width:0 !important;
  max-width:100%;
  box-sizing:border-box;
}
.table-wrap > table:has(.empty-state) .empty-state {
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  overflow-wrap:anywhere;
  word-break:break-word;
  white-space:normal;
}
.table-wrap > table:has(.empty-state) .empty-state strong,
.table-wrap > table:has(.empty-state) .empty-state span {
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
  white-space:normal;
}
.contract-detail-section .contract-actions .action-button,
.contract-table .contract-actions .action-button,
.contract-print-button {
  max-width:100%;
  height:auto;
  min-width:0;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
  text-overflow:clip;
  line-height:1.35;
}
:where(.toolbar p, .toolbar-note, .panel-head > div, .panel-head span,
        .dialog-help, .schedule-card-note, .operation-data-note,
        .detail-meta, .subtle) {
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
  white-space:normal;
}

/* 2026-08-30 ui-architecture-overhaul=20260830
   A structural pass for the authenticated workspace. The shell borrows the
   scanability of Linear/Primer and the explicit content hierarchy of mature
   enterprise workbenches, while keeping the existing build-free HTML runtime.
   This layer changes layout, grouping and progressive disclosure only; it does
   not change business state, permissions or workflow markup. */
:root {
  --shell-sidebar-width:264px;
  --shell-sidebar-collapsed-width:76px;
  --content-max-width:1440px;
  --shell-gap:24px;
  --surface-raised:#ffffff;
  --surface-muted:#f7faf9;
  --surface-line:#dfe9e6;
  --ink-strong:#173a37;
  --ink-muted:#6f8580;
}

html { min-width:320px; background:#eef3f1; }
body { background:#eef3f1; }
.app-shell {
  grid-template-columns:var(--shell-sidebar-width) minmax(0,1fr);
  min-height:100dvh;
  background:#eef3f1;
  transition:grid-template-columns .22s ease;
}
.app-shell[data-sidebar-collapsed="true"] {
  grid-template-columns:var(--shell-sidebar-collapsed-width) minmax(0,1fr);
}
.sidebar {
  position:sticky;
  inset-block-start:0;
  height:100dvh;
  min-height:100dvh;
  min-width:0;
  padding:14px 10px;
  overflow:hidden;
  background:#132522;
  border-right:1px solid #26453f;
  box-shadow:8px 0 24px rgba(16,48,43,.10);
  transition:padding .22s ease,background .22s ease;
}
.sidebar .brand { display:none; }
.nav {
  min-height:0;
  margin-top:2px;
  padding:0;
  gap:5px;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-gutter:stable;
}
.nav-group { min-width:0; gap:3px; }
.nav-group-trigger {
  position:relative;
  min-height:34px;
  padding:0 10px;
  color:#87a9a2;
  border-radius:6px;
  font-size:11px;
  letter-spacing:.045em;
}
.nav-group-trigger > span,
.nav-item > span {
  flex:0 0 18px;
  width:18px;
  color:#77a198;
  font-size:15px;
  text-align:center;
}
.nav-group-trigger > i {
  margin-left:auto;
  color:#6d928b;
  font-style:normal;
  font-size:15px;
  line-height:1;
  transition:transform .18s ease;
}
.nav-group-trigger[aria-expanded="true"] > i { transform:rotate(180deg); }
.nav-group-menu {
  display:grid;
  gap:3px;
  margin:0 0 5px 12px;
  padding:3px 0 3px 10px;
  border-left:1px solid rgba(142,193,183,.20);
}
.nav-group.is-collapsed .nav-group-menu { display:none; }
.nav-item {
  min-width:0;
  min-height:38px;
  padding:0 10px;
  gap:10px;
  color:#b3cbc5;
  border:1px solid transparent;
  border-radius:6px;
  white-space:nowrap;
}
.nav-item:hover { color:#f4fbf9; background:#1d3934; border-color:rgba(156,204,195,.16); transform:none; }
.nav-item.active {
  color:#f7fffd;
  background:#1b6259;
  border-color:#3a8f83;
  box-shadow:inset 3px 0 0 #a4ddd3,0 5px 14px rgba(4,35,31,.18);
}
.nav-group-menu .nav-item.active { background:#1d665f; }
.nav-item b { margin-left:auto; flex:0 0 auto; }
.sidebar-footer {
  flex:0 0 auto;
  margin-top:12px;
  padding:11px 10px 0;
  color:#89aaa3;
  border-top:1px solid rgba(211,235,230,.14);
  white-space:nowrap;
}
.online-dot { width:7px; height:7px; }

.app-shell[data-sidebar-collapsed="true"] .sidebar { padding-inline:8px; }
.app-shell[data-sidebar-collapsed="true"] .nav-item,
.app-shell[data-sidebar-collapsed="true"] .nav-group-trigger {
  justify-content:center;
  gap:0;
  padding-inline:0;
  font-size:0;
}
.app-shell[data-sidebar-collapsed="true"] .nav-item > span,
.app-shell[data-sidebar-collapsed="true"] .nav-group-trigger > span {
  flex:0 0 20px;
  width:20px;
  font-size:16px;
}
.app-shell[data-sidebar-collapsed="true"] .nav-group-trigger > i,
.app-shell[data-sidebar-collapsed="true"] .nav-item b,
.app-shell[data-sidebar-collapsed="true"] .sidebar-footer { display:none; }
.app-shell[data-sidebar-collapsed="true"] .nav-group-menu {
  margin-left:0;
  padding-left:0;
  border-left:0;
}

.workspace { min-width:0; background:#eef3f1; }
.topbar {
  z-index:8;
  height:72px;
  min-width:0;
  padding:0 30px;
  background:rgba(249,252,251,.96);
  border-bottom:1px solid #dbe6e3;
  box-shadow:0 1px 0 rgba(19,63,57,.03);
  backdrop-filter:blur(12px);
}
.topbar-heading { display:flex; align-items:center; min-width:0; gap:12px; }
.sidebar-toggle {
  width:34px;
  height:34px;
  min-width:34px;
  padding:0;
  display:grid;
  place-items:center;
  color:#55716c;
  border-color:#cdded9;
  background:#fff;
}
.sidebar-toggle:hover { color:#0f766e; background:#eef8f5; border-color:#8dbeb6; }
.sidebar-toggle > span[aria-hidden] { font-size:16px; line-height:1; }
.topbar-title-group { display:grid; gap:1px; min-width:0; }
.topbar-kicker {
  color:#78908a;
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.topbar h1 {
  min-width:0;
  overflow:hidden;
  color:var(--ink-strong);
  font-size:20px;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.top-actions { min-width:0; gap:8px; }
.search { width:min(320px,28vw); min-width:190px; }
.user-menu { min-width:112px; max-width:180px; }
.user-menu span,.user-menu small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.workspace-tabs {
  min-height:48px;
  padding:7px 30px;
  overflow-x:auto;
  background:#e7f0ed;
  border-bottom:1px solid #d8e5e1;
}
.workspace-tab { min-height:34px; border-radius:6px; }
.workspace-tab-main { max-width:190px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.page {
  width:100%;
  max-width:var(--content-max-width);
  margin:0 auto;
  padding:24px 30px 56px;
  background:transparent;
}
.view-panel { min-width:0; }
.view-panel-enter { animation:none; }
.toolbar {
  align-items:flex-start;
  min-width:0;
  margin:0 0 20px;
  padding:2px 0 17px;
  border-bottom:1px solid #d8e5e1;
}
.toolbar > div { min-width:0; }
.toolbar h2 { color:var(--ink-strong); font-size:23px; line-height:1.25; }
.toolbar p,.toolbar-note { max-width:72ch; color:var(--ink-muted); line-height:1.6; }
.toolbar > .primary,.toolbar > .secondary { flex:0 0 auto; }
.filters { gap:6px; }
.filter-chip { min-height:30px; padding-inline:10px; }

.metrics,.dashboard-kpi-grid,.dashboard-sales-grid,.dashboard-module-grid,.schedule-kpis { gap:10px; }
.metric,.metric-card,.dashboard-kpi-card {
  min-height:104px;
  padding:14px 15px;
  border-radius:8px;
  box-shadow:none;
}
.metric-value { margin-top:7px; font-size:28px; }
.panel,.work-filter-bar,.detail-focus-section,.styling-editor-section,
.procurement-materials-section,.operation-data-filters {
  border-radius:8px;
  box-shadow:0 1px 2px rgba(19,63,57,.035);
}
.panel + .panel { margin-top:16px; }
.panel-head {
  min-height:54px;
  padding:14px 16px;
  background:var(--surface-raised);
}
.panel-head h3 { color:var(--ink-strong); font-size:14px; }
.panel-head > div { min-width:0; }
.panel-head > div > span,.panel-head > div > p { max-width:70ch; }
.content-grid,.two-columns,.dashboard-lower,.operation-data-dashboard-grid { gap:18px; }
.table-wrap { width:100%; max-width:100%; overscroll-behavior-inline:contain; }
.product-table,.data-table { max-width:100%; }
.product-table th,.data-table th {
  position:sticky;
  top:0;
  z-index:1;
  padding:10px 13px;
  background:#edf5f2;
}
.product-table td,.data-table td { padding:11px 13px; }
.product-table tbody tr:hover td,.data-table tbody tr:hover td { background:#f3faf7; }
.empty-state { min-width:0; max-width:100%; }

.work-cards { gap:10px; margin-bottom:14px; }
.work-card { min-height:136px; padding:16px; border-radius:8px; box-shadow:none; }
.work-card p { min-height:34px; margin:6px 0 11px; }
.work-filter-bar { gap:10px; margin-bottom:14px; padding:13px 15px; background:#f9fcfb; }
.work-filter-title { gap:8px; }
.work-filter-controls { gap:8px; }
.work-filter-field input,.work-filter-field select { min-height:36px; }
.order-toolbar { margin-bottom:12px; }
.role-banner { margin-bottom:14px; padding:11px 13px; border-radius:8px; }

.dashboard-hero,.dashboard-modules,.dashboard-attention,.dashboard-lower { margin-bottom:14px; }
.dashboard-hero { border-radius:8px; }
.dashboard-module-head,.dashboard-module-row { min-width:760px; }
.dashboard-module-head { min-height:36px; }
.dashboard-module-row { min-height:58px; padding-block:8px; }
.attention-item { min-height:72px; }
.risk-item { min-height:54px; padding-block:8px; }

.detail-top { gap:18px; padding-bottom:18px; }
.detail-title { color:var(--ink-strong); font-size:23px; }
.detail-actions { min-width:0; }
.detail-actions .action-button { max-width:100%; }
.section-heading { margin:20px 0 10px; }
.section-heading .section-title,.section-title { color:var(--ink-strong); font-size:16px; }
.fields,.sku-grid { gap:0; }
.field { min-width:0; padding:14px 15px; }

@media (max-width:1180px) {
  :root { --shell-sidebar-width:228px; }
  .topbar { padding-inline:22px; }
  .page { padding-inline:22px; }
  .search { width:230px; }
  .metrics,.dashboard-kpi-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:860px) {
  :root { --shell-sidebar-width:208px; }
  .app-shell { grid-template-columns:var(--shell-sidebar-width) minmax(0,1fr); }
  .topbar { height:auto; min-height:68px; padding-block:12px; align-items:flex-start; }
  .topbar-heading { align-items:flex-start; }
  .top-actions { flex-wrap:wrap; justify-content:flex-end; }
  .search { order:10; width:min(100%,320px); }
  .content-grid,.two-columns,.dashboard-lower,.operation-data-dashboard-grid { grid-template-columns:1fr; }
  .dashboard-module-head,.dashboard-module-row { min-width:700px; }
}
@media (max-width:760px) {
  .app-shell,.app-shell[data-sidebar-collapsed="true"] { display:block; }
  .sidebar,.app-shell[data-sidebar-collapsed="true"] .sidebar {
    position:sticky;
    inset-block-start:0;
    z-index:10;
    width:100%;
    min-height:auto;
    height:auto;
    max-height:86px;
    padding:8px;
    overflow:visible;
    border-right:0;
    border-bottom:1px solid #26453f;
  }
  .nav,.app-shell[data-sidebar-collapsed="true"] .nav {
    display:flex;
    align-items:center;
    gap:5px;
    max-height:68px;
    margin:0;
    overflow-x:auto;
    overflow-y:hidden;
  }
  .nav-group,.nav-group-menu { display:flex; flex:0 0 auto; align-items:center; gap:5px; margin:0; padding:0; border:0; }
  .nav-group.is-collapsed .nav-group-menu { display:none; }
  .nav-group-trigger,.app-shell[data-sidebar-collapsed="true"] .nav-group-trigger,
  .nav-item,.app-shell[data-sidebar-collapsed="true"] .nav-item {
    width:auto;
    min-width:max-content;
    min-height:34px;
    justify-content:flex-start;
    gap:7px;
    padding-inline:10px;
    font-size:12px;
  }
  .app-shell[data-sidebar-collapsed="true"] .nav-group-trigger > i { display:block; margin-left:0; font-size:14px; }
  .app-shell[data-sidebar-collapsed="true"] .nav-item > span,
  .app-shell[data-sidebar-collapsed="true"] .nav-group-trigger > span { flex-basis:16px; width:16px; font-size:14px; }
  .sidebar-footer { display:none; }
  .workspace { min-width:0; }
  .topbar { display:flex; flex-wrap:wrap; gap:10px; padding:12px 14px; }
  .topbar-heading { flex:1 1 100%; }
  .top-actions { width:100%; justify-content:flex-start; }
  .search { flex:1 1 100%; order:0; width:100%; min-width:0; }
  .top-actions .user-menu { margin-left:auto; }
  .workspace-tabs { padding-inline:14px; }
  .page { padding:18px 14px 40px; }
  .toolbar { flex-direction:column; gap:12px; }
  .toolbar > .primary,.toolbar > .secondary { width:100%; }
  .metrics,.dashboard-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-sales-grid { grid-template-columns:1fr; }
  .panel-head { align-items:flex-start; }
  .panel-head > .status-tag { flex:0 0 auto; }
  .work-cards { grid-template-columns:1fr; }
  .work-filter-controls { grid-template-columns:1fr; }
  .work-filter-date { grid-column:auto; }
  .work-filter-result { text-align:left; }
  .detail-top { grid-template-columns:96px minmax(0,1fr); gap:12px; }
  .detail-actions { grid-column:1 / -1; }
}
@media (prefers-reduced-motion:reduce) {
  .app-shell,.sidebar,.sidebar-toggle,.nav-item,.nav-group-trigger { transition:none !important; }
}

/* 2026-08-30 ui-architecture-coherence=20260830
   Final cascade guard: the new shell and legacy module rules must share one
   material ladder. This prevents white panel headers or light controls from
   appearing inside the dark operational workspace. */
:root {
  color-scheme:dark;
  --canvas:#0a1220;
  --surface:#111c2d;
  --surface-raised:#17253a;
  --surface-muted:#0f1a2c;
  --surface-line:#2a3b55;
  --ink-strong:#f4f7fb;
  --ink-muted:#95a8bd;
}
html,body,.workspace,.page { background:var(--canvas); color:var(--ink); }
.topbar { background:#0d1728; border-bottom-color:#22334c; }
.workspace-tabs { background:#0d1728; border-bottom-color:#2a3b55; }
.toolbar { border-bottom-color:#2a3b55; }
.toolbar h2,.topbar h1,.section-title,.section-heading .section-title { color:var(--ink); }
.toolbar p,.toolbar-note,.subtle,.detail-meta,.metric-note { color:var(--ink-muted); }
.panel,.metric,.metric-card,.summary-card,.role-card,.schedule-kpi,
.operation-connector-card,.work-card,.work-filter-bar,.order-material-card,
.order-lines-card,.schedule-card,.schedule-product,.schedule-product-picker,
.attachment-card,.finance-invoice-preview,.detail-module,
.detail-more-fields,.styling-editor-section,.catalog-model-profile-row,
.hr-department-card,.hr-directory-editor,.hr-role-mapping-editor,
.hr-role-mapping-row,.hr-import-preview,.hr-organization-quick-person,
.hr-organization-quick-role,.hr-performance-grid article { background:var(--surface); border-color:var(--surface-line); color:var(--ink-soft); }
.panel-head,.dashboard-module-head,.detail-module-head { background:var(--surface-raised); border-bottom-color:var(--surface-line); }
.panel-head h3,.dashboard-module-name,.dashboard-module-name span,.work-card h3,
.schedule-card-head strong,.schedule-product-copy strong,.operation-connector-card strong,
.hr-section-title,.hr-department-card strong { color:var(--ink); }
.panel-head > div > span,.panel-head > div > p { color:var(--ink-muted); }
.panel-head a,.action-link,a { color:#8ec5ff; }
.panel-head a:hover,.action-link:hover,a:hover { color:#b7dcff; }
.search,.top-actions select,.user-menu,.icon-button,.secondary,
.filter-chip,.work-filter-bar input,.work-filter-bar select,
.dashboard-toolbar select,.operation-data-hero-actions input,
.operation-data-filters input,.operation-data-filters select,
.finance-invoice-toolbar input,.finance-invoice-toolbar select { color:var(--ink-soft); background:var(--surface-raised); border-color:var(--line-strong); }
.search input { color:var(--ink); background:transparent; }
.search input::placeholder,input::placeholder,textarea::placeholder { color:#8196ad; opacity:1; }
.icon-button:hover,.secondary:hover,.user-menu:hover,.filter-chip:hover { color:#d9fff8; background:#203650; border-color:#58d8c5; }
.primary,.auth-submit { color:#062d2a; background:#56d8c5; border-color:#56d8c5; }
.primary:hover,.auth-submit:hover { color:#052622; background:#9af5e6; border-color:#9af5e6; }
.product-table th,.data-table th,.order-line-table th,.hr-table th { color:#cbd8e7; background:#17263b; border-bottom-color:#3d5572; }
.product-table td,.data-table td,.order-line-table td,.hr-table td { color:var(--ink-soft); border-bottom-color:#22334b; }
.product-table tbody tr:hover td,.data-table tbody tr:hover td,.order-line-table tbody tr:hover td,.hr-table tbody tr:hover td { background:#172840; }
.table-wrap { background:var(--surface); border-color:var(--surface-line); }
.empty-state,.permission-empty { color:#a5b5c7; background:#111e32; border-color:#425a76; }
.empty-state strong,.permission-empty strong { color:#eef4fb; }
.fields,.sku-grid { background:#0d1728; border-color:#3b526f; }
.field { background:#111e32; border-color:#2b405b; }
.field label { color:#9fb1c4; }
.field strong { color:#f4f7fb; }
.field input,.field select,.field textarea,
.form input,.form select,.form textarea,.dialog input,.dialog select,.dialog textarea,
input,select,textarea { color:#f1f5f9; background:#17263b; border-color:#425a76; }
input:focus,select:focus,textarea:focus { border-color:#2bc7b2; box-shadow:0 0 0 3px rgba(43,199,178,.16); }
.form-footer { color:var(--ink-soft); background:#17263b; border-top-color:#2a3b55; }
.role-banner,.schedule-hero,.privacy-notice,.hr-hero,.hr-import-dropzone,
.model-scene-reference .image-drop { color:var(--ink-soft); background:#163044; border-color:#315771; }
.schedule-card-note,.schedule-communication-notes,.schedule-product-details,
.operation-data-note,.finance-invoice-preview,.order-product-summary { color:#b9c9da; background:#172f4b; border-color:#315b7c; }
.inline-warning,.provider-notice { color:#ffe0a0; background:#342a1b; border-color:#755725; }
.inline-success { color:#c3f6d7; background:#123a30; border-color:#2b775c; }
.dialog,.dialog-inner { color:var(--ink-soft); background:#0f1a2d; border-color:#415977; }
.dialog-head { background:#111e32; border-bottom-color:#2a3b55; }
.dialog-head h2,.detail-title { color:var(--ink); }
.dashboard-hero { background:#111c2d; border-color:#2a3b55; }
.dashboard-module-row,.attention-item,.risk-item,.feed li { background:var(--surface); border-bottom-color:#22334b; }
.dashboard-module-row:hover,.attention-item:hover,.risk-item:hover { background:#172840; }
.dashboard-module-head { color:#9eb0c5; }
.dashboard-chart-empty { background:#0d1728; }
.topbar-kicker { color:#7f95ad; }
.sidebar-toggle { color:#c2d0df; background:#17253a; border-color:#3d5572; }
.sidebar-toggle:hover { color:#d9fff8; background:#203650; border-color:#58d8c5; }
.app-shell[data-sidebar-collapsed="true"] .sidebar { background:#08111f; }

@media (max-width:760px) {
  .topbar,.workspace-tabs { background:#0d1728; }
  .panel-head { background:#17253a; }
}

/* 2026-08-30 workflow-role-ui-final=20260830 */
.pattern-progress {
  color:#234047 !important;
  background:#f5faf9 !important;
  border-color:#b8d8d2 !important;
}
.pattern-progress-head,
.pattern-progress-meta,
.pattern-progress-next { color:#234047 !important; }
.pattern-progress-head strong { color:#1d3b42 !important; }
.pattern-progress-meta { color:#49676c !important; }
.pattern-progress-next span { color:#0f766e !important; }
.pattern-progress-track { background:#c6dcd8 !important; }
.pattern-progress-track i { background:#18877e !important; }
.pattern-progress-mode { color:#0f766e !important; background:#dff2ee !important; border-color:#b8d8d2 !important; }
.pattern-progress-mode.external { color:#9a5c15 !important; background:#fff1d6 !important; border-color:#e7c98e !important; }

/* 2026-08-30 ui-visual-rebuild=20260830
   Presentation layer rebuild: the workspace is organized as a focused
   operating surface instead of a stack of decorative cards. Existing data,
   permissions and data-* event contracts remain unchanged. */
:root {
  --canvas:#0a1322;
  --surface:#101d30;
  --surface-raised:#14243a;
  --surface-elevated:#192b43;
  --surface-line:#29415d;
  --ink:#eef4fa;
  --ink-soft:#bdcad9;
  --ink-muted:#8298ae;
  --accent:#57d8c5;
  --accent-soft:#173e46;
  --accent-ink:#062d2a;
  --warning:#f0c36b;
  --danger:#ff8e9f;
}

html,body,.workspace,.page { background:var(--canvas); color:var(--ink); }
body { min-width:320px; }
.app-shell { grid-template-columns:264px minmax(0,1fr); background:var(--canvas); }
.sidebar {
  padding:22px 15px 16px;
  background:#0b1726;
  border-right:1px solid #20364f;
  box-shadow:none;
}
.sidebar .nav { margin-top:24px; gap:5px; }
.nav-group { gap:4px; }
.nav-group-trigger {
  min-height:34px;
  padding-inline:12px;
  color:#8fa5ba;
  border-radius:7px;
  letter-spacing:.03em;
}
.nav-group-trigger span,.nav-group-trigger i { color:#718aa2; }
.nav-group-trigger:hover { color:var(--ink); background:#13253b; }
.nav-group-menu { margin-left:8px; padding-left:9px; border-left-color:#243b56; }
.nav-item {
  min-height:41px;
  padding-inline:12px;
  color:#b6c5d5;
  border:1px solid transparent;
  border-radius:8px;
  transition:background .16s ease,border-color .16s ease,color .16s ease;
}
.nav-item span { color:#7f97ad; }
.nav-item:hover { color:#f7fbff; background:#152a42; border-color:#294760; transform:none; }
.nav-item.active,.nav-dashboard-entry.active,.nav-group-menu .nav-item.active {
  color:#eafffb;
  background:var(--accent-soft);
  border-color:#2c8f8e;
  box-shadow:inset 3px 0 0 var(--accent);
}
.nav-item.active span { color:var(--accent); }
.nav-item b { background:#c94b63; }
.sidebar-footer { color:#7f96ad; border-top-color:#20364f; }
.online-dot { background:#65d6a1; }

.topbar {
  height:88px;
  padding-inline:34px;
  background:#0b1727;
  border-bottom:1px solid #20364f;
  box-shadow:none;
}
.topbar > .topbar-heading { display:flex; align-items:center; gap:14px; }
.topbar-heading { gap:14px; }
.topbar-title-group { display:grid; gap:1px; }
.topbar-kicker { color:#7890a8; font-size:11px; letter-spacing:.06em; }
.topbar h1 { color:var(--ink); font-size:24px; letter-spacing:-.015em; }
.sidebar-toggle { background:var(--surface-raised); border-color:#3a5573; }
.sidebar-toggle:hover { color:var(--accent); background:#1a314b; border-color:#4fc9bc; }
.top-actions { gap:8px; }
.search { width:320px; background:#111f33; border-color:#355271; }
.search input { color:var(--ink); }
.top-actions select,.user-menu,.icon-button,.secondary { background:#14243a; border-color:#355271; color:var(--ink-soft); }
.top-actions select:hover,.user-menu:hover,.icon-button:hover,.secondary:hover { background:#1a314b; border-color:#4fc9bc; color:#eafffb; }
.primary { color:var(--accent-ink); background:var(--accent); border-color:var(--accent); box-shadow:none; }
.primary:hover { color:#041e1c; background:#8cecdf; border-color:#8cecdf; box-shadow:none; }
.workspace-tabs { min-height:42px; padding:6px 34px; background:#0b1727; border-bottom-color:#20364f; }
.workspace-tab { min-height:30px; border:0; border-radius:6px; color:#8fa5ba; background:transparent; }
.workspace-tab:hover { color:var(--ink); background:#14243a; }
.workspace-tab.active { color:var(--accent); background:#142c35; border-color:#2c8f8e; box-shadow:none; }
.workspace-tab-close { border-left-color:#355271; }

.page {
  width:min(calc(100% - 48px),1380px);
  max-width:none;
  margin:0 auto;
  padding:28px 0 60px;
}
.toolbar {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:24px;
  margin-bottom:22px;
  padding-bottom:20px;
  border-bottom:1px solid #223a55;
}
.toolbar-copy { display:grid; gap:4px; min-width:0; }
.toolbar-copy .eyebrow { color:#7f96ad; }
.toolbar h2 { color:var(--ink); font-size:28px; letter-spacing:-.02em; }
.toolbar p,.toolbar-note { max-width:70ch; color:var(--ink-muted); }
.toolbar-actions { align-self:end; }
.filters { gap:7px; }
.filter-chip { min-height:34px; color:var(--ink-soft); background:#14243a; border-color:#355271; }
.filter-chip.selected { color:var(--accent); background:#173e46; border-color:#2c8f8e; }

.panel,.metric,.metric-card,.summary-card,.role-card,.schedule-kpi,
.operation-connector-card,.work-card,.work-filter-bar,.order-material-card,
.order-lines-card,.schedule-card,.schedule-product,.schedule-product-picker,
.attachment-card,.finance-invoice-preview,.detail-module,
.detail-more-fields,.styling-editor-section,.catalog-model-profile-row,
.hr-department-card,.hr-directory-editor,.hr-role-mapping-editor,
.hr-role-mapping-row,.hr-import-preview,.hr-organization-quick-person,
.hr-organization-quick-role,.hr-performance-grid article {
  background:var(--surface);
  border-color:var(--surface-line);
  border-radius:10px;
  box-shadow:none;
}
.panel-head { min-height:70px; padding:17px 20px; background:var(--surface-raised); border-bottom-color:var(--surface-line); }
.panel-head h3 { color:var(--ink); font-size:15px; }
.panel-kicker { color:#78a5af; font-size:10px; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
.panel-head-actions { display:flex; gap:8px; align-items:center; }
.metrics { gap:0; padding:0; background:var(--surface); border:1px solid var(--surface-line); border-radius:10px; overflow:hidden; }
.metrics .metric { min-height:104px; border:0; border-right:1px solid var(--surface-line); border-radius:0; background:transparent; box-shadow:none; }
.metrics .metric:last-child { border-right:0; }
.metric-label { color:#8aa0b5; }
.metric-value { color:var(--ink); }
.metric-note { color:var(--ink-muted); }
.dashboard-kpi-card,.dashboard-sales-card,.dashboard-module-card,.dashboard-intelligence-card { background:#132238; border-color:#29415d; box-shadow:none; }
.dashboard-hero,.dashboard-intelligence { background:var(--surface); border-color:var(--surface-line); box-shadow:none; }
.dashboard-module-grid { padding:16px; }
.dashboard-module-card { border-radius:8px; }

.product-center-toolbar { margin-bottom:20px; }
.product-workbench-panel { overflow:hidden; }
.product-list-head { align-items:center; }
.product-list-head h3 { margin-top:2px; font-size:17px; }
.product-list-legend {
  display:grid;
  grid-template-columns:1.2fr 1.45fr 1.35fr 1fr 1.15fr 96px;
  gap:14px;
  padding:10px 22px;
  color:#718aa2;
  background:#0d192a;
  border-bottom:1px solid #243b56;
  font-size:10px;
  font-weight:750;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.product-workbench-panel .table-wrap { overflow:visible; background:var(--surface); }
.product-workbench-table {
  width:100%;
  min-width:0;
  border-collapse:separate;
  border-spacing:0 8px;
}
.product-workbench-table thead { display:none; }
.product-workbench-table tbody {
  display:grid;
  gap:8px;
  padding:8px 12px 14px;
}
.product-workbench-table tbody tr {
  display:grid;
  grid-template-columns:86px 64px minmax(120px,1fr) minmax(100px,.85fr) minmax(110px,.8fr) minmax(150px,1.15fr) minmax(120px,.95fr) minmax(130px,1fr) minmax(90px,.7fr) 96px;
  align-items:center;
  min-height:112px;
  padding:14px 12px;
  border:1px solid #29415d;
  border-radius:10px;
  background:#111f33;
  transition:border-color .16s ease,background .16s ease;
}
.product-workbench-table tbody tr:hover { background:#15273e; border-color:#3b647e; }
.product-workbench-table tbody td {
  display:block;
  min-width:0;
  width:auto !important;
  max-width:none !important;
  padding:0 8px;
  border:0;
  color:var(--ink-soft);
  vertical-align:middle;
}
.product-workbench-table tbody td::before { display:none; }
.product-workbench-table tbody td:first-child { padding-left:0; }
.product-workbench-table tbody td:last-child { padding-right:0; }
.product-workbench-table .style-code { color:#8fc7ff; font-size:16px; }
.product-workbench-table .product-image { width:64px; height:84px; border-color:#49647e; border-radius:8px; }
.product-workbench-table .stack { gap:4px; }
.product-workbench-table td:nth-child(3) strong,
.product-workbench-table td:nth-child(4) strong,
.product-workbench-table td:nth-child(7) strong { color:#e9f1f8; font-size:13px; }
.product-workbench-table td:nth-child(8) strong { color:#eaf3fb; }
.product-workbench-table .subtle { color:#8399ae; }
.product-workbench-table .tag { border-radius:999px; }
.product-workbench-table .product-row-actions { display:flex; flex-direction:column; align-items:stretch; gap:6px; min-width:0; }
.product-workbench-table .product-row-actions .action-button { width:100%; min-height:31px; padding-inline:8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.product-workbench-table .product-row-actions .row-action-menu { width:100%; }
.product-workbench-table .row-action-menu-trigger { width:100%; min-height:31px; }
.product-workbench-table .row-action-menu-panel { right:0; left:auto; min-width:150px; background:#122137; border-color:#3b5876; box-shadow:0 14px 30px rgba(0,0,0,.25); }
.product-workbench-table tbody tr:has(.empty-state) { display:block; min-height:0; padding:0; border:0; background:transparent; }
.product-workbench-table tbody tr:has(.empty-state) td { display:block; padding:0; }
.product-workbench-table + .pagination,.product-workbench-panel .pagination { border-top:1px solid var(--surface-line); background:#0f1b2d; }

.table-wrap { max-width:100%; overflow:auto; overscroll-behavior-x:contain; background:var(--surface); }
.product-table:not(.product-workbench-table) { min-width:720px; }
.product-table th,.data-table th,.order-line-table th,.hr-table th { color:#9cb0c4; background:#16263d; border-bottom-color:#3b5572; }
.product-table td,.data-table td,.order-line-table td,.hr-table td { color:var(--ink-soft); border-bottom-color:#243b56; }
.product-table tbody tr:hover td,.data-table tbody tr:hover td,.order-line-table tbody tr:hover td,.hr-table tbody tr:hover td { background:#15273e; }
.pattern-progress { color:#dcebea !important; background:#122c35 !important; border-color:#2a6e72 !important; }
.pattern-progress-head,.pattern-progress-meta,.pattern-progress-next { color:#c7d8da !important; }
.pattern-progress-head strong { color:#effcf9 !important; }
.pattern-progress-meta { color:#90b6b9 !important; }
.pattern-progress-next span { color:var(--accent) !important; }
.pattern-progress-track { background:#28434a !important; }
.pattern-progress-track i { background:#48c7b5 !important; }
.pattern-progress-mode { color:#adf1e5 !important; background:#173e46 !important; border-color:#2c8f8e !important; }
.pattern-progress-mode.external { color:#f5d38c !important; background:#40351f !important; border-color:#79612a !important; }

input,select,textarea,.form input,.form select,.form textarea,.dialog input,.dialog select,.dialog textarea {
  color:var(--ink);
  background:#172940;
  border-color:#3d5a79;
}
input::placeholder,textarea::placeholder { color:#7890a8; }
input:focus,select:focus,textarea:focus { border-color:#48c7b5; box-shadow:0 0 0 3px rgba(72,199,181,.16); }
.dialog,.dialog-inner { color:var(--ink-soft); background:#0f1a2c; border-color:#3b5876; }
.dialog-head { background:#14243a; border-bottom-color:#2b4562; }
.dialog-head h2 { color:var(--ink); }
.form-footer { background:#14243a; border-top-color:#2a425e; }

@media (max-width:1180px) {
  .page { width:min(calc(100% - 40px),1380px); }
  .product-list-legend { grid-template-columns:1.1fr 1.3fr 1.15fr 1fr 1fr 88px; }
  .product-workbench-table tbody tr {
    grid-template-columns:86px 64px minmax(150px,1.2fr) 106px;
    grid-template-areas:
      "style image identity actions"
      "style image category actions"
      "stage progress owner actions"
      "attributes attributes matches actions";
    row-gap:11px;
  }
  .product-workbench-table td:nth-child(1) { grid-area:style; }
  .product-workbench-table td:nth-child(2) { grid-area:image; }
  .product-workbench-table td:nth-child(3) { grid-area:identity; }
  .product-workbench-table td:nth-child(4) { grid-area:category; }
  .product-workbench-table td:nth-child(5) { grid-area:stage; }
  .product-workbench-table td:nth-child(6) { grid-area:progress; }
  .product-workbench-table td:nth-child(7) { grid-area:owner; }
  .product-workbench-table td:nth-child(8) { grid-area:attributes; }
  .product-workbench-table td:nth-child(9) { grid-area:matches; }
  .product-workbench-table td:nth-child(10) { grid-area:actions; }
  .product-workbench-table tbody td::before { display:block; margin-bottom:3px; content:attr(data-label); color:#6f87a0; font-size:9px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
}
@media (max-width:760px) {
  .app-shell,.app-shell[data-sidebar-collapsed="true"] { display:block; }
  .sidebar,.app-shell[data-sidebar-collapsed="true"] .sidebar { background:#0b1726; border-bottom-color:#20364f; }
  .nav,.app-shell[data-sidebar-collapsed="true"] .nav { gap:5px; }
  .nav,.app-shell[data-sidebar-collapsed="true"] .nav { height:42px; min-height:42px; max-height:42px; overflow-x:auto; overflow-y:hidden; }
  .nav-group-trigger,.nav-item,.app-shell[data-sidebar-collapsed="true"] .nav-group-trigger,.app-shell[data-sidebar-collapsed="true"] .nav-item { background:#102038; border-color:#29415d; }
  .nav-item.active,.nav-dashboard-entry.active,.nav-group-menu .nav-item.active { background:#173e46; border-color:#2c8f8e; }
  .topbar { height:auto; min-height:0; align-items:flex-start; background:#0b1727; border-bottom-color:#20364f; }
  .topbar > .topbar-heading { display:flex; align-items:flex-start; min-height:50px; }
  .topbar-title-group { padding-top:1px; }
  .top-actions { min-height:0; }
  .topbar h1 { font-size:21px; }
  .page { width:auto; margin:0; padding:20px 14px 42px; }
  .toolbar { grid-template-columns:1fr; gap:14px; align-items:start; }
  .toolbar h2 { font-size:24px; }
  .toolbar-actions { width:100%; }
  .toolbar-actions .filter-chip { flex:1 1 auto; }
  .product-list-legend { display:none; }
  .product-workbench-table tbody { padding:8px 8px 12px; }
  .product-workbench-table tbody tr {
    grid-template-columns:minmax(0,1fr) 96px;
    grid-template-areas:
      "style image"
      "identity image"
      "category actions"
      "stage actions"
      "progress actions"
      "owner actions"
      "attributes matches";
    min-height:0;
    padding:14px 13px;
    row-gap:12px;
  }
  .product-workbench-table tbody td { padding:0 5px; }
  .product-workbench-table tbody td:first-child { padding-left:0; }
  .product-workbench-table tbody td:last-child { padding-right:0; }
  .product-workbench-table .product-image { width:64px; height:84px; }
  .product-workbench-table .product-row-actions { align-self:stretch; justify-content:start; }
  .product-workbench-table tbody td::before { display:block; }
  .product-workbench-table td:nth-child(1) { grid-area:style; }
  .product-workbench-table td:nth-child(2) { grid-area:image; }
  .product-workbench-table td:nth-child(3) { grid-area:identity; }
  .product-workbench-table td:nth-child(4) { grid-area:category; }
  .product-workbench-table td:nth-child(5) { grid-area:stage; }
  .product-workbench-table td:nth-child(6) { grid-area:progress; }
  .product-workbench-table td:nth-child(7) { grid-area:owner; }
  .product-workbench-table td:nth-child(8) { grid-area:attributes; }
  .product-workbench-table td:nth-child(9) { grid-area:matches; }
  .product-workbench-table td:nth-child(10) { grid-area:actions; }
  .metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .metrics .metric { border-right:1px solid var(--surface-line); border-bottom:1px solid var(--surface-line); }
  .metrics .metric:nth-child(2n) { border-right:0; }
  .metrics .metric:nth-last-child(-n+2) { border-bottom:0; }
}
@media (prefers-reduced-motion:reduce) {
  .product-workbench-table tbody tr,.nav-item,.sidebar-toggle { transition:none !important; }
}

/* 2026-08-30 workflow-status-action-merge=20260830
   One row should communicate one flow state. The pattern progress card owns
   the current stage, mode and percentage; the action rail gets enough width
   for a readable primary action and edit entry without character wrapping. */
.product-workbench-table tbody tr {
  grid-template-columns:86px 64px minmax(120px,1fr) minmax(100px,.85fr) minmax(240px,1.35fr) minmax(120px,.95fr) minmax(130px,1fr) minmax(90px,.7fr) 168px;
}
.product-workbench-table td:nth-child(3) strong,
.product-workbench-table td:nth-child(4) strong,
.product-workbench-table td:nth-child(6) strong { color:#e9f1f8; font-size:13px; }
.product-workbench-table td:nth-child(7) strong { color:#eaf3fb; }
.product-workbench-table tbody td:nth-child(5) > .stack {
  min-width:0;
  gap:6px;
}
.product-workbench-table tbody td:nth-child(5) .pattern-progress {
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  overflow:hidden;
}
.product-workbench-table tbody td:nth-child(5) .pattern-progress-head {
  min-width:0;
  grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto;
}
.product-workbench-table tbody td:nth-child(5) .pattern-progress-mode,
.product-workbench-table tbody td:nth-child(5) .pattern-progress-head strong,
.product-workbench-table tbody td:nth-child(5) .pattern-progress-head b,
.product-workbench-table tbody td:nth-child(5) .pattern-progress-meta {
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}
.product-workbench-table tbody td:nth-child(5) .pattern-progress-mode,
.product-workbench-table tbody td:nth-child(5) .pattern-progress-head strong { white-space:nowrap; }
.product-workbench-table .product-row-actions {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  min-width:0;
}
.product-workbench-table .product-row-actions .action-button {
  width:auto;
  min-width:0;
  max-width:100%;
  flex:1 1 92px;
  white-space:nowrap;
}
.product-workbench-table .product-row-actions > .action-detail {
  flex:0 0 auto;
}
.product-workbench-table .product-row-actions .row-action-menu {
  width:auto;
  flex:0 0 auto;
}

@media (max-width:1180px) {
  .product-workbench-table tbody tr {
    grid-template-columns:86px 64px minmax(150px,1.2fr) 168px;
    grid-template-areas:
      "style image identity actions"
      "style image category actions"
      "flow flow flow actions"
      "owner owner owner actions"
      "attributes attributes matches actions";
  }
  .product-workbench-table td:nth-child(1) { grid-area:style; }
  .product-workbench-table td:nth-child(2) { grid-area:image; }
  .product-workbench-table td:nth-child(3) { grid-area:identity; }
  .product-workbench-table td:nth-child(4) { grid-area:category; }
  .product-workbench-table td:nth-child(5) { grid-area:flow; }
  .product-workbench-table td:nth-child(6) { grid-area:owner; }
  .product-workbench-table td:nth-child(7) { grid-area:attributes; }
  .product-workbench-table td:nth-child(8) { grid-area:matches; }
  .product-workbench-table td:nth-child(9) { grid-area:actions; }
}

@media (max-width:760px) {
  .product-workbench-table tbody tr {
    grid-template-columns:minmax(0,1fr) 136px;
    grid-template-areas:
      "style image"
      "identity image"
      "category category"
      "flow flow"
      "owner owner"
      "attributes attributes"
      "matches matches"
      "actions actions";
  }
  .product-workbench-table .product-row-actions {
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
    flex-wrap:wrap;
  }
  .product-workbench-table .product-row-actions .action-button,
  .product-workbench-table .product-row-actions .row-action-menu { width:auto; }
  .product-workbench-table .product-row-actions .action-button { flex:0 1 auto; }
}

/* 2026-08-30 workflow-density-tuning=20260830
   Bound the workflow state and action rails so empty space cannot push the
   owner, attributes and next-step content out of alignment. On tablet widths
   the action rail becomes a full-width footer, keeping long labels readable. */
@media (min-width:1181px) {
  .product-workbench-table tbody tr {
    grid-template-columns:
      86px 64px
      minmax(120px,1.1fr)
      minmax(100px,.9fr)
      minmax(190px,260px)
      minmax(120px,.9fr)
      minmax(130px,1fr)
      minmax(90px,.7fr)
      minmax(160px,190px);
  }
  .product-workbench-table tbody td:nth-child(5) .pattern-progress {
    width:min(100%,260px);
    justify-self:start;
  }
  .product-workbench-table .product-row-actions {
    align-content:center;
  }
  .product-workbench-table .product-row-actions > .row-primary-action {
    flex:0 1 auto;
    max-width:220px;
  }
  .product-workbench-table .product-row-actions .action-detail,
  .product-workbench-table .product-row-actions .row-action-menu-trigger {
    flex:0 0 auto;
  }
}

@media (max-width:1180px) {
  .product-workbench-table tbody tr {
    grid-template-columns:86px 64px minmax(0,1fr);
    grid-template-areas:
      "style image identity"
      "style image category"
      "flow flow flow"
      "owner owner owner"
      "attributes attributes matches"
      "actions actions actions";
    row-gap:11px;
  }
  .product-workbench-table .product-row-actions {
    align-items:center;
    justify-content:flex-start;
    padding-top:2px;
  }
  .product-workbench-table .product-row-actions > .row-primary-action {
    flex:0 1 auto;
    max-width:min(260px,100%);
  }
  .product-workbench-table .product-row-actions .action-button,
  .product-workbench-table .product-row-actions .row-action-menu {
    width:auto;
  }
  .product-workbench-table .product-row-actions .action-button {
    flex:0 1 auto;
  }
  .product-workbench-table tbody td:nth-child(5) .pattern-progress {
    width:min(100%,520px);
  }
}

@media (max-width:760px) {
  .product-workbench-table tbody td:nth-child(5) .pattern-progress {
    width:100%;
  }
  .product-workbench-table .product-row-actions > .row-primary-action {
    max-width:calc(100% - 6px);
  }
}

/* 2026-09-02 contract-template-modes=20260902-r75 · image-to-front=gpt-image-2
   Make the transaction mode and frozen appendix scope visible before the
   operator edits the plain-text body. This is intentionally additive: the
   existing contract editor, document versioning and print actions remain the
   source of truth. */
.contract-inclusion-strip {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:0 0 14px;
  padding:10px;
  border:1px solid #d7e3ed;
  border-radius:8px;
  background:#f7fafc;
}
.contract-inclusion-strip span {
  min-width:0;
  padding:8px 10px;
  border:1px solid #e2e9ef;
  border-radius:6px;
  background:#fff;
  color:#31516b;
  font-size:12px;
  line-height:1.45;
  overflow-wrap:anywhere;
}
.contract-inclusion-strip.compact {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:6px 0 0;
  padding:0;
  border:0;
  background:transparent;
}
.contract-inclusion-strip.compact span {
  padding:3px 7px;
  border-radius:999px;
  color:#45657e;
  background:#f3f7fa;
  font-size:10px;
}
.contract-editor-context > div span {
  min-width:0;
  overflow-wrap:anywhere;
}
@media (max-width:760px) {
  .contract-inclusion-strip { grid-template-columns:1fr; gap:6px; padding:8px; }
  .contract-inclusion-strip span { padding:7px 8px; }
}

/* END frontend/assets/visual-system.css */

/* BEGIN frontend/assets/operations-ledger.css */
/* Product Design option 3: operations ledger, 2026-08-30. */
:root {
  --ledger-canvas:#f3f4f6;
  --ledger-surface:#ffffff;
  --ledger-surface-soft:#f8f9fa;
  --ledger-ink:#17191c;
  --ledger-muted:#676d75;
  --ledger-line:#dfe2e6;
  --ledger-line-strong:#c8cdd3;
  --ledger-red:#d92d20;
  --ledger-red-dark:#b42318;
  --ledger-blue:#175cd3;
  --ledger-green:#067647;
  --ledger-amber:#b54708;
  --ledger-nav:#20242a;
  --ledger-nav-hover:#30353d;
}

html { color-scheme:light; background:var(--ledger-canvas); }
body {
  margin:0;
  background:var(--ledger-canvas) !important;
  color:var(--ledger-ink) !important;
  font-family:"IBM Plex Sans","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  letter-spacing:0;
}
::selection { color:#fff; background:var(--ledger-red); }
* { scrollbar-color:#a8adb5 #eceef1; scrollbar-width:thin; }
*::-webkit-scrollbar { width:10px; height:10px; }
*::-webkit-scrollbar-track { background:#eceef1; }
*::-webkit-scrollbar-thumb { border:2px solid #eceef1; border-radius:5px; background:#a8adb5; }
button,input,select,textarea { font:inherit; letter-spacing:0; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible {
  outline:2px solid var(--ledger-blue) !important;
  outline-offset:2px;
}

/* Authentication belongs to the same operating system, not a separate theme. */
.app-shell.auth-mode {
  display:block !important;
  min-height:100vh;
  background:var(--ledger-canvas) !important;
  color-scheme:light !important;
}
.app-shell.auth-mode .workspace.auth-workspace {
  position:relative;
  display:flex !important;
  flex-direction:column;
  min-height:100vh;
  overflow:auto;
  background:var(--ledger-canvas) !important;
  color-scheme:light !important;
}
.app-shell.auth-mode .workspace.auth-workspace::before {
  display:none !important;
}
.app-shell.auth-mode .workspace.auth-workspace::after { display:none !important; }
.app-shell.auth-mode .auth-workspace #page {
  position:relative;
  z-index:1;
  display:grid !important;
  flex:1 0 auto;
  min-height:0 !important;
  padding:clamp(22px,4vw,56px) !important;
  place-items:center !important;
  background:var(--ledger-canvas) !important;
}
.app-shell.auth-mode .auth-shell {
  display:grid !important;
  grid-template-columns:minmax(340px,.88fr) minmax(420px,1.12fr) !important;
  width:min(1040px,100%) !important;
  min-height:584px !important;
  overflow:hidden !important;
  border:1px solid var(--ledger-line-strong) !important;
  border-radius:6px !important;
  background:var(--ledger-surface) !important;
  box-shadow:0 18px 50px rgba(23,25,28,.11) !important;
  animation:none !important;
}
.app-shell.auth-mode .auth-brand-panel {
  position:relative;
  display:flex !important;
  flex-direction:column;
  justify-content:space-between;
  min-height:584px !important;
  padding:52px 48px 38px !important;
  overflow:hidden;
  border:0 !important;
  border-right:1px solid #343940 !important;
  color:#fff !important;
  background:var(--ledger-nav) !important;
}
.app-shell.auth-mode .auth-brand-panel::before {
  display:none !important;
}
.app-shell.auth-mode .auth-brand-panel::after {
  position:absolute;
  right:-90px !important;
  bottom:-110px !important;
  left:auto !important;
  width:280px !important;
  height:280px !important;
  border:1px solid #454b54 !important;
  border-radius:50% !important;
  box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 56px rgba(255,255,255,.015) !important;
  animation:none !important;
  content:"";
}
.app-shell.auth-mode .auth-brand-panel > * { position:relative; z-index:1; }
.app-shell.auth-mode .auth-brand-mark {
  position:relative;
  display:grid;
  width:52px !important;
  height:52px !important;
  margin:0 0 70px !important;
  place-items:center;
  border:1px solid #565d67 !important;
  border-radius:4px !important;
  background:#2a2f36 !important;
  box-shadow:none !important;
  animation:none !important;
}
.app-shell.auth-mode .auth-brand-mark::before {
  position:absolute;
  top:14px;
  left:13px;
  width:22px !important;
  height:17px !important;
  border:2px solid #f4f5f7 !important;
  border-radius:2px !important;
  background:transparent !important;
  content:"";
}
.app-shell.auth-mode .auth-brand-mark::after {
  position:absolute;
  right:11px !important;
  bottom:10px !important;
  width:18px !important;
  height:3px !important;
  border:0 !important;
  border-radius:0 !important;
  background:var(--ledger-red) !important;
  content:"";
}
.app-shell.auth-mode .auth-company {
  margin:0 0 10px !important;
  color:#f1a39d !important;
  font-size:11px !important;
  font-weight:740 !important;
  letter-spacing:0 !important;
}
.app-shell.auth-mode .auth-brand-panel h1 {
  max-width:320px !important;
  margin:0 !important;
  color:#fff !important;
  font-size:34px !important;
  font-weight:730 !important;
  line-height:1.2 !important;
  letter-spacing:0 !important;
  text-wrap:balance;
}
.app-shell.auth-mode .auth-brand-note {
  max-width:300px !important;
  margin:18px 0 0 !important;
  color:#aeb4bd !important;
  font-size:13px !important;
  line-height:1.8 !important;
}
.app-shell.auth-mode .auth-brand-footer {
  display:flex !important;
  align-items:center;
  gap:8px;
  padding-top:18px !important;
  border-top:1px solid #3a4048 !important;
  color:#aeb4bd !important;
  font-size:11px !important;
}
.app-shell.auth-mode .auth-brand-footer .online-dot {
  display:block !important;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#17b26a !important;
  box-shadow:0 0 0 3px rgba(23,178,106,.14);
}
.app-shell.auth-mode .auth-panel {
  position:relative;
  display:flex !important;
  flex-direction:column;
  width:100% !important;
  max-width:none !important;
  min-width:0;
  margin:0 !important;
  padding:54px 62px 38px !important;
  color:var(--ledger-ink) !important;
  background:#fff !important;
  color-scheme:light !important;
}
.app-shell.auth-mode .auth-panel::before { display:none !important; }
.app-shell.auth-mode .auth-kicker {
  margin:0 0 8px !important;
  color:var(--ledger-red) !important;
  font-size:10px !important;
  font-weight:780 !important;
  line-height:1.4 !important;
  letter-spacing:0 !important;
}
.app-shell.auth-mode .auth-visible-title {
  margin:0 !important;
  color:var(--ledger-ink) !important;
  font-size:28px !important;
  font-weight:730 !important;
  line-height:1.25 !important;
  letter-spacing:0 !important;
}
.app-shell.auth-mode .auth-intro {
  margin:8px 0 28px !important;
  color:var(--ledger-muted) !important;
  font-size:13px !important;
  line-height:1.7 !important;
}
.app-shell.auth-mode .auth-method-tabs {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 !important;
  margin:0 0 26px !important;
  padding:0 !important;
  border:0 !important;
  border-bottom:1px solid var(--ledger-line) !important;
  border-radius:0 !important;
  background:transparent !important;
}
.app-shell.auth-mode .auth-method-tab {
  position:relative;
  min-height:40px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#4f555d !important;
  box-shadow:none !important;
  font-size:12px !important;
  font-weight:720 !important;
  cursor:pointer;
  transform:none !important;
}
.app-shell.auth-mode .auth-method-tab:hover,
.app-shell.auth-mode .auth-method-tab:focus-visible {
  color:var(--ledger-red) !important;
  background:#faf7f5 !important;
  outline:0;
}
.app-shell.auth-mode .auth-method-tab.active { color:var(--ledger-ink) !important; }
.app-shell.auth-mode .auth-method-tab.active::after {
  position:absolute;
  right:0;
  bottom:-1px;
  left:0;
  height:2px;
  background:var(--ledger-red);
  content:"";
}
.app-shell.auth-mode .auth-method-tab:disabled { color:#858b92 !important; cursor:not-allowed; }
.app-shell.auth-mode .auth-form {
  display:grid !important;
  gap:15px !important;
  margin:0 !important;
  padding:0 !important;
}
.app-shell.auth-mode .auth-form label {
  display:grid;
  gap:7px !important;
  color:#3d4249 !important;
  font-size:11px !important;
  font-weight:690 !important;
}
.app-shell.auth-mode .auth-form input {
  width:100% !important;
  height:46px !important;
  min-height:46px !important;
  padding:0 12px !important;
  border:1px solid var(--ledger-line-strong) !important;
  border-radius:4px !important;
  background:#fff !important;
  color:var(--ledger-ink) !important;
  color-scheme:light !important;
  box-shadow:inset 0 1px 1px rgba(23,25,28,.025) !important;
}
.app-shell.auth-mode .auth-form input:hover { border-color:#959ba3 !important; }
.app-shell.auth-mode .auth-form input:focus {
  border-color:var(--ledger-blue) !important;
  outline:2px solid rgba(23,92,211,.14) !important;
  outline-offset:0 !important;
  box-shadow:none !important;
}
.app-shell.auth-mode .auth-form input:-webkit-autofill,
.app-shell.auth-mode .auth-form input:-webkit-autofill:hover,
.app-shell.auth-mode .auth-form input:-webkit-autofill:focus {
  -webkit-text-fill-color:var(--ledger-ink) !important;
  -webkit-box-shadow:0 0 0 1000px #fff inset !important;
  transition:background-color 9999s ease-out 0s;
}
.app-shell.auth-mode .password-field { position:relative; }
.app-shell.auth-mode .password-field input { padding-right:60px !important; }
.app-shell.auth-mode .password-toggle {
  position:absolute;
  top:1px;
  right:1px;
  width:56px !important;
  height:44px !important;
  border:0 !important;
  border-left:1px solid #eceef0 !important;
  border-radius:0 3px 3px 0 !important;
  background:#f8f9fa !important;
  color:#5f656d !important;
  font-size:11px !important;
}
.app-shell.auth-mode .password-toggle:hover { color:var(--ledger-red) !important; }
.app-shell.auth-mode .auth-form-hint {
  color:#7c828a !important;
  font-size:10px !important;
  line-height:1.55 !important;
}
.app-shell.auth-mode .auth-submit {
  position:relative;
  width:100% !important;
  min-height:46px !important;
  margin-top:4px !important;
  overflow:hidden;
  border:1px solid var(--ledger-red) !important;
  border-radius:4px !important;
  background:var(--ledger-red) !important;
  color:#fff !important;
  box-shadow:none !important;
  font-size:12px !important;
  font-weight:730 !important;
  transform:none !important;
}
.app-shell.auth-mode .auth-submit::after { display:none !important; }
.app-shell.auth-mode .auth-submit:hover { border-color:var(--ledger-red-dark) !important; background:var(--ledger-red-dark) !important; transform:none !important; }
.app-shell.auth-mode .auth-submit:disabled { cursor:wait; opacity:.65; }
.app-shell.auth-mode .auth-register-link {
  align-self:center !important;
  margin-top:18px !important;
  border:0 !important;
  background:transparent !important;
  color:#555b63 !important;
  font-size:11px !important;
  font-weight:650 !important;
}
.app-shell.auth-mode .auth-register-link:hover { color:var(--ledger-red) !important; }
.app-shell.auth-mode .auth-error {
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:4px !important;
  background:transparent !important;
  color:var(--ledger-red-dark) !important;
  font-size:11px !important;
  line-height:1.55 !important;
}
.app-shell.auth-mode .auth-error:empty { display:none !important; }
.app-shell.auth-mode .auth-error:not(:empty) {
  display:block !important;
  margin-top:12px !important;
  padding:10px 11px !important;
  border:1px solid #f0b9b4 !important;
  background:#fff5f4 !important;
}
.app-shell.auth-mode .auth-error.auth-success { border-color:#9bd2b9 !important; background:#f0faf5 !important; color:var(--ledger-green) !important; }
.app-shell.auth-mode .auth-error.auth-warning { border-color:#f1c98b !important; background:#fff8e9 !important; color:#8b5a13 !important; }
.app-shell.auth-mode .tenant-login-details {
  margin:0 !important;
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  background:#f8f9fa !important;
}
.app-shell.auth-mode .tenant-login-details summary {
  padding:10px 12px !important;
  color:#555b63 !important;
  font-size:11px !important;
  font-weight:660 !important;
}
.app-shell.auth-mode .tenant-login-details[open] summary { border-bottom:1px solid var(--ledger-line) !important; }
.app-shell.auth-mode .tenant-login-details label { margin:12px !important; }
.app-shell.auth-mode .tenant-login-details small { margin:0 12px 12px !important; color:#777d85 !important; }
.app-shell.auth-mode .sms-code-field { display:grid; grid-template-columns:minmax(0,1fr) 112px; gap:8px; }
.app-shell.auth-mode .sms-code-button {
  min-height:46px !important;
  border:1px solid var(--ledger-line-strong) !important;
  border-radius:4px !important;
  background:#f8f9fa !important;
  color:#3d4249 !important;
  font-size:11px !important;
}
.app-shell.auth-mode .sms-code-button:hover { border-color:#959ba3 !important; background:#f1f2f4 !important; }

.app-shell:not(.auth-mode),
.app-shell:not(.auth-mode)[data-sidebar-collapsed="false"] {
  display:grid !important;
  grid-template-columns:88px minmax(0,1fr) !important;
  min-height:100vh;
  background:var(--ledger-canvas) !important;
}
.app-shell:not(.auth-mode)[data-sidebar-collapsed="true"] { grid-template-columns:0 minmax(0,1fr) !important; }
.app-shell:not(.auth-mode)[data-sidebar-collapsed="true"] .sidebar { transform:translateX(-100%); }

.app-shell:not(.auth-mode) .sidebar {
  position:sticky;
  top:0;
  z-index:40;
  display:grid;
  grid-template-rows:minmax(0,1fr) 42px;
  width:88px !important;
  height:100vh;
  min-width:88px !important;
  overflow:hidden;
  border:0 !important;
  border-right:1px solid #121519 !important;
  background:var(--ledger-nav) !important;
  padding:0 !important;
  box-shadow:none !important;
  transition:transform .2s cubic-bezier(.2,.8,.2,1);
}
.app-shell:not(.auth-mode) .brand { display:none !important; }
.app-shell:not(.auth-mode) .nav {
  display:flex !important;
  flex-direction:column;
  gap:3px !important;
  min-height:0;
  padding:10px 7px 14px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  background:transparent !important;
  width:100% !important;
  height:auto !important;
  flex:1 1 auto !important;
  box-sizing:border-box !important;
}
.app-shell:not(.auth-mode) .nav-group { display:grid; gap:2px; min-width:0; }
.app-shell:not(.auth-mode) .nav-group-menu { display:grid !important; gap:2px !important; padding:0 !important; }
.app-shell:not(.auth-mode) .nav-group.is-collapsed .nav-group-menu { display:none !important; }
.app-shell:not(.auth-mode) .nav-item,
.app-shell:not(.auth-mode) .nav-group-trigger {
  position:relative;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-direction:column;
  gap:4px !important;
  width:100% !important;
  min-width:0 !important;
  min-height:42px !important;
  padding:5px 3px !important;
  border:0 !important;
  border-radius:4px !important;
  background:transparent !important;
  color:#aeb4bd !important;
  box-shadow:none !important;
  font-size:10px !important;
  font-weight:560 !important;
  line-height:1.15 !important;
  text-align:center !important;
  white-space:normal !important;
  cursor:pointer;
  flex:0 0 auto !important;
  box-sizing:border-box !important;
}
.app-shell:not(.auth-mode) .nav-top-level { min-height:50px !important; }
.app-shell:not(.auth-mode) .nav-item svg,
.app-shell:not(.auth-mode) .nav-group-trigger > svg:first-child { width:18px !important; height:18px !important; flex:0 0 auto; }
.app-shell:not(.auth-mode) .nav-item > span,
.app-shell:not(.auth-mode) .nav-group-trigger > span { display:block; max-width:72px; overflow:hidden; text-overflow:ellipsis; }
.app-shell:not(.auth-mode) .nav-item > span,
.app-shell:not(.auth-mode) .nav-group-trigger > span {
  flex:0 0 auto !important;
  width:auto !important;
  min-width:0 !important;
  white-space:nowrap !important;
  writing-mode:horizontal-tb !important;
}
.app-shell:not(.auth-mode) .nav-item:hover,
.app-shell:not(.auth-mode) .nav-group-trigger:hover { background:var(--ledger-nav-hover) !important; color:#fff !important; }
.app-shell:not(.auth-mode) .nav-item.active,
.app-shell:not(.auth-mode) .nav-dashboard-entry.active,
.app-shell:not(.auth-mode) .nav-group-menu .nav-item.active {
  background:#fff !important;
  color:var(--ledger-ink) !important;
}
.app-shell:not(.auth-mode) .nav-item.active::before {
  position:absolute;
  top:8px;
  bottom:8px;
  left:-7px;
  width:3px;
  background:var(--ledger-red);
  content:"";
}
.app-shell:not(.auth-mode) .nav-group-trigger {
  min-height:34px !important;
  margin-top:5px;
  color:#777f8a !important;
  font-size:9px !important;
  text-transform:none !important;
}
.app-shell:not(.auth-mode) .nav-group-trigger > svg:first-child { width:14px !important; height:14px !important; }
.app-shell:not(.auth-mode) .nav-group-chevron { display:none !important; }
.app-shell:not(.auth-mode) #alertBadge {
  position:absolute;
  top:4px;
  right:7px;
  min-width:16px;
  height:16px;
  padding:0 4px;
  border:2px solid var(--ledger-nav);
  border-radius:8px;
  background:var(--ledger-red) !important;
  color:#fff !important;
  font-size:9px;
  line-height:12px;
}
.app-shell:not(.auth-mode) .sidebar-footer {
  display:flex !important;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:0 4px !important;
  border:0 !important;
  border-top:1px solid #343940 !important;
  background:#191c21 !important;
  color:#aeb4bd !important;
  font-size:9px !important;
}
.app-shell:not(.auth-mode) .sidebar-footer svg { width:13px; height:13px; color:#17b26a; }
.app-shell:not(.auth-mode) .online-dot { display:none !important; }

.app-shell:not(.auth-mode) .workspace {
  min-width:0;
  background:var(--ledger-canvas) !important;
}
.app-shell:not(.auth-mode) .topbar {
  position:sticky;
  top:0;
  z-index:30;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px;
  min-height:68px !important;
  padding:10px 20px !important;
  border:0 !important;
  border-bottom:1px solid var(--ledger-line) !important;
  background:rgba(255,255,255,.98) !important;
  color:var(--ledger-ink) !important;
  box-shadow:none !important;
}
.topbar-heading { display:flex; align-items:center; gap:10px; min-width:0; }
.topbar-title-group { display:grid; gap:1px; min-width:0; }
.topbar-kicker {
  color:var(--ledger-red) !important;
  font-size:10px !important;
  font-weight:760 !important;
  line-height:1.2;
  letter-spacing:0 !important;
  text-transform:none !important;
}
.topbar h1 {
  margin:0 !important;
  color:var(--ledger-ink) !important;
  font-size:20px !important;
  font-weight:720 !important;
  line-height:1.25 !important;
  letter-spacing:0 !important;
}
.topbar .sidebar-toggle,
.topbar .icon-button {
  display:grid;
  place-items:center;
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
  padding:0 !important;
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  background:#fff !important;
  color:#454b53 !important;
  box-shadow:none !important;
}
.topbar .icon-button:hover { border-color:var(--ledger-line-strong) !important; background:var(--ledger-surface-soft) !important; color:var(--ledger-ink) !important; }
.topbar .icon-button svg { width:18px; height:18px; }
.top-actions { display:flex !important; align-items:center !important; justify-content:flex-end; gap:8px !important; min-width:0; }
.top-actions .search {
  display:flex !important;
  align-items:center;
  gap:8px;
  width:min(29vw,330px) !important;
  height:36px !important;
  padding:0 10px !important;
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  background:#f8f9fa !important;
  box-shadow:none !important;
}
.top-actions .search:focus-within { border-color:var(--ledger-blue) !important; background:#fff !important; }
.top-actions .search svg { width:16px; height:16px; color:#787f88; }
.top-actions .search input { width:100%; min-width:0; border:0 !important; outline:0 !important; background:transparent !important; color:var(--ledger-ink) !important; font-size:12px !important; }
.top-actions .search input::placeholder { color:#858b93 !important; }
.tenant-switcher,.user-menu,#logoutButton {
  min-height:34px !important;
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  background:#fff !important;
  color:#353a40 !important;
  box-shadow:none !important;
}
.user-menu { display:grid !important; gap:0 !important; padding:4px 9px !important; text-align:left !important; }
.user-menu small { color:var(--ledger-muted) !important; }
#logoutButton { padding:0 10px !important; }
.activity-badge { background:var(--ledger-red) !important; color:#fff !important; }

.workbench-switcher {
  position:sticky;
  top:68px;
  z-index:24;
  display:flex;
  align-items:center;
  gap:2px;
  min-height:46px;
  padding:6px 20px;
  overflow-x:auto;
  border-bottom:1px solid var(--ledger-line);
  background:#fff;
}
.workbench-switcher[hidden] { display:none !important; }
.workbench-switcher-item {
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:32px;
  padding:0 10px;
  border:0;
  border-radius:3px;
  background:transparent;
  color:#5d636b;
  font-size:11px;
  font-weight:650;
  white-space:nowrap;
  cursor:pointer;
}
.workbench-switcher-item svg { width:14px; height:14px; }
.workbench-switcher-item:hover { background:#f2f3f5; color:var(--ledger-ink); }
.workbench-switcher-item.active { background:#2b2f35; color:#fff; }

.workspace-tabs {
  display:flex !important;
  align-items:end;
  gap:0 !important;
  min-height:36px !important;
  padding:0 20px !important;
  overflow-x:auto;
  border:0 !important;
  border-bottom:1px solid var(--ledger-line) !important;
  background:#f8f9fa !important;
}
.workspace-tabs[hidden] { display:none !important; }
.workspace-tab {
  display:flex;
  align-items:center;
  height:35px !important;
  border:0 !important;
  border-right:1px solid var(--ledger-line) !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#747a82 !important;
}
.workspace-tab:first-child { border-left:1px solid var(--ledger-line) !important; }
.workspace-tab.active { border-top:2px solid var(--ledger-red) !important; background:#fff !important; color:var(--ledger-ink) !important; }
.workspace-tab-main,.workspace-tab-close { height:100%; border:0 !important; background:transparent !important; color:inherit !important; font-size:11px !important; }
.workspace-tab-main { padding:0 12px !important; }
.workspace-tab-close { width:28px; padding:0 !important; }

.page {
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:16px 20px 36px !important;
  color:var(--ledger-ink) !important;
  background:transparent !important;
}
.view-panel { min-width:0; background:transparent !important; }
.view-panel-enter { animation:ledger-enter .24s cubic-bezier(.16,1,.3,1); }
@keyframes ledger-enter { from { opacity:.75; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }

.page .panel,
.dialog-inner,
.activity-panel {
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  background:var(--ledger-surface) !important;
  color:var(--ledger-ink) !important;
  box-shadow:none !important;
}
.page .panel-head {
  min-height:48px;
  padding:11px 14px !important;
  border-bottom:1px solid var(--ledger-line) !important;
  background:#fff !important;
}
.page h2,.page h3,.page h4,.page strong { color:var(--ledger-ink); letter-spacing:0 !important; }
.page h2 { font-size:22px !important; line-height:1.3 !important; }
.page h3 { font-size:14px !important; line-height:1.35 !important; }
.page p,.page .subtle,.page small { color:var(--ledger-muted) !important; }
.eyebrow,.panel-kicker,.dashboard-kicker { letter-spacing:0 !important; text-transform:none !important; }

button.primary,.primary {
  min-height:34px;
  padding:0 12px;
  border:1px solid var(--ledger-red) !important;
  border-radius:4px !important;
  background:var(--ledger-red) !important;
  color:#fff !important;
  box-shadow:none !important;
  font-weight:680 !important;
}
button.primary:hover,.primary:hover { border-color:var(--ledger-red-dark) !important; background:var(--ledger-red-dark) !important; }
button.secondary,.secondary,.filter-chip {
  min-height:34px;
  padding:0 11px;
  border:1px solid var(--ledger-line-strong) !important;
  border-radius:4px !important;
  background:#fff !important;
  color:#3f454c !important;
  box-shadow:none !important;
  font-weight:620 !important;
}
button.secondary:hover,.secondary:hover,.filter-chip:hover { background:#f5f6f7 !important; color:var(--ledger-ink) !important; }
.filter-chip.selected { border-color:#23272d !important; background:#23272d !important; color:#fff !important; }
button svg { width:15px; height:15px; }
input,select,textarea {
  border:1px solid var(--ledger-line-strong) !important;
  border-radius:4px !important;
  background:#fff !important;
  color:var(--ledger-ink) !important;
  box-shadow:none !important;
}

.ledger-summary {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin:0 0 12px;
  border:1px solid var(--ledger-line);
  border-radius:4px;
  background:#fff;
}
.ledger-summary-item {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:58px;
  padding:9px 14px;
  border-right:1px solid var(--ledger-line);
}
.ledger-summary-item:last-child { border-right:0; }
.ledger-summary-item span { color:#70767e; font-size:11px; font-weight:650; }
.ledger-summary-item strong { color:var(--ledger-ink); font-size:24px; font-weight:720; font-variant-numeric:tabular-nums; }
.ledger-summary-item.pending strong { color:var(--ledger-amber); }
.ledger-summary-item.risk strong { color:var(--ledger-red); }

.product-center-toolbar {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  grid-template-areas:"copy actions" "filters filters";
  align-items:end !important;
  gap:12px 18px !important;
  margin:0 0 12px !important;
  padding:14px !important;
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  background:#fff !important;
}
.product-center-toolbar .toolbar-copy { grid-area:copy; }
.product-center-toolbar .toolbar-copy h2 { margin:0 0 4px !important; }
.product-center-toolbar .toolbar-copy p { margin:0 !important; max-width:72ch; font-size:12px !important; }
.product-center-toolbar > .toolbar-actions.filters {
  grid-area:filters;
  display:flex !important;
  align-items:center;
  gap:6px !important;
  width:100% !important;
  padding-top:10px;
  overflow-x:auto;
  border-top:1px solid var(--ledger-line);
}
.product-center-toolbar .filter-chip { flex:0 0 auto !important; min-height:29px !important; padding:0 10px !important; font-size:11px !important; }
.ledger-toolbar-actions { grid-area:actions; display:flex; align-items:center; justify-content:flex-end; gap:7px; flex-wrap:wrap; }
.ledger-toolbar-actions button,.ledger-inspector-actions button { display:inline-flex; align-items:center; justify-content:center; gap:6px; font-size:11px; white-space:nowrap; }

.product-ledger-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 326px;
  align-items:start;
  gap:12px;
  min-width:0;
}
.product-workbench-panel { min-width:0; overflow:hidden; }
.product-workbench-panel .product-list-head { padding:10px 12px !important; }
.product-workbench-panel .product-list-head .panel-kicker,
.product-workbench-panel .product-list-head .subtle { display:none !important; }
.product-workbench-panel .product-list-head h3 { margin:0 !important; font-size:13px !important; }
.product-list-legend { display:none !important; }
.product-workbench-panel .table-wrap {
  max-height:calc(100vh - 310px);
  min-height:430px;
  overflow:auto !important;
  background:#fff !important;
}
body .product-workbench-table {
  display:table !important;
  width:100% !important;
  min-width:850px !important;
  table-layout:fixed;
  border:0 !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  background:#fff !important;
  color:var(--ledger-ink) !important;
}
body .product-workbench-table thead { display:table-header-group !important; }
body .product-workbench-table tbody { display:table-row-group !important; padding:0 !important; background:#fff !important; }
body .product-workbench-table thead tr,
body .product-workbench-table tbody tr {
  display:table-row !important;
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:#fff !important;
  box-shadow:none !important;
  cursor:pointer;
}
body .product-workbench-table th,
body .product-workbench-table td {
  display:table-cell !important;
  height:auto !important;
  padding:9px 8px !important;
  border:0 !important;
  border-bottom:1px solid #eceef1 !important;
  background:transparent !important;
  color:#31363c !important;
  font-size:11px !important;
  line-height:1.4 !important;
  text-align:left !important;
  vertical-align:middle !important;
  white-space:normal !important;
}
body .product-workbench-table th {
  position:sticky;
  top:0;
  z-index:3;
  height:34px !important;
  padding-top:7px !important;
  padding-bottom:7px !important;
  border-bottom:1px solid var(--ledger-line-strong) !important;
  background:#f3f4f6 !important;
  color:#5f656d !important;
  font-size:10px !important;
  font-weight:720 !important;
}
body .product-workbench-table tbody td::before { display:none !important; content:none !important; }
body .product-workbench-table th:nth-child(1),body .product-workbench-table td:nth-child(1) { width:84px; }
body .product-workbench-table th:nth-child(2),body .product-workbench-table td:nth-child(2) { width:58px; }
body .product-workbench-table th:nth-child(3),body .product-workbench-table td:nth-child(3) { width:132px; }
body .product-workbench-table th:nth-child(4),body .product-workbench-table td:nth-child(4) { width:112px; }
body .product-workbench-table th:nth-child(5),body .product-workbench-table td:nth-child(5) { width:150px; }
body .product-workbench-table th:nth-child(6),body .product-workbench-table td:nth-child(6) { width:130px; }
body .product-workbench-table th:nth-child(7),body .product-workbench-table td:nth-child(7) { width:145px; }
body .product-workbench-table th:nth-child(8),body .product-workbench-table td:nth-child(8) { display:none !important; }
body .product-workbench-table th:nth-child(9),body .product-workbench-table td:nth-child(9) { width:150px; }
body .product-workbench-table tbody tr:hover td { background:#f8f9fa !important; }
body .product-workbench-table tbody tr.is-selected td { background:#fff5f4 !important; }
body .product-workbench-table tbody tr.is-selected td:first-child { box-shadow:inset 3px 0 var(--ledger-red); }
.product-workbench-table .style-code { color:var(--ledger-blue) !important; font-size:12px !important; font-weight:750 !important; }
.product-workbench-table .product-image { width:42px !important; height:54px !important; border:1px solid var(--ledger-line) !important; border-radius:3px !important; object-fit:cover; background:#f4f5f7 !important; }
.product-workbench-table .stack { display:grid; gap:2px !important; min-width:0; }
.product-workbench-table .stack strong { color:#262a2f !important; font-size:11px !important; font-weight:660 !important; }
.product-workbench-table .subtle,.product-workbench-table .stack span { color:#777d85 !important; font-size:10px !important; }
.product-workbench-table .tag,
.product-workbench-table .effect-status,
.product-workbench-table .revision-alert-badge {
  display:inline-flex;
  width:max-content;
  max-width:100%;
  min-height:22px;
  padding:2px 7px;
  border:1px solid #d5d9de !important;
  border-radius:3px !important;
  background:#f5f6f7 !important;
  color:#4f555c !important;
  font-size:10px !important;
}
.product-workbench-table .product-row-actions {
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:5px !important;
  flex-wrap:wrap !important;
}
.product-workbench-table .product-row-actions .action-button,
.product-workbench-table .row-action-menu-trigger {
  flex:0 1 auto !important;
  width:auto !important;
  min-height:28px !important;
  padding:0 8px !important;
  border-radius:3px !important;
  font-size:10px !important;
  white-space:nowrap !important;
}
.product-workbench-table .row-action-menu { width:auto !important; }
.product-workbench-table .row-action-menu-panel {
  right:0 !important;
  left:auto !important;
  min-width:160px !important;
  padding:6px !important;
  border:1px solid var(--ledger-line-strong) !important;
  border-radius:4px !important;
  background:#fff !important;
  box-shadow:0 14px 32px rgba(16,24,40,.14) !important;
}
.product-workbench-panel .pagination {
  min-height:46px;
  padding:7px 12px !important;
  border-top:1px solid var(--ledger-line) !important;
  background:#fff !important;
  color:var(--ledger-muted) !important;
  font-size:11px;
}

.ledger-inspector {
  position:sticky;
  top:162px;
  display:block;
  max-height:calc(100vh - 178px);
  overflow:hidden;
  border:1px solid var(--ledger-line);
  border-radius:4px;
  background:#fff;
}
.ledger-inspector-head {
  display:grid;
  grid-template-columns:58px minmax(0,1fr) auto;
  align-items:start;
  gap:10px;
  padding:12px;
  border-bottom:1px solid var(--ledger-line);
}
.ledger-inspector-head img { width:58px; height:74px; border:1px solid var(--ledger-line); border-radius:3px; object-fit:cover; background:#f4f5f7; }
.ledger-inspector-head > div { display:grid; gap:3px; min-width:0; }
.ledger-inspector-head > div > span { color:#858b93; font-size:9px; font-weight:700; }
.ledger-inspector-head > div > strong { overflow:hidden; color:var(--ledger-ink); font-size:17px; font-weight:760; text-overflow:ellipsis; white-space:nowrap; }
.ledger-inspector-head > div > small { overflow:hidden; color:var(--ledger-muted); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.ledger-inspector-head > .tag { min-height:21px; padding:2px 6px; border-radius:3px !important; font-size:9px; }
.ledger-inspector-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; padding:10px 12px; border-bottom:1px solid var(--ledger-line); }
.ledger-inspector-tabs { display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid var(--ledger-line); }
.ledger-inspector-tabs button {
  min-height:38px;
  border:0;
  border-bottom:2px solid transparent;
  background:#fff;
  color:#747a82;
  font-size:11px;
  font-weight:650;
}
.ledger-inspector-tabs button:hover { background:#f8f9fa; color:var(--ledger-ink); }
.ledger-inspector-tabs button.active { border-bottom-color:var(--ledger-red); color:var(--ledger-ink); }
/* Keep the inspector body as the one intentional vertical scroll surface.
   The outer card stays fixed while wheel/touch input cannot bubble into the
   page behind it. */
.ledger-inspector-body {
  max-height:calc(100vh - 386px);
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  touch-action:pan-y;
}
.ledger-facts { display:grid; grid-template-columns:1fr 1fr; margin:0; padding:4px 12px 10px; }
.ledger-facts > div { min-width:0; padding:9px 7px; border-bottom:1px solid #eef0f2; }
.ledger-facts dt { margin:0 0 3px; color:#858b93; font-size:9px; font-weight:680; }
.ledger-facts dd { margin:0; overflow:hidden; color:#30353b; font-size:10px; line-height:1.45; text-overflow:ellipsis; }
.ledger-timeline { display:grid; gap:0; margin:0; padding:4px 14px 16px; list-style:none; }
.ledger-timeline li { position:relative; display:grid; grid-template-columns:24px minmax(0,1fr); gap:8px; min-height:48px; }
.ledger-timeline li:not(:last-child)::after { position:absolute; top:22px; bottom:-2px; left:11px; width:1px; background:#d9dde2; content:""; }
.ledger-timeline-mark { z-index:1; display:grid; place-items:center; width:23px; height:23px; border:1px solid #d3d7dc; border-radius:50%; background:#fff; color:#9298a0; }
.ledger-timeline-mark svg { width:12px; height:12px; }
.ledger-timeline li.done .ledger-timeline-mark { border-color:#75c69d; background:#ecfdf3; color:var(--ledger-green); }
.ledger-timeline li.active .ledger-timeline-mark { border-color:#f0a29a; background:#fff1f0; color:var(--ledger-red); }
.ledger-timeline li > div { display:grid; align-content:start; gap:2px; padding-top:1px; }
.ledger-timeline strong { color:#32373d; font-size:11px; }
.ledger-timeline small { color:#7a8088; font-size:10px; line-height:1.35; }
.ledger-inspector-activity { display:grid; padding:4px 12px 14px; }
.ledger-inspector-activity article { display:grid; gap:3px; padding:11px 4px; border-bottom:1px solid #eef0f2; }
.ledger-inspector-activity article > span { color:var(--ledger-red); font-size:9px; font-weight:700; }
.ledger-inspector-activity article > strong { color:#30353b; font-size:11px; line-height:1.45; }
.ledger-inspector-activity article > small { color:#858b93; font-size:9px; }
.ledger-inspector-empty,.ledger-inspector-empty-state { display:grid; place-items:center; gap:7px; padding:28px 16px; color:var(--ledger-muted); text-align:center; }
.ledger-inspector-empty svg,.ledger-inspector-empty-state svg { width:24px; height:24px; color:#9aa0a8; }
.ledger-inspector-empty strong,.ledger-inspector-empty-state strong { color:#444a51; font-size:12px; }
.ledger-inspector-empty span,.ledger-inspector-empty-state span { color:#858b93; font-size:10px; }

/* Existing modules inherit the ledger surfaces instead of the previous dark card wall. */
.dashboard-hero,
.operation-data-hero,
.toolbar:not(.product-center-toolbar) {
  margin:0 0 12px !important;
  padding:14px !important;
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  background:#fff !important;
  color:var(--ledger-ink) !important;
}
.dashboard-hero h2 { margin:0 0 4px !important; font-size:22px !important; }
.dashboard-hero p { margin:0 !important; max-width:76ch; font-size:12px !important; }
.dashboard-hero .dashboard-kicker { display:none !important; }
.dashboard-kpi-grid,.metrics {
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(128px,1fr)) !important;
  gap:0 !important;
  margin:0 0 12px !important;
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  background:#fff !important;
  overflow:hidden;
}
.dashboard-kpi-card,.metric {
  min-height:82px !important;
  padding:13px 14px !important;
  border:0 !important;
  border-right:1px solid var(--ledger-line) !important;
  border-radius:0 !important;
  background:#fff !important;
  color:var(--ledger-ink) !important;
  box-shadow:none !important;
}
.dashboard-kpi-card:last-child,.metric:last-child { border-right:0 !important; }
.dashboard-kpi-card span,.metric-label { color:#737981 !important; font-size:10px !important; }
.dashboard-kpi-card strong,.metric-value { color:var(--ledger-ink) !important; font-size:21px !important; font-weight:730 !important; font-variant-numeric:tabular-nums; }
.dashboard-kpi-card.alert strong,.metric.alert .metric-value { color:var(--ledger-red) !important; }
.dashboard-kpi-card small,.metric-note { color:#858b93 !important; font-size:9px !important; }
.dashboard-sales-card,
.dashboard-intelligence-card,
.dashboard-influencer-card,
.dashboard-module-card,
.operation-connector-card,
.styling-editor-section,
.catalog-model-profile-row {
  border:1px solid var(--ledger-line) !important;
  border-radius:3px !important;
  background:#fff !important;
  color:var(--ledger-ink) !important;
  box-shadow:none !important;
}
.dashboard-bar,.module-progress-bar,.operation-data-bar { border-radius:2px !important; background:#e9ebee !important; }
.dashboard-bar i,.module-progress-bar i,.operation-data-bar i { border-radius:2px !important; background:var(--ledger-blue) !important; }
.dashboard-module-health,.risk-level,.operation-data-status,.effect-status { border-radius:3px !important; }
.product-table:not(.product-workbench-table) { background:#fff !important; color:var(--ledger-ink) !important; }
.product-table:not(.product-workbench-table) th { background:#f3f4f6 !important; color:#5f656d !important; }
.product-table:not(.product-workbench-table) td { background:#fff !important; color:#33383e !important; }
.dialog { color:var(--ledger-ink) !important; }
.dialog::backdrop { background:rgba(25,28,33,.45) !important; backdrop-filter:none !important; }
.dialog-head { border-bottom-color:var(--ledger-line) !important; background:#fff !important; }
.dialog-head h2,.dialog .section-title { color:var(--ledger-ink) !important; }
.dialog .subtle,.dialog p,.dialog small { color:var(--ledger-muted) !important; }

@media (max-width:1180px) {
  .top-actions .search { width:220px !important; }
  .tenant-context-name { max-width:120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .product-ledger-layout { grid-template-columns:minmax(0,1fr) 292px; }
  .ledger-inspector-head { grid-template-columns:50px minmax(0,1fr); }
  .ledger-inspector-head img { width:50px; height:66px; }
  .ledger-inspector-head > .tag { grid-column:2; width:max-content; }
  .ledger-facts { grid-template-columns:1fr; }
}

@media (max-width:900px) {
  .topbar { align-items:flex-start !important; flex-wrap:wrap; }
  .top-actions { width:100%; justify-content:flex-start !important; }
  .top-actions .search { flex:1 1 220px; width:auto !important; }
  .workbench-switcher { top:112px; }
  .product-ledger-layout { grid-template-columns:1fr; }
  .ledger-inspector { position:relative; top:auto; max-height:none; }
  .ledger-inspector-body { max-height:300px; }
  .product-workbench-panel .table-wrap { max-height:none; }
}

@media (max-width:760px) {
  .app-shell.auth-mode { min-height:100dvh; }
  .app-shell.auth-mode .workspace.auth-workspace { min-height:100dvh; }
  .app-shell.auth-mode .auth-workspace #page {
    min-height:100dvh !important;
    padding:18px 12px !important;
    place-items:start center !important;
    background-size:28px 28px !important;
  }
  .app-shell.auth-mode .auth-shell {
    grid-template-columns:1fr !important;
    width:100% !important;
    min-height:0 !important;
    margin-top:8px;
  }
  .app-shell.auth-mode .auth-brand-panel {
    min-height:174px !important;
    padding:26px 24px 22px !important;
    border-right:0 !important;
    border-bottom:1px solid #343940 !important;
  }
  .app-shell.auth-mode .auth-brand-panel::before { inset:0 0 auto !important; width:auto !important; height:5px !important; }
  .app-shell.auth-mode .auth-brand-panel::after { right:-120px !important; bottom:-180px !important; }
  .app-shell.auth-mode .auth-brand-mark { width:42px !important; height:42px !important; margin:0 0 22px !important; }
  .app-shell.auth-mode .auth-brand-mark::before { top:11px; left:10px; width:19px !important; height:15px !important; }
  .app-shell.auth-mode .auth-brand-mark::after { right:8px !important; bottom:8px !important; width:16px !important; }
  .app-shell.auth-mode .auth-company { margin-bottom:5px !important; font-size:10px !important; }
  .app-shell.auth-mode .auth-brand-panel h1 { font-size:24px !important; }
  .app-shell.auth-mode .auth-brand-note { margin-top:8px !important; font-size:11px !important; line-height:1.5 !important; }
  .app-shell.auth-mode .auth-brand-footer { display:none !important; }
  .app-shell.auth-mode .auth-panel { padding:28px 22px 24px !important; }
  .app-shell.auth-mode .auth-visible-title { font-size:24px !important; }
  .app-shell.auth-mode .auth-intro { margin-bottom:22px !important; }
  body { padding-bottom:66px; }
  body:has(.app-shell.auth-mode) { padding-bottom:0 !important; }
  .app-shell:not(.auth-mode),
  .app-shell:not(.auth-mode)[data-sidebar-collapsed="false"],
  .app-shell:not(.auth-mode)[data-sidebar-collapsed="true"] { display:block !important; min-height:100vh; }
  .app-shell:not(.auth-mode) .sidebar,
  .app-shell:not(.auth-mode)[data-sidebar-collapsed="true"] .sidebar {
    position:fixed !important;
    inset:auto 0 0 0 !important;
    z-index:80;
    display:block !important;
    width:100% !important;
    height:66px !important;
    min-width:0 !important;
    overflow:hidden !important;
    border:0 !important;
    border-top:1px solid #111418 !important;
    background:var(--ledger-nav) !important;
    transform:none !important;
  }
  .app-shell:not(.auth-mode) .sidebar-footer { display:none !important; }
  .app-shell:not(.auth-mode) .nav {
    display:flex !important;
    flex-direction:row !important;
    align-items:center;
    gap:3px !important;
    width:100%;
    height:66px !important;
    min-height:66px !important;
    padding:6px 8px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }
  .app-shell:not(.auth-mode) .nav-group,
  .app-shell:not(.auth-mode) .nav-group-menu,
  .app-shell:not(.auth-mode) .nav-group.is-collapsed .nav-group-menu { display:contents !important; }
  .app-shell:not(.auth-mode) .nav-group-trigger { display:none !important; }
  .app-shell:not(.auth-mode) .nav-item,
  .app-shell:not(.auth-mode) .nav-top-level {
    display:flex !important;
    flex:0 0 72px !important;
    width:72px !important;
    min-width:72px !important;
    min-height:52px !important;
    height:52px !important;
    padding:5px 3px !important;
  }
  .app-shell:not(.auth-mode) .nav-item.active::before { top:auto; right:12px; bottom:-6px; left:12px; width:auto; height:3px; }
  .app-shell:not(.auth-mode) #alertBadge { right:9px; }
  .app-shell:not(.auth-mode) .topbar {
    position:sticky;
    top:0;
    min-height:0 !important;
    padding:9px 12px !important;
    gap:8px;
  }
  .topbar-heading { width:100%; }
  .topbar .sidebar-toggle { display:none !important; }
  .topbar-kicker { display:none !important; }
  .topbar h1 { font-size:18px !important; }
  .top-actions { display:grid !important; grid-template-columns:minmax(0,1fr) auto auto auto; gap:6px !important; }
  .top-actions .search { grid-column:1; width:100% !important; min-width:0; }
  .tenant-switcher { display:none !important; }
  .user-menu { max-width:96px; overflow:hidden; }
  .user-menu span,.user-menu small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #logoutButton { padding:0 8px !important; }
  .workbench-switcher {
    position:relative;
    top:auto;
    min-height:42px;
    padding:5px 12px;
  }
  .workbench-switcher-item { min-height:30px; padding:0 9px; }
  .workspace-tabs { min-height:34px !important; padding:0 12px !important; }
  .workspace-tab { height:33px !important; }
  .page { padding:12px 12px 24px !important; }
  .ledger-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ledger-summary-item { min-height:52px; padding:8px 11px; border-bottom:1px solid var(--ledger-line); }
  .ledger-summary-item:nth-child(2n) { border-right:0; }
  .ledger-summary-item:nth-last-child(-n+2) { border-bottom:0; }
  .ledger-summary-item strong { font-size:21px; }
  .product-center-toolbar {
    grid-template-columns:1fr !important;
    grid-template-areas:"copy" "actions" "filters";
    align-items:start !important;
    padding:12px !important;
  }
  .ledger-toolbar-actions { justify-content:flex-start; width:100%; overflow-x:auto; }
  .ledger-toolbar-actions button { flex:0 0 auto; }
  .product-ledger-layout { display:flex; flex-direction:column; }
  .ledger-inspector { order:-1; width:100%; }
  .ledger-inspector-head { grid-template-columns:48px minmax(0,1fr) auto; }
  .ledger-inspector-head img { width:48px; height:62px; }
  .ledger-inspector-head > .tag { grid-column:auto; }
  .ledger-inspector-body { max-height:280px; }
  .ledger-facts { grid-template-columns:1fr 1fr; }
  .product-workbench-panel .table-wrap { min-height:0; overflow:visible !important; }
  body .product-workbench-table {
    display:block !important;
    min-width:0 !important;
    table-layout:auto;
    background:transparent !important;
  }
  body .product-workbench-table thead { display:none !important; }
  body .product-workbench-table tbody { display:grid !important; gap:8px; padding:8px !important; background:#f3f4f6 !important; }
  body .product-workbench-table tbody tr {
    display:grid !important;
    grid-template-columns:54px minmax(0,1fr) !important;
    grid-template-areas:
      "image style"
      "image identity"
      "category category"
      "flow flow"
      "owner owner"
      "attributes attributes"
      "actions actions" !important;
    gap:8px 10px !important;
    min-height:0 !important;
    padding:11px !important;
    border:1px solid var(--ledger-line) !important;
    border-radius:4px !important;
    background:#fff !important;
  }
  body .product-workbench-table tbody td {
    display:block !important;
    width:auto !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
  }
  body .product-workbench-table tbody td:nth-child(1) { grid-area:style; }
  body .product-workbench-table tbody td:nth-child(2) { grid-area:image; }
  body .product-workbench-table tbody td:nth-child(3) { grid-area:identity; }
  body .product-workbench-table tbody td:nth-child(4) { grid-area:category; }
  body .product-workbench-table tbody td:nth-child(5) { grid-area:flow; }
  body .product-workbench-table tbody td:nth-child(6) { grid-area:owner; }
  body .product-workbench-table tbody td:nth-child(7) { grid-area:attributes; }
  body .product-workbench-table tbody td:nth-child(8) { display:none !important; }
  body .product-workbench-table tbody td:nth-child(9) { grid-area:actions; padding-top:8px !important; border-top:1px solid #eef0f2 !important; }
  body .product-workbench-table tbody tr.is-selected { border-color:#efa49d !important; box-shadow:inset 3px 0 var(--ledger-red) !important; }
  body .product-workbench-table tbody tr.is-selected td:first-child { box-shadow:none; }
  .product-workbench-table .product-image { width:50px !important; height:64px !important; }
  .product-workbench-table .product-row-actions { align-items:center !important; }
  .dashboard-kpi-grid,.metrics { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .dashboard-kpi-card,.metric { border-right:1px solid var(--ledger-line) !important; border-bottom:1px solid var(--ledger-line) !important; }
  .dashboard-kpi-card:nth-child(2n),.metric:nth-child(2n) { border-right:0 !important; }
  .dashboard-kpi-card:last-child,.metric:last-child { border-bottom:0 !important; }
  .dashboard-overview-grid,.dashboard-detail-grid,.dashboard-lower,.operation-data-dashboard-grid { grid-template-columns:1fr !important; }
}

@media (max-width:420px) {
  .app-shell.auth-mode .auth-workspace #page { padding:12px 8px !important; }
  .app-shell.auth-mode .auth-panel { padding-right:18px !important; padding-left:18px !important; }
  .app-shell.auth-mode .sms-code-field { grid-template-columns:1fr; }
  .app-shell.auth-mode .sms-code-button { width:100% !important; }
}

@media (prefers-reduced-motion:reduce) {
  .view-panel-enter,.sidebar { animation:none !important; transition:none !important; }
}

/* Dashboard consistency pass: remove the legacy dark list blocks. */
.app-shell:not(.auth-mode) .dashboard-lower .dashboard-risks,
.app-shell:not(.auth-mode) .dashboard-lower .dashboard-activity {
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  background:#fff !important;
  box-shadow:none !important;
}
.app-shell:not(.auth-mode) .dashboard-lower .risk-list,
.app-shell:not(.auth-mode) .dashboard-lower .business-timeline,
.app-shell:not(.auth-mode) .dashboard-lower .feed {
  background:#fff !important;
}
.app-shell:not(.auth-mode) .dashboard-lower .risk-item,
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone,
.app-shell:not(.auth-mode) .dashboard-lower .feed li {
  position:relative;
  border:0 !important;
  border-bottom:1px solid #eceef0 !important;
  border-radius:0 !important;
  background:#fff !important;
  color:#33383e !important;
  box-shadow:none !important;
}
.app-shell:not(.auth-mode) .dashboard-lower .risk-item:last-child,
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone:last-child,
.app-shell:not(.auth-mode) .dashboard-lower .feed li:last-child { border-bottom:0 !important; }
.app-shell:not(.auth-mode) .dashboard-lower .risk-item:hover,
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone:hover,
.app-shell:not(.auth-mode) .dashboard-lower .feed li:hover { background:#f8f9fa !important; }
.app-shell:not(.auth-mode) .dashboard-lower .risk-item::before,
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone::before {
  position:absolute;
  inset:8px auto 8px 0;
  width:3px;
  border-radius:0 2px 2px 0;
  background:#d9dde2;
  content:"";
}
.app-shell:not(.auth-mode) .dashboard-lower .risk-item:has(.risk-level.overdue)::before,
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone.overdue::before {
  background:var(--ledger-red);
}
.app-shell:not(.auth-mode) .dashboard-lower .risk-level {
  width:38px !important;
  min-height:22px !important;
  border:1px solid #f1d3a8 !important;
  border-radius:3px !important;
  background:#fff8eb !important;
  color:#9a5a08 !important;
  font-size:10px !important;
}
.app-shell:not(.auth-mode) .dashboard-lower .risk-level.overdue {
  border-color:#f0b9b4 !important;
  background:#fff1f0 !important;
  color:var(--ledger-red-dark) !important;
}
.app-shell:not(.auth-mode) .dashboard-lower .risk-copy strong,
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone-copy strong {
  color:#30353b !important;
  font-weight:680 !important;
}
.app-shell:not(.auth-mode) .dashboard-lower .risk-copy small,
.app-shell:not(.auth-mode) .dashboard-lower .risk-owner,
.app-shell:not(.auth-mode) .dashboard-lower .risk-owner small,
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone-date small,
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone-copy small {
  color:#7a8088 !important;
}
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone-date strong {
  color:#4d657f !important;
  font-size:13px !important;
  font-variant-numeric:tabular-nums;
}
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone.overdue .business-milestone-date strong { color:var(--ledger-red) !important; }
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone-status {
  border:1px solid #dfe2e6 !important;
  border-radius:3px !important;
  background:#f5f6f7 !important;
  color:#676d75 !important;
}
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone.overdue .business-milestone-status {
  border-color:#f0b9b4 !important;
  background:#fff1f0 !important;
  color:var(--ledger-red-dark) !important;
}
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone.today .business-milestone-status,
.app-shell:not(.auth-mode) .dashboard-lower .business-milestone.soon .business-milestone-status {
  border-color:#f1d3a8 !important;
  background:#fff8eb !important;
  color:#9a5a08 !important;
}
.app-shell:not(.auth-mode) .dashboard-lower .feed-title { color:#30353b !important; }
.app-shell:not(.auth-mode) .dashboard-lower .feed-meta { color:#858b93 !important; }

/* The attention grid lives above the lower dashboard row; keep it on the same
   surface vocabulary so no legacy dark tiles survive in the dashboard. */
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-grid {
  background:#fff !important;
}
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-item,
.app-shell:not(.auth-mode) .attention-item {
  position:relative;
  min-height:75px !important;
  border:0 !important;
  border-right:1px solid #eceef0 !important;
  border-bottom:1px solid #eceef0 !important;
  border-radius:0 !important;
  background:#fff !important;
  color:#33383e !important;
  box-shadow:none !important;
}
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-item:nth-child(2n),
.app-shell:not(.auth-mode) .attention-item:nth-child(2n) { border-right:0 !important; }
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-item:nth-last-child(-n+2),
.app-shell:not(.auth-mode) .attention-item:nth-last-child(-n+2) { border-bottom:0 !important; }
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-item:hover,
.app-shell:not(.auth-mode) .attention-item:hover { background:#f8f9fa !important; }
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-item::before,
.app-shell:not(.auth-mode) .attention-item::before {
  position:absolute;
  inset:10px auto 10px 0;
  width:3px;
  border-radius:0 2px 2px 0;
  background:#d9dde2;
  content:"";
}
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-item span,
.app-shell:not(.auth-mode) .attention-item span {
  color:#737981 !important;
  font-size:11px !important;
}
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-item strong,
.app-shell:not(.auth-mode) .attention-item strong {
  color:var(--ledger-ink) !important;
  font-size:22px !important;
  font-weight:730 !important;
  font-variant-numeric:tabular-nums;
}
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-item:nth-child(3n+1)::before,
.app-shell:not(.auth-mode) .attention-item:nth-child(3n+1)::before { background:var(--ledger-red); }
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-item:nth-child(3n+2)::before,
.app-shell:not(.auth-mode) .attention-item:nth-child(3n+2)::before { background:var(--ledger-blue); }
.app-shell:not(.auth-mode) .dashboard-attention-panel .attention-item:nth-child(3n)::before,
.app-shell:not(.auth-mode) .attention-item:nth-child(3n)::before { background:#17b26a; }

@media (max-width:760px) {
  .app-shell:not(.auth-mode) .dashboard-lower .risk-item,
  .app-shell:not(.auth-mode) .dashboard-lower .business-milestone { padding-left:16px !important; }
}

/* Desktop navigation must be readable before it is compact. A rail that
   truncates every business module is a visual failure and a usability bug. */
@media (min-width:761px) {
  .app-shell:not(.auth-mode),
  .app-shell:not(.auth-mode)[data-sidebar-collapsed="false"] {
    grid-template-columns:220px minmax(0,1fr) !important;
  }
  .app-shell:not(.auth-mode)[data-sidebar-collapsed="true"] { grid-template-columns:0 minmax(0,1fr) !important; }
  .app-shell:not(.auth-mode) .sidebar {
    width:220px !important;
    min-width:220px !important;
  }
  .app-shell:not(.auth-mode) .nav {
    gap:3px !important;
    padding:14px 10px 16px !important;
  }
  .app-shell:not(.auth-mode) .nav-item,
  .app-shell:not(.auth-mode) .nav-group-trigger {
    flex-direction:row !important;
    justify-content:flex-start !important;
    gap:10px !important;
    width:100% !important;
    min-height:42px !important;
    padding:8px 12px !important;
    border-radius:4px !important;
    font-size:13px !important;
    line-height:1.2 !important;
    text-align:left !important;
    white-space:nowrap !important;
  }
  .app-shell:not(.auth-mode) .nav-top-level { min-height:46px !important; }
  .app-shell:not(.auth-mode) .nav-item svg,
  .app-shell:not(.auth-mode) .nav-group-trigger > svg:first-child {
    width:18px !important;
    height:18px !important;
    flex:0 0 18px !important;
  }
  .app-shell:not(.auth-mode) .nav-item > span,
  .app-shell:not(.auth-mode) .nav-group-trigger > span {
    display:block !important;
    flex:1 1 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    writing-mode:horizontal-tb !important;
  }
  .app-shell:not(.auth-mode) .nav-group-trigger {
    min-height:34px !important;
    margin-top:8px !important;
    padding-top:6px !important;
    padding-bottom:6px !important;
    color:#8b929c !important;
    font-size:11px !important;
    font-weight:700 !important;
  }
  .app-shell:not(.auth-mode) .nav-group-trigger > svg:first-child { width:16px !important; height:16px !important; flex-basis:16px !important; }
  .app-shell:not(.auth-mode) .nav-group-chevron {
    display:block !important;
    width:14px !important;
    height:14px !important;
    margin-left:auto;
    flex:0 0 14px !important;
    opacity:.7;
  }
  .app-shell:not(.auth-mode) .nav-group-trigger[aria-expanded="true"] .nav-group-chevron { transform:rotate(90deg); }
  .app-shell:not(.auth-mode) .nav-group-menu {
    gap:2px !important;
    padding:0 0 0 12px !important;
  }
  .app-shell:not(.auth-mode) .nav-group-menu .nav-item {
    min-height:38px !important;
    padding:7px 12px !important;
    font-size:12px !important;
  }
  .app-shell:not(.auth-mode) .sidebar-footer {
    justify-content:flex-start !important;
    padding:0 18px !important;
  }
}

/* Global coherence pass: legacy modules must share the same light work area.
   The graphite rail is intentional; every surface inside the workspace is
   otherwise light, semantic, and readable. */
:root {
  color-scheme:light;
  --canvas:var(--ledger-canvas);
  --surface:var(--ledger-surface);
  --surface-quiet:var(--ledger-surface-soft);
  --surface-tint:#f4f7fa;
  --line:var(--ledger-line);
  --line-strong:var(--ledger-line-strong);
  --ink:var(--ledger-ink);
  --ink-soft:#3f464e;
  --muted:var(--ledger-muted);
  --muted-light:#8a9199;
  --primary:var(--ledger-red);
  --primary-strong:var(--ledger-red-dark);
  --primary-soft:#fff1f0;
  --blue:var(--ledger-blue);
  --blue-soft:#eef4ff;
  --warm:var(--ledger-amber);
  --warm-soft:#fff8eb;
  --danger:var(--ledger-red);
  --danger-soft:#fff1f0;
  --green:var(--ledger-green);
  --orange:var(--ledger-amber);
}

.app-shell:not(.auth-mode) {
  color-scheme:light !important;
}
.app-shell:not(.auth-mode) .workspace,
.app-shell:not(.auth-mode) .page,
.app-shell:not(.auth-mode) .view-panel {
  color:var(--ledger-ink) !important;
}

.app-shell:not(.auth-mode) .panel,
.app-shell:not(.auth-mode) .metric,
.app-shell:not(.auth-mode) .metric-card,
.app-shell:not(.auth-mode) .summary-card,
.app-shell:not(.auth-mode) .role-card,
.app-shell:not(.auth-mode) .operation-connector-card,
.app-shell:not(.auth-mode) .table-wrap,
.app-shell:not(.auth-mode) .flow,
.app-shell:not(.auth-mode) .work-card,
.app-shell:not(.auth-mode) .work-filter-bar,
.app-shell:not(.auth-mode) .schedule-kpi,
.app-shell:not(.auth-mode) .schedule-card,
.app-shell:not(.auth-mode) .schedule-product-card,
.app-shell:not(.auth-mode) .platform-current-tenant,
.app-shell:not(.auth-mode) .hr-hero,
.app-shell:not(.auth-mode) .hr-import-dropzone,
.app-shell:not(.auth-mode) .role-banner,
.app-shell:not(.auth-mode) .privacy-notice,
.app-shell:not(.auth-mode) .styling-output-section,
.app-shell:not(.auth-mode) .model-scene-reference .image-drop,
.app-shell:not(.auth-mode) .operation-data-filter-group {
  color:var(--ledger-ink) !important;
  border-color:var(--ledger-line) !important;
  background:#fff !important;
  box-shadow:none !important;
}

.app-shell:not(.auth-mode) .work-card,
.app-shell:not(.auth-mode) .work-filter-bar,
.app-shell:not(.auth-mode) .schedule-kpi,
.app-shell:not(.auth-mode) .table-wrap,
.app-shell:not(.auth-mode) .platform-current-tenant,
.app-shell:not(.auth-mode) .hr-hero,
.app-shell:not(.auth-mode) .hr-import-dropzone {
  background:#fff !important;
}
.app-shell:not(.auth-mode) .work-card h3,
.app-shell:not(.auth-mode) .work-card .number,
.app-shell:not(.auth-mode) .work-filter-bar strong,
.app-shell:not(.auth-mode) .schedule-kpi strong,
.app-shell:not(.auth-mode) .hr-hero h2,
.app-shell:not(.auth-mode) .platform-current-tenant h3,
.app-shell:not(.auth-mode) .platform-current-tenant strong {
  color:var(--ledger-ink) !important;
}
.app-shell:not(.auth-mode) .work-card span,
.app-shell:not(.auth-mode) .work-card small,
.app-shell:not(.auth-mode) .work-filter-bar label,
.app-shell:not(.auth-mode) .schedule-kpi span,
.app-shell:not(.auth-mode) .schedule-kpi small,
.app-shell:not(.auth-mode) .hr-hero p,
.app-shell:not(.auth-mode) .platform-current-tenant span,
.app-shell:not(.auth-mode) .platform-current-tenant small {
  color:var(--ledger-muted) !important;
}

.app-shell:not(.auth-mode) .dashboard-intelligence {
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  background:#fff !important;
  color:var(--ledger-ink) !important;
  box-shadow:none !important;
}
.app-shell:not(.auth-mode) .dashboard-intelligence .panel-head,
.app-shell:not(.auth-mode) .dashboard-intelligence-card {
  background:#fff !important;
  border-color:var(--ledger-line) !important;
  color:var(--ledger-ink) !important;
}
.app-shell:not(.auth-mode) .dashboard-intelligence-card.urgent { background:#fff7f6 !important; border-color:#f0c2bd !important; }
.app-shell:not(.auth-mode) .dashboard-intelligence-card.focus { background:#fffaf0 !important; border-color:#edd7aa !important; }
.app-shell:not(.auth-mode) .dashboard-intelligence-card.time { background:#f5f8ff !important; border-color:#c9d9f4 !important; }
.app-shell:not(.auth-mode) .dashboard-intelligence-card.progress { background:#f3faf6 !important; border-color:#bfdfce !important; }
.app-shell:not(.auth-mode) .dashboard-intelligence-card-head span,
.app-shell:not(.auth-mode) .dashboard-intelligence-card p { color:var(--ledger-muted) !important; }
.app-shell:not(.auth-mode) .dashboard-intelligence-card-head strong { color:var(--ledger-ink) !important; }
.app-shell:not(.auth-mode) .dashboard-intelligence-card.urgent .dashboard-intelligence-card-head strong { color:var(--ledger-red-dark) !important; }

.app-shell:not(.auth-mode) .product-table,
.app-shell:not(.auth-mode) .data-table,
.app-shell:not(.auth-mode) .order-line-table,
.app-shell:not(.auth-mode) .hr-table {
  color:var(--ledger-ink) !important;
  background:#fff !important;
}
.app-shell:not(.auth-mode) .product-table th,
.app-shell:not(.auth-mode) .data-table th,
.app-shell:not(.auth-mode) .order-line-table th,
.app-shell:not(.auth-mode) .hr-table th {
  color:#59616b !important;
  background:#f5f6f7 !important;
  border-bottom-color:var(--ledger-line-strong) !important;
}
.app-shell:not(.auth-mode) .product-table td,
.app-shell:not(.auth-mode) .data-table td,
.app-shell:not(.auth-mode) .order-line-table td,
.app-shell:not(.auth-mode) .hr-table td {
  color:#3f464e !important;
  background:#fff !important;
  border-bottom-color:#eceef0 !important;
}
.app-shell:not(.auth-mode) .product-table tbody tr:hover td,
.app-shell:not(.auth-mode) .data-table tbody tr:hover td,
.app-shell:not(.auth-mode) .order-line-table tbody tr:hover td,
.app-shell:not(.auth-mode) .hr-table tbody tr:hover td { background:#fafafa !important; }

.app-shell:not(.auth-mode) .row-action-menu-trigger,
.app-shell:not(.auth-mode) .action-button,
.app-shell:not(.auth-mode) .contract-actions .secondary {
  color:#4b535c !important;
  border:1px solid var(--ledger-line-strong) !important;
  background:#fff !important;
  box-shadow:none !important;
}
.app-shell:not(.auth-mode) .row-action-menu-trigger:hover,
.app-shell:not(.auth-mode) .action-button:hover,
.app-shell:not(.auth-mode) .contract-actions .secondary:hover {
  color:var(--ledger-red-dark) !important;
  border-color:#d69a94 !important;
  background:#fff8f7 !important;
}
.app-shell:not(.auth-mode) .action-button.action-danger,
.app-shell:not(.auth-mode) .action-danger {
  color:var(--ledger-red-dark) !important;
  border-color:#efb9b4 !important;
  background:#fff5f4 !important;
}
.app-shell:not(.auth-mode) .action-button.primary,
.app-shell:not(.auth-mode) .action-button[data-primary] { color:#fff !important; border-color:var(--ledger-red) !important; background:var(--ledger-red) !important; }

.app-shell:not(.auth-mode) .filter-chip.selected,
.app-shell:not(.auth-mode) .filters button.selected {
  color:var(--ledger-red-dark) !important;
  border-color:#e2a39d !important;
  background:#fff1f0 !important;
}
.app-shell:not(.auth-mode) .tag.blue { color:#1752b8 !important; background:#eef4ff !important; }
.app-shell:not(.auth-mode) .tag.green { color:#067647 !important; background:#eaf7ef !important; }
.app-shell:not(.auth-mode) .tag.orange { color:#9a5a08 !important; background:#fff8eb !important; }
.app-shell:not(.auth-mode) .tag.red { color:var(--ledger-red-dark) !important; background:#fff1f0 !important; }
.app-shell:not(.auth-mode) .tag.gray { color:#59616b !important; background:#f1f2f3 !important; }

.app-shell:not(.auth-mode) .schedule-hero {
  color:var(--ledger-ink) !important;
  border-color:#d5e0ee !important;
  background:#f7f9fc !important;
}
.app-shell:not(.auth-mode) .schedule-hero h2 { color:var(--ledger-ink) !important; }
.app-shell:not(.auth-mode) .schedule-hero p,
.app-shell:not(.auth-mode) .schedule-card-note,
.app-shell:not(.auth-mode) .schedule-communication-notes { color:var(--ledger-muted) !important; }
.app-shell:not(.auth-mode) .schedule-card-note,
.app-shell:not(.auth-mode) .schedule-communication-notes {
  border-color:#c9d9f4 !important;
  background:#f5f8ff !important;
}
.app-shell:not(.auth-mode) .operation-data-note {
  color:var(--ledger-muted) !important;
  border-color:var(--ledger-line) !important;
  background:#f7f8f9 !important;
}
.app-shell:not(.auth-mode) .operation-data-status {
  color:#9a5a08 !important;
  border:1px solid #efd39b !important;
  background:#fff8eb !important;
}
.app-shell:not(.auth-mode) .operation-data-status.connected { color:var(--ledger-green) !important; border-color:#b9dfc9 !important; background:#eaf7ef !important; }

.app-shell:not(.auth-mode) .empty-state,
.app-shell:not(.auth-mode) .permission-empty,
.app-shell:not(.auth-mode) .detail-fields-empty,
.app-shell:not(.auth-mode) .operation-data-empty {
  color:var(--ledger-muted) !important;
  border-color:var(--ledger-line) !important;
  background:#fff !important;
}
.app-shell:not(.auth-mode) .empty-state strong,
.app-shell:not(.auth-mode) .permission-empty strong { color:var(--ledger-ink-soft, #3f464e) !important; }

.app-shell:not(.auth-mode) .detail-module,
.app-shell:not(.auth-mode) .detail-module-content,
.app-shell:not(.auth-mode) .detail-focus-section,
.app-shell:not(.auth-mode) .fields,
.app-shell:not(.auth-mode) .field,
.app-shell:not(.auth-mode) .detail-more-fields summary,
.app-shell:not(.auth-mode) .sku-chip,
.app-shell:not(.auth-mode) .model-reference-slot,
.app-shell:not(.auth-mode) .consent-check {
  color:var(--ledger-ink) !important;
  border-color:var(--ledger-line) !important;
  background:#fff !important;
  box-shadow:none !important;
}
.app-shell:not(.auth-mode) .detail-module-head { color:var(--ledger-ink) !important; border-bottom-color:var(--ledger-line) !important; background:#f7f8f9 !important; }
.app-shell:not(.auth-mode) .detail-module-head h3,
.app-shell:not(.auth-mode) .detail-module-head p,
.app-shell:not(.auth-mode) .detail-module-content,
.app-shell:not(.auth-mode) .field label,
.app-shell:not(.auth-mode) .field strong,
.app-shell:not(.auth-mode) .sku-chip { color:var(--ledger-ink) !important; }
.app-shell:not(.auth-mode) .detail-module-index { color:var(--ledger-red-dark) !important; background:#fff1f0 !important; }
.app-shell:not(.auth-mode) .detail-module-actions { color:var(--ledger-ink) !important; border-color:#c7dfd1 !important; background:#f3faf6 !important; }
.app-shell:not(.auth-mode) .detail-module-contract-actions { border-color:#ead7aa !important; background:#fffaf0 !important; }
.app-shell:not(.auth-mode) .field input,
.app-shell:not(.auth-mode) .field select,
.app-shell:not(.auth-mode) .field textarea { color:var(--ledger-ink) !important; background:#fff !important; border-color:var(--ledger-line-strong) !important; }

.app-shell:not(.auth-mode) .ai-chat-panel,
.app-shell:not(.auth-mode) .ai-chat-hero,
.app-shell:not(.auth-mode) .ai-chat-stage,
.app-shell:not(.auth-mode) .ai-chat-stage.has-transcript,
.app-shell:not(.auth-mode) .ai-chat-quick-prompt,
.app-shell:not(.auth-mode) .ai-assistant-mode,
.app-shell:not(.auth-mode) .ai-chat-image-wrap,
.app-shell:not(.auth-mode) .ai-chat-file-card,
.app-shell:not(.auth-mode) .knowledge-answer-copy,
.app-shell:not(.auth-mode) .ai-chat-turn > p {
  color:var(--ledger-ink) !important;
  border-color:var(--ledger-line) !important;
  background:#fff !important;
  box-shadow:none !important;
}
.app-shell:not(.auth-mode) .ai-chat-hero { background:#f7f8f9 !important; }
.app-shell:not(.auth-mode) .ai-chat-hero h2,
.app-shell:not(.auth-mode) .ai-chat-session-bar strong,
.app-shell:not(.auth-mode) .ai-chat-turn > p,
.app-shell:not(.auth-mode) .knowledge-answer-copy { color:var(--ledger-ink) !important; }
.app-shell:not(.auth-mode) .ai-chat-hero p,
.app-shell:not(.auth-mode) .ai-live-status,
.app-shell:not(.auth-mode) .ai-chat-session-bar span,
.app-shell:not(.auth-mode) .ai-chat-footnote,
.app-shell:not(.auth-mode) .ai-assistant-mode small { color:var(--ledger-muted) !important; }
.app-shell:not(.auth-mode) .ai-chat-stage { min-height:260px; background:#fbfbfc !important; }
.app-shell:not(.auth-mode) .ai-chat-quick-prompt { color:#4b535c !important; background:#fff !important; }
.app-shell:not(.auth-mode) .ai-chat-quick-prompt:hover,
.app-shell:not(.auth-mode) .ai-chat-quick-prompt:focus-visible { color:var(--ledger-red-dark) !important; border-color:#e2a39d !important; background:#fff8f7 !important; }
.app-shell:not(.auth-mode) .ai-assistant-mode.active { color:var(--ledger-red-dark) !important; border-color:#e2a39d !important; background:#fff1f0 !important; }
.app-shell:not(.auth-mode) .ai-chat-turn.user > p { color:var(--ledger-red-dark) !important; border-color:#efc0ba !important; background:#fff5f4 !important; }

.app-shell:not(.auth-mode) .dialog,
.app-shell:not(.auth-mode) .dialog-inner,
.app-shell:not(.auth-mode) .form-footer,
.app-shell:not(.auth-mode) .dialog .form,
.app-shell:not(.auth-mode) .contract-editor-context,
.app-shell:not(.auth-mode) .contract-editor-preview {
  color:var(--ledger-ink) !important;
  border-color:var(--ledger-line) !important;
  background:#fff !important;
}
.app-shell:not(.auth-mode) .dialog-head,
.app-shell:not(.auth-mode) .form-footer { background:#f7f8f9 !important; }
.app-shell:not(.auth-mode) .dialog input,
.app-shell:not(.auth-mode) .dialog select,
.app-shell:not(.auth-mode) .dialog textarea,
.app-shell:not(.auth-mode) .form input,
.app-shell:not(.auth-mode) .form select,
.app-shell:not(.auth-mode) .form textarea,
.app-shell:not(.auth-mode) .order-product-search,
.app-shell:not(.auth-mode) .schedule-product-search input {
  color:var(--ledger-ink) !important;
  border-color:var(--ledger-line-strong) !important;
  background:#fff !important;
}
.app-shell:not(.auth-mode) .order-product-results,
.app-shell:not(.auth-mode) .order-product-result { color:var(--ledger-ink) !important; border-color:var(--ledger-line) !important; background:#fff !important; }
.app-shell:not(.auth-mode) .order-product-result:hover,
.app-shell:not(.auth-mode) .order-product-result:focus-visible { background:#f8f9fa !important; }
.app-shell:not(.auth-mode) .role-dialog .permission-group { color:var(--ledger-ink) !important; border-color:var(--ledger-line) !important; background:#f7f8f9 !important; }
.app-shell:not(.auth-mode) .role-dialog .permission-option { color:var(--ledger-ink) !important; }

.app-shell:not(.auth-mode) .flow-step { color:var(--ledger-muted) !important; }
.app-shell:not(.auth-mode) .flow-step:not(:last-child)::after { background:#c8cdd3 !important; }
.app-shell:not(.auth-mode) .dashboard-module-head,
.app-shell:not(.auth-mode) .dashboard-module-row { color:var(--ledger-ink) !important; border-color:var(--ledger-line) !important; background:#fff !important; }
.app-shell:not(.auth-mode) .dashboard-module-head { background:#f5f6f7 !important; }
.app-shell:not(.auth-mode) .dashboard-module-name { color:var(--ledger-ink) !important; }
.app-shell:not(.auth-mode) .module-progress-bar { background:#eceef1 !important; }

@media (max-width:760px) {
  .app-shell:not(.auth-mode) .work-card,
  .app-shell:not(.auth-mode) .work-filter-bar,
  .app-shell:not(.auth-mode) .schedule-hero,
  .app-shell:not(.auth-mode) .hr-hero,
  .app-shell:not(.auth-mode) .platform-current-tenant { border-radius:4px !important; }
  .app-shell:not(.auth-mode) .ai-chat-stage { min-height:220px; }
}

/* Dialogs are siblings of the app shell, so they need their own authenticated
   scope instead of inheriting the workspace rules above. */
body:has(.app-shell:not(.auth-mode)) .dialog,
body:has(.app-shell:not(.auth-mode)) .dialog-inner,
body:has(.app-shell:not(.auth-mode)) .product-detail-shell,
body:has(.app-shell:not(.auth-mode)) .dialog .form,
body:has(.app-shell:not(.auth-mode)) .dialog .details,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-content,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-focus-section,
body:has(.app-shell:not(.auth-mode)) .dialog .fields,
body:has(.app-shell:not(.auth-mode)) .dialog .field,
body:has(.app-shell:not(.auth-mode)) .dialog .sku-grid,
body:has(.app-shell:not(.auth-mode)) .dialog .sku-chip,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-more-fields summary,
body:has(.app-shell:not(.auth-mode)) .dialog .label-preview-grid > div,
body:has(.app-shell:not(.auth-mode)) .dialog .revision-opinion-item,
body:has(.app-shell:not(.auth-mode)) .dialog .revision-history-preview,
body:has(.app-shell:not(.auth-mode)) .dialog .contract-editor-context,
body:has(.app-shell:not(.auth-mode)) .dialog .contract-editor-preview,
body:has(.app-shell:not(.auth-mode)) .dialog .contract-editor-preview-body,
body:has(.app-shell:not(.auth-mode)) .dialog .model-reference-slot,
body:has(.app-shell:not(.auth-mode)) .dialog .consent-check,
body:has(.app-shell:not(.auth-mode)) .dialog .role-banner,
body:has(.app-shell:not(.auth-mode)) .dialog .permission-group,
body:has(.app-shell:not(.auth-mode)) .dialog .empty-state {
  color:var(--ledger-ink) !important;
  border-color:var(--ledger-line) !important;
  background:#fff !important;
  box-shadow:none !important;
  color-scheme:light !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog {
  border-radius:6px !important;
  box-shadow:0 24px 70px rgba(23,25,28,.2) !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog::backdrop {
  background:rgba(25,28,33,.48) !important;
  backdrop-filter:none !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog .dialog-head,
body:has(.app-shell:not(.auth-mode)) .dialog .form-footer,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-head,
body:has(.app-shell:not(.auth-mode)) .dialog .history-head {
  color:var(--ledger-ink) !important;
  border-color:var(--ledger-line) !important;
  background:#f7f8f9 !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog .dialog-head h2,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-head h3,
body:has(.app-shell:not(.auth-mode)) .dialog .section-title,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-title,
body:has(.app-shell:not(.auth-mode)) .dialog .field strong,
body:has(.app-shell:not(.auth-mode)) .dialog .sku-chip,
body:has(.app-shell:not(.auth-mode)) .dialog .permission-option { color:var(--ledger-ink) !important; }
body:has(.app-shell:not(.auth-mode)) .dialog p,
body:has(.app-shell:not(.auth-mode)) .dialog small,
body:has(.app-shell:not(.auth-mode)) .dialog .subtle,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-head p,
body:has(.app-shell:not(.auth-mode)) .dialog .field label { color:var(--ledger-muted) !important; }
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav {
  border-color:var(--ledger-line) !important;
  background:#f7f8f9 !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav-item {
  color:#4b535c !important;
  border-color:var(--ledger-line-strong) !important;
  background:#fff !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav-item:hover {
  color:var(--ledger-red-dark) !important;
  border-color:#e2a39d !important;
  background:#fff8f7 !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav-item.is-active {
  color:var(--ledger-red-dark) !important;
  border-color:#e2a39d !important;
  background:#fff1f0 !important;
  box-shadow:inset 0 -2px 0 var(--ledger-red) !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-index {
  color:var(--ledger-red-dark) !important;
  background:#fff1f0 !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-actions { color:var(--ledger-ink) !important; border-color:#c7dfd1 !important; background:#f3faf6 !important; }
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-contract-actions { border-color:#ead7aa !important; background:#fffaf0 !important; }
body:has(.app-shell:not(.auth-mode)) .dialog .revision-opinions-section > .section-heading > strong,
body:has(.app-shell:not(.auth-mode)) .dialog .pending-opinion-badge {
  color:#9a5a08 !important;
  border-color:#efd39b !important;
  background:#fff8eb !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog .image-drop,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-image-drop,
body:has(.app-shell:not(.auth-mode)) .dialog .attachment-picker,
body:has(.app-shell:not(.auth-mode)) .dialog .styling-output-preview,
body:has(.app-shell:not(.auth-mode)) .dialog .model-image-inline-empty {
  color:var(--ledger-muted) !important;
  border-color:var(--ledger-line-strong) !important;
  background:#f7f8f9 !important;
  box-shadow:none !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog .image-drop:hover,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-image-drop:hover,
body:has(.app-shell:not(.auth-mode)) .dialog .attachment-picker:hover {
  border-color:#9eabb9 !important;
  background:#fff !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog input,
body:has(.app-shell:not(.auth-mode)) .dialog select,
body:has(.app-shell:not(.auth-mode)) .dialog textarea {
  color:var(--ledger-ink) !important;
  border-color:var(--ledger-line-strong) !important;
  background:#fff !important;
  color-scheme:light !important;
}
body:has(.app-shell:not(.auth-mode)) .dialog .tag.blue { color:#1752b8 !important; background:#eef4ff !important; }
body:has(.app-shell:not(.auth-mode)) .dialog .tag.green { color:#067647 !important; background:#eaf7ef !important; }
body:has(.app-shell:not(.auth-mode)) .dialog .tag.orange { color:#9a5a08 !important; background:#fff8eb !important; }
body:has(.app-shell:not(.auth-mode)) .dialog .tag.red { color:var(--ledger-red-dark) !important; background:#fff1f0 !important; }
body:has(.app-shell:not(.auth-mode)) .dialog .tag.gray { color:#59616b !important; background:#f1f2f3 !important; }

@media (max-width:760px) {
  body:has(.app-shell:not(.auth-mode)) .dialog { border-radius:4px !important; }
  body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav { background:#f7f8f9 !important; }
}

/* Tenant picker is also used during authentication, before auth-mode is
   removed. Keep it on the same light, readable dialog contract in both
   states so legacy dark-card rules cannot leak through the login flow. */
.dialog > .dialog-inner.tenant-selection-dialog,
.dialog > .dialog-inner.tenant-selection-dialog .form,
.dialog > .dialog-inner.tenant-selection-dialog .tenant-selection-list {
  color:var(--ledger-ink) !important;
  border-color:var(--ledger-line) !important;
  background:#fff !important;
  color-scheme:light !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .dialog-head,
.dialog > .dialog-inner.tenant-selection-dialog .form-footer {
  color:var(--ledger-ink) !important;
  border-color:var(--ledger-line) !important;
  background:#f7f8f9 !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .dialog-help {
  color:var(--ledger-muted) !important;
  background:#fff !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .tenant-selection-option {
  display:flex !important;
  align-items:center !important;
  min-height:68px !important;
  border:1px solid var(--ledger-line-strong) !important;
  border-radius:6px !important;
  background:#fff !important;
  color:var(--ledger-ink) !important;
  box-shadow:none !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .tenant-selection-option:hover,
.dialog > .dialog-inner.tenant-selection-dialog .tenant-selection-option:focus-within {
  border-color:#d69a94 !important;
  background:#fffaf9 !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .tenant-selection-option:has(input:checked) {
  border-color:var(--ledger-red) !important;
  background:#fff5f3 !important;
  box-shadow:0 0 0 3px rgba(217,45,32,.1) !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .tenant-selection-option input {
  width:18px !important;
  height:18px !important;
  margin:0 10px 0 0 !important;
  accent-color:var(--ledger-red) !important;
  color-scheme:light !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .tenant-selection-option strong {
  color:var(--ledger-ink) !important;
  font-size:15px !important;
  line-height:1.35 !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .tenant-selection-option small {
  color:var(--ledger-muted) !important;
  font-size:12px !important;
  line-height:1.35 !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .form-footer {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .form-footer .secondary {
  color:#4b535c !important;
  border:1px solid var(--ledger-line-strong) !important;
  background:#fff !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .form-footer .secondary:hover {
  color:var(--ledger-red-dark) !important;
  border-color:#d69a94 !important;
  background:#fff8f7 !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .form-footer .primary {
  color:#fff !important;
  border-color:var(--ledger-red) !important;
  background:var(--ledger-red) !important;
}
.dialog > .dialog-inner.tenant-selection-dialog .form-footer .primary:hover {
  border-color:var(--ledger-red-dark) !important;
  background:var(--ledger-red-dark) !important;
}

@media (max-width:760px) {
  .dialog > .dialog-inner.tenant-selection-dialog .tenant-selection-option {
    min-height:62px !important;
    padding:11px 12px !important;
  }
  .dialog > .dialog-inner.tenant-selection-dialog .tenant-selection-option strong {
    font-size:14px !important;
  }
  .dialog > .dialog-inner.tenant-selection-dialog .form-footer {
    align-items:stretch !important;
    flex-direction:column-reverse !important;
  }
  .dialog > .dialog-inner.tenant-selection-dialog .form-footer button {
    width:100% !important;
  }
}

/* Legal footer shared by the login entry and authenticated workspace.
   Keep the footer in the same neutral palette as the operating system UI. */
.platform-legal-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  width:100%;
  box-sizing:border-box;
  margin:0;
  padding:15px clamp(24px,5vw,72px) 17px;
  color:var(--ledger-muted);
  background:var(--ledger-canvas);
  border-top:1px solid var(--ledger-line);
  font-size:12px;
  line-height:1.5;
}
.workspace-legal-footer {
  flex:0 0 auto;
}
.platform-legal-copy,
.platform-legal-meta {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:5px 14px;
  min-width:0;
}
.platform-legal-copy { justify-content:flex-start; }
.platform-legal-copy strong {
  color:var(--ledger-ink);
  font-size:13px;
  font-weight:700;
}
.platform-legal-copy span { color:#858b93; }
.platform-legal-meta { justify-content:flex-end; gap:8px 18px; }
.platform-legal-trust,
.platform-legal-links { display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; }
.platform-legal-links { padding-left:18px; border-left:1px solid var(--ledger-line); }
.platform-filing-link { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.platform-filing-link svg { width:14px; height:14px; color:var(--ledger-green); }
.platform-legal-meta a {
  color:#59616b;
  text-decoration:none;
}
.platform-legal-meta a:hover,
.platform-legal-meta a:focus-visible {
  color:var(--ledger-red-dark);
  text-decoration:underline;
}
.platform-trust-item {
  display:inline-flex;
  align-items:center;
  gap:4px;
  color:#737981;
  white-space:nowrap;
}
.platform-trust-item svg { width:13px; height:13px; color:var(--ledger-green); }
.app-shell.auth-mode .workspace-legal-footer { display:flex !important; flex:0 0 auto; }
.app-shell.auth-mode .auth-panel { min-height:0; }
.app-shell.auth-mode .auth-legal-footer { display:none !important; }

@media (max-width:900px) {
  .platform-legal-footer {
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
    padding:16px 24px 18px;
  }
  .platform-legal-meta { justify-content:flex-start; gap:8px 14px; }
  .platform-legal-links { padding-left:0; border-left:0; }
}

@media (max-width:760px) {
  .platform-legal-footer {
    width:100%;
    padding:14px 16px 16px;
  }
  .platform-legal-meta { justify-content:flex-start; gap:8px 14px; }
  .platform-legal-copy,
  .platform-legal-meta,
  .platform-legal-trust,
  .platform-legal-links { width:100%; }
  .platform-legal-copy { gap:2px 10px; }
  .platform-legal-links { gap:6px 14px; }
  .platform-trust-item { white-space:normal; }
  body:has(.app-shell.auth-mode) { padding-bottom:0 !important; }
}

/* Final visible-state contract. Legacy visual-system rules still contain
   dark-workbench declarations with !important; these explicit shared
   component overrides keep every tenant selector and workflow progress card
   readable wherever they are rendered. */
.app-shell:not(.auth-mode) .tenant-switcher,
.app-shell:not(.auth-mode) .tenant-switcher select,
.app-shell:not(.auth-mode) .tenant-context-name {
  color:var(--ledger-ink) !important;
  background:#fff !important;
  border-color:var(--ledger-line-strong) !important;
  box-shadow:none !important;
  color-scheme:light !important;
}
.app-shell:not(.auth-mode) .tenant-switcher select option {
  color:var(--ledger-ink) !important;
  background:#fff !important;
}
.app-shell:not(.auth-mode) .pattern-progress {
  color:var(--ledger-ink) !important;
  background:#fff !important;
  border:1px solid var(--ledger-line) !important;
  border-radius:4px !important;
  box-shadow:none !important;
}
.app-shell:not(.auth-mode) .pattern-progress-head,
.app-shell:not(.auth-mode) .pattern-progress-head strong {
  color:var(--ledger-ink) !important;
}
.app-shell:not(.auth-mode) .pattern-progress-head b {
  color:var(--ledger-red-dark) !important;
}
.app-shell:not(.auth-mode) .pattern-progress-meta {
  color:var(--ledger-muted) !important;
}
.app-shell:not(.auth-mode) .pattern-progress-next {
  color:#4b535c !important;
}
.app-shell:not(.auth-mode) .pattern-progress-next span {
  color:var(--ledger-red-dark) !important;
}
.app-shell:not(.auth-mode) .pattern-progress-track {
  background:#eceef1 !important;
}
.app-shell:not(.auth-mode) .pattern-progress-track i {
  background:var(--ledger-blue) !important;
}
.app-shell:not(.auth-mode) .pattern-progress-mode {
  color:var(--ledger-green) !important;
  background:#eaf7ef !important;
  border-color:#b9dfc9 !important;
}
.app-shell:not(.auth-mode) .pattern-progress-mode.external {
  color:#9a5a08 !important;
  background:#fff8eb !important;
  border-color:#efd39b !important;
}
.app-shell:not(.auth-mode) .pattern-timeline {
  border-color:var(--ledger-line) !important;
}
.app-shell:not(.auth-mode) .pattern-timeline strong {
  color:var(--ledger-ink) !important;
}
.app-shell:not(.auth-mode) .pattern-timeline small {
  color:var(--ledger-muted) !important;
}
.app-shell:not(.auth-mode) .pattern-timeline li:not(:last-child)::after {
  background:#c8cdd3 !important;
}
.app-shell:not(.auth-mode) .pattern-timeline-dot {
  border-color:#aeb5bd !important;
  background:#fff !important;
}
.app-shell:not(.auth-mode) .pattern-timeline li.done .pattern-timeline-dot {
  border-color:var(--ledger-green) !important;
  background:var(--ledger-green) !important;
}
.app-shell:not(.auth-mode) .pattern-timeline li.current .pattern-timeline-dot {
  border-color:var(--ledger-red) !important;
  background:#fff1f0 !important;
}

@media (max-width:760px) {
  .app-shell:not(.auth-mode) .tenant-switcher,
  .app-shell:not(.auth-mode) .tenant-switcher select,
  .app-shell:not(.auth-mode) .tenant-context-name {
    min-width:0 !important;
    max-width:100% !important;
  }
  .app-shell:not(.auth-mode) .pattern-progress {
    padding:12px !important;
  }
}

/* Employee and organization center: one OA-style workspace with three clear
   tasks. Departments filter employees; directory and role maintenance each
   have one canonical entry instead of repeated buttons on every row. */
.app-shell:not(.auth-mode) .org-account-hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:16px 24px;
  margin:0 0 12px;
  padding:6px 0 0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--ledger-ink);
}
.app-shell:not(.auth-mode) .org-account-hero h2 {
  margin:2px 0 4px;
  color:var(--ledger-ink);
  font-size:24px;
  line-height:1.25;
}
.app-shell:not(.auth-mode) .org-account-hero p:not(.eyebrow) {
  margin:0;
  color:var(--ledger-muted);
  font-size:13px;
}
.app-shell:not(.auth-mode) .org-account-hero .hr-hero-actions {
  align-self:center;
  margin:0;
}
.app-shell:not(.auth-mode) .hr-section-tabs {
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  gap:2px;
  min-width:0;
  border-bottom:1px solid var(--ledger-line);
}
.app-shell:not(.auth-mode) .hr-section-tab {
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:40px;
  padding:0 14px;
  border:0;
  border-radius:0;
  background:transparent;
  color:#626b75;
  font-size:13px;
  font-weight:650;
}
.app-shell:not(.auth-mode) .hr-section-tab:hover { color:var(--ledger-ink); background:#f6f7f8; }
.app-shell:not(.auth-mode) .hr-section-tab.is-active { color:var(--ledger-red-dark); }
.app-shell:not(.auth-mode) .hr-section-tab.is-active::after {
  content:"";
  position:absolute;
  right:10px;
  bottom:-1px;
  left:10px;
  height:2px;
  background:var(--ledger-red);
}
.app-shell:not(.auth-mode) .hr-section-tab span {
  min-width:20px;
  padding:1px 6px;
  border-radius:999px;
  background:#eceff1;
  color:#626b75;
  font-size:10px;
  font-weight:700;
}
.app-shell:not(.auth-mode) .org-account-summary {
  display:flex;
  align-items:stretch;
  gap:0;
  margin:0 0 12px;
  border:1px solid var(--ledger-line);
  border-radius:4px;
  background:#fff;
  overflow:hidden;
}
.app-shell:not(.auth-mode) .org-account-summary > div {
  display:flex;
  align-items:baseline;
  gap:8px;
  flex:1 1 0;
  min-width:0;
  padding:10px 14px;
  border:0;
  border-right:1px solid var(--ledger-line);
  border-radius:0;
  background:#fff;
}
.app-shell:not(.auth-mode) .org-account-summary > div:last-child { border-right:0; }
.app-shell:not(.auth-mode) .org-account-summary span { color:var(--ledger-muted); font-size:11px; }
.app-shell:not(.auth-mode) .org-account-summary strong { color:var(--ledger-ink); font-size:17px; line-height:1.2; }
.app-shell:not(.auth-mode) .org-account-content { min-width:0; }
.app-shell:not(.auth-mode) .org-primary-panel { margin:0; overflow:hidden; }
.app-shell:not(.auth-mode) .org-primary-panel > .panel-head { min-height:58px; padding:12px 16px; }
.app-shell:not(.auth-mode) .org-primary-panel > .panel-head > div { display:grid; gap:2px; }
.app-shell:not(.auth-mode) .org-primary-panel > .panel-head h3 { margin:0; }
.app-shell:not(.auth-mode) .org-filter-bar {
  display:flex;
  align-items:center;
  gap:12px;
  min-height:50px;
  padding:8px 16px;
  border-bottom:1px solid var(--ledger-line);
  background:#fafafa;
}
.app-shell:not(.auth-mode) .org-filter-bar label { display:flex; align-items:center; gap:8px; color:var(--ledger-muted); font-size:12px; }
.app-shell:not(.auth-mode) .org-filter-bar select {
  min-width:180px;
  height:34px;
  padding:0 30px 0 10px;
  border:1px solid var(--ledger-line-strong);
  border-radius:4px;
  background:#fff;
  color:var(--ledger-ink);
}
.app-shell:not(.auth-mode) .org-filter-summary { margin-left:auto; color:var(--ledger-muted); font-size:11px; }
.app-shell:not(.auth-mode) .org-department-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0;
  padding:0;
}
.app-shell:not(.auth-mode) .org-department-filter {
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  min-height:64px;
  padding:10px 14px;
  border:0;
  border-right:1px solid var(--ledger-line);
  border-bottom:1px solid var(--ledger-line);
  border-radius:0;
  background:#fff;
  color:var(--ledger-ink);
  text-align:left;
}
.app-shell:not(.auth-mode) .org-department-filter:nth-child(2n) { border-right:0; }
.app-shell:not(.auth-mode) .org-department-filter:hover { background:#f8faf9; }
.app-shell:not(.auth-mode) .org-department-filter.is-selected { background:#f1f8f5; box-shadow:inset 3px 0 0 var(--ledger-green); }
.app-shell:not(.auth-mode) .org-department-filter .org-department-main { flex:1 1 auto; }
.app-shell:not(.auth-mode) .org-department-filter .org-department-main > span:last-child { display:grid; gap:2px; min-width:0; }
.app-shell:not(.auth-mode) .org-department-filter .org-department-main strong,
.app-shell:not(.auth-mode) .org-department-filter .org-department-main small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.app-shell:not(.auth-mode) .org-department-filter .org-department-count { min-width:26px; text-align:right; }
.app-shell:not(.auth-mode) .org-role-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; padding:0; }
.app-shell:not(.auth-mode) .org-role-row {
  grid-template-columns:minmax(0,1fr) auto;
  min-height:64px;
  padding:10px 14px;
  border:0;
  border-right:1px solid var(--ledger-line);
  border-bottom:1px solid var(--ledger-line);
  border-radius:0;
}
.app-shell:not(.auth-mode) .org-role-row:nth-child(2n) { border-right:0; }
.app-shell:not(.auth-mode) .org-role-row .row-actions { flex-wrap:wrap; }
.app-shell:not(.auth-mode) .org-members-table { min-width:760px; }

/* employee-permission-workspace=20260903-r1: the reference workflow keeps
   the department directory beside one employee table, then moves role
   maintenance into a separate permission workspace. */
.app-shell:not(.auth-mode) .org-workspace-grid {
  display:grid;
  grid-template-columns:minmax(210px,250px) minmax(0,1fr);
  gap:12px;
  align-items:start;
}
.app-shell:not(.auth-mode) .org-directory-rail {
  min-width:0;
  overflow:hidden;
  border:1px solid var(--ledger-line);
  border-radius:4px;
  background:#fff;
}
.app-shell:not(.auth-mode) .org-rail-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:58px;
  padding:12px 14px;
  border-bottom:1px solid var(--ledger-line);
  background:#fafafa;
}
.app-shell:not(.auth-mode) .org-rail-head > div {
  display:grid;
  gap:3px;
  min-width:0;
}
.app-shell:not(.auth-mode) .org-rail-head strong { color:var(--ledger-ink); font-size:14px; }
.app-shell:not(.auth-mode) .org-rail-head small { color:var(--ledger-muted); font-size:11px; }
.app-shell:not(.auth-mode) .org-directory-rail .org-department-list { grid-template-columns:1fr; }
.app-shell:not(.auth-mode) .org-directory-rail .org-department-filter,
.app-shell:not(.auth-mode) .org-directory-rail .org-department-filter:nth-child(2n) {
  border-right:0;
}
.app-shell:not(.auth-mode) .org-workspace-main { min-width:0; }
.app-shell:not(.auth-mode) .org-workspace-main .org-primary-panel { min-width:0; }
.app-shell:not(.auth-mode) .org-workspace-main .org-members-table { min-width:760px; }
.app-shell:not(.auth-mode) .org-roles-panel .panel-head { align-items:flex-start; }
.app-shell:not(.auth-mode) .org-roles-panel .panel-head > div { min-width:0; }
.app-shell:not(.auth-mode) .org-roles-panel .panel-head .subtle { max-width:68ch; line-height:1.45; }

@media (max-width:900px) {
  .app-shell:not(.auth-mode) .org-account-hero { grid-template-columns:1fr; align-items:start; }
  .app-shell:not(.auth-mode) .org-account-hero .hr-hero-actions { justify-self:start; }
  .app-shell:not(.auth-mode) .org-account-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .app-shell:not(.auth-mode) .org-account-summary > div:nth-child(2) { border-right:0; }
  .app-shell:not(.auth-mode) .org-account-summary > div:nth-child(-n+2) { border-bottom:1px solid var(--ledger-line); }
}

@media (max-width:680px) {
  .app-shell:not(.auth-mode) .org-account-hero { gap:12px; }
  .app-shell:not(.auth-mode) .org-account-hero .hr-hero-actions,
  .app-shell:not(.auth-mode) .org-account-hero .hr-hero-actions button { width:100%; }
  .app-shell:not(.auth-mode) .hr-section-tabs { overflow-x:auto; }
  .app-shell:not(.auth-mode) .hr-section-tab { flex:0 0 auto; min-height:42px; padding:0 12px; }
  .app-shell:not(.auth-mode) .org-account-summary > div { display:grid; gap:3px; padding:9px 11px; }
  .app-shell:not(.auth-mode) .org-filter-bar { align-items:stretch; flex-direction:column; gap:7px; }
  .app-shell:not(.auth-mode) .org-filter-bar label { display:grid; grid-template-columns:auto minmax(0,1fr); }
  .app-shell:not(.auth-mode) .org-filter-bar select { width:100%; min-width:0; }
  .app-shell:not(.auth-mode) .org-filter-summary { margin-left:0; }
  .app-shell:not(.auth-mode) .org-department-list,
  .app-shell:not(.auth-mode) .org-role-list { grid-template-columns:1fr; }
  .app-shell:not(.auth-mode) .org-department-filter,
  .app-shell:not(.auth-mode) .org-role-row { border-right:0; }
  .app-shell:not(.auth-mode) .org-role-row { grid-template-columns:1fr; align-items:start; }
  .app-shell:not(.auth-mode) .org-role-row .row-actions { justify-content:flex-start; }
  .app-shell:not(.auth-mode) .org-workspace-grid { grid-template-columns:1fr; }
  .app-shell:not(.auth-mode) .org-directory-rail { order:0; }
  .app-shell:not(.auth-mode) .org-workspace-main { order:1; }
}

/* Schedule board contract. A product card can contain an expanded details
   disclosure; grid rows must not stretch every sibling to that height, and
   the disclosure must stay on the same light, high-contrast surface as the
   rest of the schedule board. */
.app-shell:not(.auth-mode) .schedule-card {
  color:var(--ledger-ink) !important;
  background:#fff !important;
  border-color:var(--ledger-line) !important;
}
.app-shell:not(.auth-mode) .schedule-product-grid {
  align-items:start !important;
}
.app-shell:not(.auth-mode) .schedule-product {
  align-self:start !important;
  min-height:0 !important;
  height:auto !important;
  color:#3f464e !important;
  background:#fff !important;
  border-color:var(--ledger-line-strong) !important;
  border-radius:4px !important;
  box-shadow:none !important;
}
.app-shell:not(.auth-mode) .schedule-product-head,
.app-shell:not(.auth-mode) .schedule-product-copy {
  min-width:0 !important;
}
.app-shell:not(.auth-mode) .schedule-product-copy strong {
  color:var(--ledger-ink) !important;
}
.app-shell:not(.auth-mode) .schedule-product-copy span,
.app-shell:not(.auth-mode) .schedule-product-copy small {
  color:var(--ledger-muted) !important;
}
.app-shell:not(.auth-mode) .schedule-product-details {
  color:#3f464e !important;
  background:#fff !important;
  border-top:1px solid var(--ledger-line) !important;
  border-color:var(--ledger-line) !important;
}
.app-shell:not(.auth-mode) .schedule-product-details > summary {
  display:list-item !important;
  padding:7px 0 !important;
  color:var(--ledger-red-dark) !important;
  background:#fff !important;
  font-weight:700 !important;
}
.app-shell:not(.auth-mode) .schedule-product-details > summary:hover,
.app-shell:not(.auth-mode) .schedule-product-details > summary:focus-visible {
  color:#a32920 !important;
}
.app-shell:not(.auth-mode) .schedule-info-item {
  border-color:#eceef0 !important;
}
.app-shell:not(.auth-mode) .schedule-info-item dt {
  color:#737981 !important;
}
.app-shell:not(.auth-mode) .schedule-info-item dd {
  color:#3f464e !important;
}
.app-shell:not(.auth-mode) .schedule-communication-notes {
  color:#59616b !important;
  background:#f5f8ff !important;
  border-color:#c9d9f4 !important;
}
.app-shell:not(.auth-mode) .schedule-communication-notes strong {
  color:#2457a6 !important;
}
.app-shell:not(.auth-mode) .schedule-communication-empty {
  color:var(--ledger-muted) !important;
}
.app-shell:not(.auth-mode) .schedule-period span {
  color:#06706a !important;
  background:#eaf7f4 !important;
  border-color:#b9dfd7 !important;
}
.app-shell:not(.auth-mode) .schedule-influencer {
  color:#59616b !important;
  background:#f1f2f3 !important;
  border-color:#dfe2e5 !important;
}
.app-shell:not(.auth-mode) .schedule-card-head p {
  color:var(--ledger-muted) !important;
}

@media (max-width:760px) {
  .app-shell:not(.auth-mode) .schedule-product-grid {
    align-items:stretch !important;
  }
  .app-shell:not(.auth-mode) .schedule-product {
    align-self:stretch !important;
  }
}

/* employee-admin-quick=20260903-r94: keep the daily onboarding path short;
   advanced HR details remain available through explicit disclosure. */
.app-shell:not(.auth-mode) .hr-fast-onboard .hr-core-fields {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.app-shell:not(.auth-mode) .hr-fast-onboard .hr-generated-number-box {
  min-height:40px;
}
.app-shell:not(.auth-mode) .hr-fast-onboard .hr-account-provisioning {
  margin-top:10px;
  padding:12px 14px;
  border:1px solid var(--ledger-line);
  border-radius:4px;
  background:#fafbfc;
}
.app-shell:not(.auth-mode) .hr-fast-onboard .hr-account-provisioning > p {
  margin:7px 0 0;
}
.app-shell:not(.auth-mode) .hr-fast-onboard .hr-employee-more {
  margin-top:8px;
}
.app-shell:not(.auth-mode) .hr-fast-onboard .hr-employee-more:not([open]) {
  background:#fff;
}
.app-shell:not(.auth-mode) .hr-fast-onboard .hr-employee-more summary {
  min-height:34px;
  display:flex;
  align-items:center;
}
.app-shell:not(.auth-mode) .org-members-table .row-actions {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:5px;
}
.app-shell:not(.auth-mode) .org-department-filter {
  min-height:58px;
}
.app-shell:not(.auth-mode) .org-department-filter .org-department-main small {
  white-space:normal;
  overflow-wrap:anywhere;
}
.app-shell:not(.auth-mode) .org-role-row {
  min-height:56px;
}

@media (max-width:680px) {
  .app-shell:not(.auth-mode) .hr-fast-onboard .hr-core-fields {
    grid-template-columns:1fr;
  }
}

/* employee-org-simple=20260903-r95: inline directory rows keep organization
   maintenance focused on the two actions people actually repeat. */
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-editor-simple {
  gap:12px;
  padding:14px;
  background:#fff;
  border-color:var(--ledger-line-strong);
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-columns {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-column {
  min-width:0;
  padding:10px;
  border:1px solid var(--ledger-line);
  border-radius:4px;
  background:var(--ledger-surface-soft);
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-column-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-height:32px;
  margin-bottom:8px;
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-column-head > div:first-child {
  display:grid;
  gap:2px;
  min-width:0;
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-column-head strong { font-size:13px; }
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-column-head small { color:var(--ledger-muted); font-size:11px; }
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-column-actions {
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-items {
  display:grid;
  gap:6px;
  max-height:290px;
  overflow:auto;
  padding-right:2px;
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-item {
  display:grid;
  grid-template-columns:minmax(0,1fr) 30px;
  align-items:center;
  gap:5px;
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-item input {
  min-height:34px;
  padding:7px 9px;
  border-color:var(--ledger-line);
  background:#fff;
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-remove {
  width:30px;
  height:30px;
  padding:0;
  color:var(--ledger-muted);
  border:1px solid var(--ledger-line);
  border-radius:4px;
  background:#fff;
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-remove:hover {
  color:var(--ledger-red-dark);
  border-color:#e3b5b0;
  background:#fff8f7;
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-empty {
  margin:0;
  padding:12px 8px;
  color:var(--ledger-muted);
  font-size:12px;
  text-align:center;
}
.app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-editor-simple > .hr-directory-hint {
  margin:0;
  color:var(--ledger-muted);
}

@media (max-width:760px) {
  .app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-columns { grid-template-columns:1fr; }
  .app-shell:not(.auth-mode) .hr-organization-dialog .hr-directory-items { max-height:220px; }
}

/* END frontend/assets/operations-ledger.css */

/* BEGIN frontend/assets/ui-system-final.css */
/*
 * UI system final pass, 2026-09-01.
 *
 * This is the last visual layer in the cascade. The application has several
 * historical theme layers, so this file deliberately owns the authenticated
 * workspace surfaces as one system while leaving the login flow readable.
 */
:root {
  --ui-canvas: #0a1322;
  --ui-canvas-raised: #0d192b;
  --ui-surface: #101d30;
  --ui-surface-raised: #14243a;
  --ui-surface-elevated: #192b43;
  --ui-surface-soft: #122138;
  --ui-line: #29415d;
  --ui-line-strong: #3d5a79;
  --ui-ink: #eef4fa;
  --ui-ink-soft: #d0dce9;
  --ui-muted: #8da1b7;
  --ui-faint: #687f98;
  --ui-accent: #57d8c5;
  --ui-accent-strong: #36b8aa;
  --ui-accent-soft: #173e46;
  --ui-info: #8ec5ff;
  --ui-warning: #f0c36b;
  --ui-warning-soft: #3b301c;
  --ui-danger: #ff9cab;
  --ui-danger-soft: #412533;
  --ui-success: #69d6a7;
  --ui-success-soft: #143b35;
  --ui-shadow: 0 18px 44px rgba(0, 0, 0, .22);
  --ui-radius: 12px;
  --ui-radius-sm: 8px;
}

html:has(body .app-shell:not(.auth-mode)) {
  color-scheme: dark !important;
  background: var(--ui-canvas) !important;
}

body:has(.app-shell:not(.auth-mode)) {
  margin: 0 !important;
  overflow-x: hidden !important;
  --canvas: var(--ui-canvas) !important;
  --canvas-raised: var(--ui-canvas-raised) !important;
  --surface: var(--ui-surface) !important;
  --surface-soft: var(--ui-surface-soft) !important;
  --surface-raised: var(--ui-surface-raised) !important;
  --surface-elevated: var(--ui-surface-elevated) !important;
  --line: var(--ui-line) !important;
  --line-strong: var(--ui-line-strong) !important;
  --ink: var(--ui-ink) !important;
  --ink-soft: var(--ui-ink-soft) !important;
  --muted: var(--ui-muted) !important;
  --primary: var(--ui-accent) !important;
  --primary-strong: var(--ui-accent-strong) !important;
  --primary-soft: var(--ui-accent-soft) !important;
  background: var(--ui-canvas) !important;
  color: var(--ui-ink) !important;
  font-family: "IBM Plex Sans", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif !important;
  letter-spacing: 0 !important;
}

body:has(.app-shell:not(.auth-mode)) * {
  scrollbar-color: #45627e #0d192b;
}

body:has(.app-shell:not(.auth-mode)) *::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

body:has(.app-shell:not(.auth-mode)) *::-webkit-scrollbar-track {
  background: #0d192b;
}

body:has(.app-shell:not(.auth-mode)) *::-webkit-scrollbar-thumb {
  border: 2px solid #0d192b;
  border-radius: 5px;
  background: #45627e;
}

body:has(.app-shell:not(.auth-mode)) ::selection {
  color: #07151c;
  background: var(--ui-accent);
}

.app-shell:not(.auth-mode),
.app-shell:not(.auth-mode) .workspace,
.app-shell:not(.auth-mode) #page,
.app-shell:not(.auth-mode) .page,
.app-shell:not(.auth-mode) .view-panel {
  color: var(--ui-ink) !important;
  background: var(--ui-canvas) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) {
  background: var(--ui-canvas) !important;
}

.app-shell:not(.auth-mode) {
  grid-template-columns: minmax(216px, 248px) minmax(0, 1fr) !important;
  min-height: 100vh !important;
}

.app-shell:not(.auth-mode) .workspace {
  min-width: 0 !important;
  overflow: hidden !important;
}

.app-shell:not(.auth-mode) .page {
  width: min(100%, 1680px) !important;
  max-width: 1680px !important;
  box-sizing: border-box !important;
  margin: 0 auto !important;
  padding: 28px clamp(18px, 3vw, 48px) 56px !important;
}

.app-shell:not(.auth-mode) .sidebar {
  box-sizing: border-box !important;
  border-right: 1px solid #203750 !important;
  background: #0d1d2f !important;
  box-shadow: 12px 0 30px rgba(0, 0, 0, .16) !important;
}

.app-shell:not(.auth-mode) .sidebar::before,
.app-shell:not(.auth-mode) .sidebar::after,
.app-shell:not(.auth-mode) .workspace::before,
.app-shell:not(.auth-mode) .workspace::after,
.app-shell:not(.auth-mode) #page::before,
.app-shell:not(.auth-mode) #page::after {
  display: none !important;
  content: none !important;
}

.app-shell:not(.auth-mode) .sidebar-header,
.app-shell:not(.auth-mode) .brand,
.app-shell:not(.auth-mode) .brand-copy {
  color: var(--ui-ink) !important;
}

.app-shell:not(.auth-mode) .brand-copy small,
.app-shell:not(.auth-mode) .sidebar-footer,
.app-shell:not(.auth-mode) .nav-group-trigger,
.app-shell:not(.auth-mode) .nav-item:not(.active) {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .nav-group,
.app-shell:not(.auth-mode) .nav-group-items {
  border-color: #203750 !important;
}

.app-shell:not(.auth-mode) .nav-item,
.app-shell:not(.auth-mode) .nav-group-trigger {
  min-height: 40px !important;
  border: 1px solid transparent !important;
  border-radius: var(--ui-radius-sm) !important;
  background: transparent !important;
}

.app-shell:not(.auth-mode) .nav-item:hover,
.app-shell:not(.auth-mode) .nav-group-trigger:hover {
  color: var(--ui-ink) !important;
  border-color: #2d4d6c !important;
  background: #142942 !important;
}

.app-shell:not(.auth-mode) .nav-item.active {
  color: #d9fff7 !important;
  border-color: #2d968c !important;
  background: var(--ui-accent-soft) !important;
  box-shadow: inset 3px 0 0 var(--ui-accent), 0 8px 18px rgba(18, 97, 95, .16) !important;
}

.app-shell:not(.auth-mode) .nav-item.active span,
.app-shell:not(.auth-mode) .nav-item.active i,
.app-shell:not(.auth-mode) .nav-item.active svg {
  color: var(--ui-accent) !important;
}

.app-shell:not(.auth-mode) .topbar {
  min-height: 68px !important;
  box-sizing: border-box !important;
  border-bottom: 1px solid var(--ui-line) !important;
  background: rgba(13, 25, 43, .96) !important;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .2) !important;
  backdrop-filter: blur(14px) !important;
}

.app-shell:not(.auth-mode) .topbar h1,
.app-shell:not(.auth-mode) .topbar .eyebrow,
.app-shell:not(.auth-mode) .topbar .breadcrumb,
.app-shell:not(.auth-mode) .topbar strong {
  color: var(--ui-ink) !important;
}

.app-shell:not(.auth-mode) .topbar p,
.app-shell:not(.auth-mode) .topbar small,
.app-shell:not(.auth-mode) .topbar span {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .topbar input,
.app-shell:not(.auth-mode) .topbar select,
.app-shell:not(.auth-mode) .tenant-switcher,
.app-shell:not(.auth-mode) .workbench-switcher {
  min-height: 40px !important;
  color: var(--ui-ink-soft) !important;
  border: 1px solid var(--ui-line-strong) !important;
  border-radius: var(--ui-radius-sm) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
  color-scheme: dark !important;
}

.app-shell:not(.auth-mode) .topbar input::placeholder,
.app-shell:not(.auth-mode) input::placeholder,
.app-shell:not(.auth-mode) textarea::placeholder {
  color: var(--ui-faint) !important;
  opacity: 1 !important;
}

.app-shell:not(.auth-mode) .topbar input:focus,
.app-shell:not(.auth-mode) .topbar select:focus,
.app-shell:not(.auth-mode) input:focus,
.app-shell:not(.auth-mode) select:focus,
.app-shell:not(.auth-mode) textarea:focus {
  border-color: var(--ui-accent) !important;
  box-shadow: 0 0 0 3px rgba(87, 216, 197, .14) !important;
  outline: none !important;
}

.app-shell:not(.auth-mode) .workspace-tabs {
  min-height: 48px !important;
  box-sizing: border-box !important;
  padding: 7px clamp(18px, 3vw, 48px) !important;
  border-bottom: 1px solid var(--ui-line) !important;
  background: var(--ui-canvas-raised) !important;
}

.app-shell:not(.auth-mode) .workspace-tab {
  min-height: 34px !important;
  color: var(--ui-muted) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: 7px !important;
  background: var(--ui-surface) !important;
}

.app-shell:not(.auth-mode) .workspace-tab.active {
  color: #d9fff7 !important;
  border-color: #319e93 !important;
  background: var(--ui-accent-soft) !important;
  box-shadow: inset 0 -2px 0 var(--ui-accent) !important;
}

.app-shell:not(.auth-mode) .workspace-tab-close {
  color: var(--ui-muted) !important;
  border-left-color: var(--ui-line) !important;
}

.app-shell:not(.auth-mode) a,
.app-shell:not(.auth-mode) .action-link {
  color: var(--ui-info) !important;
}

.app-shell:not(.auth-mode) a:hover,
.app-shell:not(.auth-mode) .action-link:hover {
  color: #c5e2ff !important;
}

.app-shell:not(.auth-mode) .panel,
.app-shell:not(.auth-mode) .metric,
.app-shell:not(.auth-mode) .metric-card,
.app-shell:not(.auth-mode) .summary-card,
.app-shell:not(.auth-mode) .role-card,
.app-shell:not(.auth-mode) .schedule-kpi,
.app-shell:not(.auth-mode) .work-card,
.app-shell:not(.auth-mode) .schedule-card,
.app-shell:not(.auth-mode) .schedule-product-card,
.app-shell:not(.auth-mode) .finance-invoice-preview,
.app-shell:not(.auth-mode) .operation-connector-card,
.app-shell:not(.auth-mode) .dashboard-module-card,
.app-shell:not(.auth-mode) .hr-department-card,
.app-shell:not(.auth-mode) .hr-performance-grid article,
.app-shell:not(.auth-mode) .product-workbench-panel,
.app-shell:not(.auth-mode) .ledger-summary-item,
.app-shell:not(.auth-mode) .ledger-inspector,
.app-shell:not(.auth-mode) .attachment-card,
.app-shell:not(.auth-mode) .order-lines-card {
  color: var(--ui-ink-soft) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius) !important;
  background: var(--ui-surface) !important;
  box-shadow: var(--ui-shadow) !important;
}

.app-shell:not(.auth-mode) .panel-head,
.app-shell:not(.auth-mode) .dashboard-module-card-head,
.app-shell:not(.auth-mode) .activity-head,
.app-shell:not(.auth-mode) .hr-directory-head,
.app-shell:not(.auth-mode) .finance-invoice-toolbar {
  color: var(--ui-ink) !important;
  border-bottom: 1px solid var(--ui-line) !important;
  background: var(--ui-surface-raised) !important;
}

.app-shell:not(.auth-mode) .panel-head h2,
.app-shell:not(.auth-mode) .panel-head h3,
.app-shell:not(.auth-mode) .section-title,
.app-shell:not(.auth-mode) .section-heading,
.app-shell:not(.auth-mode) .dashboard-module-name,
.app-shell:not(.auth-mode) .activity-heading,
.app-shell:not(.auth-mode) .hr-section-title {
  color: var(--ui-ink) !important;
}

.app-shell:not(.auth-mode) .panel-head p,
.app-shell:not(.auth-mode) .panel-head small,
.app-shell:not(.auth-mode) .panel-description,
.app-shell:not(.auth-mode) .metric-note,
.app-shell:not(.auth-mode) .activity-filter-note,
.app-shell:not(.auth-mode) .dashboard-updated,
.app-shell:not(.auth-mode) .subtle {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .metric,
.app-shell:not(.auth-mode) .metric-card,
.app-shell:not(.auth-mode) .summary-card,
.app-shell:not(.auth-mode) .schedule-kpi,
.app-shell:not(.auth-mode) .ledger-summary-item {
  min-width: 0 !important;
  padding: 18px !important;
  background: linear-gradient(145deg, var(--ui-surface-raised), var(--ui-surface)) !important;
}

.app-shell:not(.auth-mode) .metric-label,
.app-shell:not(.auth-mode) .ledger-summary-item span {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .metric-value,
.app-shell:not(.auth-mode) .ledger-summary-item strong {
  color: var(--ui-ink) !important;
}

.app-shell:not(.auth-mode) .ledger-summary {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 18px !important;
}

body:has(.app-shell:not(.auth-mode)) .product-center-toolbar,
body:has(.app-shell:not(.auth-mode)) .ledger-summary {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-surface-raised) !important;
  box-shadow: var(--ui-shadow) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-center-toolbar .toolbar-copy h2 {
  color: var(--ui-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-center-toolbar .toolbar-copy p {
  color: var(--ui-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-center-toolbar > .toolbar-actions.filters {
  border-top-color: var(--ui-line) !important;
  background: transparent !important;
}

body:has(.app-shell:not(.auth-mode)) .product-center-toolbar .filter-chip {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line-strong) !important;
  background: var(--ui-surface) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-center-toolbar .filter-chip.selected {
  color: #d9fff7 !important;
  border-color: #319e93 !important;
  background: var(--ui-accent-soft) !important;
}

.app-shell:not(.auth-mode) .ledger-summary-item.pending {
  border-color: #69562d !important;
  background: linear-gradient(145deg, #322b1c, #201e1b) !important;
}

.app-shell:not(.auth-mode) .ledger-summary-item.risk {
  border-color: #684052 !important;
  background: linear-gradient(145deg, #382230, #211b2a) !important;
}

.app-shell:not(.auth-mode) .toolbar-copy h2,
.app-shell:not(.auth-mode) .page-title,
.app-shell:not(.auth-mode) .dashboard-hero h2,
.app-shell:not(.auth-mode) .hr-hero h2,
.app-shell:not(.auth-mode) .schedule-hero h2 {
  color: var(--ui-ink) !important;
}

.app-shell:not(.auth-mode) .toolbar-copy p,
.app-shell:not(.auth-mode) .dashboard-hero p,
.app-shell:not(.auth-mode) .hr-hero p,
.app-shell:not(.auth-mode) .schedule-hero p {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .product-ledger-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px) !important;
  align-items: start !important;
  gap: 16px !important;
}

.app-shell:not(.auth-mode) .product-ledger-layout > .product-workbench-panel {
  min-width: 0 !important;
}

.app-shell:not(.auth-mode) .ledger-inspector {
  position: sticky !important;
  top: 18px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  background: var(--ui-surface-raised) !important;
}

.app-shell:not(.auth-mode) .ledger-inspector-head {
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 16px !important;
  border-bottom: 1px solid var(--ui-line) !important;
  background: #172b44 !important;
}

.app-shell:not(.auth-mode) .ledger-inspector-head img {
  width: 48px !important;
  height: 60px !important;
  object-fit: cover !important;
  border: 1px solid var(--ui-line-strong) !important;
  border-radius: 7px !important;
  background: var(--ui-surface) !important;
}

.app-shell:not(.auth-mode) .ledger-inspector-head span,
.app-shell:not(.auth-mode) .ledger-inspector-head small,
.app-shell:not(.auth-mode) .ledger-facts dt,
.app-shell:not(.auth-mode) .ledger-inspector-activity small {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .ledger-inspector-head strong,
.app-shell:not(.auth-mode) .ledger-facts dd,
.app-shell:not(.auth-mode) .ledger-inspector-activity strong {
  color: var(--ui-ink) !important;
}

.app-shell:not(.auth-mode) .ledger-inspector-actions,
.app-shell:not(.auth-mode) .ledger-inspector-tabs {
  display: flex !important;
  gap: 8px !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid var(--ui-line) !important;
  background: var(--ui-surface) !important;
}

.app-shell:not(.auth-mode) .ledger-inspector-tabs {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.app-shell:not(.auth-mode) .ledger-inspector-tabs button {
  min-height: 30px !important;
  color: var(--ui-muted) !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  background: transparent !important;
}

.app-shell:not(.auth-mode) .ledger-inspector-tabs button.active {
  color: #d9fff7 !important;
  border-color: #2d968c !important;
  background: var(--ui-accent-soft) !important;
}

.app-shell:not(.auth-mode) .ledger-inspector-body {
  padding: 16px !important;
  background: var(--ui-surface-raised) !important;
}

.app-shell:not(.auth-mode) .ledger-facts {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
}

.app-shell:not(.auth-mode) .ledger-facts > div {
  padding-bottom: 10px !important;
  border-bottom: 1px solid #223a55 !important;
}

.app-shell:not(.auth-mode) .ledger-facts dd {
  margin: 4px 0 0 !important;
}

.app-shell:not(.auth-mode) .ledger-timeline {
  margin: 18px 0 0 !important;
  padding: 0 !important;
}

.app-shell:not(.auth-mode) .ledger-timeline strong {
  color: var(--ui-ink-soft) !important;
}

.app-shell:not(.auth-mode) .ledger-timeline small {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .ledger-timeline-mark {
  color: var(--ui-accent) !important;
  border-color: #4d998f !important;
  background: #173e46 !important;
}

.app-shell:not(.auth-mode) .ledger-timeline li:not(:last-child)::after {
  background: #35516d !important;
}

.app-shell:not(.auth-mode) .ledger-inspector-empty,
.app-shell:not(.auth-mode) .ledger-inspector-empty-state {
  color: var(--ui-muted) !important;
  background: transparent !important;
}

.app-shell:not(.auth-mode) .product-workbench-table {
  width: 100% !important;
  min-width: 920px !important;
  color: var(--ui-ink-soft) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: var(--ui-surface) !important;
}

.app-shell:not(.auth-mode) .product-workbench-table th {
  color: var(--ui-muted) !important;
  border-bottom: 1px solid var(--ui-line-strong) !important;
  background: #172b44 !important;
}

.app-shell:not(.auth-mode) .product-workbench-table td {
  color: var(--ui-ink-soft) !important;
  border-bottom: 1px solid #203750 !important;
  background: var(--ui-surface) !important;
}

.app-shell:not(.auth-mode) .product-workbench-table tbody tr:hover td,
.app-shell:not(.auth-mode) .product-workbench-table tbody tr.is-selected td {
  background: #142b42 !important;
}

body:has(.app-shell:not(.auth-mode)) .product-workbench-panel .table-wrap {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-surface) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-workbench-table,
body:has(.app-shell:not(.auth-mode)) .product-workbench-table tbody,
body:has(.app-shell:not(.auth-mode)) .product-workbench-table tbody tr {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-surface) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-workbench-table tbody tr:hover,
body:has(.app-shell:not(.auth-mode)) .product-workbench-table tbody tr.is-selected {
  background: #142b42 !important;
}

body:has(.app-shell:not(.auth-mode)) .product-workbench-table tbody td {
  color: var(--ui-ink-soft) !important;
  border-color: #203750 !important;
  background: transparent !important;
}

body:has(.app-shell:not(.auth-mode)) .product-workbench-table tbody tr:hover td,
body:has(.app-shell:not(.auth-mode)) .product-workbench-table tbody tr.is-selected td {
  color: var(--ui-ink-soft) !important;
  background: #142b42 !important;
}

body:has(.app-shell:not(.auth-mode)) .product-workbench-table .product-row-actions,
body:has(.app-shell:not(.auth-mode)) .product-workbench-table .row-action-menu-panel {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line-strong) !important;
  background: var(--ui-surface-raised) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-workbench-panel .pagination {
  color: var(--ui-muted) !important;
  border-top-color: var(--ui-line) !important;
  background: var(--ui-surface-raised) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-table,
body:has(.app-shell:not(.auth-mode)) .data-table,
body:has(.app-shell:not(.auth-mode)) .order-line-table,
body:has(.app-shell:not(.auth-mode)) .hr-table,
body:has(.app-shell:not(.auth-mode)) .finance-invoice-table {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-surface) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-table th,
body:has(.app-shell:not(.auth-mode)) .data-table th,
body:has(.app-shell:not(.auth-mode)) .order-line-table th,
body:has(.app-shell:not(.auth-mode)) .hr-table th,
body:has(.app-shell:not(.auth-mode)) .finance-invoice-table th {
  color: var(--ui-muted) !important;
  border-color: var(--ui-line-strong) !important;
  background: var(--ui-surface-raised) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-table td,
body:has(.app-shell:not(.auth-mode)) .data-table td,
body:has(.app-shell:not(.auth-mode)) .order-line-table td,
body:has(.app-shell:not(.auth-mode)) .hr-table td,
body:has(.app-shell:not(.auth-mode)) .finance-invoice-table td {
  color: var(--ui-ink-soft) !important;
  border-color: #203750 !important;
  background: var(--ui-surface) !important;
}

body:has(.app-shell:not(.auth-mode)) .product-table tbody tr:hover td,
body:has(.app-shell:not(.auth-mode)) .data-table tbody tr:hover td,
body:has(.app-shell:not(.auth-mode)) .order-line-table tbody tr:hover td,
body:has(.app-shell:not(.auth-mode)) .hr-table tbody tr:hover td,
body:has(.app-shell:not(.auth-mode)) .finance-invoice-table tbody tr:hover td {
  background: #142b42 !important;
}

body:has(.app-shell:not(.auth-mode)) .platform-legal-footer,
body:has(.app-shell:not(.auth-mode)) .workspace-legal-footer {
  color: var(--ui-muted) !important;
  border-top-color: var(--ui-line) !important;
  background: var(--ui-canvas-raised) !important;
}

body:has(.app-shell:not(.auth-mode)) .platform-legal-copy strong {
  color: var(--ui-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .platform-legal-copy span,
body:has(.app-shell:not(.auth-mode)) .platform-legal-meta,
body:has(.app-shell:not(.auth-mode)) .platform-trust-item,
body:has(.app-shell:not(.auth-mode)) .platform-legal-meta a {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .product-workbench-table .stack > strong,
.app-shell:not(.auth-mode) .product-workbench-table .product-code,
.app-shell:not(.auth-mode) .product-workbench-table .style-no {
  color: var(--ui-ink) !important;
}

.app-shell:not(.auth-mode) .table-wrap {
  max-width: 100% !important;
  overflow-x: auto !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
}

.app-shell:not(.auth-mode) .status-tag,
.app-shell:not(.auth-mode) .tag,
.app-shell:not(.auth-mode) .chip,
.app-shell:not(.auth-mode) .filter-chip {
  border: 1px solid var(--ui-line-strong) !important;
  border-radius: 999px !important;
  background: var(--ui-surface-elevated) !important;
  color: var(--ui-ink-soft) !important;
}

.app-shell:not(.auth-mode) .tag.blue,
.app-shell:not(.auth-mode) .status-tag.blue {
  color: #c5e2ff !important;
  border-color: #35628e !important;
  background: #183552 !important;
}

.app-shell:not(.auth-mode) .tag.green,
.app-shell:not(.auth-mode) .status-tag.green {
  color: #c3f4dc !important;
  border-color: #317a66 !important;
  background: var(--ui-success-soft) !important;
}

.app-shell:not(.auth-mode) .tag.orange,
.app-shell:not(.auth-mode) .status-tag.orange {
  color: #ffe5a9 !important;
  border-color: #8a6a32 !important;
  background: var(--ui-warning-soft) !important;
}

.app-shell:not(.auth-mode) .tag.red,
.app-shell:not(.auth-mode) .status-tag.red {
  color: #ffd0d7 !important;
  border-color: #84445b !important;
  background: var(--ui-danger-soft) !important;
}

.app-shell:not(.auth-mode) button,
.app-shell:not(.auth-mode) input,
.app-shell:not(.auth-mode) select,
.app-shell:not(.auth-mode) textarea {
  font: inherit !important;
  letter-spacing: 0 !important;
}

.app-shell:not(.auth-mode) button {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line-strong) !important;
  border-radius: var(--ui-radius-sm) !important;
  background: var(--ui-surface-raised) !important;
  box-shadow: none !important;
}

.app-shell:not(.auth-mode) button:hover,
.app-shell:not(.auth-mode) button:focus-visible {
  color: #eafffa !important;
  border-color: var(--ui-accent-strong) !important;
  background: #17334a !important;
}

.app-shell:not(.auth-mode) button.primary,
.app-shell:not(.auth-mode) .action-button.primary,
.app-shell:not(.auth-mode) button[data-primary] {
  color: #071b21 !important;
  border-color: var(--ui-accent) !important;
  background: var(--ui-accent) !important;
  box-shadow: 0 8px 18px rgba(87, 216, 197, .14) !important;
}

.app-shell:not(.auth-mode) button.primary:hover,
.app-shell:not(.auth-mode) .action-button.primary:hover,
.app-shell:not(.auth-mode) button[data-primary]:hover {
  color: #06151a !important;
  border-color: #84e9dc !important;
  background: #84e9dc !important;
}

.app-shell:not(.auth-mode) button.danger,
.app-shell:not(.auth-mode) .action-button.danger {
  color: #ffd7de !important;
  border-color: #8e4560 !important;
  background: var(--ui-danger-soft) !important;
}

.app-shell:not(.auth-mode) input,
.app-shell:not(.auth-mode) select,
.app-shell:not(.auth-mode) textarea {
  min-width: 0 !important;
  color: var(--ui-ink) !important;
  border: 1px solid var(--ui-line-strong) !important;
  border-radius: var(--ui-radius-sm) !important;
  background: #0d1b2e !important;
  color-scheme: dark !important;
}

.app-shell:not(.auth-mode) .form,
.app-shell:not(.auth-mode) .form-grid,
.app-shell:not(.auth-mode) .field,
.app-shell:not(.auth-mode) .fields,
.app-shell:not(.auth-mode) .detail-more-fields,
.app-shell:not(.auth-mode) .detail-focus-section,
.app-shell:not(.auth-mode) .sku-grid,
.app-shell:not(.auth-mode) .model-reference-slot,
.app-shell:not(.auth-mode) .image-drop,
.app-shell:not(.auth-mode) .empty-state,
.app-shell:not(.auth-mode) .permission-empty {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

.app-shell:not(.auth-mode) .field label,
.app-shell:not(.auth-mode) .field strong,
.app-shell:not(.auth-mode) .detail-meta,
.app-shell:not(.auth-mode) .detail-actions-note,
.app-shell:not(.auth-mode) .dialog-help {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .field strong,
.app-shell:not(.auth-mode) .detail-title,
.app-shell:not(.auth-mode) .section-heading strong {
  color: var(--ui-ink) !important;
}

/* Detail pages: one module grammar, one surface ladder. */
body:has(.app-shell:not(.auth-mode)) .dialog,
body:has(.app-shell:not(.auth-mode)) .dialog-inner,
body:has(.app-shell:not(.auth-mode)) .product-detail-shell,
body:has(.app-shell:not(.auth-mode)) .dialog .details,
body:has(.app-shell:not(.auth-mode)) .dialog .form,
body:has(.app-shell:not(.auth-mode)) .dialog .form-footer,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-content,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-focus-section,
body:has(.app-shell:not(.auth-mode)) .dialog .fields,
body:has(.app-shell:not(.auth-mode)) .dialog .field,
body:has(.app-shell:not(.auth-mode)) .dialog .sku-grid,
body:has(.app-shell:not(.auth-mode)) .dialog .sku-chip,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-more-fields,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-more-fields summary,
body:has(.app-shell:not(.auth-mode)) .dialog .model-reference-slot,
body:has(.app-shell:not(.auth-mode)) .dialog .consent-check,
body:has(.app-shell:not(.auth-mode)) .dialog .revision-opinion-item,
body:has(.app-shell:not(.auth-mode)) .dialog .revision-history-preview,
body:has(.app-shell:not(.auth-mode)) .dialog .contract-editor-context,
body:has(.app-shell:not(.auth-mode)) .dialog .contract-editor-preview,
body:has(.app-shell:not(.auth-mode)) .dialog .contract-editor-preview-body,
body:has(.app-shell:not(.auth-mode)) .dialog .role-banner,
body:has(.app-shell:not(.auth-mode)) .dialog .permission-group,
body:has(.app-shell:not(.auth-mode)) .dialog .empty-state {
  box-sizing: border-box !important;
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
  color-scheme: dark !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog {
  width: min(1180px, calc(100vw - 32px)) !important;
  max-width: 1180px !important;
  max-height: min(92vh, 980px) !important;
  overflow: hidden !important;
  border: 1px solid var(--ui-line-strong) !important;
  border-radius: var(--ui-radius) !important;
  background: var(--ui-surface) !important;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .48) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog::backdrop {
  background: rgba(3, 10, 20, .72) !important;
  backdrop-filter: blur(8px) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .dialog-head,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-head,
body:has(.app-shell:not(.auth-mode)) .dialog .history-head,
body:has(.app-shell:not(.auth-mode)) .dialog .form-footer {
  color: var(--ui-ink) !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-surface-raised) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .dialog-head h2,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-head h3,
body:has(.app-shell:not(.auth-mode)) .dialog .section-title,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-title,
body:has(.app-shell:not(.auth-mode)) .dialog .field strong,
body:has(.app-shell:not(.auth-mode)) .dialog .sku-chip,
body:has(.app-shell:not(.auth-mode)) .dialog .permission-option,
body:has(.app-shell:not(.auth-mode)) .dialog .pattern-timeline strong {
  color: var(--ui-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog p,
body:has(.app-shell:not(.auth-mode)) .dialog small,
body:has(.app-shell:not(.auth-mode)) .dialog .subtle,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-head p,
body:has(.app-shell:not(.auth-mode)) .dialog .field label,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-meta {
  color: var(--ui-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav {
  gap: 8px !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-canvas-raised) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav-item {
  color: var(--ui-muted) !important;
  border-color: var(--ui-line) !important;
  border-radius: 7px !important;
  background: var(--ui-surface) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav-item:hover,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav-item.is-active {
  color: #d9fff7 !important;
  border-color: #319e93 !important;
  background: var(--ui-accent-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-index {
  color: #d9fff7 !important;
  border-color: #319e93 !important;
  background: var(--ui-accent-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-content > section {
  border-top-color: var(--ui-line) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-actions,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-contract-actions {
  color: var(--ui-ink-soft) !important;
  border-color: #2d675f !important;
  background: #12323c !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-contract-actions {
  border-color: #725b2a !important;
  background: var(--ui-warning-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-actions-head strong {
  color: var(--ui-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-actions-head span {
  color: var(--ui-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog input,
body:has(.app-shell:not(.auth-mode)) .dialog select,
body:has(.app-shell:not(.auth-mode)) .dialog textarea {
  color: var(--ui-ink) !important;
  border-color: var(--ui-line-strong) !important;
  background: #0d1b2e !important;
  color-scheme: dark !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .image-drop,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-image-drop,
body:has(.app-shell:not(.auth-mode)) .dialog .attachment-picker,
body:has(.app-shell:not(.auth-mode)) .dialog .styling-output-preview,
body:has(.app-shell:not(.auth-mode)) .dialog .model-image-inline-empty {
  color: var(--ui-muted) !important;
  border: 1px dashed var(--ui-line-strong) !important;
  background: #0d1b2e !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .image-drop:hover,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-image-drop:hover,
body:has(.app-shell:not(.auth-mode)) .dialog .attachment-picker:hover {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-accent) !important;
  background: #112a3f !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .image-block,
body:has(.app-shell:not(.auth-mode)) .dialog .image-block-head,
body:has(.app-shell:not(.auth-mode)) .dialog .design-image-strip {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line) !important;
  background: transparent !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .image-block-head strong,
body:has(.app-shell:not(.auth-mode)) .dialog .image-drop-copy strong,
body:has(.app-shell:not(.auth-mode)) .dialog .image-main-action-row strong {
  color: var(--ui-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .image-block-head small,
body:has(.app-shell:not(.auth-mode)) .dialog .image-drop-copy small,
body:has(.app-shell:not(.auth-mode)) .dialog .image-main-action-row span,
body:has(.app-shell:not(.auth-mode)) .dialog .image-permission-note,
body:has(.app-shell:not(.auth-mode)) .dialog .design-image-keep-one,
body:has(.app-shell:not(.auth-mode)) .dialog .design-image-order-hint {
  color: var(--ui-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .image-permission-note {
  display: block !important;
  border: 0 !important;
  background: transparent !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .image-permission-badge.image-permission-ready {
  color: #c3f4dc !important;
  border-color: #317a66 !important;
  background: var(--ui-success-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .image-permission-badge.image-permission-locked {
  color: var(--ui-muted) !important;
  border-color: var(--ui-line-strong) !important;
  background: var(--ui-surface-elevated) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog button:not(.primary),
body:has(.app-shell:not(.auth-mode)) .dialog .secondary,
body:has(.app-shell:not(.auth-mode)) .dialog .action-button,
body:has(.app-shell:not(.auth-mode)) .dialog .design-image-thumb,
body:has(.app-shell:not(.auth-mode)) .dialog .design-image-replace {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line-strong) !important;
  background: var(--ui-surface-raised) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog button:not(.primary):hover,
body:has(.app-shell:not(.auth-mode)) .dialog .secondary:hover,
body:has(.app-shell:not(.auth-mode)) .dialog .design-image-thumb:hover,
body:has(.app-shell:not(.auth-mode)) .dialog .design-image-replace:hover {
  color: #d9fff7 !important;
  border-color: var(--ui-accent-strong) !important;
  background: #17334a !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .tag.gray {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line-strong) !important;
  background: var(--ui-surface-elevated) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .tag.orange {
  color: #ffe5a9 !important;
  border-color: #8a6a32 !important;
  background: var(--ui-warning-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .product-history-panel,
body:has(.app-shell:not(.auth-mode)) .dialog .label-preview-grid > div,
body:has(.app-shell:not(.auth-mode)) .dialog .styling-image-wrap,
body:has(.app-shell:not(.auth-mode)) .dialog .matching-list,
body:has(.app-shell:not(.auth-mode)) .dialog .styling-image-empty {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-surface-raised) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .label-preview-grid > div strong,
body:has(.app-shell:not(.auth-mode)) .dialog .styling-image-empty strong {
  color: var(--ui-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .label-preview-grid > div span,
body:has(.app-shell:not(.auth-mode)) .dialog .label-preview-grid > div small,
body:has(.app-shell:not(.auth-mode)) .dialog .styling-image-empty span,
body:has(.app-shell:not(.auth-mode)) .dialog .matching-list .subtle {
  color: var(--ui-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .effect-status {
  color: var(--ui-muted) !important;
  border-color: var(--ui-line-strong) !important;
  background: var(--ui-surface-elevated) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .effect-status.ready {
  color: #c3f4dc !important;
  border-color: #317a66 !important;
  background: var(--ui-success-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .effect-status.failed {
  color: #ffd0d7 !important;
  border-color: #84445b !important;
  background: var(--ui-danger-soft) !important;
}

/* Progress is an information panel, never a white card inside a dark dialog. */
body:has(.app-shell:not(.auth-mode)) .pattern-progress,
.app-shell:not(.auth-mode) .pattern-progress {
  color: var(--ui-ink-soft) !important;
  border: 1px solid #2f6270 !important;
  border-radius: var(--ui-radius-sm) !important;
  background: linear-gradient(145deg, #12313c, #102532) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-progress-head,
body:has(.app-shell:not(.auth-mode)) .pattern-progress-head strong {
  color: var(--ui-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-progress-head b {
  color: var(--ui-accent) !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-progress-meta,
body:has(.app-shell:not(.auth-mode)) .pattern-progress-next {
  color: var(--ui-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-progress-next span {
  color: #b8f8e9 !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-progress-track {
  background: #244853 !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-progress-track i {
  background: var(--ui-accent) !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-progress-mode {
  color: #c3f4dc !important;
  border-color: #317a66 !important;
  background: var(--ui-success-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-progress-mode.external {
  color: #ffe5a9 !important;
  border-color: #8a6a32 !important;
  background: var(--ui-warning-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-timeline {
  border-color: #35516d !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-timeline small {
  color: var(--ui-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-timeline li:not(:last-child)::after {
  background: #35516d !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-timeline-dot {
  border-color: #5b7892 !important;
  background: var(--ui-surface-raised) !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-timeline-dot.done,
body:has(.app-shell:not(.auth-mode)) .pattern-timeline-dot.active {
  border-color: var(--ui-accent) !important;
  background: var(--ui-accent-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .revision-opinions-section > .section-heading > strong,
body:has(.app-shell:not(.auth-mode)) .dialog .pending-opinion-badge {
  color: #ffe5a9 !important;
  border-color: #8a6a32 !important;
  background: var(--ui-warning-soft) !important;
}

.app-shell:not(.auth-mode) .schedule-hero,
.app-shell:not(.auth-mode) .hr-hero,
.app-shell:not(.auth-mode) .role-banner,
.app-shell:not(.auth-mode) .privacy-notice,
.app-shell:not(.auth-mode) .operation-data-note,
.app-shell:not(.auth-mode) .finance-invoice-preview,
.app-shell:not(.auth-mode) .order-product-summary {
  color: var(--ui-ink-soft) !important;
  border: 1px solid var(--ui-line) !important;
  background: var(--ui-surface-raised) !important;
}

.app-shell:not(.auth-mode) .schedule-card-note,
.app-shell:not(.auth-mode) .schedule-communication-notes {
  color: #c5e2ff !important;
  border-color: #315b7c !important;
  background: #172f4b !important;
}

.app-shell:not(.auth-mode) .schedule-card-head strong,
.app-shell:not(.auth-mode) .schedule-product-copy strong,
.app-shell:not(.auth-mode) .schedule-product-details {
  color: var(--ui-ink) !important;
}

.app-shell:not(.auth-mode) .ai-chat-panel,
.app-shell:not(.auth-mode) .ai-chat-hero,
.app-shell:not(.auth-mode) .ai-chat-stage,
.app-shell:not(.auth-mode) .ai-chat-stage.has-transcript,
.app-shell:not(.auth-mode) .ai-chat-quick-prompt,
.app-shell:not(.auth-mode) .ai-assistant-mode,
.app-shell:not(.auth-mode) .ai-chat-image-wrap,
.app-shell:not(.auth-mode) .ai-chat-file-card,
.app-shell:not(.auth-mode) .knowledge-answer-copy {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
}

.app-shell:not(.auth-mode) .ai-chat-hero,
.app-shell:not(.auth-mode) .ai-chat-stage {
  background: var(--ui-surface-raised) !important;
}

.app-shell:not(.auth-mode) .ai-chat-hero h2,
.app-shell:not(.auth-mode) .ai-chat-session-bar strong,
.app-shell:not(.auth-mode) .ai-chat-turn > p,
.app-shell:not(.auth-mode) .knowledge-answer-copy {
  color: var(--ui-ink) !important;
}

.app-shell:not(.auth-mode) .ai-chat-hero p,
.app-shell:not(.auth-mode) .ai-live-status,
.app-shell:not(.auth-mode) .ai-chat-session-bar span,
.app-shell:not(.auth-mode) .ai-chat-footnote,
.app-shell:not(.auth-mode) .ai-assistant-mode small {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .ai-chat-turn.user > p {
  color: #d9fff7 !important;
  border-color: #2d675f !important;
  background: var(--ui-accent-soft) !important;
}

.app-shell:not(.auth-mode) .notification-item,
.app-shell:not(.auth-mode) .feed-item,
.app-shell:not(.auth-mode) .activity-record,
.app-shell:not(.auth-mode) .hr-document-card,
.app-shell:not(.auth-mode) .hr-role-mapping-row,
.app-shell:not(.auth-mode) .finance-invoice-table tr {
  color: var(--ui-ink-soft) !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-surface) !important;
}

.app-shell:not(.auth-mode) .notification-message,
.app-shell:not(.auth-mode) .feed-title,
.app-shell:not(.auth-mode) .activity-summary,
.app-shell:not(.auth-mode) .hr-document-card strong,
.app-shell:not(.auth-mode) .finance-invoice-table td strong {
  color: var(--ui-ink) !important;
}

.app-shell:not(.auth-mode) .notification-actions,
.app-shell:not(.auth-mode) .feed-meta,
.app-shell:not(.auth-mode) .feed-change,
.app-shell:not(.auth-mode) .activity-record-id,
.app-shell:not(.auth-mode) .hr-document-hint {
  color: var(--ui-muted) !important;
}

.app-shell:not(.auth-mode) .module-progress-bar,
.app-shell:not(.auth-mode) .progress-track {
  background: #213b54 !important;
}

.app-shell:not(.auth-mode) .module-progress-bar i,
.app-shell:not(.auth-mode) .progress-track i {
  background: var(--ui-accent) !important;
}

/* Prevent content from widening the viewport or causing scroll jitter. */
.app-shell:not(.auth-mode) .page,
.app-shell:not(.auth-mode) .view-panel,
.app-shell:not(.auth-mode) .panel,
.app-shell:not(.auth-mode) .dialog-inner,
.app-shell:not(.auth-mode) .detail-module-content,
.app-shell:not(.auth-mode) .detail-top,
.app-shell:not(.auth-mode) .details {
  min-width: 0 !important;
}

.app-shell:not(.auth-mode) img,
.app-shell:not(.auth-mode) svg,
.app-shell:not(.auth-mode) video,
.app-shell:not(.auth-mode) canvas {
  max-width: 100% !important;
}

.app-shell:not(.auth-mode) .text-overflow,
.app-shell:not(.auth-mode) .stack > span,
.app-shell:not(.auth-mode) .stack > strong,
.app-shell:not(.auth-mode) .detail-title,
.app-shell:not(.auth-mode) .product-name {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

@media (max-width: 1120px) {
  .app-shell:not(.auth-mode) {
    grid-template-columns: 216px minmax(0, 1fr) !important;
  }

  .app-shell:not(.auth-mode) .product-ledger-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .app-shell:not(.auth-mode) .ledger-inspector {
    position: static !important;
  }
}

@media (max-width: 760px) {
  .app-shell:not(.auth-mode) {
    display: block !important;
  }

  .app-shell:not(.auth-mode) .sidebar {
    position: fixed !important;
    z-index: 30 !important;
    width: min(86vw, 300px) !important;
    max-width: calc(100vw - 20px) !important;
  }

  .app-shell:not(.auth-mode) .workspace {
    width: 100% !important;
  }

  .app-shell:not(.auth-mode) .topbar {
    min-height: 64px !important;
    padding: 10px 14px !important;
  }

  .app-shell:not(.auth-mode) .topbar > * {
    min-width: 0 !important;
  }

  .app-shell:not(.auth-mode) .page {
    width: 100% !important;
    padding: 18px 14px 36px !important;
  }

  .app-shell:not(.auth-mode) .workspace-tabs {
    padding: 7px 14px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
  }

  .app-shell:not(.auth-mode) .workspace-tabs::-webkit-scrollbar {
    display: none !important;
  }

  .app-shell:not(.auth-mode) .ledger-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .app-shell:not(.auth-mode) .ledger-summary-item {
    padding: 14px !important;
  }

  .app-shell:not(.auth-mode) .product-ledger-layout {
    display: block !important;
  }

  .app-shell:not(.auth-mode) .ledger-inspector {
    margin-top: 14px !important;
  }

  .app-shell:not(.auth-mode) .ledger-inspector-head {
    grid-template-columns: 44px minmax(0, 1fr) !important;
  }

  .app-shell:not(.auth-mode) .ledger-inspector-head .status-tag,
  .app-shell:not(.auth-mode) .ledger-inspector-head .tag {
    grid-column: 2 !important;
    justify-self: start !important;
  }

  .app-shell:not(.auth-mode) .ledger-inspector-actions,
  .app-shell:not(.auth-mode) .ledger-toolbar-actions,
  .app-shell:not(.auth-mode) .dialog-head-actions,
  .app-shell:not(.auth-mode) .detail-actions,
  .app-shell:not(.auth-mode) .form-footer {
    flex-wrap: wrap !important;
  }

  .app-shell:not(.auth-mode) .ledger-inspector-actions button,
  .app-shell:not(.auth-mode) .ledger-toolbar-actions button,
  .app-shell:not(.auth-mode) .detail-actions button,
  .app-shell:not(.auth-mode) .form-footer button {
    min-width: 0 !important;
    flex: 1 1 150px !important;
  }

  .app-shell:not(.auth-mode) .panel,
  .app-shell:not(.auth-mode) .metric,
  .app-shell:not(.auth-mode) .work-card,
  .app-shell:not(.auth-mode) .schedule-card,
  .app-shell:not(.auth-mode) .ledger-inspector {
    border-radius: 10px !important;
  }

  body:has(.app-shell:not(.auth-mode)) .dialog {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100vh - 20px) !important;
    border-radius: 10px !important;
  }

  body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav {
    display: flex !important;
    overflow-x: auto !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    scrollbar-width: none !important;
  }

  body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav::-webkit-scrollbar {
    display: none !important;
  }

  body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav-item {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
  }

  body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-head {
    padding: 14px !important;
  }

  body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-content {
    padding: 0 14px 16px !important;
  }

  body:has(.app-shell:not(.auth-mode)) .dialog .fields,
  body:has(.app-shell:not(.auth-mode)) .dialog .sku-grid,
  body:has(.app-shell:not(.auth-mode)) .dialog .form-grid {
    grid-template-columns: 1fr !important;
  }

  body:has(.app-shell:not(.auth-mode)) .dialog .detail-top {
    grid-template-columns: 1fr !important;
  }

  body:has(.app-shell:not(.auth-mode)) .dialog .detail-image-frame,
  body:has(.app-shell:not(.auth-mode)) .dialog .detail-image {
    max-height: 360px !important;
  }

  .app-shell:not(.auth-mode) .product-workbench-panel .table-wrap {
    max-height: 62vh !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body:has(.app-shell:not(.auth-mode)) *,
  body:has(.app-shell:not(.auth-mode)) *::before,
  body:has(.app-shell:not(.auth-mode)) *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}

/* Boot and shell composition contract: never expose the default "未登录"
   chrome while session/workspace data is still being resolved. */
.app-shell.is-booting {
  display: block !important;
  min-height: 100vh !important;
  background: var(--ui-canvas) !important;
}

.app-shell.is-booting .sidebar,
.app-shell.is-booting .topbar,
.app-shell.is-booting .workbench-switcher,
.app-shell.is-booting .workspace-tabs,
.app-shell.is-booting .platform-legal-footer {
  display: none !important;
}

.app-shell.is-booting .workspace {
  display: block !important;
  min-height: 100vh !important;
  background: var(--ui-canvas) !important;
}

.app-shell.is-booting #page {
  display: grid !important;
  min-height: 100vh !important;
  padding: 0 !important;
  place-items: center !important;
}

.app-shell.is-booting #page::before {
  display: block !important;
  content: "正在加载工作台";
  color: var(--ui-muted);
  font-size: 14px;
  text-align: center;
  letter-spacing: 0;
}

/* The ready shell owns the vertical composition so short/empty views do not
   leave a legal footer floating halfway down the viewport. */
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100vh !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
}

body:has(.app-shell:not(.auth-mode):not(.is-booting)) #page {
  flex: 1 0 auto !important;
  min-height: 0 !important;
}

body:has(.app-shell:not(.auth-mode):not(.is-booting)) #page:empty {
  flex: 1 1 auto !important;
  padding: 0 !important;
}

body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer,
body:has(.app-shell.auth-mode) .workspace-legal-footer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-content: stretch !important;
  gap: 12px 28px !important;
  min-height: 52px !important;
  margin-top: auto !important;
  padding: 12px clamp(16px, 3vw, 48px) !important;
  border-radius: 0 !important;
}

body:has(.app-shell:not(.auth-mode):not(.is-booting)) .platform-legal-copy,
body:has(.app-shell.auth-mode) .platform-legal-copy {
  justify-content: flex-start !important;
}

body:has(.app-shell:not(.auth-mode):not(.is-booting)) .platform-legal-meta,
body:has(.app-shell.auth-mode) .platform-legal-meta {
  justify-content: flex-end !important;
}

body:has(.app-shell:not(.auth-mode):not(.is-booting)) .platform-legal-copy,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .platform-legal-meta,
body:has(.app-shell.auth-mode) .platform-legal-copy,
body:has(.app-shell.auth-mode) .platform-legal-meta {
  min-height: 0 !important;
}

@media (max-width: 900px) {
  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer,
  body:has(.app-shell.auth-mode) .workspace-legal-footer {
    grid-template-columns: 1fr !important;
    align-items: start !important;
    gap: 8px !important;
  }

  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .platform-legal-meta,
  body:has(.app-shell.auth-mode) .platform-legal-meta {
    justify-content: flex-start !important;
  }
}

@media (max-width: 760px) {
  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace {
    overflow-x: hidden !important;
  }

  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer,
  body:has(.app-shell.auth-mode) .workspace-legal-footer {
    min-height: 60px !important;
    padding: 11px 14px 13px !important;
  }
}

/* Form surface coherence, 2026-09-01: conditional workflow fields and
   validation feedback must use the same dark surface ladder as the dialog. */
body:has(.app-shell:not(.auth-mode)) .conditional-fields,
body:has(.app-shell:not(.auth-mode)) .pattern-requirement-preview,
body:has(.app-shell:not(.auth-mode)) .external-pattern-contact {
  box-sizing: border-box !important;
  color: var(--ui-ink-soft) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius-sm) !important;
  background: var(--ui-surface-raised) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .conditional-fields {
  display: grid !important;
  gap: 12px !important;
  padding: 12px !important;
}

body:has(.app-shell:not(.auth-mode)) .conditional-fields[hidden] {
  display: none !important;
}

body:has(.app-shell:not(.auth-mode)) .conditional-fields .conditional-title {
  padding: 0 !important;
  color: var(--ui-ink) !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

body:has(.app-shell:not(.auth-mode)) .conditional-fields label {
  color: var(--ui-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .conditional-fields input,
body:has(.app-shell:not(.auth-mode)) .conditional-fields select,
body:has(.app-shell:not(.auth-mode)) .conditional-fields textarea {
  color: var(--ui-ink) !important;
  border-color: var(--ui-line-strong) !important;
  background: var(--ui-surface) !important;
  color-scheme: dark !important;
}

body:has(.app-shell:not(.auth-mode)) .conditional-fields .subtle,
body:has(.app-shell:not(.auth-mode)) .external-pattern-contact {
  color: var(--ui-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .pattern-requirement-preview,
body:has(.app-shell:not(.auth-mode)) .external-pattern-contact {
  display: block !important;
  max-width: 100% !important;
  padding: 6px 8px !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

body:has(.app-shell:not(.auth-mode)) .form-validation-summary,
body:has(.app-shell:not(.auth-mode)) .dialog-inline-error:not(:empty),
body:has(.app-shell:not(.auth-mode)) .hr-import-errors,
body:has(.app-shell:not(.auth-mode)) .auth-error:not(:empty) {
  color: #ffd5dc !important;
  border: 1px solid #7d4657 !important;
  border-radius: var(--ui-radius-sm) !important;
  background: var(--ui-danger-soft) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .form-validation-summary,
body:has(.app-shell:not(.auth-mode)) .dialog-inline-error:not(:empty) {
  padding: 9px 11px !important;
  line-height: 1.55 !important;
}

body:has(.app-shell:not(.auth-mode)) .field-error {
  display: block !important;
  margin-top: 6px !important;
  color: #ffb7c2 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

body:has(.app-shell:not(.auth-mode)) .has-validation-error > input,
body:has(.app-shell:not(.auth-mode)) .has-validation-error > select,
body:has(.app-shell:not(.auth-mode)) .has-validation-error > textarea,
body:has(.app-shell:not(.auth-mode)) .has-validation-error .order-product-search,
body:has(.app-shell:not(.auth-mode)) .has-validation-error .size-picker {
  border-color: #d96a7d !important;
  box-shadow: 0 0 0 3px rgba(217, 106, 125, .16) !important;
}

body:has(.app-shell:not(.auth-mode)) .required-field.has-validation-error {
  color: #ffb7c2 !important;
}

@media (max-width: 760px) {
  body:has(.app-shell:not(.auth-mode)) .conditional-fields {
    gap: 10px !important;
    padding: 10px !important;
  }
}

/* Full form-surface audit, 2026-09-01: operations-ledger is the canonical
   workspace treatment. Keep the graphite rail, but remove legacy dark islands
   from every data-entry, review, picker, preview, and validation surface. */
html:has(body .app-shell:not(.auth-mode)) {
  color-scheme: light !important;
  background: var(--ledger-canvas) !important;
}

body:has(.app-shell:not(.auth-mode)) {
  background: var(--ledger-canvas) !important;
  color: var(--ledger-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode),
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) #page,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .page,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .view-panel {
  color: var(--ledger-ink) !important;
  background: var(--ledger-canvas) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace-tabs {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar input,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar select,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .tenant-switcher,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher-item,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace-tab,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .search,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .user-menu,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .icon-button,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) #logoutButton {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line-strong) !important;
  background: var(--ledger-surface) !important;
  color-scheme: light !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .panel,
  .metric,
  .metric-card,
  .summary-card,
  .role-card,
  .work-card,
  .schedule-card,
  .schedule-product-card,
  .operation-connector-card,
  .product-workbench-panel,
  .ledger-inspector,
  .table-wrap,
  .flow,
  .dashboard-module-card,
  .dashboard-intelligence-card,
  .dashboard-sales-card,
  .dashboard-influencer-card,
  .order-lines-card,
  .attachment-card,
  .hr-department-card,
  .hr-performance-grid article
) {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .panel-head,
  .dashboard-module-card-head,
  .activity-head,
  .hr-directory-head,
  .finance-invoice-toolbar,
  .product-list-head,
  .dashboard-module-head,
  .work-filter-bar,
  .product-center-toolbar,
  .role-banner,
  .privacy-notice,
  .hr-hero,
  .hr-import-dropzone
) {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface-soft) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .form,
  .form-grid,
  .fields,
  .field,
  .conditional-fields,
  .detail-more-fields,
  .detail-more-fields summary,
  .sku-grid,
  .sku-chip,
  .model-reference-slot,
  .consent-check,
  .order-product-picker,
  .order-product-search,
  .order-product-results,
  .order-product-result,
  .order-material-card,
  .order-calc-note,
  .schedule-product-picker,
  .schedule-product-option,
  .match-picker,
  .match-option,
  .permission-grid,
  .permission-group,
  .permission-option,
  .hr-import-preview,
  .hr-import-summary,
  .hr-role-mapping-row,
  .supplier-recommendation,
  .supplier-receipt-summary,
  .image-drop,
  .detail-image-drop,
  .attachment-picker,
  .attachment-picker-list,
  .styling-output-preview,
  .model-image-inline-empty,
  .pattern-progress,
  .pattern-requirement-preview,
  .external-pattern-contact,
  .revision-history-preview,
  .revision-opinion-item,
  .return-notice,
  .contract-summary,
  .contract-editor-context,
  .contract-editor-preview,
  .contract-editor-preview-body,
  .empty-state,
  .permission-empty
) {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface) !important;
  box-shadow: none !important;
  color-scheme: light !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .conditional-fields,
  .detail-more-fields summary,
  .permission-group,
  .hr-import-preview,
  .hr-import-summary,
  .attachment-picker,
  .styling-output-preview,
  .model-image-inline-empty,
  .pattern-progress,
  .revision-history-preview
) {
  background: var(--ledger-surface-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  input,
  select,
  textarea,
  .order-product-search,
  .schedule-product-search input
) {
  min-width: 0 !important;
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line-strong) !important;
  background: var(--ledger-surface) !important;
  color-scheme: light !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  input::placeholder,
  textarea::placeholder
) {
  color: #858b93 !important;
  opacity: 1 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  form label,
  .field label,
  .work-filter-field,
  .conditional-fields label
) {
  color: #3f464e !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  form .subtle,
  form small,
  .field .subtle,
  .conditional-fields .subtle,
  .dialog-help,
  .dialog p,
  .dialog small
) {
  color: var(--ledger-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .conditional-fields {
  display: grid !important;
  gap: 12px !important;
  padding: 12px !important;
  border-radius: 4px !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .conditional-fields[hidden] {
  display: none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .conditional-title {
  padding: 0 !important;
  color: var(--ledger-ink) !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .form-footer,
  .dialog .form-footer,
  .contract-footer
) {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  button.secondary,
  button:not(.primary):not(.danger):not(.nav-item):not(.nav-group-trigger),
  .secondary,
  .action-button,
  .design-image-thumb,
  .design-image-replace
) {
  color: #3f454c !important;
  border-color: var(--ledger-line-strong) !important;
  background: var(--ledger-surface) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  button.secondary:hover,
  button:not(.primary):not(.danger):not(.nav-item):not(.nav-group-trigger):hover,
  .secondary:hover,
  .action-button:hover,
  .design-image-thumb:hover,
  .design-image-replace:hover
) {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line-strong) !important;
  background: var(--ledger-surface-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  button.primary,
  .primary,
  .action-button.primary,
  .action-button[data-primary]
) {
  color: #fff !important;
  border-color: var(--ledger-red) !important;
  background: var(--ledger-red) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  button.danger,
  .danger,
  .action-button.action-danger,
  .action-danger
) {
  color: var(--ledger-red-dark) !important;
  border-color: #efb9b4 !important;
  background: #fff5f4 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .inline-warning,
  .provider-notice,
  .detail-module-contract-actions
) {
  color: #9a5a08 !important;
  border-color: #efd39b !important;
  background: #fff8eb !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .inline-success,
  .detail-module-actions,
  .contract-summary.ready
) {
  color: var(--ledger-green) !important;
  border-color: #b9dfc9 !important;
  background: #eaf7ef !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .form-validation-summary,
  .dialog-inline-error:not(:empty),
  .hr-import-errors,
  .auth-error:not(:empty),
  .effect-error
) {
  color: var(--ledger-red-dark) !important;
  border-color: #efb9b4 !important;
  background: #fff1f0 !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .form-validation-summary,
  .dialog-inline-error:not(:empty)
) {
  padding: 9px 11px !important;
  line-height: 1.55 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .field-error {
  display: block !important;
  margin-top: 6px !important;
  color: var(--ledger-red-dark) !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .has-validation-error > input,
  .has-validation-error > select,
  .has-validation-error > textarea,
  .has-validation-error .order-product-search,
  .has-validation-error .size-picker
) {
  border-color: #d96a7d !important;
  box-shadow: 0 0 0 3px rgba(217, 106, 125, .14) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .tag.blue,
  .status-tag.blue
) {
  color: #1752b8 !important;
  border-color: #c9d9f4 !important;
  background: #eef4ff !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .tag.green,
  .status-tag.green
) {
  color: var(--ledger-green) !important;
  border-color: #b9dfc9 !important;
  background: #eaf7ef !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .tag.orange,
  .status-tag.orange
) {
  color: #9a5a08 !important;
  border-color: #efd39b !important;
  background: #fff8eb !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .tag.red,
  .status-tag.red
) {
  color: var(--ledger-red-dark) !important;
  border-color: #efb9b4 !important;
  background: #fff1f0 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .tag.gray,
  .status-tag.gray
) {
  color: #59616b !important;
  border-color: var(--ledger-line) !important;
  background: #f1f2f3 !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog,
body:has(.app-shell:not(.auth-mode)) .dialog-inner,
body:has(.app-shell:not(.auth-mode)) .dialog .details,
body:has(.app-shell:not(.auth-mode)) .dialog .form,
body:has(.app-shell:not(.auth-mode)) .dialog .form-grid,
body:has(.app-shell:not(.auth-mode)) .dialog .fields,
body:has(.app-shell:not(.auth-mode)) .dialog .field,
body:has(.app-shell:not(.auth-mode)) .dialog .conditional-fields,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-content,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-focus-section,
body:has(.app-shell:not(.auth-mode)) .dialog .permission-group,
body:has(.app-shell:not(.auth-mode)) .dialog .empty-state {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface) !important;
  box-shadow: none !important;
  color-scheme: light !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .dialog-head,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-head,
body:has(.app-shell:not(.auth-mode)) .dialog .history-head {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav {
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav-item {
  color: #4b535c !important;
  border-color: var(--ledger-line-strong) !important;
  background: var(--ledger-surface) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav-item:hover,
body:has(.app-shell:not(.auth-mode)) .dialog .detail-module-nav-item.is-active {
  color: var(--ledger-red-dark) !important;
  border-color: #e2a39d !important;
  background: #fff1f0 !important;
  box-shadow: inset 0 -2px 0 var(--ledger-red) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog input,
body:has(.app-shell:not(.auth-mode)) .dialog select,
body:has(.app-shell:not(.auth-mode)) .dialog textarea {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line-strong) !important;
  background: var(--ledger-surface) !important;
  color-scheme: light !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog :is(
  .image-drop,
  .detail-image-drop,
  .attachment-picker,
  .styling-output-preview,
  .model-image-inline-empty
) {
  color: var(--ledger-muted) !important;
  border-color: var(--ledger-line-strong) !important;
  background: var(--ledger-surface-soft) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog :is(
  .image-drop:hover,
  .detail-image-drop:hover,
  .attachment-picker:hover
) {
  color: var(--ledger-ink) !important;
  border-color: #9eabb9 !important;
  background: var(--ledger-surface) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .form-footer {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface-soft) !important;
}

@media (max-width: 760px) {
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
    .form,
    .form-grid,
    .fields,
    .conditional-fields,
    .form-footer
  ) {
    min-width: 0 !important;
  }

  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .conditional-fields {
    gap: 10px !important;
    padding: 10px !important;
  }
}

/* Media surfaces are part of the form contract too. Empty image/video panes
   must never reintroduce the legacy navy rectangle inside a light card. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .detail-image,
  .product-image,
  .styling-image,
  .styling-image-wrap,
  .styling-image-empty,
  .model-image-source-preview,
  .model-image-output-preview,
  .model-image-output-empty,
  .model-image-inline-empty,
  .model-image-pose-card,
  .model-scene-reference,
  .attachment-image,
  .attachment-video,
  .label-preview-grid > div,
  .label-editor-block
) {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface-soft) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .detail-image,
  .product-image,
  .styling-image,
  .model-image-source-preview,
  .model-image-output-preview,
  .attachment-image
) {
  background: var(--ledger-surface) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .styling-image-empty,
  .model-image-output-empty,
  .model-image-inline-empty,
  .model-image-pose-card,
  .attachment-video,
  .label-preview-grid > div,
  .label-editor-block
) {
  color: var(--ledger-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .model-image-source-preview,
  .model-image-output-preview,
  .model-image-inline-empty,
  .model-image-output-empty
) {
  border-radius: 4px !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog :is(
  .detail-image,
  .styling-image,
  .styling-image-wrap,
  .styling-image-empty,
  .model-image-source-preview,
  .model-image-output-preview,
  .model-image-output-empty,
  .model-image-inline-empty,
  .model-image-pose-card,
  .attachment-image,
  .attachment-video,
  .label-preview-grid > div,
  .label-editor-block
) {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line) !important;
  background: var(--ledger-surface-soft) !important;
  box-shadow: none !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog :is(
  .detail-image,
  .styling-image,
  .model-image-source-preview,
  .model-image-output-preview,
  .attachment-image
) {
  background: var(--ledger-surface) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog :is(
  .model-image-output-empty,
  .model-image-inline-empty,
  .styling-image-empty,
  .attachment-video
) {
  color: var(--ledger-muted) !important;
}

/* Identity document cards use their own empty-state class. Keep the card,
   preview pane, helper copy, and native file control on the same light
   material ladder as every other authenticated form surface. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .hr-document-card,
  .hr-document-card > span:first-child,
  .hr-document-card small,
  .hr-document-card input[type="file"],
  .hr-document-empty,
  .hr-document-thumb
) {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line-strong) !important;
  background: var(--ledger-surface) !important;
  box-shadow: none !important;
  color-scheme: light !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .hr-document-card {
  min-width: 0 !important;
  border-style: solid !important;
  border-radius: 8px !important;
  background: var(--ledger-surface-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .hr-document-card small,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .hr-document-hint {
  color: var(--ledger-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .hr-document-empty {
  min-height: 128px !important;
  color: var(--ledger-muted) !important;
  border: 1px dashed var(--ledger-line-strong) !important;
  background: var(--ledger-surface-soft) !important;
  border-radius: 6px !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .hr-document-thumb {
  background: var(--ledger-surface-soft) !important;
  border-radius: 6px !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .hr-document-card input[type="file"] {
  width: 100% !important;
  min-height: 38px !important;
  padding: 8px !important;
  color: var(--ledger-muted) !important;
  border: 1px solid var(--ledger-line-strong) !important;
  background: var(--ledger-surface) !important;
  border-radius: 6px !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .hr-document-card input[type="file"]::file-selector-button {
  margin-right: 8px !important;
  padding: 6px 10px !important;
  color: var(--ledger-ink) !important;
  border: 1px solid var(--ledger-line-strong) !important;
  background: var(--ledger-surface-soft) !important;
  border-radius: 4px !important;
  cursor: pointer !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog :is(
  .hr-document-card,
  .hr-document-card > span:first-child,
  .hr-document-card small,
  .hr-document-card input[type="file"],
  .hr-document-empty,
  .hr-document-thumb
) {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line-strong) !important;
  background: var(--ledger-surface) !important;
  box-shadow: none !important;
  color-scheme: light !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .hr-document-card {
  background: var(--ledger-surface-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .hr-document-empty {
  color: var(--ledger-muted) !important;
  border: 1px dashed var(--ledger-line-strong) !important;
  background: var(--ledger-surface-soft) !important;
}

body:has(.app-shell:not(.auth-mode)) .dialog .hr-document-card input[type="file"]::file-selector-button {
  color: var(--ledger-ink) !important;
  border-color: var(--ledger-line-strong) !important;
  background: var(--ledger-surface-soft) !important;
}

/* Authenticated shell rebuild, 2026-09-01. The rail is navigation chrome;
   work surfaces are ledger white. This closes the cascade gap that previously
   produced white nav tiles, dark table headers, and oversized empty panels. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) {
  display:grid !important;
  grid-template-columns:232px minmax(0,1fr) !important;
  min-height:100vh !important;
  background:var(--ledger-canvas) !important;
  color:var(--ledger-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar {
  position:sticky !important;
  inset:0 auto auto 0 !important;
  z-index:40 !important;
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto !important;
  width:232px !important;
  min-width:232px !important;
  height:100vh !important;
  min-height:100vh !important;
  overflow:hidden !important;
  border:0 !important;
  border-right:1px solid #343940 !important;
  background:#20242a !important;
  box-shadow:none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .brand {
  display:flex !important;
  min-height:58px !important;
  align-items:center !important;
  gap:10px !important;
  padding:12px 16px !important;
  border-bottom:1px solid #343940 !important;
  color:#f4f5f6 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .brand-mark {
  width:28px !important;
  height:28px !important;
  flex:0 0 28px !important;
  border:1px solid #69717b !important;
  border-radius:4px !important;
  background:#30353d !important;
  box-shadow:none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .brand-copy {
  display:grid !important;
  min-width:0 !important;
  gap:2px !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .brand-copy strong {
  overflow:hidden !important;
  color:#f4f5f6 !important;
  font-size:13px !important;
  font-weight:700 !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .brand-copy small {
  overflow:hidden !important;
  color:#aeb4bd !important;
  font-size:10px !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav {
  display:flex !important;
  flex-direction:column !important;
  gap:2px !important;
  min-height:0 !important;
  margin:0 !important;
  padding:12px 10px 16px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  background:transparent !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(
  .nav-item,
  .nav-group-trigger
) {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:100% !important;
  min-width:0 !important;
  min-height:38px !important;
  gap:10px !important;
  padding:8px 12px !important;
  border:1px solid transparent !important;
  border-radius:6px !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:#aeb4bd !important;
  font-size:13px !important;
  font-weight:560 !important;
  line-height:1.2 !important;
  text-align:left !important;
  transform:none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(
  .nav-item > span,
  .nav-group-trigger > span,
  .nav-item > svg,
  .nav-group-trigger > svg
) {
  color:#aeb4bd !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger {
  min-height:30px !important;
  margin-top:10px !important;
  padding-top:5px !important;
  padding-bottom:5px !important;
  color:#858c95 !important;
  font-size:11px !important;
  font-weight:700 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger > span,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger > svg:first-child {
  color:#858c95 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-menu {
  display:grid !important;
  gap:2px !important;
  margin:0 !important;
  padding:2px 0 2px 12px !important;
  border-left:1px solid #3a4048 !important;
  background:transparent !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-menu .nav-item {
  min-height:36px !important;
  padding-top:7px !important;
  padding-bottom:7px !important;
  font-size:12px !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(
  .nav-item:hover,
  .nav-group-trigger:hover
) {
  border-color:#3d444d !important;
  background:#2b3037 !important;
  color:#fff !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-item.active,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-menu .nav-item.active,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-dashboard-entry.active {
  border-color:#454c55 !important;
  background:#30363e !important;
  color:#fff !important;
  box-shadow:inset 3px 0 0 var(--ledger-red) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-item.active > span,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-item.active > svg {
  color:#fff !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-dashboard-entry {
  margin-bottom:6px !important;
  border-color:#3b424a !important;
  background:#272c33 !important;
  font-weight:680 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .sidebar-footer {
  display:flex !important;
  min-height:42px !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:7px !important;
  padding:0 16px !important;
  border:0 !important;
  border-top:1px solid #343940 !important;
  background:#1b1e23 !important;
  color:#aeb4bd !important;
  font-size:10px !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace {
  min-width:0 !important;
  overflow:hidden !important;
  background:var(--ledger-canvas) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar {
  min-height:66px !important;
  padding:10px 24px !important;
  border-bottom:1px solid var(--ledger-line) !important;
  background:#fff !important;
  box-shadow:0 1px 0 rgba(23,25,28,.02) !important;
  backdrop-filter:none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar :is(
  h1,
  strong,
  .topbar-title,
  .topbar-heading
) {
  color:var(--ledger-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar :is(
  .topbar-kicker,
  .eyebrow,
  small,
  p,
  span
) {
  color:var(--ledger-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .top-actions {
  min-width:0 !important;
  gap:8px !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .top-actions :is(
  .search,
  .tenant-switcher,
  .user-menu,
  #logoutButton,
  .icon-button
) {
  border:1px solid var(--ledger-line-strong) !important;
  border-radius:6px !important;
  background:#fff !important;
  box-shadow:none !important;
  color:var(--ledger-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace-tabs {
  min-height:40px !important;
  padding:5px 24px !important;
  border-bottom:1px solid var(--ledger-line) !important;
  background:#fff !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher-item,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace-tab {
  min-height:30px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  background:transparent !important;
  color:#6b727a !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher-item:hover,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace-tab:hover {
  background:#f4f5f6 !important;
  color:var(--ledger-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .workbench-switcher-item.active,
  .workspace-tab.active
) {
  border-color:#e2a39d !important;
  background:#fff1f0 !important;
  color:var(--ledger-red-dark) !important;
  box-shadow:inset 0 -2px 0 var(--ledger-red) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .page {
  width:100% !important;
  max-width:1680px !important;
  margin:0 auto !important;
  padding:22px 28px 44px !important;
  background:transparent !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .toolbar,
  .hr-hero,
  .org-account-hero,
  .dashboard-hero,
  .schedule-hero,
  .product-center-toolbar
) {
  border:1px solid var(--ledger-line) !important;
  border-radius:6px !important;
  background:#fff !important;
  box-shadow:none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .toolbar h2,
  .hr-hero h2,
  .dashboard-hero h2,
  .schedule-hero h2,
  .product-center-toolbar h2,
  .org-account-hero h2
) {
  color:var(--ledger-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .toolbar p,
  .hr-hero p,
  .dashboard-hero p,
  .schedule-hero p,
  .product-center-toolbar p,
  .org-account-hero p
) {
  color:var(--ledger-muted) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .panel,
  .table-wrap,
  .product-workbench-panel,
  .metric,
  .summary-card,
  .org-account-summary,
  .org-account-content
) {
  border-color:var(--ledger-line) !important;
  border-radius:6px !important;
  background:#fff !important;
  box-shadow:none !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .panel-head,
  .product-list-head,
  .hr-directory-head,
  .org-account-summary
) {
  border-color:var(--ledger-line) !important;
  background:#fff !important;
  color:var(--ledger-ink) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .product-table th,
  .data-table th,
  .order-line-table th,
  .hr-table th
) {
  border-bottom:1px solid var(--ledger-line) !important;
  background:#f3f4f6 !important;
  color:#59616b !important;
  font-size:11px !important;
  font-weight:720 !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .product-table td,
  .data-table td,
  .order-line-table td,
  .hr-table td
) {
  border-bottom:1px solid #eceef0 !important;
  background:#fff !important;
  color:#3f464e !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(
  .product-table tbody tr:hover td,
  .data-table tbody tr:hover td,
  .order-line-table tbody tr:hover td,
  .hr-table tbody tr:hover td
) {
  background:#fafbfb !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .empty-state {
  display:grid !important;
  min-height:112px !important;
  place-content:center !important;
  gap:6px !important;
  padding:24px !important;
  border:1px dashed var(--ledger-line-strong) !important;
  border-radius:4px !important;
  background:#f8f9fa !important;
  color:#3f464e !important;
  text-align:center !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .empty-state strong {
  color:var(--ledger-ink) !important;
  font-size:14px !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .empty-state span {
  color:var(--ledger-muted) !important;
  font-size:12px !important;
}

@media (max-width:760px) {
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) {
    display:block !important;
  }

  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar {
    position:fixed !important;
    inset:auto 0 0 0 !important;
    width:100% !important;
    min-width:0 !important;
    height:62px !important;
    min-height:62px !important;
    grid-template-rows:1fr !important;
    border-top:1px solid #343940 !important;
    border-right:0 !important;
  }

  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .brand,
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .sidebar-footer,
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger {
    display:none !important;
  }

  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav {
    display:flex !important;
    flex-direction:row !important;
    align-items:stretch !important;
    gap:4px !important;
    height:62px !important;
    padding:5px 8px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group,
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-menu {
    display:contents !important;
  }

  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group,
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-menu {
    display:contents !important;
  }

  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-item {
    flex:0 0 74px !important;
    justify-content:center !important;
    gap:3px !important;
    min-height:52px !important;
    padding:4px 5px !important;
    font-size:10px !important;
    text-align:center !important;
  }

  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-item > span {
    max-width:68px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar {
    min-height:60px !important;
    padding:8px 14px !important;
  }

  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .page {
    padding:14px 12px 82px !important;
  }
}

/* Terminal navigation isolation. Generic control normalization must never
   repaint navigation items as white buttons; navigation owns its own rail
   surface and active state. Keep this block last in the cascade. */
body.workspace-mode .sidebar :is(button.nav-item, a.nav-item, button.nav-group-trigger) {
  width:100% !important;
  min-height:36px !important;
  padding:7px 10px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:#aeb7c1 !important;
  font-size:12px !important;
  transform:none !important;
}
body.workspace-mode .sidebar button.nav-group-trigger {
  min-height:28px !important;
  padding:4px 10px !important;
  color:#aeb7c1 !important;
  font-size:10px !important;
}
body.workspace-mode .sidebar :is(button.nav-item, a.nav-item, button.nav-group-trigger):hover {
  color:#fff !important;
  background:#2a3037 !important;
  background-color:#2a3037 !important;
  border-color:#3d454e !important;
}
body.workspace-mode .sidebar :is(button.nav-item.active, a.nav-item.active, button.nav-dashboard-entry.active) {
  color:#fff !important;
  background:#30373f !important;
  background-color:#30373f !important;
  border-color:#424a53 !important;
  box-shadow:inset 3px 0 0 var(--workspace-red) !important;
}
body.workspace-mode .sidebar :is(.nav-item, .nav-group-trigger) > :is(span, svg, i) { color:inherit !important; }
body.workspace-mode .sidebar :is(.nav-item.active, .nav-group-trigger.active) > :is(span, svg, i) { color:#fff !important; }

/* Final action contrast guard: nested labels/icons follow the action surface. */
body.workspace-mode :is(button.primary, .primary, .action-button.primary, button.danger, .danger) :is(span, svg, i) {
  color:#fff !important;
  opacity:1 !important;
}

/* Expanded group labels stay on the rail; only pointer hover gets a transient tint. */
body.workspace-mode .sidebar button.nav-group-trigger[aria-expanded="true"]:not(:hover):not(:focus-visible) {
  background:transparent !important;
  background-color:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
}

/* Explicit selector fallback for legacy action-label rules. */
body.workspace-mode button.primary span,
body.workspace-mode button.danger span,
body.workspace-mode .primary span,
body.workspace-mode .danger span {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  opacity:1 !important;
}

/* Final action contrast guard: nested labels/icons must follow the action surface. */
body.workspace-mode :is(button.primary, .primary, .action-button.primary, button.danger, .danger) > :is(span, svg, i) {
  color:#fff !important;
  opacity:1 !important;
}

/* Terminal navigation isolation (final cascade position). Generic control
   normalization must never repaint navigation items as white buttons. */
body.workspace-mode .sidebar :is(button.nav-item, a.nav-item, button.nav-group-trigger) {
  width:100% !important;
  min-height:36px !important;
  padding:7px 10px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:#aeb7c1 !important;
  font-size:12px !important;
  transform:none !important;
}
body.workspace-mode .sidebar button.nav-group-trigger {
  min-height:28px !important;
  padding:4px 10px !important;
  color:#aeb7c1 !important;
  font-size:10px !important;
}
body.workspace-mode .sidebar :is(button.nav-item, a.nav-item, button.nav-group-trigger):hover {
  color:#fff !important;
  background:#2a3037 !important;
  background-color:#2a3037 !important;
  border-color:#3d454e !important;
}
body.workspace-mode .sidebar :is(button.nav-item.active, a.nav-item.active, button.nav-dashboard-entry.active) {
  color:#fff !important;
  background:#30373f !important;
  background-color:#30373f !important;
  border-color:#424a53 !important;
  box-shadow:inset 3px 0 0 var(--workspace-red) !important;
}
body.workspace-mode .sidebar :is(.nav-item, .nav-group-trigger) > :is(span, svg, i) { color:inherit !important; }
body.workspace-mode .sidebar :is(.nav-item.active, .nav-group-trigger.active) > :is(span, svg, i) { color:#fff !important; }

/* Impeccable operate pass, 2026-09-01-r11.
   One coherent ledger surface wins the cascade: graphite rail, cool-white
   workspace, compact controls, and a table-first work area. */
:root {
  --operate-canvas:#f3f4f6;
  --operate-surface:#ffffff;
  --operate-surface-soft:#f8f9fa;
  --operate-ink:#17191c;
  --operate-muted:#626a73;
  --operate-faint:#8a9199;
  --operate-line:#dfe3e7;
  --operate-line-strong:#c4cbd2;
  --operate-rail:#20242a;
  --operate-rail-hover:#2b3138;
  --operate-red:#d92d20;
  --operate-blue:#175cd3;
  --operate-green:#067647;
  --operate-amber:#b54708;
}

html:has(body .app-shell:not(.auth-mode)),
body:has(.app-shell:not(.auth-mode)) {
  color-scheme:light !important;
  background:var(--operate-canvas) !important;
}

body:has(.app-shell:not(.auth-mode)) {
  margin:0 !important;
  overflow-x:hidden !important;
  background:var(--operate-canvas) !important;
  color:var(--operate-ink) !important;
  font-family:"IBM Plex Sans","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode),
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) #page,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .page,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .view-panel {
  color:var(--operate-ink) !important;
  background:var(--operate-canvas) !important;
}

/* Clear the old dark inherited text at the workspace boundary. Component
   states below opt back into their semantic colors. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .view-panel :where(p,span,small,li,dt,dd,label,legend) {
  color:var(--operate-muted) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .view-panel :where(h1,h2,h3,h4,h5,strong,th) {
  color:var(--operate-ink) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .view-panel :where(a,.action-link) {
  color:var(--operate-blue) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) {
  display:grid !important;
  grid-template-columns:208px minmax(0,1fr) !important;
  min-height:100vh !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode)[data-sidebar-collapsed="true"] {
  grid-template-columns:0 minmax(0,1fr) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar {
  position:sticky !important;
  inset:0 auto auto 0 !important;
  z-index:40 !important;
  display:grid !important;
  grid-template-rows:minmax(0,1fr) 40px !important;
  width:208px !important;
  min-width:208px !important;
  height:100vh !important;
  min-height:100vh !important;
  overflow:hidden !important;
  padding:0 !important;
  border:0 !important;
  border-right:1px solid #343a42 !important;
  background:var(--operate-rail) !important;
  box-shadow:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .brand {
  display:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav {
  display:flex !important;
  flex-direction:column !important;
  gap:2px !important;
  min-height:0 !important;
  margin:0 !important;
  padding:12px 10px 14px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  background:transparent !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(.nav-item,.nav-group-trigger) {
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:100% !important;
  min-width:0 !important;
  min-height:36px !important;
  gap:10px !important;
  padding:7px 10px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:#aeb7c1 !important;
  font-size:12px !important;
  font-weight:600 !important;
  line-height:1.2 !important;
  text-align:left !important;
  transform:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(.nav-item,.nav-group-trigger) > span,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(.nav-item,.nav-group-trigger) > svg {
  color:#aeb7c1 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(.nav-item,.nav-group-trigger):hover {
  border-color:#3d454e !important;
  background:var(--operate-rail-hover) !important;
  color:#fff !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(.nav-item,.nav-group-trigger):hover > span,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(.nav-item,.nav-group-trigger):hover > svg {
  color:#fff !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-item.active,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-dashboard-entry.active {
  border-color:#424a53 !important;
  background:#30373f !important;
  color:#fff !important;
  box-shadow:inset 3px 0 0 var(--operate-red) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-item.active > span,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-item.active > svg {
  color:#fff !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger {
  min-height:28px !important;
  margin-top:8px !important;
  padding-top:4px !important;
  padding-bottom:4px !important;
  color:#7f8994 !important;
  font-size:10px !important;
  font-weight:750 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger > span,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger > svg:first-child {
  color:#7f8994 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-menu {
  display:grid !important;
  gap:2px !important;
  margin:0 !important;
  padding:1px 0 2px 12px !important;
  border-left:1px solid #3a424a !important;
  background:transparent !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-menu .nav-item {
  min-height:34px !important;
  padding-top:6px !important;
  padding-bottom:6px !important;
  font-size:12px !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .sidebar-footer {
  display:flex !important;
  min-height:40px !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:6px !important;
  padding:0 14px !important;
  border:0 !important;
  border-top:1px solid #343a42 !important;
  background:#1b1f24 !important;
  color:#87919c !important;
  font-size:10px !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .sidebar-footer span,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .sidebar-footer svg {
  color:#87919c !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace {
  min-width:0 !important;
  overflow:visible !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar {
  position:sticky !important;
  top:0 !important;
  z-index:30 !important;
  min-height:58px !important;
  padding:8px 18px !important;
  border:0 !important;
  border-bottom:1px solid var(--operate-line) !important;
  background:#fff !important;
  color:var(--operate-ink) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar :where(h1,strong,.topbar-title,.topbar-heading) { color:var(--operate-ink) !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar :where(p,small,span,.eyebrow,.topbar-kicker) { color:var(--operate-muted) !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .top-actions { gap:7px !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .top-actions :is(.search,.tenant-switcher,.user-menu,#logoutButton,.icon-button) {
  border:1px solid var(--operate-line-strong) !important;
  border-radius:4px !important;
  background:#fff !important;
  box-shadow:none !important;
  color:var(--operate-ink) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .top-actions .search { width:min(28vw,320px) !important; height:34px !important; background:var(--operate-surface-soft) !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .top-actions .search input { color:var(--operate-ink) !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .top-actions .search input::placeholder { color:#858d96 !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .tenant-switcher select { color:var(--operate-ink) !important; background:#fff !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) #currentUserName { color:var(--operate-ink) !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) #currentUserRole { color:var(--operate-muted) !important; }

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace-tabs {
  min-height:36px !important;
  padding:3px 18px !important;
  border-bottom:1px solid var(--operate-line) !important;
  background:#fff !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher {
  overflow-x:auto !important;
  scrollbar-width:none;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher::-webkit-scrollbar { display:none; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.workbench-switcher-item,.workspace-tab) {
  min-height:30px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  background:transparent !important;
  color:#626a73 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.workbench-switcher-item,.workspace-tab) :where(span,button) { color:inherit !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.workbench-switcher-item,.workspace-tab):hover { background:#f4f5f6 !important; color:var(--operate-ink) !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.workbench-switcher-item.active,.workspace-tab.active) {
  border-color:#efc0ba !important;
  background:#fff5f4 !important;
  color:#b42318 !important;
  box-shadow:inset 0 -2px 0 var(--operate-red) !important;
}

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .page {
  width:100% !important;
  max-width:1680px !important;
  margin:0 auto !important;
  padding:14px 20px 32px !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .view-panel { min-width:0 !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.toolbar,.hr-hero,.org-account-hero,.dashboard-hero,.schedule-hero,.product-center-toolbar) {
  margin-bottom:10px !important;
  border:1px solid var(--operate-line) !important;
  border-radius:5px !important;
  background:#fff !important;
  box-shadow:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.toolbar h2,.hr-hero h2,.dashboard-hero h2,.schedule-hero h2,.product-center-toolbar h2,.org-account-hero h2) {
  color:var(--operate-ink) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.toolbar p,.hr-hero p,.dashboard-hero p,.schedule-hero p,.product-center-toolbar p,.org-account-hero p) {
  color:var(--operate-muted) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.panel,.table-wrap,.product-workbench-panel,.metric,.summary-card,.org-account-summary,.org-account-content) {
  border-color:var(--operate-line) !important;
  border-radius:5px !important;
  background:#fff !important;
  box-shadow:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.panel-head,.product-list-head,.hr-directory-head,.org-account-summary) {
  border-color:var(--operate-line) !important;
  background:#fff !important;
  color:var(--operate-ink) !important;
}

/* Pattern/design workbenches: keep all three facts and all filters, but make
   the stack scan like a compact control strip instead of a hero section. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-cards {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:8px !important;
  margin:0 0 10px !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  grid-template-areas:"title count" "desc count" !important;
  align-items:center !important;
  min-height:78px !important;
  padding:11px 13px !important;
  border:1px solid var(--operate-line) !important;
  border-radius:5px !important;
  background:#f7fbfa !important;
  box-shadow:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card:nth-child(2) { background:#fffaf2 !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card:nth-child(3) { background:#f6f9fb !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card.is-drilldown {
  border-color:#efc0ba !important;
  box-shadow:0 0 0 2px #fff0ee !important;
  background:#fffaf9 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card h3 {
  grid-area:title !important;
  min-width:0 !important;
  margin:0 !important;
  color:var(--operate-ink) !important;
  font-size:13px !important;
  line-height:1.25 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card p {
  grid-area:desc !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:4px 8px 0 0 !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  overflow:hidden !important;
  color:var(--operate-muted) !important;
  font-size:11px !important;
  line-height:1.35 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card .number {
  grid-area:count !important;
  align-self:center !important;
  margin:0 0 0 10px !important;
  color:var(--operate-ink) !important;
  font-size:23px !important;
  line-height:1 !important;
  font-variant-numeric:tabular-nums;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card-number { color:var(--operate-ink) !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card-number span { color:var(--operate-blue) !important; font-size:10px !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-bar {
  display:grid !important;
  grid-template-columns:170px minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:8px 12px !important;
  margin:0 0 10px !important;
  padding:9px 12px !important;
  border:1px solid var(--operate-line) !important;
  border-radius:5px !important;
  background:#fff !important;
  box-shadow:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-title { display:grid !important; gap:2px !important; min-width:0 !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-title strong { color:var(--operate-ink) !important; font-size:13px !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-title span { color:var(--operate-muted) !important; font-size:10px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-controls {
  grid-column:2 !important;
  grid-row:1 !important;
  display:grid !important;
  grid-template-columns:minmax(240px,1.35fr) minmax(130px,.7fr) minmax(130px,.7fr) auto !important;
  gap:7px !important;
  align-items:end !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-field { display:grid !important; gap:3px !important; color:var(--operate-muted) !important; font-size:10px !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-field input,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-field select {
  min-height:31px !important;
  padding:4px 8px !important;
  border:1px solid var(--operate-line-strong) !important;
  border-radius:4px !important;
  background:#fff !important;
  color:var(--operate-ink) !important;
  font-size:11px !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-reset { min-height:31px !important; padding:0 10px !important; font-size:11px !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-result { grid-column:3 !important; grid-row:1 !important; color:var(--operate-muted) !important; font-size:11px !important; white-space:nowrap; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-result strong { color:var(--operate-blue) !important; font-size:13px !important; }

/* Keep the list in the page flow on desktop. The page owns vertical scrolling;
   only a genuinely wider table may scroll horizontally inside its frame. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-panel .product-list-head {
  min-height:42px !important;
  padding:8px 12px !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-panel .product-list-head h3 { color:var(--operate-ink) !important; font-size:13px !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-panel .table-wrap {
  max-height:none !important;
  min-height:0 !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  background:#fff !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table {
  min-width:900px !important;
  background:#fff !important;
  color:var(--operate-ink) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.product-table th,.data-table th,.order-line-table th,.hr-table th) {
  border-bottom:1px solid var(--operate-line) !important;
  background:#f3f4f6 !important;
  color:#59616b !important;
  font-size:10px !important;
  font-weight:720 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.product-table td,.data-table td,.order-line-table td,.hr-table td) {
  border-bottom:1px solid #eceef0 !important;
  background:#fff !important;
  color:#3f464e !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table :is(td,th) { padding:8px 8px !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table .stack strong { color:#262a2f !important; font-size:11px !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table .stack span,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table .subtle { color:#6f7780 !important; font-size:10px !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table .product-image { width:38px !important; height:50px !important; border-color:var(--operate-line) !important; border-radius:3px !important; background:#f4f5f7 !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table .product-actions-cell,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table .product-row-actions {
  background:#fff !important;
  color:var(--operate-ink) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table .product-row-actions { display:flex !important; align-items:center !important; gap:5px !important; flex-wrap:wrap !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table .product-row-actions :is(button,.action-button,.row-action-menu-trigger) {
  min-height:27px !important;
  padding:0 8px !important;
  border:1px solid var(--operate-line-strong) !important;
  border-radius:3px !important;
  background:#fff !important;
  color:#3f464e !important;
  font-size:10px !important;
  white-space:nowrap !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table .product-row-actions .primary {
  border-color:var(--operate-red) !important;
  background:var(--operate-red) !important;
  color:#fff !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-panel .pagination {
  min-height:42px !important;
  padding:6px 12px !important;
  border-top:1px solid var(--operate-line) !important;
  background:#fff !important;
  color:var(--operate-muted) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-panel .pagination button {
  min-height:28px !important;
  border:1px solid var(--operate-line-strong) !important;
  border-radius:3px !important;
  background:#fff !important;
  color:#3f464e !important;
}

/* 2026-09-02 footer-compact=r3
 * Match the approved reference: one compact, centered legal group with a
 * small divider before compliance links. */
body:has(.app-shell.auth-mode) .workspace-legal-footer,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer {
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
  align-items:center !important;
  gap:6px 18px !important;
  min-height:52px !important;
  padding:11px clamp(20px,4vw,56px) 12px !important;
}
body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-copy,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-copy {
  justify-content:center !important;
  text-align:center !important;
  width:auto !important;
}
body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-meta,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-meta {
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
  text-align:center !important;
  width:auto !important;
  padding-top:0 !important;
  border-top:0 !important;
  gap:6px 14px !important;
}
body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-links,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-links {
  padding-left:18px !important;
  border-left:1px solid var(--ui-line, var(--ledger-line)) !important;
}
@media (max-width:560px) {
  body:has(.app-shell.auth-mode) .workspace-legal-footer,
  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer {
    flex-direction:row !important;
    min-height:68px !important;
    padding:11px 16px 12px !important;
  }
  body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-meta,
  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-meta {
    align-items:center !important;
    flex-direction:row !important;
    text-align:center !important;
  }
  body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-copy,
  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-copy,
  body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-meta,
  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-meta {
    justify-content:center !important;
    align-items:center !important;
    width:auto !important;
  }
  body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-links,
  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-links {
    padding-left:0 !important;
    border-left:0 !important;
  }
}

/* 2026-09-02 action-controls-fit=20260902
   Keep row actions readable at narrow widths. Several historical responsive
   rules made controls stretch to the cell width while text-overflow clipped
   the label, leaving blank button outlines in the mobile/tablet layout. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) #page
  :is(.row-actions, .product-row-actions) {
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  min-width:0 !important;
  width:auto !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) #page
  :is(.row-actions, .product-row-actions) > :is(button, a, .action-button, .action-link, .row-action-menu) {
  flex:0 1 auto !important;
  width:auto !important;
  min-width:max-content !important;
  max-width:100% !important;
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) #page
  :is(.row-actions, .product-row-actions) .row-action-menu-trigger {
  width:auto !important;
  min-width:max-content !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-panel .pagination button:disabled { background:#f3f4f6 !important; color:#9aa1a8 !important; }

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .empty-state {
  min-height:112px !important;
  padding:24px !important;
  border:1px dashed var(--operate-line-strong) !important;
  border-radius:4px !important;
  background:#f8f9fa !important;
  color:var(--operate-muted) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .empty-state strong { color:var(--operate-ink) !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.workspace-legal-footer,.legal-footer) {
  border-top:1px solid var(--operate-line) !important;
  background:#fff !important;
  color:var(--operate-muted) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.workspace-legal-footer,.legal-footer) :where(span,strong,a) { color:var(--operate-muted) !important; }

@media (min-width:761px) and (max-width:1100px) {
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) { grid-template-columns:188px minmax(0,1fr) !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar { width:188px !important; min-width:188px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher { position:static !important; top:auto !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .page { padding:12px 14px 28px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-bar { grid-template-columns:150px minmax(0,1fr) !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-controls { grid-column:2 !important; grid-row:1 !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-result { grid-column:2 !important; grid-row:2 !important; text-align:left !important; }
}

@media (max-width:760px) {
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) { display:block !important; min-height:100vh !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar {
    position:fixed !important;
    inset:auto 0 0 0 !important;
    z-index:60 !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    height:60px !important;
    min-height:60px !important;
    border-top:1px solid #343a42 !important;
    border-right:0 !important;
  }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav {
    display:flex !important;
    flex-direction:row !important;
    align-items:stretch !important;
    gap:3px !important;
    height:60px !important;
    padding:4px 7px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group,
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-menu { display:contents !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(.nav-item,.nav-group-trigger) {
    flex:0 0 70px !important;
    justify-content:center !important;
    gap:2px !important;
    min-height:50px !important;
    padding:4px 4px !important;
    font-size:10px !important;
    text-align:center !important;
  }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger { display:none !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .sidebar-footer { display:none !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar { min-height:56px !important; padding:7px 12px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar-heading { min-width:0 !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar h1 { font-size:17px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .top-actions { flex-wrap:wrap !important; justify-content:flex-end !important; gap:5px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .top-actions .search { width:170px !important; height:32px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .tenant-switcher { width:100% !important; order:4 !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .tenant-switcher select { width:100% !important; max-width:none !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.workbench-switcher,.workspace-tabs) { min-height:34px !important; padding:2px 10px !important; overflow-x:auto !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .page { padding:10px 10px 76px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-cards { grid-template-columns:1fr !important; gap:6px !important; margin-bottom:8px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card { min-height:66px !important; padding:9px 11px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card h3 { font-size:12px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card p { font-size:10px !important; -webkit-line-clamp:1 !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-card .number { font-size:21px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-bar { display:grid !important; grid-template-columns:1fr !important; gap:7px !important; padding:9px 10px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-controls { grid-column:auto !important; grid-row:auto !important; grid-template-columns:1fr !important; gap:6px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-result { grid-column:auto !important; grid-row:auto !important; text-align:left !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .work-filter-title span { white-space:normal !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-panel .table-wrap { overflow-x:auto !important; overflow-y:visible !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-table { min-width:760px !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .product-workbench-panel .pagination { flex-wrap:wrap !important; }
}

/* Final navigation isolation: the legacy shared button-surface selector also
   matches every button without .primary/.danger, including rail navigation.
   Keep those controls transparent regardless of source-order or theme layer. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(button.nav-item,button.nav-group-trigger) {
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  color:#aeb7c1 !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(button.nav-item,button.nav-group-trigger) > :is(span,svg) {
  color:inherit !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar button.nav-item.active,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar button.nav-dashboard-entry.active {
  background:#30373f !important;
  background-color:#30373f !important;
  color:#fff !important;
  border-color:#424a53 !important;
  box-shadow:inset 3px 0 0 var(--operate-red) !important;
}

/* The legacy title grid creates an implicit third row (the toggle, kicker and
   title stack vertically), which is the main source of the oversized header.
   Use a single horizontal heading row and keep the account control within the
   same 58px topbar contract. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar-heading {
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  min-width:190px !important;
  width:auto !important;
  height:auto !important;
  padding:0 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar-title-group {
  display:grid !important;
  gap:0 !important;
  min-width:0 !important;
  width:auto !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar-kicker {
  line-height:12px !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar h1 {
  line-height:25px !important;
  white-space:nowrap !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .top-actions .user-menu {
  min-height:38px !important;
  height:38px !important;
  padding:4px 9px !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar {
  height:64px !important;
  min-height:64px !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher {
  height:36px !important;
  min-height:36px !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace-tabs {
  height:36px !important;
  min-height:36px !important;
  padding-top:2px !important;
  padding-bottom:2px !important;
}

/* Shared surfaces used by detail dialogs, editors, forms and AI-assisted
   workflows. These selectors intentionally sit at the final cascade layer so
   the legacy dark theme cannot reappear when another module opens a dialog. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.dialog,.dialog-inner,.product-detail-shell,.detail-module,.detail-module-content,.ai-chat-panel,.ai-chat-stage,.ai-assistant-mode) {
  color:var(--operate-ink) !important;
  background:#fff !important;
  border-color:var(--operate-line) !important;
  box-shadow:0 14px 34px rgba(23,25,28,.08) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.dialog-head,.detail-module-head,.form-footer) {
  color:var(--operate-ink) !important;
  background:#f3f4f6 !important;
  border-color:var(--operate-line) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.dialog,.dialog-inner) :where(h1,h2,h3,h4,h5,strong,legend,label) { color:var(--operate-ink) !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.dialog,.dialog-inner) :where(p,small,span,li,dt,dd,.dialog-help,.subtle) { color:var(--operate-muted) !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.dialog,.dialog-inner) :where(input,select,textarea) {
  color:var(--operate-ink) !important;
  background:#fff !important;
  border-color:var(--operate-line-strong) !important;
  box-shadow:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.fields,.sku-grid) {
  color:var(--operate-ink) !important;
  background:#f8f9fa !important;
  border-color:var(--operate-line) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.field,.detail-module-content) {
  color:var(--operate-ink) !important;
  background:#fff !important;
  border-color:#eceef0 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.image-drop,.detail-image-drop,.model-scene-reference .image-drop,.detail-fields-empty,.permission-empty) {
  color:var(--operate-muted) !important;
  background:#f8f9fa !important;
  border-color:var(--operate-line-strong) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.detail-module-nav,.detail-more-fields summary,.model-reference-slot,.consent-check) {
  color:var(--operate-muted) !important;
  background:#f3f4f6 !important;
  border-color:var(--operate-line) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.ai-chat-turn > p,.knowledge-answer-copy,.ai-chat-file-card,.ai-chat-image-wrap,.ai-chat-quick-prompt) {
  color:var(--operate-ink) !important;
  background:#f8f9fa !important;
  border-color:var(--operate-line) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.ai-chat-turn.user > p,.ai-chat-file-card .compact-button) {
  color:#fff !important;
  background:var(--operate-blue) !important;
  border-color:var(--operate-blue) !important;
}

/* Option 3 coherence pass: every operational surface follows the same
   ledger grammar. The rail stays graphite; all work surfaces are paper-white,
   with semantic tints reserved for status rather than whole dark panels. */
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.ledger-summary,.ledger-summary-item,.panel,.metric,.metric-card,.summary-card,.schedule-kpi,.dashboard-module-card,.hr-department-card,.finance-invoice-preview,.operation-connector-card) {
  color:var(--operate-ink) !important;
  background:#fff !important;
  border-color:var(--operate-line) !important;
  box-shadow:0 1px 2px rgba(23,25,28,.04) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .ledger-summary {
  gap:0 !important;
  overflow:hidden !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .ledger-summary-item {
  min-height:68px !important;
  padding:12px 14px !important;
  border-width:0 1px 0 0 !important;
  border-radius:0 !important;
  background:#fff !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .ledger-summary-item:last-child { border-right:0 !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .ledger-summary-item.pending { background:#fff9ed !important; border-color:#f0dfb9 !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .ledger-summary-item.risk { background:#fff3f2 !important; border-color:#f1c7c3 !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.ledger-summary-item span,.metric-label) { color:#68717a !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.ledger-summary-item strong,.metric-value) { color:#20252a !important; }

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.product-table,.data-table,.order-line-table,.hr-table,.finance-invoice-table,.product-workbench-table) {
  color:var(--operate-ink) !important;
  background:#fff !important;
  border-color:var(--operate-line) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.product-table,.data-table,.order-line-table,.hr-table,.finance-invoice-table) th {
  color:#59616b !important;
  background:#f3f4f6 !important;
  border-bottom:1px solid var(--operate-line) !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.product-table,.data-table,.order-line-table,.hr-table,.finance-invoice-table) td {
  color:#3f464e !important;
  background:#fff !important;
  border-bottom:1px solid #eceef0 !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(.product-table,.data-table,.order-line-table,.hr-table,.finance-invoice-table) tbody tr:hover td { background:#f8fafb !important; }

body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(button.secondary,button:not(.primary):not(.danger):not(.nav-item):not(.nav-group-trigger),.secondary,.action-button,.compact-button) {
  min-height:32px !important;
  padding:0 10px !important;
  border:1px solid var(--operate-line-strong) !important;
  border-radius:4px !important;
  color:#3f464e !important;
  background:#fff !important;
  box-shadow:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(button.secondary,button:not(.primary):not(.danger):not(.nav-item):not(.nav-group-trigger),.secondary,.action-button,.compact-button):hover,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(button.secondary,button:not(.primary):not(.danger):not(.nav-item):not(.nav-group-trigger),.secondary,.action-button,.compact-button):focus-visible {
  color:var(--operate-blue) !important;
  border-color:#9db7d4 !important;
  background:#f4f8fc !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(button.primary,.primary,.action-button.primary) {
  min-height:32px !important;
  padding:0 12px !important;
  border-radius:4px !important;
  color:#fff !important;
  background:var(--operate-red) !important;
  border-color:var(--operate-red) !important;
  box-shadow:none !important;
}
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(button.primary,.primary,.action-button.primary):hover,
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(button.primary,.primary,.action-button.primary):focus-visible { background:#b9231b !important; border-color:#b9231b !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) button:disabled { color:#9aa1a8 !important; background:#f3f4f6 !important; border-color:#dfe2e5 !important; box-shadow:none !important; }
body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(button,a,input,select,textarea):focus-visible { outline:2px solid #7ba9d6 !important; outline-offset:2px !important; }

@media (max-width:760px) {
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .ledger-summary { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .ledger-summary-item { border-bottom:1px solid var(--operate-line) !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .ledger-summary-item:nth-child(2n) { border-right:0 !important; }
  body:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) :is(button.secondary,button:not(.primary):not(.danger):not(.nav-item):not(.nav-group-trigger),.secondary,.action-button,.compact-button) { min-height:40px !important; }
}

/* Direct shell fallback for browsers/embedded tabs that evaluate :has() late
   during boot. It mirrors the authenticated rail contract without relying on
   the body relational selector, so an old cached theme cannot paint white
   navigation tiles while the page is already authenticated. */
.app-shell:not(.auth-mode) .sidebar {
  width:208px !important;
  min-width:208px !important;
  background:var(--operate-rail) !important;
  border-right:1px solid #343a42 !important;
}
.app-shell:not(.auth-mode) .sidebar .nav-item,
.app-shell:not(.auth-mode) .sidebar .nav-group-trigger {
  width:100% !important;
  min-height:36px !important;
  padding:7px 10px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:#aeb7c1 !important;
}
.app-shell:not(.auth-mode) .sidebar .nav-item.active,
.app-shell:not(.auth-mode) .sidebar .nav-dashboard-entry.active {
  background:#30373f !important;
  background-color:#30373f !important;
  border-color:#424a53 !important;
  color:#fff !important;
  box-shadow:inset 3px 0 0 var(--operate-red) !important;
}
.app-shell:not(.auth-mode) .sidebar .nav-item > span,
.app-shell:not(.auth-mode) .sidebar .nav-item > svg,
.app-shell:not(.auth-mode) .sidebar .nav-group-trigger > span,
.app-shell:not(.auth-mode) .sidebar .nav-group-trigger > svg { color:inherit !important; }

/* Authenticated workspace contract, 2026-09-01 r19.
   The earlier visual layers contain intentional dark variants for legacy
   modules. Scope the final operating system to an explicit body state so the
   browser cannot fall back to a mixed white-tile/dark-panel composition. */
body.workspace-mode {
  --workspace-canvas:#f3f4f6;
  --workspace-surface:#fff;
  --workspace-surface-soft:#f8f9fa;
  --workspace-ink:#20252a;
  --workspace-muted:#68717a;
  --workspace-line:#dfe2e6;
  --workspace-line-strong:#c8cdd3;
  --workspace-rail:#20242a;
  --workspace-blue:#175cd3;
  --workspace-red:#d92d20;
  background:var(--workspace-canvas) !important;
  color:var(--workspace-ink) !important;
  color-scheme:light !important;
}
body.workspace-mode .app-shell {
  grid-template-columns:208px minmax(0,1fr) !important;
  min-height:100vh !important;
  background:var(--workspace-canvas) !important;
  color:var(--workspace-ink) !important;
}
body.workspace-mode .workspace,
body.workspace-mode #page,
body.workspace-mode .page,
body.workspace-mode .view-panel {
  background:var(--workspace-canvas) !important;
  color:var(--workspace-ink) !important;
}
body.workspace-mode .sidebar {
  width:208px !important;
  min-width:208px !important;
  background:var(--workspace-rail) !important;
  border-right:1px solid #343a42 !important;
  box-shadow:none !important;
}
body.workspace-mode .sidebar .nav-item,
body.workspace-mode .sidebar .nav-group-trigger {
  width:100% !important;
  min-height:36px !important;
  padding:7px 10px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:#aeb7c1 !important;
  font-size:12px !important;
  transform:none !important;
}
body.workspace-mode .sidebar .nav-group-trigger { min-height:28px !important; padding:4px 10px !important; font-size:10px !important; }
body.workspace-mode .sidebar .nav-item:hover,
body.workspace-mode .sidebar .nav-group-trigger:hover {
  color:#fff !important;
  background:#2a3037 !important;
  border-color:#3d454e !important;
}
body.workspace-mode .sidebar .nav-item.active,
body.workspace-mode .sidebar .nav-dashboard-entry.active {
  color:#fff !important;
  background:#30373f !important;
  border-color:#424a53 !important;
  box-shadow:inset 3px 0 0 var(--workspace-red) !important;
}
body.workspace-mode .sidebar .nav-item span,
body.workspace-mode .sidebar .nav-item svg,
body.workspace-mode .sidebar .nav-group-trigger span,
body.workspace-mode .sidebar .nav-group-trigger svg { color:inherit !important; }
body.workspace-mode .sidebar .nav-item.active span,
body.workspace-mode .sidebar .nav-item.active svg { color:#fff !important; }
body.workspace-mode .sidebar .nav-group,
body.workspace-mode .sidebar .nav-group-menu { border-color:#343a42 !important; }
body.workspace-mode .sidebar-footer { color:#8e969f !important; border-top-color:#343a42 !important; }

body.workspace-mode .topbar {
  min-height:64px !important;
  height:64px !important;
  background:var(--workspace-surface) !important;
  border-bottom:1px solid var(--workspace-line) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
body.workspace-mode .topbar h1,
body.workspace-mode .topbar strong,
body.workspace-mode .topbar .eyebrow { color:var(--workspace-ink) !important; }
body.workspace-mode .topbar span,
body.workspace-mode .topbar p,
body.workspace-mode .topbar small { color:var(--workspace-muted) !important; }
body.workspace-mode .topbar input,
body.workspace-mode .topbar select,
body.workspace-mode .tenant-switcher,
body.workspace-mode .workbench-switcher,
body.workspace-mode .workspace-tabs {
  color:var(--workspace-ink) !important;
  border-color:var(--workspace-line) !important;
  background:var(--workspace-surface) !important;
  box-shadow:none !important;
  color-scheme:light !important;
}
body.workspace-mode .workbench-switcher { min-height:36px !important; height:36px !important; }
body.workspace-mode .workspace-tabs { min-height:36px !important; height:36px !important; padding:2px 18px !important; }
body.workspace-mode .workspace-tab {
  min-height:30px !important;
  color:var(--workspace-muted) !important;
  border-color:var(--workspace-line) !important;
  background:var(--workspace-surface) !important;
}
body.workspace-mode .workspace-tab.active { color:var(--workspace-ink) !important; border-color:#9ecfc8 !important; background:#f1faf8 !important; box-shadow:inset 0 -2px 0 #319e93 !important; }

body.workspace-mode .panel,
body.workspace-mode .metric,
body.workspace-mode .metric-card,
body.workspace-mode .summary-card,
body.workspace-mode .role-card,
body.workspace-mode .schedule-kpi,
body.workspace-mode .work-card,
body.workspace-mode .schedule-card,
body.workspace-mode .schedule-product-card,
body.workspace-mode .dashboard-module-card,
body.workspace-mode .hr-department-card,
body.workspace-mode .hr-performance-grid article,
body.workspace-mode .product-workbench-panel,
body.workspace-mode .ledger-summary,
body.workspace-mode .ledger-summary-item,
body.workspace-mode .attachment-card,
body.workspace-mode .order-lines-card {
  color:var(--workspace-ink) !important;
  border-color:var(--workspace-line) !important;
  background:var(--workspace-surface) !important;
  box-shadow:0 1px 2px rgba(23,25,28,.04) !important;
}
body.workspace-mode :is(.panel-head,.dashboard-module-card-head,.activity-head,.hr-directory-head,.finance-invoice-toolbar) {
  color:var(--workspace-ink) !important;
  border-bottom-color:var(--workspace-line) !important;
  background:var(--workspace-surface-soft) !important;
}
body.workspace-mode :is(.page-title,.toolbar-copy h2,.section-title,.panel-head h2,.panel-head h3,.dashboard-module-name,.hr-section-title) { color:var(--workspace-ink) !important; }
body.workspace-mode :is(.toolbar-copy p,.panel-description,.panel-head p,.panel-head small,.subtle,.metric-note,.dashboard-updated) { color:var(--workspace-muted) !important; }

/* The selected-row inspector is an in-page surface, not a dark modal. */
body.workspace-mode .ledger-inspector {
  color:var(--workspace-ink) !important;
  border:1px solid var(--workspace-line) !important;
  border-radius:6px !important;
  background:var(--workspace-surface) !important;
  box-shadow:0 1px 2px rgba(23,25,28,.04) !important;
}
body.workspace-mode .ledger-inspector-head {
  grid-template-columns:48px minmax(0,1fr) auto !important;
  padding:14px !important;
  border-bottom:1px solid var(--workspace-line) !important;
  background:var(--workspace-surface-soft) !important;
}
body.workspace-mode .ledger-inspector-head img { border-color:var(--workspace-line-strong) !important; background:var(--workspace-surface) !important; }
body.workspace-mode .ledger-inspector-head span,
body.workspace-mode .ledger-inspector-head small,
body.workspace-mode .ledger-inspector-activity small,
body.workspace-mode .ledger-facts dt { color:var(--workspace-muted) !important; }
body.workspace-mode .ledger-inspector-head strong,
body.workspace-mode .ledger-inspector-activity strong,
body.workspace-mode .ledger-facts dd { color:var(--workspace-ink) !important; }
body.workspace-mode .ledger-inspector-actions,
body.workspace-mode .ledger-inspector-tabs { border-bottom-color:var(--workspace-line) !important; background:var(--workspace-surface) !important; }
body.workspace-mode .ledger-inspector-tabs button { color:var(--workspace-muted) !important; background:transparent !important; border-color:transparent !important; }
body.workspace-mode .ledger-inspector-tabs button.active { color:var(--workspace-ink) !important; border-color:#9ecfc8 !important; background:#f1faf8 !important; }
body.workspace-mode .ledger-inspector-body { color:var(--workspace-ink) !important; background:var(--workspace-surface) !important; }
body.workspace-mode .ledger-facts > div,
body.workspace-mode .ledger-inspector-activity article { border-bottom-color:#eceef0 !important; }
body.workspace-mode .ledger-timeline strong { color:var(--workspace-ink) !important; }
body.workspace-mode .ledger-timeline small { color:var(--workspace-muted) !important; }

body.workspace-mode :is(.product-workbench-table,.product-table,.data-table,.order-line-table,.hr-table,.finance-invoice-table) {
  color:var(--workspace-ink) !important;
  border-color:var(--workspace-line) !important;
  background:var(--workspace-surface) !important;
}
body.workspace-mode :is(.product-workbench-table,.product-table,.data-table,.order-line-table,.hr-table,.finance-invoice-table) th {
  color:#59616b !important;
  border-bottom-color:var(--workspace-line) !important;
  background:#f3f4f6 !important;
}
body.workspace-mode :is(.product-workbench-table,.product-table,.data-table,.order-line-table,.hr-table,.finance-invoice-table) td {
  color:#3f464e !important;
  border-bottom-color:#eceef0 !important;
  background:#fff !important;
}
body.workspace-mode :is(.product-workbench-table,.product-table,.data-table,.order-line-table,.hr-table,.finance-invoice-table) tbody tr:hover td { background:#f8fafb !important; }

/* Detail records, forms and dialogs share the same paper surface. */
body.workspace-mode :is(.product-detail-shell,.dialog,.dialog-inner,.detail-module,.detail-module-content,.fields,.field,.sku-grid,.detail-focus-section,.detail-more-fields,.empty-state,.permission-empty) {
  color:var(--workspace-ink) !important;
  border-color:var(--workspace-line) !important;
  background:var(--workspace-surface) !important;
  box-shadow:none !important;
  color-scheme:light !important;
}
body.workspace-mode :is(.dialog-head,.detail-module-head,.form-footer,.history-head) { color:var(--workspace-ink) !important; border-color:var(--workspace-line) !important; background:var(--workspace-surface-soft) !important; }
body.workspace-mode :is(.dialog,.dialog-inner) :is(h1,h2,h3,h4,h5,strong,legend,label,.detail-title,.section-title) { color:var(--workspace-ink) !important; }
body.workspace-mode :is(.dialog,.dialog-inner) :is(p,small,span,li,dt,dd,.subtle,.dialog-help,.detail-meta) { color:var(--workspace-muted) !important; }
body.workspace-mode :is(.dialog,.dialog-inner) :is(input,select,textarea) { color:var(--workspace-ink) !important; background:#fff !important; border-color:var(--workspace-line-strong) !important; color-scheme:light !important; }
body.workspace-mode :is(.detail-module-nav,.detail-more-fields summary,.model-reference-slot,.consent-check) { color:var(--workspace-muted) !important; background:#f3f4f6 !important; border-color:var(--workspace-line) !important; }
body.workspace-mode :is(.image-drop,.detail-image-drop,.attachment-picker,.model-image-inline-empty,.detail-fields-empty) { color:var(--workspace-muted) !important; background:#f8f9fa !important; border-color:var(--workspace-line-strong) !important; }
body.workspace-mode .detail-module-actions { color:var(--workspace-ink) !important; background:#f1faf8 !important; border-color:#b8ddd7 !important; }
body.workspace-mode .detail-module-contract-actions { color:#6a4a10 !important; background:#fff8e8 !important; border-color:#ead7a8 !important; }

body.workspace-mode :is(button.secondary,button:not(.primary):not(.danger):not(.nav-item):not(.nav-group-trigger),.secondary,.action-button,.compact-button) {
  min-height:32px !important;
  color:#3f464e !important;
  border:1px solid var(--workspace-line-strong) !important;
  border-radius:4px !important;
  background:#fff !important;
  box-shadow:none !important;
}
body.workspace-mode :is(button.secondary,button:not(.primary):not(.danger):not(.nav-item):not(.nav-group-trigger),.secondary,.action-button,.compact-button):hover { color:var(--workspace-blue) !important; border-color:#9db7d4 !important; background:#f4f8fc !important; }
body.workspace-mode :is(button.primary,.primary,.action-button.primary) { color:#fff !important; border-color:var(--workspace-red) !important; border-radius:4px !important; background:var(--workspace-red) !important; box-shadow:none !important; }
body.workspace-mode button:disabled { color:#9aa1a8 !important; background:#f3f4f6 !important; border-color:#dfe2e5 !important; }

/* 2026-09-02 flow-action-label=20260902: preserve the visible workflow
   action after the generic action-button normalization rule. */
body.workspace-mode .app-shell:not(.auth-mode) .product-workbench-table .product-row-actions :is(.row-primary-action,.action-button.primary) {
  min-width:78px !important;
  color:#fff !important;
  background:var(--workspace-red) !important;
  border-color:var(--workspace-red) !important;
}

@media (max-width:760px) {
  body.workspace-mode .app-shell { grid-template-columns:minmax(0,1fr) !important; }
  body.workspace-mode .sidebar { width:100% !important; min-width:0 !important; }
  body.workspace-mode .page { padding:16px 10px 44px !important; }
  body.workspace-mode .ledger-inspector { width:100% !important; }
  body.workspace-mode .ledger-inspector-head { grid-template-columns:48px minmax(0,1fr) auto !important; }
  body.workspace-mode :is(.product-workbench-table,.product-table,.data-table,.order-line-table,.hr-table,.finance-invoice-table) { min-width:0 !important; }
}
/* FINAL NAVIGATION GROUP CONTRACT 20260901-r26
   The group trigger owns one stable row in every state. The menu collapses
   through the same DOM path as it expands, so the chevron, focus target and
   visible children cannot drift apart. */
body.workspace-mode .sidebar .nav-group {
  display:grid !important;
  gap:4px !important;
  min-width:0 !important;
}
body.workspace-mode .sidebar :is(button.nav-item, a.nav-item, button.nav-group-trigger) {
  width:100% !important;
  min-height:36px !important;
  padding:7px 10px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:#aeb7c1 !important;
  font-size:12px !important;
  transform:none !important;
}
body.workspace-mode .sidebar .nav-group-trigger {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  min-height:40px !important;
  margin:4px 0 0 !important;
  padding:8px 10px !important;
  color:#aeb7c1 !important;
  font-size:12px !important;
  font-weight:650 !important;
  line-height:1.25 !important;
  text-align:left !important;
  transition:background .18s ease,border-color .18s ease,color .18s ease !important;
}
body.workspace-mode .sidebar .nav-group-trigger > svg:first-child {
  width:18px !important;
  height:18px !important;
  flex:0 0 18px !important;
  color:inherit !important;
}
body.workspace-mode .sidebar .nav-group-trigger > span {
  flex:1 1 auto !important;
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:inherit !important;
}
body.workspace-mode .sidebar .nav-group-chevron {
  display:block !important;
  width:16px !important;
  height:16px !important;
  margin-left:auto !important;
  flex:0 0 16px !important;
  opacity:.86 !important;
  transform:rotate(0deg) !important;
  transition:transform .18s ease,opacity .18s ease !important;
}
body.workspace-mode .sidebar .nav-group-trigger:hover,
body.workspace-mode .sidebar .nav-group-trigger:focus-visible {
  color:#fff !important;
  background:#2a3037 !important;
  background-color:#2a3037 !important;
  border-color:#3d454e !important;
}
body.workspace-mode .sidebar .nav-group-trigger[aria-expanded="true"] {
  color:#fff !important;
  background:#2a3037 !important;
  background-color:#2a3037 !important;
  border-color:#3d454e !important;
}
body.workspace-mode .sidebar .nav-group-trigger[aria-expanded="true"] .nav-group-chevron {
  transform:rotate(90deg) !important;
}
body.workspace-mode .sidebar .nav-group-menu {
  display:grid !important;
  gap:3px !important;
  max-height:640px !important;
  margin:0 0 4px 11px !important;
  padding:4px 0 4px 13px !important;
  overflow:hidden !important;
  border-left:1px solid #3a4149 !important;
  opacity:1 !important;
  transform:translateY(0) !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transition:max-height .22s ease,opacity .16s ease,transform .22s ease,border-color .22s ease,padding .22s ease,margin .22s ease !important;
}
body.workspace-mode .sidebar .nav-group.is-collapsed .nav-group-menu {
  display:grid !important;
  max-height:0 !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  border-left-color:transparent !important;
  opacity:0 !important;
  transform:translateY(-4px) !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
body.workspace-mode .sidebar .nav-group-menu .nav-item {
  min-height:38px !important;
  padding:7px 10px !important;
  border-radius:4px !important;
}
body.workspace-mode .sidebar .nav-group-menu .nav-item > :is(span,svg,i) { color:inherit !important; }
body.workspace-mode .sidebar :is(button.nav-item, a.nav-item):hover {
  color:#fff !important;
  background:#2a3037 !important;
  background-color:#2a3037 !important;
  border-color:#3d454e !important;
}
body.workspace-mode .sidebar :is(button.nav-item.active, a.nav-item.active, button.nav-dashboard-entry.active) {
  color:#fff !important;
  background:#30373f !important;
  background-color:#30373f !important;
  border-color:#424a53 !important;
  box-shadow:inset 3px 0 0 var(--workspace-red) !important;
}
body.workspace-mode .sidebar :is(.nav-item, .nav-group-trigger) > :is(span, svg, i) { color:inherit !important; }
body.workspace-mode .sidebar :is(.nav-item.active, .nav-group-trigger.active) > :is(span, svg, i) { color:#fff !important; }
body.workspace-mode .app-shell[data-sidebar-collapsed="true"] .sidebar .nav-group-menu { display:none !important; }

@media (prefers-reduced-motion:reduce) {
  body.workspace-mode .sidebar .nav-group-trigger,
  body.workspace-mode .sidebar .nav-group-chevron,
  body.workspace-mode .sidebar .nav-group-menu { transition:none !important; }
}

/* On mobile the rail becomes a bottom navigation strip; group headings are
   intentionally removed and their children stay in the flat strip. */
@media (max-width:760px) {
  body.workspace-mode .sidebar .nav-group,
  body.workspace-mode .sidebar .nav-group-menu { display:contents !important; }
  body.workspace-mode .sidebar .nav-group-trigger { display:none !important; }
  body.workspace-mode .sidebar .nav-group-menu,
  body.workspace-mode .sidebar .nav-group.is-collapsed .nav-group-menu {
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
    border:0 !important;
    opacity:1 !important;
    transform:none !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transition:none !important;
  }
}

/* 2026-09-02 action-label-contrast-final=20260902
   Keep every table action label readable after all theme and navigation
   overrides have been applied. */
body.workspace-mode .app-shell:not(.auth-mode) #page
  :is(.row-actions, .product-row-actions)
  :is(button, a, .action-button, .action-link, .row-action-menu-trigger) {
  color:#1f3b5b !important;
  background:#fff !important;
  border-color:#b8c4d1 !important;
  opacity:1 !important;
  font-weight:650 !important;
  text-shadow:none !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page
  :is(.row-actions, .product-row-actions)
  :is(.primary, .action-button.primary, .row-primary-action):not(:disabled) {
  color:#fff !important;
  background:var(--workspace-red) !important;
  border-color:var(--workspace-red) !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page
  :is(.row-actions, .product-row-actions)
  :is(button:disabled, .action-button:disabled, .row-primary-action:disabled) {
  color:#53677f !important;
  background:#eef4fb !important;
  border-color:#9fb9d8 !important;
  opacity:1 !important;
}

/* 2026-09-02 context-inspector-contrast=20260902
   The selected-row inspector is an in-page light surface. Its older
   .app-shell:not(.auth-mode) rules are more specific than the later generic
   workspace theme, so keep the terminal contrast bridge at that specificity
   and scope it to the actual product-center inspector only. */
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector {
  color:#17324d !important;
  background:#fff !important;
  border-color:#dce4ec !important;
  box-shadow:0 2px 8px rgba(15,39,67,.05) !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector :is(.ledger-inspector-head,.ledger-inspector-actions,.ledger-inspector-tabs,.ledger-inspector-body) {
  color:#17324d !important;
  background:#fff !important;
  border-color:#e0e7ee !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector-body {
  color:#17324d !important;
  background:#fff !important;
  border-color:#e0e7ee !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector :is(.ledger-facts,.ledger-timeline) {
  color:#17324d !important;
  background:transparent !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-facts > div {
  border-bottom-color:#eceef0 !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-facts dt,
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-inspector-head > div > span,
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-inspector-head > div > small,
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-timeline small {
  color:#68717a !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-facts dd,
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-inspector-head > div > strong,
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-timeline strong {
  color:#17324d !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-timeline li:not(:last-child)::after {
  background:#d6dde5 !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-timeline-mark {
  color:#68717a !important;
  background:#fff !important;
  border-color:#c8d2de !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-timeline li.done .ledger-timeline-mark {
  color:#067647 !important;
  background:#effaf4 !important;
  border-color:#9bd6c8 !important;
}
body.workspace-mode .app-shell:not(.auth-mode) #page .ledger-inspector .ledger-timeline li.active .ledger-timeline-mark {
  color:#b42318 !important;
  background:#fff1f0 !important;
  border-color:#efb5ae !important;
}

/* The shell contract intentionally applies a high-specificity ink rule to
   all detail copy. Reassert the inspector's muted labels at that same scope. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector
  :is(.ledger-facts dt, .ledger-inspector-head > div > span, .ledger-inspector-head > div > small, .ledger-timeline small) {
  color:#68717a !important;
}

/* Mode-independent fallback: the action rail is rendered after login, but a
   transient class switch or an older cached theme must not erase its labels. */
.app-shell:not(.auth-mode) #page
  :is(.row-actions, .product-row-actions)
  :is(button, a, .action-button, .action-link, .row-action-menu-trigger) {
  color:#1f3b5b !important;
  -webkit-text-fill-color:#1f3b5b !important;
  background:#fff !important;
  border-color:#b8c4d1 !important;
  opacity:1 !important;
}
.app-shell:not(.auth-mode) #page
  :is(.row-actions, .product-row-actions)
  :is(.primary, .action-button.primary, .row-primary-action):not(:disabled) {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  background:#b4232f !important;
  border-color:#b4232f !important;
}
.app-shell:not(.auth-mode) #page
  :is(.row-actions, .product-row-actions)
  :is(button:disabled, .action-button:disabled, .row-primary-action:disabled) {
  color:#53677f !important;
  -webkit-text-fill-color:#53677f !important;
  background:#eef4fb !important;
  border-color:#9fb9d8 !important;
  opacity:1 !important;
}

/* END frontend/assets/ui-system-final.css */

/* BEGIN frontend/assets/ui-shell-contract.css */
/*
 * UI shell contract · 2026-09-02 r34
 *
 * This is the only final shell/layout layer. The earlier stylesheets remain
 * compatibility and page-component layers; new shell, navigation, topbar,
 * workspace-tab and responsive layout rules belong here and nowhere else.
 * All selectors are scoped to an explicit lifecycle state so auth and boot
 * surfaces cannot inherit authenticated workspace chrome.
 */
:root {
  --shell-sidebar-width:220px;
  --shell-sidebar-narrow:188px;
  --shell-topbar-height:64px;
  --shell-switcher-height:38px;
  --shell-tabs-height:36px;
  --shell-page-gutter:clamp(24px,2vw,48px);
  --shell-page-max-width:clamp(1380px,calc(100vw - var(--shell-sidebar-width) - 80px),3200px);
  --shell-page-max-width-collapsed:clamp(1380px,calc(100vw - 80px),3200px);
  --shell-rail:#20242a;
  --shell-rail-2:#2a3037;
  --shell-rail-line:#3d454e;
  --shell-rail-ink:#aeb7c1;
  --shell-rail-strong:#fff;
  --shell-canvas:#f3f4f6;
  --shell-surface:#fff;
  --shell-line:#dfe2e6;
  --shell-line-strong:#c8cdd3;
  --shell-ink:#20252a;
  --shell-muted:#68717a;
  --shell-focus:#7ba9d6;
  --shell-content-ink:#17324d;
  --shell-content-muted:#52677d;
  --shell-content-faint:#7d8b99;
  --shell-content-link:#175cd3;
  --shell-content-line:#d6dde5;
  --shell-content-surface:#fff;
  --shell-content-subtle:#f5f7f9;
  --shell-content-info-bg:#eef5ff;
  --shell-content-success-bg:#effaf4;
  --shell-content-warning-bg:#fff8eb;
  --shell-content-danger-bg:#fff5f4;
  --shell-r30-coral:#f04438;
  --shell-r30-navy:#17324d;
  --shell-r30-blue:#175cd3;
  --shell-r30-cyan:#0e7490;
  --shell-r30-surface:#fff;
  --shell-r30-soft:#f7f9fc;
  --shell-r30-line:#e4e9f0;
}
/* Lifecycle guard: only a ready, authenticated workspace receives the shell. */
.app-shell.is-booting { visibility:hidden; }
body.auth-mode .app-shell:not(.auth-mode) { visibility:hidden; }
body.workspace-mode .app-shell.auth-mode { visibility:hidden; }
body.auth-mode .app-shell.auth-mode,
body.workspace-mode .app-shell:not(.auth-mode) { visibility:visible; }

body.workspace-mode {
  min-width:320px;
  background:var(--shell-canvas) !important;
  color:var(--shell-ink) !important;
  color-scheme:light !important;
}
body.workspace-mode .app-shell {
  display:grid !important;
  grid-template-columns:var(--shell-sidebar-width) minmax(0,1fr) !important;
  min-height:100vh !important;
  background:var(--shell-canvas) !important;
}
body.workspace-mode .sidebar,
body.workspace-mode .workspace,
body.workspace-mode #page,
body.workspace-mode .page {
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}
body.workspace-mode .sidebar {
  width:var(--shell-sidebar-width) !important;
  min-width:var(--shell-sidebar-width) !important;
  overflow:hidden !important;
  background:var(--shell-rail) !important;
  border-right:1px solid #343a42 !important;
  box-shadow:none !important;
}
body.workspace-mode .workspace {
  overflow-x:hidden !important;
  background:var(--shell-canvas) !important;
}

/* Topbar, workbench switcher and recent-module strip have one height each. */
body.workspace-mode .topbar {
  display:flex !important;
  align-items:center !important;
  min-height:var(--shell-topbar-height) !important;
  height:var(--shell-topbar-height) !important;
  padding:0 24px !important;
  box-sizing:border-box !important;
  background:var(--shell-surface) !important;
  border-bottom:1px solid var(--shell-line) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
body.workspace-mode .topbar-heading,
body.workspace-mode .top-actions {
  min-width:0 !important;
}
body.workspace-mode .topbar-heading {
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  flex:0 1 auto !important;
}
body.workspace-mode .topbar-title-group {
  display:grid !important;
  gap:0 !important;
  min-width:0 !important;
}
body.workspace-mode .topbar h1,
body.workspace-mode .topbar .topbar-kicker {
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
body.workspace-mode .workbench-switcher,
body.workspace-mode .workspace-tabs {
  min-height:var(--shell-switcher-height) !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  scrollbar-width:none;
  background:var(--shell-surface) !important;
  border-bottom:1px solid var(--shell-line) !important;
}
body.workspace-mode .workbench-switcher::-webkit-scrollbar,
body.workspace-mode .workspace-tabs::-webkit-scrollbar { display:none; }
body.workspace-mode .workbench-switcher { height:var(--shell-switcher-height) !important; padding:2px 24px !important; }
body.workspace-mode .workspace-tabs { min-height:var(--shell-tabs-height) !important; height:var(--shell-tabs-height) !important; padding:3px 24px !important; }
body.workspace-mode .workspace-tabs[hidden] { display:none !important; }

/* The main reading surface never grows from intrinsic child width. */
body.workspace-mode .page {
  width:min(calc(100% - (var(--shell-page-gutter) * 2)),var(--shell-page-max-width)) !important;
  margin:0 auto !important;
  padding:24px 0 48px !important;
}
body.workspace-mode :is(.panel,.toolbar,.table-wrap,.product-workbench-panel,.dialog,.dialog-inner) {
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}
body.workspace-mode :is(button,input,select,textarea) {
  max-width:100% !important;
  box-sizing:border-box !important;
}
body.workspace-mode button {
  overflow-wrap:anywhere;
}
body.workspace-mode :is(.table-wrap,.product-workbench-panel .table-wrap) {
  overflow-x:auto !important;
  overflow-y:visible !important;
  scrollbar-gutter:stable;
}
body.workspace-mode :is(.dialog,.dialog-inner) { overflow-wrap:anywhere; }
body.workspace-mode .dialog > .dialog-inner { width:100% !important; max-width:100% !important; }
body.workspace-mode :is(button,a,input,select,textarea):focus-visible {
  outline:2px solid var(--shell-focus) !important;
  outline-offset:2px !important;
}

/* Navigation contract: the trigger and menu share one state machine. */
body.workspace-mode .sidebar .nav {
  min-width:0 !important;
  width:100% !important;
  min-height:0 !important;
  padding:12px 10px 16px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  box-sizing:border-box !important;
}
body.workspace-mode .sidebar .nav-group {
  display:grid !important;
  gap:4px !important;
  min-width:0 !important;
}
body.workspace-mode .sidebar :is(button.nav-item,a.nav-item,button.nav-group-trigger) {
  display:flex !important;
  align-items:center !important;
  width:100% !important;
  min-width:0 !important;
  min-height:38px !important;
  padding:8px 10px !important;
  gap:10px !important;
  border:1px solid transparent !important;
  border-radius:6px !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:var(--shell-rail-ink) !important;
  font-size:13px !important;
  font-weight:600 !important;
  line-height:1.2 !important;
  text-align:left !important;
  transform:none !important;
  transition:background .18s ease,border-color .18s ease,color .18s ease !important;
}
body.workspace-mode .sidebar .nav-group-trigger {
  min-height:40px !important;
  margin:4px 0 0 !important;
  font-size:12px !important;
  font-weight:650 !important;
}
body.workspace-mode .sidebar :is(.nav-item,.nav-group-trigger) > svg:first-child {
  width:18px !important;
  height:18px !important;
  flex:0 0 18px !important;
  color:inherit !important;
}
body.workspace-mode .sidebar :is(.nav-item,.nav-group-trigger) > span {
  flex:1 1 auto !important;
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:inherit !important;
}
body.workspace-mode .sidebar .nav-group-chevron {
  display:block !important;
  width:16px !important;
  height:16px !important;
  margin-left:auto !important;
  flex:0 0 16px !important;
  opacity:.86 !important;
  transform:rotate(0deg) !important;
  transition:transform .18s ease,opacity .18s ease !important;
}
body.workspace-mode .sidebar .nav-group-trigger[aria-expanded="true"] .nav-group-chevron { transform:rotate(90deg) !important; }
body.workspace-mode .sidebar .nav-group-trigger:hover,
body.workspace-mode .sidebar .nav-group-trigger:focus-visible,
body.workspace-mode .sidebar .nav-group-trigger[aria-expanded="true"] {
  color:var(--shell-rail-strong) !important;
  background:var(--shell-rail-2) !important;
  border-color:var(--shell-rail-line) !important;
}
body.workspace-mode .sidebar :is(.nav-item,.nav-group-trigger):hover {
  color:var(--shell-rail-strong) !important;
  background:var(--shell-rail-2) !important;
  border-color:var(--shell-rail-line) !important;
}
body.workspace-mode .sidebar .nav-group-menu {
  display:grid !important;
  gap:3px !important;
  max-height:640px !important;
  margin:0 0 4px 11px !important;
  padding:4px 0 4px 13px !important;
  overflow:hidden !important;
  border-left:1px solid var(--shell-rail-line) !important;
  opacity:1 !important;
  transform:translateY(0) !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transition:max-height .22s ease,opacity .16s ease,transform .22s ease,border-color .22s ease,padding .22s ease,margin .22s ease !important;
}
body.workspace-mode .sidebar .nav-group.is-collapsed .nav-group-menu {
  display:grid !important;
  max-height:0 !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  border-left-color:transparent !important;
  opacity:0 !important;
  transform:translateY(-4px) !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
body.workspace-mode .sidebar .nav-group-menu .nav-item {
  min-height:38px !important;
  padding:7px 10px !important;
  border-radius:4px !important;
}
body.workspace-mode .sidebar .nav-item.active,
body.workspace-mode .sidebar .nav-dashboard-entry.active {
  color:#fff !important;
  background:#30373f !important;
  border-color:#424a53 !important;
  box-shadow:inset 3px 0 0 var(--workspace-red) !important;
}
body.workspace-mode .app-shell[data-sidebar-collapsed="true"] .sidebar .nav-group-menu { display:none !important; }

@media (min-width:761px) and (max-width:1100px) {
  body.workspace-mode .app-shell { grid-template-columns:var(--shell-sidebar-narrow) minmax(0,1fr) !important; }
  body.workspace-mode .sidebar { width:var(--shell-sidebar-narrow) !important; min-width:var(--shell-sidebar-narrow) !important; }
  body.workspace-mode .topbar { min-height:58px !important; height:58px !important; padding-inline:16px !important; }
  body.workspace-mode .workbench-switcher { padding-inline:16px !important; }
  body.workspace-mode .workspace-tabs { padding-inline:16px !important; }
  body.workspace-mode .page { width:calc(100% - 32px) !important; padding-block:16px 36px !important; }
}

@media (max-width:760px) {
  body.workspace-mode .app-shell { display:block !important; min-height:100vh !important; }
  body.workspace-mode .sidebar {
    position:fixed !important;
    inset:auto 0 0 0 !important;
    z-index:60 !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    height:62px !important;
    min-height:62px !important;
    border-top:1px solid #343a42 !important;
    border-right:0 !important;
  }
  body.workspace-mode .sidebar .nav {
    display:flex !important;
    flex-direction:row !important;
    align-items:stretch !important;
    gap:4px !important;
    height:62px !important;
    padding:5px 8px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }
  body.workspace-mode .sidebar .nav-group,
  body.workspace-mode .sidebar .nav-group-menu { display:contents !important; }
  body.workspace-mode .sidebar .nav-group-trigger { display:none !important; }
  body.workspace-mode .sidebar .nav-group-menu,
  body.workspace-mode .sidebar .nav-group.is-collapsed .nav-group-menu {
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
    border:0 !important;
    opacity:1 !important;
    transform:none !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transition:none !important;
  }
  body.workspace-mode .sidebar :is(.nav-item,.nav-group-menu .nav-item) {
    flex:0 0 74px !important;
    justify-content:center !important;
    flex-direction:column !important;
    gap:3px !important;
    min-height:52px !important;
    padding:4px 5px !important;
    font-size:10px !important;
    text-align:center !important;
  }
  body.workspace-mode .topbar {
    min-height:56px !important;
    height:auto !important;
    padding:7px 12px !important;
  }
  body.workspace-mode .workbench-switcher,
  body.workspace-mode .workspace-tabs { min-height:34px !important; height:34px !important; padding-inline:10px !important; }
  body.workspace-mode .page { width:auto !important; padding:12px 10px 76px !important; }
}


/* employee-workspace-polish=20260903-r2
 * The directory is a navigation rail, not a second table. The employee list
 * stays dense by keeping row actions on one line and reserving a stable action
 * track so labels never collide with phone or role values. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-grid {
  grid-template-columns:minmax(198px,224px) minmax(0,1fr) !important;
  gap:10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail {
  border:1px solid #dfe7e5 !important;
  border-radius:6px !important;
  background:#fbfdfc !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-rail-head {
  min-height:52px !important;
  padding:10px 12px !important;
  border-bottom:1px solid #e4ece9 !important;
  background:#f7faf9 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-list {
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:0 !important;
  padding:5px 8px 7px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-filter {
  min-height:48px !important;
  margin:0 !important;
  padding:8px 9px !important;
  border:0 !important;
  border-bottom:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-filter:last-child {
  border-bottom:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-filter:hover {
  background:#f4f9f7 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-filter.is-selected {
  margin:2px 0 !important;
  border-bottom-color:transparent !important;
  border-radius:5px !important;
  background:#edf8f3 !important;
  box-shadow:inset 3px 0 0 #2b8a78 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-main strong {
  font-size:13px !important;
  font-weight:720 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-main small {
  font-size:10px !important;
  line-height:1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-panel {
  border-radius:6px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-panel .panel-head {
  min-height:58px !important;
  padding:10px 14px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-filter-bar {
  min-height:44px !important;
  padding:6px 14px !important;
  gap:10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-filter-bar select {
  min-width:150px !important;
  height:32px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table {
  min-width:0 !important;
  width:100% !important;
  table-layout:fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td {
  padding:10px 10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(1) { width:21% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(2) { width:12% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(3) { width:13% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(4) { width:20% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(5) { width:15% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(6) { width:19% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child {
  min-width:188px !important;
  width:19% !important;
  overflow:visible !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table .row-actions {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex-wrap:nowrap !important;
  gap:4px !important;
  min-width:0 !important;
  max-width:100% !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child > button.compact-button {
  flex:0 0 auto !important;
  min-width:0 !important;
  min-height:30px !important;
  padding-inline:7px !important;
  font-size:12px !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child > .account-admin-protected {
  display:inline-flex !important;
  max-width:100% !important;
  white-space:normal !important;
}

@media (max-width:1100px) and (min-width:761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-grid {
    grid-template-columns:190px minmax(0,1fr) !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child {
    min-width:176px !important;
  }
}

/* Keep the first base-material content group comfortably separated from its
   chapter header after the generic first-child divider reset. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .detail-module-content > .label-section {
  padding-top:16px !important;
  border-top:0 !important;
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .detail-module-content > .label-section {
    padding-top:14px !important;
  }
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-grid {
    gap:8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child {
    min-width:0 !important;
    white-space:normal !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table .row-actions {
    flex-wrap:wrap !important;
    white-space:normal !important;
  }
}

/* Content contrast terminal contract · 2026-09-01 r29
 * Authenticated business content uses one readable light surface contract.
 * Sidebar and login surfaces intentionally remain outside this scope.
 */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.workspace,#page,.page) {
  color:var(--shell-content-ink) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .page {
  background:var(--shell-canvas) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,legend,caption,td,th,summary,small,span,strong,em) {
  color:var(--shell-content-ink) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.subtle,.muted,.secondary,.helper-text,.field-help,.meta,.pattern-progress-meta,.pattern-progress-next,.pattern-timeline small,.sku-chip small,.detail-module-head p,.detail-module-actions-head span,.dashboard-module-card-head span,.dashboard-module-name span,.operation-data-note,.finance-invoice-preview,.order-product-summary,.schedule-product-copy small,.hr-document-empty,.hr-role-mapping-empty,.form-footer small) {
  color:var(--shell-content-muted) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(:disabled,.is-disabled,.placeholder,[aria-disabled="true"]) {
  color:var(--shell-content-faint) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(a,.link,.action-link,.style-code,.detail-module-nav-item) {
  color:var(--shell-content-link) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(button.primary,.btn-primary,.button-primary,.danger-button,.destructive-button) {
  color:#fff !important;
}

/* r34 employee-directory overflow contract: keep role/protection content
   inside its column while exposing the full value through title/ARIA. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.org-members-panel,.hr-table-wrap,.account-table-wrap) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.org-members-table,.hr-table,.account-table) {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  table-layout:fixed !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.org-members-table th,.org-members-table td,.hr-table th,.hr-table td,.account-table th,.account-table td) {
  min-width:0 !important;
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  vertical-align:middle !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.org-members-table td,.hr-table td,.account-table td) {
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.org-role-label,.account-admin-protected,.role-protected,.org-account-state,.hr-account-summary,.account-binding-state) {
  display:inline-flex !important;
  align-items:center !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  line-height:1.35 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.org-members-table .row-actions,.account-table .row-actions) {
  min-width:0 !important;
  max-width:100% !important;
  display:flex !important;
  flex-wrap:wrap !important;
  gap:5px !important;
}
@media (max-width:680px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.org-members-table,.hr-table,.account-table) {
    min-width:0 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.org-members-table th,.org-members-table td,.hr-table th,.hr-table td,.account-table th,.account-table td) {
    padding-inline:8px !important;
  }
}

/* r35 image-to-front detail workspace contract. The reference image informs
   hierarchy and spacing only; all content remains rendered by the live DOM. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.dialog.product-detail-shell,.dialog:has(.product-detail-shell)) {
  width:min(1540px,calc(100% - 28px)) !important;
  max-width:1540px !important;
  max-height:min(940px,calc(100% - 28px)) !important;
  border:1px solid #d7e0e9 !important;
  border-radius:8px !important;
  background:#f6f8fb !important;
  box-shadow:0 18px 52px rgba(15,39,67,.16) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell {
  color:#17324d !important;
  background:#f6f8fb !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .dialog-head {
  min-height:54px !important;
  padding:10px 18px !important;
  background:#fff !important;
  border-bottom:1px solid #dce4ec !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .details {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:10px !important;
  padding:12px !important;
  background:#f6f8fb !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top {
  display:grid !important;
  grid-template-columns:132px minmax(0,1fr) auto !important;
  align-items:start !important;
  gap:16px !important;
  margin:0 !important;
  padding:14px !important;
  border:1px solid #dce4ec !important;
  border-radius:7px !important;
  background:#fff !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) {
  width:132px !important;
  height:164px !important;
  border-radius:5px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-title {
  color:#102a45 !important;
  font-size:21px !important;
  font-weight:780 !important;
  line-height:1.25 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-meta {
  display:flex !important;
  flex-wrap:wrap !important;
  gap:5px !important;
  margin:8px 0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-actions {
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
  align-items:flex-start !important;
  gap:7px !important;
  min-width:180px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-actions .primary {
  background:#e5483f !important;
  border-color:#e5483f !important;
  color:#fff !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav {
  position:sticky !important;
  top:0 !important;
  z-index:4 !important;
  display:flex !important;
  gap:4px !important;
  overflow-x:auto !important;
  padding:4px !important;
  border:1px solid #dce4ec !important;
  border-radius:6px !important;
  background:#fff !important;
  box-shadow:0 2px 8px rgba(15,39,67,.06) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav-item {
  min-height:32px !important;
  padding:0 11px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  color:#52677d !important;
  background:#fff !important;
  font-size:11px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav-item.is-active {
  color:#e5483f !important;
  background:#fff1ef !important;
  border-color:#f2c0bb !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module {
  margin:0 !important;
  border:1px solid #dce4ec !important;
  border-radius:7px !important;
  background:#fff !important;
  box-shadow:0 2px 8px rgba(15,39,67,.045) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-head {
  display:flex !important;
  align-items:flex-start !important;
  gap:9px !important;
  padding:10px 14px !important;
  background:#f8fafc !important;
  border-bottom:1px solid #e2e8ef !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-index {
  width:25px !important;
  height:25px !important;
  flex:0 0 25px !important;
  border-radius:50% !important;
  color:#fff !important;
  background:#e5483f !important;
  font-size:10px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content {
  padding:12px 14px 14px !important;
  background:#fff !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-actions {
  margin:0 0 10px !important;
  padding:9px 10px !important;
  border:1px solid #c9e3da !important;
  border-radius:5px !important;
  background:#eff9f5 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-grid {
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(176px,1fr)) !important;
  gap:8px !important;
  padding:8px !important;
  border:1px solid #e0e7ee !important;
  border-radius:6px !important;
  background:#f8fafc !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip {
  min-width:0 !important;
  min-height:64px !important;
  padding:9px !important;
  border:1px solid #dce5ed !important;
  border-radius:5px !important;
  background:#fff !important;
  box-shadow:0 1px 4px rgba(15,39,67,.04) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip :is(strong,b) { color:#17324d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip small { color:#52677d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-workbench-layout {
  grid-template-columns:minmax(0,1fr) 292px !important;
  gap:10px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector {
  border:1px solid #dce4ec !important;
  border-radius:7px !important;
  background:#fff !important;
  box-shadow:0 2px 8px rgba(15,39,67,.05) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector :is(.ledger-inspector-head,.ledger-inspector-actions,.ledger-inspector-tabs) {
  background:#fff !important;
  border-color:#e0e7ee !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector-tabs button.active {
  color:#e5483f !important;
  border-bottom-color:#e5483f !important;
}
@media (max-width:900px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top { grid-template-columns:104px minmax(0,1fr) !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) { width:104px !important; height:132px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-actions { grid-column:1/-1 !important; justify-content:flex-start !important; min-width:0 !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-workbench-layout { grid-template-columns:1fr !important; }
}
@media (max-width:560px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.dialog.product-detail-shell,.dialog:has(.product-detail-shell)) { width:calc(100% - 14px) !important; max-height:calc(100% - 14px) !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .details { padding:8px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top { grid-template-columns:76px minmax(0,1fr) !important; gap:9px !important; padding:9px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) { width:76px !important; height:98px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-title { font-size:16px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}

/* r35 EOF visual seal: final cascade for the image-to-front detail workspace. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .details { background:#f6f8fb !important; color:#17324d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector { background:#fff !important; color:#17324d !important; border-color:#dce4ec !important; box-shadow:0 2px 8px rgba(15,39,67,.05) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-head { background:#f8fafc !important; border-bottom-color:#e2e8ef !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav { display:flex !important; gap:4px !important; overflow-x:auto !important; padding:4px !important; background:#fff !important; border:1px solid #dce4ec !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav-item { min-height:32px !important; padding:0 11px !important; color:#52677d !important; background:#fff !important; border-color:transparent !important; white-space:nowrap !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav-item.is-active { color:#e5483f !important; background:#fff1ef !important; border-color:#f2c0bb !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-index { background:#e5483f !important; color:#fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-actions { background:#eff9f5 !important; border-color:#c9e3da !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-grid { display:grid !important; grid-template-columns:repeat(auto-fit,minmax(176px,1fr)) !important; gap:8px !important; padding:8px !important; background:#f8fafc !important; border-color:#e0e7ee !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip :is(strong,b) { color:#17324d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip small { color:#52677d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-workbench-layout { grid-template-columns:minmax(0,1fr) 292px !important; gap:10px !important; }

/* r33 terminal override: physically final cascade for redundant workbench strip. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workbench-switcher {
  display:none !important;
  visibility:hidden !important;
  position:absolute !important;
  inset:auto !important;
  width:0 !important;
  min-width:0 !important;
  max-width:0 !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  flex:none !important;
  flex-basis:0 !important;
  grid-area:none !important;
  scrollbar-width:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher::-webkit-scrollbar { display:none !important; }

/* 2026-09-02 order-table-density=20260902
 * The order ledger keeps every procurement and scheduling field, but uses a
 * fixed column contract so long SKU text cannot widen the table or inflate
 * the row. Narrow screens use the same fields as labelled order records. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .table-wrap {
  width:100% !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  scrollbar-gutter:stable;
  background:#fff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table {
  width:100% !important;
  min-width:1498px !important;
  table-layout:fixed !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table :is(th,td) {
  min-width:0 !important;
  padding:8px 9px !important;
  line-height:1.3 !important;
  vertical-align:middle !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th {
  height:34px !important;
  padding-top:7px !important;
  padding-bottom:7px !important;
  white-space:nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(1),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(1) { width:78px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(2),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(2) { width:64px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(3),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(3) { width:102px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(4),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(4) { width:88px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(5),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(5) { width:110px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(6),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(6) { width:96px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(7),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(7) { width:68px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(8),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(8) { width:142px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(9),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(9) { width:84px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(10),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(10) { width:96px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(11),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(11) { width:78px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(12),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(12) { width:84px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(13),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(13) { width:100px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(14),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(14) { width:104px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(15),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(15) { width:94px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table th:nth-child(16),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table td:nth-child(16) { width:110px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-image {
  display:block !important;
  width:56px !important;
  height:76px !important;
  border:1px solid var(--workspace-line-strong) !important;
  border-radius:3px !important;
  object-fit:cover !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .stack {
  min-width:0 !important;
  gap:2px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .stack > :is(strong,span),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .subtle {
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .compact-order-lines {
  display:block !important;
  min-width:0 !important;
  max-width:none !important;
  line-height:1.3 !important;
  overflow-wrap:anywhere !important;
  white-space:normal !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .match-style-list {
  display:flex !important;
  flex-wrap:wrap !important;
  gap:2px 5px !important;
  max-width:none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-actions-cell,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-row-actions {
  min-width:0 !important;
  white-space:normal !important;
}

@media (max-width:760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .table-wrap {
    overflow:visible !important;
    padding:0 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table {
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    table-layout:auto !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table thead { display:none !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody {
    display:grid !important;
    gap:8px !important;
    padding:8px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody tr {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    overflow:hidden !important;
    border:1px solid var(--workspace-line) !important;
    border-radius:4px !important;
    background:#fff !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td {
    display:block !important;
    width:auto !important;
    max-width:none !important;
    padding:9px 10px !important;
    border-right:1px solid #eceef0 !important;
    border-bottom:1px solid #eceef0 !important;
    background:#fff !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td::before {
    content:attr(data-label) !important;
    display:block !important;
    margin-bottom:3px !important;
    color:var(--workspace-muted) !important;
    font-size:10px !important;
    font-weight:700 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:is([data-label="款号"],[data-label="图片"],[data-label="颜色 / 尺码明细"],[data-label="操作"]) {
    grid-column:1/-1 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:last-child {
    border-right:0 !important;
    border-bottom:0 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-image {
    width:64px !important;
    height:82px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-actions-cell {
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    min-height:48px !important;
    border-top:1px solid #eceef0 !important;
    border-right:0 !important;
    border-bottom:0 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-actions-cell::before {
    flex:0 0 auto;
    margin:0 4px 0 0 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-row-actions {
    flex:1 1 auto !important;
    justify-content:flex-start !important;
  }
}

/* surface-coherence-audit=20260903-r1
 * Full workspace audit: keep one strong container per workflow, use quiet
 * separators for sections inside it, and reserve framed cards for repeated
 * records. This closes the recurring "box inside box" and table-like rhythm
 * without changing markup or business behavior. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page {
  --audit-ink:#1f2b36;
  --audit-muted:#687784;
  --audit-line:#e1e7eb;
  --audit-line-soft:#edf1f3;
  --audit-surface:#fff;
  --audit-surface-soft:#f8fafb;
}

/* A panel owns the surface. Its direct table wrapper is only a scroll
   affordance and must not look like a second panel. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.panel,.metric,.metric-card,.summary-card,.role-card,.schedule-kpi,.operation-connector-card) {
  border-color:var(--audit-line) !important;
  border-radius:8px !important;
  background:var(--audit-surface) !important;
  box-shadow:0 1px 2px rgba(29,45,56,.035) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.panel,.metric,.metric-card,.summary-card) > :is(.table-wrap,.hr-table-wrap,.account-table-wrap) {
  margin-inline:0 !important;
  border:0 !important;
  border-top:1px solid var(--audit-line-soft) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.panel,.metric,.metric-card,.summary-card) > :is(.table-wrap,.hr-table-wrap,.account-table-wrap) > table {
  border-radius:0 !important;
}

/* Detail modules are the primary hierarchy. Everything below a module reads
   as content or a quiet divider, never as another floating panel. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content > section {
  margin:0 !important;
  padding:18px 0 0 !important;
  border:0 !important;
  border-top:1px solid var(--audit-line-soft) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content > section:first-child {
  padding-top:0 !important;
  border-top:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content > :is(.label-section,.detail-focus-section,.styling-section,.model-image-section,.pattern-requirement-section,.pattern-progress-section,.revision-opinions-section,.contract-detail-section,.design-materials-section,.procurement-materials-section,.procurement-archive-section,.dealer-material-list-section,.supply-plan-panel,.operation-detail-context) {
  border:0 !important;
  border-top:1px solid var(--audit-line-soft) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content > :is(.label-section,.detail-focus-section,.styling-section,.model-image-section,.pattern-requirement-section,.pattern-progress-section,.revision-opinions-section,.contract-detail-section,.design-materials-section,.procurement-materials-section,.procurement-archive-section,.dealer-material-list-section,.supply-plan-panel,.operation-detail-context) :is(.section-heading,.workflow-route-head,.panel-head) {
  margin-top:0 !important;
}

/* Keep action bands useful but visually subordinate to the module header. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-actions,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-contract-actions {
  margin:0 0 14px !important;
  padding:10px 0 12px !important;
  border:0 !important;
  border-bottom:1px solid var(--audit-line-soft) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-actions-head {
  margin-bottom:8px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-action-list {
  gap:6px !important;
}

/* Material sections commonly carried their own large card, group card and
   table card. Collapse that stack to one section heading plus grouped rows. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.procurement-material-groups,.procurement-archive-section .procurement-material-groups) {
  gap:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.procurement-material-group,.procurement-material-sources,.procurement-archive-history) {
  margin:0 !important;
  border:0 !important;
  border-top:1px solid var(--audit-line-soft) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.procurement-material-group:first-child,.procurement-material-sources:first-child,.procurement-archive-history:first-child) {
  border-top:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .procurement-material-group-heading {
  padding:13px 0 !important;
  border-bottom:1px solid var(--audit-line-soft) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.procurement-material-group,.procurement-material-sources) > .table-wrap,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .dealer-material-list-section > .table-wrap,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .design-materials-section > .table-wrap {
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* Repeated record grids keep a small card treatment, but the grid itself is
   never another framed surface. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.label-preview-grid,.dashboard-module-grid,.dashboard-sales-grid,.operation-data-connectors,.role-grid,.permission-grid,.workbench-status-grid,.material-grid) {
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.dashboard-module-grid,.dashboard-sales-grid,.operation-data-connectors,.role-grid,.permission-grid,.workbench-status-grid,.material-grid) {
  padding-inline:0 !important;
}

/* Section headings share one rhythm so controls sit beside copy instead of
   floating at the opposite edge of a large empty block. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-heading,.panel-head,.workflow-route-head,.procurement-material-group-heading) {
  gap:12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-heading,.panel-head) > :first-child {
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-actions,.panel-head-actions,.procurement-list-tools,.operation-data-hero-actions) {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:7px !important;
  flex-wrap:wrap !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-actions,.panel-head-actions) button {
  min-height:30px !important;
  padding-inline:10px !important;
  border-radius:6px !important;
}

/* Forms and editable fields should read as one form, not a tiled table. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.form,.form-grid,.fields) {
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.fields,.detail-more-fields) {
  margin:16px 0 0 !important;
  padding:0 !important;
  border:0 !important;
  border-top:1px solid var(--audit-line-soft) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.field,.detail-more-fields summary) {
  background:transparent !important;
  border-color:var(--audit-line-soft) !important;
}

@media (max-width:920px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-heading,.panel-head,.workflow-route-head) {
    align-items:flex-start !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-actions,.panel-head-actions,.procurement-list-tools,.operation-data-hero-actions) {
    justify-content:flex-start !important;
  }
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-heading,.panel-head,.workflow-route-head) {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:9px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-actions,.panel-head-actions,.procurement-list-tools,.operation-data-hero-actions) {
    justify-content:flex-start !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.detail-module-content,.detail-module-base .detail-module-content) {
    padding-inline:12px !important;
  }
}

@media (max-width:460px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody tr { grid-template-columns:1fr !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td { grid-column:1/-1 !important; border-right:0 !important; }
}

/* r35 EOF visual seal: these declarations are intentionally after every
   legacy theme layer, so the reference hierarchy wins the final cascade. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .details { background:#f6f8fb !important; color:#17324d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector { background:#fff !important; color:#17324d !important; border-color:#dce4ec !important; box-shadow:0 2px 8px rgba(15,39,67,.05) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-head { background:#f8fafc !important; border-bottom-color:#e2e8ef !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav { display:flex !important; gap:4px !important; overflow-x:auto !important; padding:4px !important; background:#fff !important; border:1px solid #dce4ec !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav-item { min-height:32px !important; padding:0 11px !important; color:#52677d !important; background:#fff !important; border-color:transparent !important; white-space:nowrap !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav-item.is-active { color:#e5483f !important; background:#fff1ef !important; border-color:#f2c0bb !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-index { background:#e5483f !important; color:#fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-actions { background:#eff9f5 !important; border-color:#c9e3da !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-grid { display:grid !important; grid-template-columns:repeat(auto-fit,minmax(176px,1fr)) !important; gap:8px !important; padding:8px !important; background:#f8fafc !important; border-color:#e0e7ee !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip :is(strong,b) { color:#17324d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip small { color:#52677d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-workbench-layout { grid-template-columns:minmax(0,1fr) 292px !important; gap:10px !important; }

/* r35 terminal visual contract: final cascade for the image-to-front detail workspace. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell {
  color:#17324d !important;
  background:#f6f8fb !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .details {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:10px !important;
  padding:12px !important;
  background:#f6f8fb !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top {
  display:grid !important;
  grid-template-columns:132px minmax(0,1fr) auto !important;
  gap:16px !important;
  padding:14px !important;
  border:1px solid #dce4ec !important;
  border-radius:7px !important;
  background:#fff !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) {
  width:132px !important;
  height:164px !important;
  border-radius:5px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-title { color:#102a45 !important; font-size:21px !important; font-weight:780 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-meta { display:flex !important; flex-wrap:wrap !important; gap:5px !important; margin:8px 0 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav {
  display:flex !important;
  gap:4px !important;
  overflow-x:auto !important;
  padding:4px !important;
  border:1px solid #dce4ec !important;
  border-radius:6px !important;
  background:#fff !important;
  box-shadow:0 2px 8px rgba(15,39,67,.06) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav-item {
  min-height:32px !important;
  padding:0 11px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  color:#52677d !important;
  background:#fff !important;
  white-space:nowrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav-item.is-active { color:#e5483f !important; background:#fff1ef !important; border-color:#f2c0bb !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module {
  margin:0 !important;
  border:1px solid #dce4ec !important;
  border-radius:7px !important;
  background:#fff !important;
  box-shadow:0 2px 8px rgba(15,39,67,.045) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-head { padding:10px 14px !important; background:#f8fafc !important; border-bottom:1px solid #e2e8ef !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-index { width:25px !important; height:25px !important; flex:0 0 25px !important; background:#e5483f !important; color:#fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content { padding:12px 14px 14px !important; background:#fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-actions { margin:0 0 10px !important; padding:9px 10px !important; border:1px solid #c9e3da !important; border-radius:5px !important; background:#eff9f5 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-grid { display:grid !important; grid-template-columns:repeat(auto-fit,minmax(176px,1fr)) !important; gap:8px !important; padding:8px !important; border:1px solid #e0e7ee !important; border-radius:6px !important; background:#f8fafc !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip { min-width:0 !important; min-height:64px !important; padding:9px !important; border:1px solid #dce5ed !important; border-radius:5px !important; background:#fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip :is(strong,b) { color:#17324d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip small { color:#52677d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-workbench-layout { grid-template-columns:minmax(0,1fr) 292px !important; gap:10px !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector { border:1px solid #dce4ec !important; border-radius:7px !important; background:#fff !important; box-shadow:0 2px 8px rgba(15,39,67,.05) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector :is(.ledger-inspector-head,.ledger-inspector-actions,.ledger-inspector-tabs) { background:#fff !important; border-color:#e0e7ee !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector-tabs button.active { color:#e5483f !important; border-bottom-color:#e5483f !important; }
@media (max-width:900px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top { grid-template-columns:104px minmax(0,1fr) !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) { width:104px !important; height:132px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-actions { grid-column:1/-1 !important; justify-content:flex-start !important; min-width:0 !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-workbench-layout { grid-template-columns:1fr !important; }
}
@media (max-width:560px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .details { padding:8px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top { grid-template-columns:76px minmax(0,1fr) !important; gap:9px !important; padding:9px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) { width:76px !important; height:98px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-title { font-size:16px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}

/* r33 terminal override: physically last rule, wins every legacy switcher declaration. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workbench-switcher {
  display:none !important;
  visibility:hidden !important;
  position:absolute !important;
  inset:auto !important;
  width:0 !important;
  min-width:0 !important;
  max-width:0 !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  flex:none !important;
  flex-basis:0 !important;
  grid-area:none !important;
  scrollbar-width:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher::-webkit-scrollbar { display:none !important; }

/* r32 terminal override: final cascade wins over every historical switcher rule. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workbench-switcher {
  display:none !important;
  visibility:hidden !important;
  position:absolute !important;
  inset:auto !important;
  width:0 !important;
  min-width:0 !important;
  max-width:0 !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  flex:none !important;
  flex-basis:0 !important;
  grid-area:none !important;
  scrollbar-width:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher::-webkit-scrollbar { display:none !important; }

/* r32 terminal override: keep the redundant switcher hidden after every legacy rule. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workbench-switcher {
  display:none !important;
  visibility:hidden !important;
  position:absolute !important;
  inset:auto !important;
  width:0 !important;
  min-width:0 !important;
  max-width:0 !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  flex:none !important;
  flex-basis:0 !important;
  grid-area:none !important;
  scrollbar-width:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher::-webkit-scrollbar { display:none !important; }

/* r31: the sidebar is the sole workbench navigation surface. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workbench-switcher {
  display:none !important;
  visibility:hidden !important;
  width:0 !important;
  min-width:0 !important;
  max-width:0 !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  scrollbar-width:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher::-webkit-scrollbar { display:none !important; }

/* Image-to-front visual contract · 2026-09-01 r30
 * Visual truth: output/uiux-gpt-image-2-r30.png. Live data and workflow DOM stay intact.
 */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.page,.panel,.toolbar,.view-panel) {
  border-radius:6px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workbench-switcher {
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
  min-height:44px !important;
  height:44px !important;
  padding:4px 24px !important;
  background:#fff !important;
  border-bottom:1px solid var(--shell-r30-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workbench-switcher-item {
  min-height:32px !important;
  padding:0 12px !important;
  border:1px solid transparent !important;
  border-radius:6px !important;
  color:var(--shell-content-muted) !important;
  background:transparent !important;
  font-size:12px !important;
  font-weight:700 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workbench-switcher-item.active {
  color:var(--shell-r30-coral) !important;
  background:#fff1f0 !important;
  border-color:#ffd1cc !important;
}

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog.product-detail-shell,.dialog:has(.product-detail-shell)) {
  width:min(1480px,calc(100% - 32px)) !important;
  max-width:1480px !important;
  max-height:min(920px,calc(100% - 32px)) !important;
  border:1px solid var(--shell-r30-line) !important;
  border-radius:8px !important;
  background:var(--shell-r30-soft) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog.product-detail-shell,.dialog:has(.product-detail-shell)) > .product-detail-shell {
  max-width:none !important;
  background:var(--shell-r30-soft) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .dialog-head {
  min-height:56px !important;
  padding:12px 20px !important;
  background:#fff !important;
  border-bottom:1px solid var(--shell-r30-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .details {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:12px !important;
  padding:16px !important;
  background:var(--shell-r30-soft) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top {
  display:grid !important;
  grid-template-columns:150px minmax(0,1fr) auto !important;
  align-items:start !important;
  gap:18px !important;
  margin:0 !important;
  padding:16px !important;
  border:1px solid var(--shell-r30-line) !important;
  border-radius:6px !important;
  background:#fff !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-drop {
  width:150px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-drop img {
  width:150px !important;
  height:184px !important;
  border-radius:6px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-title {
  color:var(--shell-r30-navy) !important;
  font-size:22px !important;
  line-height:1.3 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-actions {
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
  gap:8px !important;
  min-width:190px !important;
}

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-module-nav {
  display:flex !important;
  gap:6px !important;
  overflow-x:auto !important;
  padding:4px !important;
  border:1px solid var(--shell-r30-line) !important;
  border-radius:6px !important;
  background:#fff !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-module-nav-item {
  flex:0 0 auto !important;
  min-height:34px !important;
  padding:0 12px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  color:var(--shell-content-muted) !important;
  background:transparent !important;
  font-size:11px !important;
  font-weight:700 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-module-nav-item.is-active {
  color:var(--shell-r30-coral) !important;
  background:#fff1f0 !important;
  border-color:#ffd1cc !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-module {
  margin:0 !important;
  border:1px solid var(--shell-r30-line) !important;
  border-radius:6px !important;
  background:#fff !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-module-head {
  display:flex !important;
  align-items:flex-start !important;
  gap:10px !important;
  padding:12px 16px !important;
  background:#f7f9fc !important;
  border-bottom:1px solid var(--shell-r30-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-module-index {
  display:grid !important;
  width:28px !important;
  height:28px !important;
  place-items:center !important;
  flex:0 0 28px !important;
  border-radius:50% !important;
  color:#fff !important;
  background:var(--shell-r30-coral) !important;
  font-size:11px !important;
  font-weight:800 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-module-content {
  padding:14px 16px !important;
  background:#fff !important;
}

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .sku-grid {
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr)) !important;
  gap:8px !important;
  padding:10px !important;
  border:1px solid var(--shell-r30-line) !important;
  border-radius:6px !important;
  background:#f7f9fc !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .sku-chip {
  display:grid !important;
  gap:4px !important;
  min-width:0 !important;
  min-height:58px !important;
  padding:10px !important;
  border:1px solid #dce5ef !important;
  border-radius:5px !important;
  background:#fff !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .sku-chip strong { color:var(--shell-r30-navy) !important; font-size:12px !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .sku-chip small { color:var(--shell-content-muted) !important; font-size:10px !important; }

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .ledger-workbench-layout {
  grid-template-columns:minmax(0,1fr) 320px !important;
  gap:12px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .ledger-inspector {
  border:1px solid var(--shell-r30-line) !important;
  border-radius:6px !important;
  background:#fff !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .ledger-inspector-head,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .ledger-inspector-actions,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .ledger-inspector-tabs {
  background:#fff !important;
  border-color:var(--shell-r30-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .ledger-inspector-tabs button.active {
  color:var(--shell-r30-coral) !important;
  border-bottom-color:var(--shell-r30-coral) !important;
}

@media (max-width:900px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top { grid-template-columns:112px minmax(0,1fr) !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-drop,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-drop img { width:112px !important; height:144px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-actions { grid-column:1/-1 !important; justify-content:flex-start !important; min-width:0 !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .ledger-workbench-layout { grid-template-columns:minmax(0,1fr) !important; }
}
@media (max-width:560px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell { width:calc(100% - 16px) !important; max-height:calc(100% - 16px) !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .details { padding:8px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top { grid-template-columns:80px minmax(0,1fr) !important; gap:10px !important; padding:10px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-drop,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-drop img { width:80px !important; height:104px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-title { font-size:16px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .sku-grid { grid-template-columns:1fr 1fr !important; }
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(button.primary,.btn-primary,.button-primary,.danger-button,.destructive-button) :is(span,strong) {
  color:inherit !important;
}

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(
  .sku-grid,.sku-chip,.pattern-progress,.pattern-progress-section,.pattern-requirement-section,
  .pattern-timeline,.detail-module,.detail-module-head,.detail-module-content,.detail-focus-section,
  .detail-module-actions,.detail-module-contract-actions,.fields,.field,.detail-more-fields summary,
  .dashboard-module-card,.dashboard-module-head,.dashboard-module-row,.dashboard-chart-empty,
  .empty-state,.permission-empty,.detail-fields-empty,.operation-data-note,.finance-invoice-preview,
  .order-product-summary,.schedule-product-option,.order-product-result,.hr-document-empty,
  .hr-role-mapping-empty,.form-footer,.table-wrap,.product-table,.product-detail-shell
) {
  color:var(--shell-content-ink) !important;
  background:var(--shell-content-surface) !important;
  border-color:var(--shell-content-line) !important;
  box-shadow:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(
  .detail-module-head,.dashboard-module-head,.dialog-head,.form-footer
) {
  background:var(--shell-content-subtle) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.fields,.sku-grid) {
  background:#f8fafc !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(
  .sku-chip strong,.sku-chip b,.pattern-progress-head strong,.pattern-progress-head b,
  .pattern-timeline strong,.detail-module-actions-head strong,.detail-module-contract-actions strong
) {
  color:var(--shell-content-ink) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.pattern-progress-head,.pattern-progress-meta,.pattern-progress-next,.pattern-timeline,.pattern-timeline small) {
  color:var(--shell-content-muted) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.pattern-progress-track,.pattern-timeline::before,.pattern-timeline::after) {
  background:var(--shell-content-line) !important;
  border-color:var(--shell-content-line) !important;
}

/* Light semantic surfaces retain meaning without sacrificing contrast. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.inline-success,.status-tag.success,.tag.green,.state-success,.pattern-progress-mode.internal) {
  color:#176d5f !important;
  background:var(--shell-content-success-bg) !important;
  border-color:#9bd6c8 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.inline-warning,.status-tag.warning,.tag.orange,.state-warning,.pattern-progress-mode.external) {
  color:#8a5a00 !important;
  background:var(--shell-content-warning-bg) !important;
  border-color:#e8c77f !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.inline-error,.status-tag.error,.tag.red,.state-error,.return-notice) {
  color:#b42318 !important;
  background:var(--shell-content-danger-bg) !important;
  border-color:#efb5ae !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.inline-info,.status-tag.info,.tag.blue,.state-info) {
  color:#175cd3 !important;
  background:var(--shell-content-info-bg) !important;
  border-color:#a9c7f5 !important;
}

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(input,select,textarea,.field input,.field select,.field textarea) {
  color:var(--shell-content-ink) !important;
  background:#fff !important;
  border-color:#c8d2de !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(input,select,textarea)::placeholder {
  color:var(--shell-content-faint) !important;
  opacity:1 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.product-table th,.data-table th) {
  color:var(--shell-content-ink) !important;
  background:#f3f4f6 !important;
  border-color:var(--shell-content-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.product-table td,.data-table td) {
  color:var(--shell-content-ink) !important;
  background:#fff !important;
  border-color:var(--shell-content-line) !important;
}

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog,.dialog-inner) {
  color:var(--shell-content-ink) !important;
  background:var(--shell-content-surface) !important;
  border-color:var(--shell-content-line) !important;
  box-shadow:0 18px 48px rgba(23,50,77,.16) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog,.dialog-inner) :is(h1,h2,h3,h4,h5,h6,p,label,small,span,strong,td,th,legend) {
  color:var(--shell-content-ink) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog,.dialog-inner) :is(.muted,.subtle,.helper-text,.field-help) {
  color:var(--shell-content-muted) !important;
}

/* Authenticated content-surface theme contract · 2026-09-01 r28
 * Legacy visual layers still contain dark !important declarations for detail
 * modules, progress timelines, forms, tables and empty states. This final,
 * scoped layer normalizes user-visible workspace content without touching the
 * intentional graphite navigation rail or the login surface. State classes
 * keep their semantic success/warning/error colors on readable light tints.
 */
html:has(body.workspace-mode) {
  color-scheme:light !important;
  background:var(--shell-canvas) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page {
  color-scheme:light !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.detail-module,.detail-module-head,.detail-module-content,.detail-focus-section,.detail-module-actions,.fields,.field,.sku-grid,.sku-chip,.detail-more-fields summary,.timeline,.pattern-timeline,.pattern-progress,.pattern-requirement-preview,.revision-history-preview,.revision-opinion-item,.styling-output-section,.styling-output-preview,.model-image-inline-empty,.model-image-output-empty,.model-scene-reference,.model-reference-slot,.consent-check,.dashboard-module-card,.dashboard-module-head,.dashboard-module-row,.dashboard-chart-empty,.empty-state,.permission-empty,.detail-fields-empty,.role-banner,.schedule-hero,.privacy-notice,.operation-data-note,.finance-invoice-preview,.order-product-summary) {
  color:var(--shell-ink) !important;
  background:var(--shell-surface) !important;
  border-color:var(--shell-line) !important;
  box-shadow:none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.detail-module-head,.dashboard-module-head) {
  background:#f7f8f9 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.detail-module-content,.detail-focus-section,.fields,.field,.timeline,.dashboard-module-row) {
  background:#fff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.detail-module-head h3,.detail-module-head p,.detail-module-content,.field label,.field strong,.sku-chip,.pattern-progress-head,.pattern-progress-head strong,.pattern-timeline strong,.dashboard-module-name,.dashboard-module-card-head strong,.empty-state strong,.permission-empty strong,.detail-fields-empty strong) {
  color:var(--shell-ink) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.detail-module-head p,.field label,.pattern-progress-meta,.pattern-progress-next,.pattern-timeline small,.detail-fields-empty,.empty-state,.permission-empty,.dashboard-module-card-head span,.dashboard-module-name span) {
  color:var(--shell-muted) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.detail-module-nav,.detail-module-nav-item) {
  color:var(--shell-muted) !important;
  background:#f7f8f9 !important;
  border-color:var(--shell-line-strong) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .detail-module-nav-item:is(:hover,.is-active) {
  color:var(--shell-ink) !important;
  background:#fff4f2 !important;
  border-color:#e2a39d !important;
  box-shadow:inset 0 -2px 0 var(--ledger-red) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.detail-module-index,.pattern-progress-head b,.pattern-progress-next span) {
  color:var(--ledger-red-dark) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.detail-module-index,.pattern-progress-mode) {
  background:#fff1f0 !important;
  border-color:#efc0ba !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .pattern-progress-track {
  background:#eceef1 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .pattern-progress-track i,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .module-progress-bar i {
  background:var(--ledger-blue) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .detail-module-actions {
  color:var(--shell-ink) !important;
  background:#f3faf6 !important;
  border-color:#c7dfd1 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .module-progress-bar {
  background:#eceef1 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .pattern-progress-mode.external,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .detail-module-contract-actions,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .inline-warning,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .provider-notice {
  color:var(--ledger-amber) !important;
  background:#fff8eb !important;
  border-color:#efd39b !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.revision-opinion-item.unread,.return-notice,.contract-summary.failed,.hr-import-errors) {
  color:var(--ledger-red-dark) !important;
  background:#fff5f4 !important;
  border-color:#efc0ba !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.contract-summary.ready,.inline-success,.hr-import-success) {
  color:var(--ledger-green) !important;
  background:#effaf4 !important;
  border-color:#b9dfc9 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.product-table,.data-table,.order-line-table,.hr-table) {
  color:var(--shell-ink) !important;
  background:#fff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.product-table,.data-table,.order-line-table,.hr-table) th {
  color:#4b535c !important;
  background:#f3f4f6 !important;
  border-color:var(--shell-line) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.product-table,.data-table,.order-line-table,.hr-table) td {
  color:#33383e !important;
  background:#fff !important;
  border-color:var(--shell-line) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(input,select,textarea,.field input,.field select,.field textarea,.dialog input,.dialog select,.dialog textarea) {
  color:var(--shell-ink) !important;
  background:#fff !important;
  border-color:var(--shell-line-strong) !important;
  color-scheme:light !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(input,textarea)::placeholder {
  color:#8a9199 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.dialog,.dialog-inner),
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog,.dialog-inner) {
  color:var(--shell-ink) !important;
  background:#fff !important;
  border-color:var(--shell-line-strong) !important;
  color-scheme:light !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog-head,.form-footer,.dialog .detail-module-head,.dialog .history-head) {
  color:var(--shell-ink) !important;
  background:#f7f8f9 !important;
  border-color:var(--shell-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .dialog :is(.pattern-progress,.detail-module,.detail-module-content,.fields,.field,.pattern-timeline,.empty-state,.permission-empty) {
  color:var(--shell-ink) !important;
  background:#fff !important;
  border-color:var(--shell-line) !important;
}

@media (prefers-reduced-motion:reduce) {
  body.workspace-mode .sidebar :is(.nav-item,.nav-group-trigger,.nav-group-chevron,.nav-group-menu) { transition:none !important; }
}

/* Specificity bridge for the frozen legacy layers.
 * ui-system-final.css still contains historical :has() selectors whose
 * specificity is intentionally higher than the base contract above. Keep
 * this small, state-scoped bridge here so the r26 dimensions actually win;
 * new component rules must continue to live in their own scoped layers. */
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode),
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode)[data-sidebar-collapsed="false"] {
  display:grid !important;
  grid-template-columns:var(--shell-sidebar-width) minmax(0,1fr) !important;
  min-height:100vh !important;
  background:var(--shell-canvas) !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode)[data-sidebar-collapsed="true"] {
  grid-template-columns:0 minmax(0,1fr) !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar {
  width:var(--shell-sidebar-width) !important;
  min-width:var(--shell-sidebar-width) !important;
  background:var(--shell-rail) !important;
  border-right:1px solid #343a42 !important;
  box-shadow:none !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace {
  min-width:0 !important;
  overflow-x:hidden !important;
  background:var(--shell-canvas) !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar {
  min-height:var(--shell-topbar-height) !important;
  height:var(--shell-topbar-height) !important;
  padding:0 24px !important;
  background:var(--shell-surface) !important;
  border-bottom:1px solid var(--shell-line) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher {
  min-height:var(--shell-switcher-height) !important;
  height:var(--shell-switcher-height) !important;
  padding:2px 24px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  background:var(--shell-surface) !important;
  border-bottom:1px solid var(--shell-line) !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace-tabs {
  min-height:var(--shell-tabs-height) !important;
  height:var(--shell-tabs-height) !important;
  padding:3px 24px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  background:var(--shell-surface) !important;
  border-bottom:1px solid var(--shell-line) !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .page {
  width:min(calc(100% - (var(--shell-page-gutter) * 2)),var(--shell-page-max-width)) !important;
  max-width:100% !important;
  margin:0 auto !important;
  padding:24px 0 48px !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav {
  width:100% !important;
  min-width:0 !important;
  padding:12px 10px 16px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(button.nav-item,a.nav-item,button.nav-group-trigger) {
  width:100% !important;
  min-width:0 !important;
  min-height:38px !important;
  padding:8px 10px !important;
  border-radius:6px !important;
  background:transparent !important;
  color:var(--shell-rail-ink) !important;
  font-size:13px !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger {
  min-height:40px !important;
  margin:4px 0 0 !important;
  font-size:12px !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger[aria-expanded="true"] .nav-group-chevron {
  transform:rotate(90deg) !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-menu {
  display:grid !important;
  max-height:640px !important;
  margin:0 0 4px 11px !important;
  padding:4px 0 4px 13px !important;
  overflow:hidden !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group.is-collapsed .nav-group-menu {
  display:grid !important;
  max-height:0 !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

@media (min-width:761px) and (max-width:1100px) {
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) {
    grid-template-columns:var(--shell-sidebar-narrow) minmax(0,1fr) !important;
  }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar {
    width:var(--shell-sidebar-narrow) !important;
    min-width:var(--shell-sidebar-narrow) !important;
  }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar {
    min-height:58px !important;
    height:58px !important;
    padding-inline:16px !important;
  }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher,
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace-tabs { padding-inline:16px !important; }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .page {
    width:calc(100% - 32px) !important;
    padding-block:16px 36px !important;
  }
}

/* Terminal content-surface normalization · 2026-09-01 r28
 * This is intentionally the last block in the canonical shell file so the
 * historical dark theme declarations cannot win in authenticated content. */
html:has(body.workspace-mode) { color-scheme:light !important; background:var(--shell-canvas) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.pattern-progress,.pattern-requirement-preview,.revision-history-preview,.revision-opinion-item,.styling-output-section,.styling-output-preview,.model-image-inline-empty,.model-image-output-empty,.model-scene-reference,.model-reference-slot,.consent-check,.detail-module,.detail-module-head,.detail-module-content,.detail-focus-section,.detail-module-actions,.fields,.field,.pattern-timeline,.sku-chip,.detail-more-fields summary,.timeline,.dashboard-module-card,.dashboard-module-head,.dashboard-module-row,.dashboard-chart-empty,.empty-state,.permission-empty,.detail-fields-empty) {
  color:var(--shell-ink) !important;
  background:#fff !important;
  border-color:var(--shell-line) !important;
  box-shadow:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.detail-module-head,.dashboard-module-head) { background:#f7f8f9 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.detail-module-head h3,.detail-module-head p,.detail-module-content,.field label,.field strong,.sku-chip,.pattern-progress-head,.pattern-progress-head strong,.pattern-timeline strong,.dashboard-module-name,.dashboard-module-card-head strong,.empty-state strong,.permission-empty strong,.detail-fields-empty strong) { color:var(--shell-ink) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.detail-module-head p,.field label,.pattern-progress-meta,.pattern-progress-next,.pattern-timeline small,.detail-fields-empty,.empty-state,.permission-empty,.dashboard-module-card-head span,.dashboard-module-name span) { color:var(--shell-muted) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.detail-module-nav,.detail-module-nav-item) { color:var(--shell-muted) !important; background:#f7f8f9 !important; border-color:var(--shell-line-strong) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .detail-module-nav-item:is(:hover,.is-active) { color:var(--shell-ink) !important; background:#fff4f2 !important; border-color:#e2a39d !important; box-shadow:inset 0 -2px 0 var(--ledger-red) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.detail-module-index,.pattern-progress-head b,.pattern-progress-next span) { color:var(--ledger-red-dark) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.detail-module-index,.pattern-progress-mode) { background:#fff1f0 !important; border-color:#efc0ba !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .pattern-progress-track { background:#eceef1 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.pattern-progress-track i,.module-progress-bar i) { background:var(--ledger-blue) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .module-progress-bar { background:#eceef1 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .detail-module-actions { color:var(--shell-ink) !important; background:#f3faf6 !important; border-color:#c7dfd1 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.pattern-progress-mode.external,.detail-module-contract-actions,.inline-warning,.provider-notice) { color:var(--ledger-amber) !important; background:#fff8eb !important; border-color:#efd39b !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.revision-opinion-item.unread,.return-notice,.contract-summary.failed,.hr-import-errors) { color:var(--ledger-red-dark) !important; background:#fff5f4 !important; border-color:#efc0ba !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.contract-summary.ready,.inline-success,.hr-import-success) { color:var(--ledger-green) !important; background:#effaf4 !important; border-color:#b9dfc9 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.product-table,.data-table,.order-line-table,.hr-table) { color:var(--shell-ink) !important; background:#fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.product-table,.data-table,.order-line-table,.hr-table) th { color:#4b535c !important; background:#f3f4f6 !important; border-color:var(--shell-line) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.product-table,.data-table,.order-line-table,.hr-table) td { color:#33383e !important; background:#fff !important; border-color:var(--shell-line) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(input,select,textarea,.field input,.field select,.field textarea) { color:var(--shell-ink) !important; background:#fff !important; border-color:var(--shell-line-strong) !important; color-scheme:light !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(input,textarea)::placeholder { color:#8a9199 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog,.dialog-inner) { color:var(--shell-ink) !important; background:#fff !important; border-color:var(--shell-line-strong) !important; color-scheme:light !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog-head,.form-footer,.dialog .detail-module-head,.dialog .history-head) { color:var(--shell-ink) !important; background:#f7f8f9 !important; border-color:var(--shell-line) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .dialog :is(.pattern-progress,.detail-module,.detail-module-content,.detail-module-actions,.fields,.field,.pattern-timeline,.empty-state,.permission-empty) { color:var(--shell-ink) !important; background:#fff !important; border-color:var(--shell-line) !important; }

/* The shell marker raises only the root contract above legacy :has() rules.
 * It is deliberately an attribute on the existing shell, not a new runtime
 * state, so lifecycle and business event handling remain unchanged. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode),
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode)[data-sidebar-collapsed="false"] {
  grid-template-columns:var(--shell-sidebar-width) minmax(0,1fr) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode)[data-sidebar-collapsed="true"] {
  grid-template-columns:0 minmax(0,1fr) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar {
  width:var(--shell-sidebar-width) !important;
  min-width:var(--shell-sidebar-width) !important;
}
@media (min-width:761px) and (max-width:1100px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) {
    grid-template-columns:var(--shell-sidebar-narrow) minmax(0,1fr) !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar {
    width:var(--shell-sidebar-narrow) !important;
    min-width:var(--shell-sidebar-narrow) !important;
  }
}
@media (max-width:760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) {
    display:block !important;
    grid-template-columns:none !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar {
    width:100% !important;
    min-width:0 !important;
  }
}

/* Desktop content-width contract · 2026-09-01 r27
 *
 * The shell grows in readable steps instead of stopping at the legacy 1380px
 * cap or stretching every page edge-to-edge. Dashboard grids consume the
 * additional width; dense tables and dialogs retain their own boundaries.
 */
@media (min-width:1101px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"] {
    --shell-page-max-width:var(--shell-page-max-width-collapsed);
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .page {
    width:min(calc(100% - (var(--shell-page-gutter) * 2)),var(--shell-page-max-width)) !important;
    max-width:100% !important;
    margin-inline:auto !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.dashboard-hero,.dashboard-kpi-grid,.dashboard-sales-panel,.dashboard-intelligence,.dashboard-overview-grid,.dashboard-detail-grid,.dashboard-modules,.dashboard-lower) {
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .dashboard-kpi-grid {
    grid-template-columns:repeat(7,minmax(0,1fr)) !important;
    gap:clamp(10px,0.8vw,18px) !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .dashboard-sales-grid,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .dashboard-intelligence-grid {
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:clamp(10px,0.8vw,18px) !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .dashboard-overview-grid,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .dashboard-detail-grid {
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:clamp(14px,1vw,24px) !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .dashboard-module-grid {
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:clamp(12px,1vw,20px) !important;
    min-width:0 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .dashboard-module-card {
    min-width:0 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .dashboard-lower {
    grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr) !important;
    gap:clamp(14px,1vw,24px) !important;
  }
}

@media (min-width:2560px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .dashboard-module-grid {
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
}

@media (max-width:760px) {
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) {
    display:block !important;
    min-height:100vh !important;
  }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar {
    width:100% !important;
    min-width:0 !important;
    height:62px !important;
    min-height:62px !important;
    border-top:1px solid #343a42 !important;
    border-right:0 !important;
  }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav {
    height:62px !important;
    padding:5px 8px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group,
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-menu { display:contents !important; }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar .nav-group-trigger { display:none !important; }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .sidebar :is(.nav-item,.nav-group-menu .nav-item) {
    flex:0 0 74px !important;
    min-height:52px !important;
    padding:4px 5px !important;
    font-size:10px !important;
  }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .topbar {
    min-height:56px !important;
    height:auto !important;
    padding:7px 12px !important;
  }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workbench-switcher,
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .workspace-tabs {
    min-height:34px !important;
    height:34px !important;
    padding-inline:10px !important;
  }
  body.workspace-mode:has(.app-shell:not(.auth-mode)) .app-shell:not(.auth-mode) .page {
    width:auto !important;
    padding:12px 10px 76px !important;
  }
}

/* r29 final bridge: this must remain the last authenticated content rule. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page {
  color:var(--shell-content-ink) !important;
  background:var(--shell-canvas) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,legend,caption,td,th,summary,small,span,strong,em) {
  color:var(--shell-content-ink) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.muted,.subtle,.secondary,.helper-text,.field-help,.meta,.pattern-progress-meta,.pattern-progress-next,.sku-chip small,.operation-data-note,.form-footer small) {
  color:var(--shell-content-muted) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.sku-grid,.sku-chip,.pattern-progress,.pattern-progress-section,.pattern-requirement-section,.pattern-timeline,.detail-module,.detail-module-head,.detail-module-content,.detail-focus-section,.detail-module-actions,.detail-module-contract-actions,.fields,.field,.empty-state,.permission-empty,.detail-fields-empty,.dashboard-module-card,.dashboard-module-head,.dashboard-module-row,.table-wrap,.product-table,.product-detail-shell,.form-footer) {
  color:var(--shell-content-ink) !important;
  background:var(--shell-content-surface) !important;
  border-color:var(--shell-content-line) !important;
  box-shadow:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(input,select,textarea) {
  color:var(--shell-content-ink) !important;
  background:#fff !important;
  border-color:#c8d2de !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(input,select,textarea)::placeholder {
  color:var(--shell-content-faint) !important;
  opacity:1 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog,.dialog-inner) {
  color:var(--shell-content-ink) !important;
  background:var(--shell-content-surface) !important;
  border-color:var(--shell-content-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(button.primary,.btn-primary,.button-primary,.danger-button,.destructive-button) {
  color:#fff !important;
}

/* r33 terminal override: physically final cascade for redundant workbench strip. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workbench-switcher {
  display:none !important;
  visibility:hidden !important;
  position:absolute !important;
  inset:auto !important;
  width:0 !important;
  min-width:0 !important;
  max-width:0 !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
  flex:none !important;
  flex-basis:0 !important;
  grid-area:none !important;
  scrollbar-width:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workbenchSwitcher::-webkit-scrollbar { display:none !important; }
/* 2026-09-02 contract-list-mobile=20260902-r1
 * Preserve the eight-column contract record on narrow screens. The table
 * scrolls inside its own viewport instead of squeezing cells into overlap. */
@media (max-width:760px) {
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .table-wrap {
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
  }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table {
    width:940px !important;
    min-width:940px !important;
    table-layout:fixed !important;
  }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table th,
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td {
    min-width:0 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
  }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table th:first-child,
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td:first-child { width:160px !important; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table th:last-child,
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td:last-child { width:190px !important; }

  /* Replace the wide desktop grid with readable stacked records on phones. */
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table {
    width:100% !important;
    min-width:0 !important;
    table-layout:auto !important;
  }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table thead { display:none !important; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table tbody,
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table tr,
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td { display:block !important; width:100% !important; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table tr {
    padding:12px 14px !important;
    border-bottom:1px solid var(--workspace-line) !important;
  }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td {
    display:grid !important;
    grid-template-columns:92px minmax(0,1fr) !important;
    gap:8px !important;
    align-items:start !important;
    padding:6px 0 !important;
    border:0 !important;
  }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td::before {
    color:var(--workspace-muted) !important;
    font-size:11px !important;
    line-height:1.4 !important;
  }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td:nth-child(1)::before { content:"款号 / 款式"; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td:nth-child(2)::before { content:"合同编号"; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td:nth-child(3)::before { content:"达人 / 品牌"; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td:nth-child(4)::before { content:"供应商"; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td:nth-child(5)::before { content:"订单"; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td:nth-child(6)::before { content:"状态"; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td:nth-child(7)::before { content:"打印记录"; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-table td:nth-child(8)::before { content:"操作"; }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-style-thumb {
    display:block !important;
    width:82px !important;
    height:108px !important;
    margin-top:6px !important;
    border:1px solid var(--workspace-line-strong) !important;
    border-radius:4px !important;
    background:#f8f9fa !important;
    object-fit:cover !important;
    cursor:zoom-in !important;
  }
  body.workspace-mode .app-shell:not(.auth-mode) #page .contract-list-panel .contract-style-cell {
    display:grid !important;
    justify-items:start !important;
    gap:3px !important;
    min-width:0 !important;
  }
}

/* workspace-tab-polish=20260902-r69 · image-to-front=gpt-image-2
 * Recent modules are one-piece navigation items: the close affordance stays
 * inside the tab, while the active module is identified by a quiet coral rule.
 * This terminal selector intentionally outranks the legacy shell layers above
 * without changing the existing tab DOM or click/close behavior. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) {
  display:flex !important;
  align-items:stretch !important;
  gap:4px !important;
  min-height:42px !important;
  height:42px !important;
  padding:4px 24px 0 !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  background:#f4f5f7 !important;
  border-bottom:1px solid #dfe2e6 !important;
  scrollbar-width:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden])::-webkit-scrollbar {
  display:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab:first-child {
  display:flex !important;
  align-items:stretch !important;
  flex:0 0 auto !important;
  min-width:0 !important;
  min-height:38px !important;
  height:38px !important;
  max-width:220px !important;
  padding:0 !important;
  border:1px solid #dfe2e6 !important;
  border-bottom-color:#cfd5db !important;
  border-radius:6px 6px 0 0 !important;
  background:#fff !important;
  color:#52606d !important;
  box-shadow:none !important;
  overflow:hidden !important;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab:hover {
  border-color:#c8d0d8 !important;
  background:#fbfcfd !important;
  color:#17324d !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab.active {
  border-color:#c8d4df !important;
  border-bottom-color:#e5483f !important;
  background:#fff !important;
  color:#17324d !important;
  box-shadow:inset 0 -2px 0 #e5483f !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab-main {
  display:flex !important;
  align-items:center !important;
  flex:1 1 auto !important;
  min-width:0 !important;
  max-width:190px !important;
  height:100% !important;
  padding:0 12px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:inherit !important;
  font-size:13px !important;
  font-weight:650 !important;
  line-height:1 !important;
  text-decoration:none !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab-main:focus-visible {
  outline:2px solid #7ba9d6 !important;
  outline-offset:-4px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab-close {
  display:grid !important;
  place-items:center !important;
  flex:0 0 26px !important;
  width:26px !important;
  min-width:26px !important;
  height:26px !important;
  min-height:26px !important;
  margin:5px 5px 0 0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:4px !important;
  background:transparent !important;
  color:#7d8792 !important;
  font-size:18px !important;
  line-height:1 !important;
  text-decoration:none !important;
  transition:background-color .16s ease,color .16s ease !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab-close:hover,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab-close:focus-visible {
  color:#b42318 !important;
  background:#fff1f0 !important;
  outline:0 !important;
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) {
    min-height:40px !important;
    height:40px !important;
    padding:3px 10px 0 !important;
    gap:3px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab:first-child {
    min-height:36px !important;
    height:36px !important;
    max-width:174px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab-main {
    max-width:140px !important;
    padding:0 10px !important;
    font-size:12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab-close {
    flex-basis:24px !important;
    width:24px !important;
    min-width:24px !important;
    height:24px !important;
    min-height:24px !important;
    margin:5px 4px 0 0 !important;
    font-size:17px !important;
  }
}

/* employee-account-action-contrast=20260902-r70 · image-to-front=gpt-image-2
   Keep compact primary actions visibly actionable after the broad compact
   button normalization rules run. This is a presentation contract only: the
   existing account-opening permission and event binding remain unchanged. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page button.primary.compact-button {
  min-height:32px !important;
  min-width:94px !important;
  padding:0 12px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  white-space:nowrap !important;
  color:#fff !important;
  background:#e5483f !important;
  border:1px solid #e5483f !important;
  border-radius:4px !important;
  box-shadow:none !important;
  font-weight:650 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page button.primary.compact-button:hover,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page button.primary.compact-button:focus-visible {
  color:#fff !important;
  background:#b9231b !important;
  border-color:#b9231b !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page button.primary.compact-button.account-open-button {
  min-width:94px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-members-table td:last-child {
  min-width:190px !important;
  overflow:visible !important;
  white-space:normal !important;
  vertical-align:middle !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-members-table td:last-child > button.compact-button {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:32px !important;
  min-width:82px !important;
  margin:2px 4px 2px 0 !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-members-table td:last-child > button.primary.compact-button {
  min-width:94px !important;
}

/* role-permission-layout=20260903-r1
 * The generic dialog contract makes every input width:100%. That is correct
 * for text fields, but it turns permission checkboxes into flex/grid items
 * that consume the entire card and collapse the copy column. Keep this
 * permission surface intrinsic so labels stay readable and cards do not
 * stretch to the dialog height. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog {
  min-height:0 !important;
  height:auto !important;
  max-height:inherit !important;
  overflow:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog > .form,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog > .form {
  min-height:0 !important;
  height:auto !important;
  align-content:start !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-groups,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-groups {
  display:grid !important;
  grid-auto-rows:max-content !important;
  align-content:start !important;
  align-items:start !important;
  min-height:0 !important;
  height:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-group,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-group {
  display:block !important;
  align-self:start !important;
  min-height:0 !important;
  height:auto !important;
  overflow:hidden !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-grid,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-grid {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  grid-auto-rows:max-content !important;
  align-content:start !important;
  align-items:start !important;
  justify-items:stretch !important;
  min-height:0 !important;
  height:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-option,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-option {
  display:grid !important;
  grid-template-columns:18px minmax(0,1fr) !important;
  align-items:start !important;
  align-self:start !important;
  justify-content:initial !important;
  width:100% !important;
  min-width:0 !important;
  min-height:58px !important;
  height:auto !important;
  box-sizing:border-box !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-option input[type="checkbox"],
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-option input[type="checkbox"],
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-select-all input[type="checkbox"],
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-select-all input[type="checkbox"] {
  width:18px !important;
  min-width:18px !important;
  max-width:18px !important;
  height:18px !important;
  min-height:18px !important;
  max-height:18px !important;
  margin:2px 0 0 !important;
  padding:0 !important;
  flex:none !important;
  accent-color:#175cd3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-select-all input[type="checkbox"],
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-select-all input[type="checkbox"] {
  margin-top:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-option > span,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-option > span {
  display:grid !important;
  align-content:start !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  overflow:hidden !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-option > span :is(strong,small),
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-option > span :is(strong,small) {
  display:block !important;
  width:auto !important;
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-group-head,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-group-head {
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-group-head > div:first-child,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-group-head > div:first-child {
  min-width:0 !important;
  flex:1 1 auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-group-head :is(h4,span),
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-group-head :is(h4,span) {
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-toolbar,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-toolbar {
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:flex-start !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-toolbar > div:first-child,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-toolbar > div:first-child {
  min-width:0 !important;
  flex:1 1 auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-toolbar > div:last-child,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-toolbar > div:last-child {
  min-width:0 !important;
  flex:0 1 auto !important;
  flex-wrap:wrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-search,
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-search {
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog > .dialog-inner.role-dialog .permission-search input[type="search"],
body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-search input[type="search"] {
  width:210px !important;
  min-width:0 !important;
  max-width:100% !important;
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    #createDialog > .dialog-inner.role-dialog .permission-grid,
  body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-grid {
    grid-template-columns:1fr !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    #createDialog > .dialog-inner.role-dialog .permission-group-head,
  body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-group-head {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:9px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    #createDialog > .dialog-inner.role-dialog .permission-select-all,
  body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-select-all {
    justify-self:start !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    #createDialog > .dialog-inner.role-dialog .permission-toolbar > div:last-child,
  body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-toolbar > div:last-child {
    width:100% !important;
    flex:1 1 100% !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    #createDialog > .dialog-inner.role-dialog .permission-search,
  body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-search {
    flex:1 1 100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    #createDialog > .dialog-inner.role-dialog .permission-search input[type="search"],
  body:has(.app-shell:not(.auth-mode)) #createDialog > .dialog-inner.role-dialog .permission-search input[type="search"] {
    width:100% !important;
  }
}

/* employee-workspace-polish-final=20260903-r2
 * Terminal overrides for the employee workspace. Keep the directory quiet
 * and list-like; keep the table compact without allowing action labels to
 * collapse into the employee, phone, or role columns. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-grid {
  grid-template-columns:minmax(198px,224px) minmax(0,1fr) !important;
  gap:10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail {
  border-radius:6px !important;
  background:#fbfdfc !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-list {
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:1px !important;
  padding:5px 7px 7px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-filter {
  min-height:46px !important;
  margin:0 !important;
  padding:7px 9px !important;
  border:0 !important;
  border-radius:5px !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-filter:hover {
  background:#f2f8f5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-directory-rail .org-department-filter.is-selected {
  margin:0 !important;
  background:#eaf7f1 !important;
  box-shadow:inset 3px 0 0 #2b8a78 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-panel .panel-head {
  min-height:54px !important;
  padding:9px 14px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-filter-bar {
  min-height:42px !important;
  padding:5px 14px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table {
  min-width:0 !important;
  width:100% !important;
  table-layout:fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td {
  padding:8px 10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(1) { width:20% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(2) { width:12% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(3) { width:13% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(4) { width:20% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(5) { width:12% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table th:nth-child(6) { width:23% !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child {
  min-width:222px !important;
  width:23% !important;
  overflow:visible !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child > button.compact-button {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:0 !important;
  min-height:30px !important;
  margin:1px 3px 1px 0 !important;
  padding:0 7px !important;
  font-size:12px !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child > button.primary.compact-button.account-open-button {
  min-width:94px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child > .account-admin-protected {
  display:inline-flex !important;
  max-width:100% !important;
  white-space:normal !important;
  line-height:1.35 !important;
}

@media (max-width:1100px) and (min-width:761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-grid {
    grid-template-columns:190px minmax(0,1fr) !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child {
    min-width:204px !important;
  }
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-grid {
    gap:8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child {
    min-width:0 !important;
    white-space:normal !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-workspace-main .org-members-table td:last-child > button.compact-button {
    margin:1px 3px 1px 0 !important;
  }
}
/* topbar-polish=20260903-r3
 * Keep the authenticated header as a navigation toolbar, not a row of
 * equally weighted form cells. Search, tenant context, identity, and exit
 * remain distinct while preserving visible focus and touch-sized targets. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar {
  gap:16px !important;
  padding-inline:clamp(16px,2vw,30px) !important;
  background:#fff !important;
  border-bottom:1px solid #e7eaee !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar-heading {
  flex:0 1 auto !important;
  min-width:150px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:7px !important;
  min-width:0 !important;
  flex:1 1 auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search {
  flex:0 1 clamp(220px,27vw,340px) !important;
  width:clamp(220px,27vw,340px) !important;
  min-width:180px !important;
  height:38px !important;
  gap:8px !important;
  padding:0 12px !important;
  border:1px solid #e4e9ef !important;
  border-radius:10px !important;
  background:#f7f9fb !important;
  box-shadow:inset 0 1px 1px rgba(25,46,69,.03) !important;
  transition:border-color .15s ease, background-color .15s ease, box-shadow .15s ease !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search:focus-within {
  border-color:#8fb6dd !important;
  background:#fff !important;
  box-shadow:0 0 0 3px rgba(123,169,214,.16) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search svg {
  flex:0 0 auto !important;
  width:17px !important;
  height:17px !important;
  color:#7e8a96 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search input {
  min-width:0 !important;
  height:34px !important;
  padding:0 !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  color:#17324d !important;
  font-size:13px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search input::placeholder {
  color:#8997a6 !important;
  opacity:1 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher {
  display:flex !important;
  align-items:center !important;
  flex:0 1 clamp(210px,29vw,360px) !important;
  min-width:170px !important;
  min-height:38px !important;
  border:0 !important;
  background:transparent !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher select {
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:38px !important;
  padding:0 34px 0 13px !important;
  border:1px solid #dce6f0 !important;
  border-radius:10px !important;
  background:#f2f7fc !important;
  color:#17324d !important;
  font-size:13px !important;
  font-weight:650 !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher select:hover {
  border-color:#b9cede !important;
  background:#edf5fb !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher select:focus-visible {
  border-color:#8fb6dd !important;
  box-shadow:0 0 0 3px rgba(123,169,214,.16) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu {
  position:relative !important;
  display:grid !important;
  grid-template-columns:28px minmax(0,1fr) !important;
  grid-template-rows:auto auto !important;
  column-gap:8px !important;
  align-items:center !important;
  flex:0 1 142px !important;
  min-width:106px !important;
  min-height:38px !important;
  padding:4px 10px 4px 6px !important;
  border:0 !important;
  border-radius:10px !important;
  background:#f7f9fb !important;
  color:#17324d !important;
  text-align:left !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu::before {
  content:"" !important;
  grid-row:1 / span 2 !important;
  width:28px !important;
  height:28px !important;
  border-radius:50% !important;
  background:#dcecf8 !important;
  box-shadow:inset 0 0 0 1px #c4ddeb !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu span,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu small {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu span {
  color:#17324d !important;
  font-size:13px !important;
  font-weight:650 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu small {
  color:#718396 !important;
  font-size:11px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu:hover {
  background:#eef5fa !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #logoutButton {
  min-width:48px !important;
  min-height:38px !important;
  padding:0 8px !important;
  border:0 !important;
  border-radius:8px !important;
  background:transparent !important;
  color:#617080 !important;
  font-size:12px !important;
  font-weight:650 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #logoutButton:hover {
  background:#f2f5f7 !important;
  color:#17324d !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .activity-button {
  position:relative !important;
  flex:0 0 38px !important;
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  min-height:38px !important;
  border:0 !important;
  border-radius:8px !important;
  background:transparent !important;
  color:#5f6f7f !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .activity-button:hover {
  background:#f2f5f7 !important;
  color:#17324d !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .activity-button svg {
  width:18px !important;
  height:18px !important;
}

@media (max-width:1100px) and (min-width:761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar {
    gap:10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search {
    flex-basis:220px !important;
    width:220px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher {
    flex-basis:220px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu {
    flex-basis:126px !important;
  }
}

@media (max-width:900px) and (min-width:761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar {
    align-items:flex-start !important;
    flex-wrap:wrap !important;
    row-gap:8px !important;
    padding-block:8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar-heading {
    width:100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions {
    width:100% !important;
    justify-content:flex-start !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search {
    flex:1 1 240px !important;
    width:auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher {
    flex:1 1 240px !important;
  }
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions {
    gap:5px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search {
    min-width:0 !important;
    height:36px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu {
    flex-basis:96px !important;
    min-width:76px !important;
    padding-right:7px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #logoutButton {
    min-width:42px !important;
    padding-inline:6px !important;
  }
}
/* topbar-polish-final=20260903-r4
 * Remove the remaining control-box silhouette. The header reads as one
 * navigation surface with a few deliberate anchors instead of a form row. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar {
  background:#fff !important;
  border-bottom:1px solid #e7eaee !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions {
  gap:13px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search {
  flex-basis:clamp(220px,27vw,340px) !important;
  width:clamp(220px,27vw,340px) !important;
  height:36px !important;
  padding:0 2px 0 1px !important;
  border:0 !important;
  border-bottom:1px solid #cfd8e2 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search:focus-within {
  border:0 !important;
  border-bottom:2px solid #7ba9d6 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search input {
  font-size:13px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher {
  flex-basis:clamp(210px,29vw,360px) !important;
  min-width:170px !important;
  min-height:36px !important;
  border:0 !important;
  background:transparent !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher select {
  height:36px !important;
  padding:0 25px 0 2px !important;
  border:0 !important;
  border-bottom:1px solid #dbe6ef !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#17324d !important;
  font-size:13px !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher select:hover {
  border:0 !important;
  border-bottom:1px solid #b7cddd !important;
  background:#f8fbfd !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher select:focus-visible {
  border:0 !important;
  border-bottom:2px solid #7ba9d6 !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu {
  flex-basis:142px !important;
  min-width:106px !important;
  min-height:36px !important;
  padding:3px 4px 3px 14px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:inset 1px 0 0 #e8edf2 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu::before {
  width:27px !important;
  height:27px !important;
  background:#dcecf8 !important;
  box-shadow:inset 0 0 0 1px #c4ddeb !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu:hover {
  background:#f7fafc !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #logoutButton {
  min-height:36px !important;
  padding:0 3px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#697887 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #logoutButton:hover {
  background:transparent !important;
  color:#17324d !important;
  text-decoration:underline !important;
  text-underline-offset:3px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .activity-button {
  flex-basis:36px !important;
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
  min-height:36px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .activity-button:hover {
  background:#f7fafc !important;
  color:#17324d !important;
}

@media (max-width:1100px) and (min-width:761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search {
    flex-basis:220px !important;
    width:220px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher {
    flex-basis:220px !important;
  }
}

@media (max-width:900px) and (min-width:761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search {
    flex-basis:240px !important;
    width:auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .tenant-switcher {
    flex-basis:240px !important;
  }
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions {
    gap:7px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions .search {
    border-bottom-color:#d7dfe7 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .user-menu {
    flex-basis:96px !important;
    min-width:76px !important;
    padding-left:8px !important;
  }
}
/* product-base-section-polish=20260903-r1
 * Keep the base-material chapter as the only main container. Label data and
 * SKU records are content groups inside it, not additional nested panels. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base {
  margin:0 !important;
  overflow:hidden !important;
  border:1px solid #d8e5e1 !important;
  border-radius:8px !important;
  background:#fff !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .detail-module-head {
  min-height:58px !important;
  padding:12px 16px !important;
  background:#f7fbfa !important;
  border-bottom:1px solid #e3ece9 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .detail-module-content {
  padding:0 18px 18px !important;
  background:#fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-section {
  margin:0 !important;
  padding:16px 0 0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-section .section-heading {
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  margin:0 !important;
  padding:0 0 12px !important;
  border-bottom:1px solid #e7eeeb !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-section .section-title {
  margin:0 0 4px !important;
  color:#17324d !important;
  font-size:16px !important;
  font-weight:760 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-section .subtle {
  color:#667b8c !important;
  font-size:12px !important;
  line-height:1.5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-section .section-actions {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:6px !important;
  flex:0 0 auto !important;
  flex-wrap:wrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-section .section-actions button {
  min-height:30px !important;
  padding:0 10px !important;
  border-radius:5px !important;
  font-size:12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-preview-grid {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;
  margin:0 !important;
  padding:14px 0 0 !important;
  border:0 !important;
  background:transparent !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-preview-grid > div {
  min-height:92px !important;
  display:grid !important;
  align-content:start !important;
  gap:5px !important;
  padding:13px 15px !important;
  border:1px solid #e0eae7 !important;
  border-radius:6px !important;
  background:#fbfdfc !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-preview-grid > div strong {
  color:#17324d !important;
  font-size:13px !important;
  font-weight:750 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-preview-grid > div span,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-preview-grid > div small {
  color:#5e7487 !important;
  font-size:12px !important;
  line-height:1.45 !important;
  overflow-wrap:anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .sku-section-heading {
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  margin:18px 0 0 !important;
  padding:17px 0 10px !important;
  border-top:1px solid #e7ecef !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .sku-section-heading .section-title {
  margin:0 0 4px !important;
  color:#17324d !important;
  font-size:16px !important;
  font-weight:760 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .sku-section-heading .subtle {
  color:#667b8c !important;
  font-size:12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .sku-section-heading button {
  min-height:30px !important;
  padding:0 10px !important;
  border-radius:5px !important;
  font-size:12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .sku-grid {
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr)) !important;
  gap:10px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .sku-grid .sku-chip {
  min-height:68px !important;
  padding:11px 13px !important;
  border:1px solid #e0e7ee !important;
  border-radius:6px !important;
  background:#fff !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .sku-grid .sku-chip:hover {
  border-color:#bed2cf !important;
  background:#fbfdfc !important;
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .detail-module-content {
    padding:0 12px 14px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-section .section-heading,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .sku-section-heading {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-section .section-actions {
    justify-content:flex-start !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .label-preview-grid {
    grid-template-columns:1fr !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .sku-grid {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}



/* 2026-09-02 footer-hierarchy=r2
 * Keep legal information readable as two deliberate rows. This comes after
 * the shell grid rules so the footer no longer compresses every item into one
 * horizontal strip. */
body:has(.app-shell.auth-mode) .workspace-legal-footer,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  align-items:start !important;
  gap:9px !important;
  min-height:78px !important;
  padding:14px clamp(20px,4vw,56px) 15px !important;
}
body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-copy,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-copy {
  justify-content:flex-start !important;
  width:100% !important;
}
body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-meta,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-meta {
  justify-content:flex-start !important;
  width:100% !important;
  padding-top:8px !important;
  border-top:1px solid var(--ui-line, var(--ledger-line)) !important;
  gap:7px 18px !important;
}
body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-links,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-links {
  padding-left:18px !important;
  border-left:1px solid var(--ui-line, var(--ledger-line)) !important;
}
@media (max-width:560px) {
  body:has(.app-shell.auth-mode) .workspace-legal-footer,
  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer {
    min-height:104px !important;
    padding:13px 16px 14px !important;
  }
  body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-meta,
  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-meta {
    align-items:flex-start !important;
    flex-direction:column !important;
  }
  body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-links,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-links {
    padding-left:0 !important;
    border-left:0 !important;
  }
}

/* surface-coherence-audit-final=20260903-r1
 * Final cascade tie-breakers for the full audit. These rules intentionally
 * repeat only the high-risk surfaces so late legacy page rules cannot rebuild
 * nested frames after the shared hierarchy has been flattened. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content > :is(.label-section,.detail-focus-section,.styling-section,.model-image-section,.pattern-requirement-section,.pattern-progress-section,.revision-opinions-section,.contract-detail-section,.design-materials-section,.procurement-materials-section,.procurement-archive-section,.dealer-material-list-section,.supply-plan-panel,.operation-detail-context) {
  margin:0 !important;
  padding:18px 0 0 !important;
  border:0 !important;
  border-top:1px solid #edf1f3 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content > :first-child {
  padding-top:0 !important;
  border-top:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.procurement-material-groups,.procurement-archive-section .procurement-material-groups) {
  gap:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.procurement-material-group,.procurement-material-sources,.procurement-archive-history) {
  margin:0 !important;
  border:0 !important;
  border-top:1px solid #edf1f3 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.procurement-material-group,.procurement-material-sources,.procurement-archive-history):first-child {
  border-top:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.procurement-material-group,.procurement-material-sources,.procurement-archive-history) > .table-wrap,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell :is(.dealer-material-list-section,.design-materials-section) > .table-wrap {
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.panel,.metric,.metric-card,.summary-card) > :is(.table-wrap,.hr-table-wrap,.account-table-wrap) {
  margin:0 !important;
  border:0 !important;
  border-top:1px solid #edf1f3 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.label-preview-grid,.dashboard-module-grid,.dashboard-sales-grid,.operation-data-connectors,.role-grid,.permission-grid,.workbench-status-grid,.material-grid) {
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-heading,.panel-head,.workflow-route-head) {
  gap:12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-actions,.panel-head-actions,.procurement-list-tools,.operation-data-hero-actions) {
  gap:7px !important;
  flex-wrap:wrap !important;
  min-width:0 !important;
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.section-heading,.panel-head,.workflow-route-head) {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:9px !important;
  }
}

/* surface-coherence-audit-spacing=20260903-r1 */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .detail-module-content > .label-section {
  padding-top:16px !important;
  border-top:0 !important;
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-base .detail-module-content > .label-section {
    padding-top:14px !important;
  }
}

/* END frontend/assets/ui-shell-contract.css */

/* BEGIN frontend/assets/ui-detail-r35.css */
/* r35 image-to-front detail contract · loaded after the shell contract. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .details { color:#17324d !important; background:#f6f8fb !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .details { display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:10px !important; padding:12px !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top { display:grid !important; grid-template-columns:132px minmax(0,1fr) auto !important; gap:16px !important; padding:14px !important; border:1px solid #dce4ec !important; border-radius:7px !important; background:#fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) { width:132px !important; height:164px !important; border-radius:5px !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-title { color:#102a45 !important; font-size:21px !important; font-weight:780 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-meta { display:flex !important; flex-wrap:wrap !important; gap:5px !important; margin:8px 0 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-actions { display:flex !important; flex-wrap:wrap !important; justify-content:flex-end !important; gap:7px !important; min-width:180px !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-actions .primary { color:#fff !important; background:#e5483f !important; border-color:#e5483f !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav { display:flex !important; gap:4px !important; overflow-x:auto !important; padding:4px !important; border:1px solid #dce4ec !important; border-radius:6px !important; background:#fff !important; box-shadow:0 2px 8px rgba(15,39,67,.06) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav-item { min-height:32px !important; padding:0 11px !important; border:1px solid transparent !important; border-radius:4px !important; color:#52677d !important; background:#fff !important; font-size:11px !important; font-weight:700 !important; white-space:nowrap !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-nav-item.is-active { color:#e5483f !important; background:#fff1ef !important; border-color:#f2c0bb !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module { margin:0 !important; border:1px solid #dce4ec !important; border-radius:7px !important; background:#fff !important; box-shadow:0 2px 8px rgba(15,39,67,.045) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-head { padding:10px 14px !important; background:#f8fafc !important; border-bottom:1px solid #e2e8ef !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-index { width:25px !important; height:25px !important; flex:0 0 25px !important; background:#e5483f !important; color:#fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-content { padding:12px 14px 14px !important; background:#fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-module-actions { margin:0 0 10px !important; padding:9px 10px !important; border:1px solid #c9e3da !important; border-radius:5px !important; background:#eff9f5 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-grid { display:grid !important; grid-template-columns:repeat(auto-fit,minmax(176px,1fr)) !important; gap:8px !important; padding:8px !important; border:1px solid #e0e7ee !important; border-radius:6px !important; background:#f8fafc !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip { min-width:0 !important; min-height:64px !important; padding:9px !important; border:1px solid #dce5ed !important; border-radius:5px !important; background:#fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip :is(strong,b) { color:#17324d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-chip small { color:#52677d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-workbench-layout { grid-template-columns:minmax(0,1fr) 292px !important; gap:10px !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector { border:1px solid #dce4ec !important; border-radius:7px !important; background:#fff !important; box-shadow:0 2px 8px rgba(15,39,67,.05) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector :is(.ledger-inspector-head,.ledger-inspector-actions,.ledger-inspector-tabs) { background:#fff !important; border-color:#e0e7ee !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector-tabs button.active { color:#e5483f !important; border-bottom-color:#e5483f !important; }
@media (max-width:900px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top { grid-template-columns:104px minmax(0,1fr) !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) { width:104px !important; height:132px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-actions { grid-column:1/-1 !important; justify-content:flex-start !important; min-width:0 !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-workbench-layout { grid-template-columns:1fr !important; }
}
@media (max-width:560px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top { grid-template-columns:76px minmax(0,1fr) !important; gap:9px !important; padding:9px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) { width:76px !important; height:98px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-title { font-size:16px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .sku-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}

/* END frontend/assets/ui-detail-r35.css */

/* BEGIN frontend/assets/ui-system-r40.css */
/* 2026-09-02 r40 visual rebuild
 * One terminal visual layer for every authenticated surface. Business DOM,
 * permissions, state and API contracts stay unchanged; this file owns the
 * visual vocabulary and responsive composition. Reference boards live in
 * output/uiux-gpt-image-2-r40/ and were generated with gpt-image-2.
 */
:root {
  --r40-canvas: #f4f6f8;
  --r40-surface: #ffffff;
  --r40-surface-soft: #f8fafc;
  --r40-surface-tint: #f1f6fb;
  --r40-line: #dbe3eb;
  --r40-line-strong: #c4d0dc;
  --r40-ink: #15243a;
  --r40-ink-2: #33445b;
  --r40-muted: #69788b;
  --r40-faint: #8c98a8;
  --r40-navy: #13263e;
  --r40-navy-2: #1b3552;
  --r40-navy-3: #29496c;
  --r40-coral: #f05b50;
  --r40-coral-dark: #d94840;
  --r40-coral-soft: #fff0ee;
  --r40-blue: #2f76d2;
  --r40-blue-soft: #edf4ff;
  --r40-cyan: #1ba9b7;
  --r40-cyan-soft: #e9f8fa;
  --r40-green: #249b68;
  --r40-green-soft: #eaf8f1;
  --r40-amber: #c98026;
  --r40-amber-soft: #fff6e6;
  --r40-red: #d9465f;
  --r40-red-soft: #fff0f2;
  --r40-radius: 4px;
  --r40-radius-sm: 3px;
  --r40-shadow: 0 8px 24px rgba(21, 36, 58, .06);
}

body.workspace-mode {
  min-width: 320px;
  color: var(--r40-ink);
  background: var(--r40-canvas);
  font-family: "Avenir Next", "SF Pro Display", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] {
  grid-template-columns: 224px minmax(0, 1fr) !important;
  background: var(--r40-canvas) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] .sidebar {
  z-index: 5;
  width: 224px !important;
  min-width: 224px !important;
  padding: 18px 12px 14px !important;
  color: #edf4fc !important;
  background: var(--r40-navy) !important;
  border-right: 1px solid #27425f !important;
  box-shadow: 8px 0 24px rgba(9, 22, 40, .12) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] .brand {
  min-height: 58px !important;
  padding: 2px 8px 14px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(223, 235, 247, .16) !important;
  background: transparent !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] .brand-mark {
  width: 34px !important;
  height: 34px !important;
  flex-basis: 34px !important;
  border: 1px solid #89b5e4 !important;
  border-radius: 50% !important;
  background: #f2f7fd !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] .brand-mark::before { border-color: var(--r40-blue) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .brand-mark::after { background: var(--r40-coral) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .brand-copy strong { color: #f5f8fd !important; font-size: 13px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .brand-copy small { color: #9eb1c8 !important; font-size: 10px !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] .nav {
  gap: 5px !important;
  margin-top: 14px !important;
  padding-right: 0 !important;
  scrollbar-color: #496a8e #142d49 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-group { gap: 3px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-group-trigger {
  min-height: 34px !important;
  padding: 0 10px !important;
  color: #9db1c7 !important;
  border-radius: var(--r40-radius) !important;
  font-size: 11px !important;
  letter-spacing: .02em !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-group-trigger span,
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-group-trigger i { color: #9db1c7 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-group-trigger:hover { color: #fff !important; background: var(--r40-navy-2) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-group-menu {
  margin-left: 10px !important;
  padding-left: 8px !important;
  border-left: 1px solid rgba(158, 188, 218, .24) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-item {
  min-height: 38px !important;
  padding: 0 10px !important;
  color: #c6d4e4 !important;
  border: 1px solid transparent !important;
  border-radius: var(--r40-radius) !important;
  background: transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-item span { color: #c6d4e4 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-item:hover { color: #fff !important; background: var(--r40-navy-2) !important; border-color: #315274 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-item.active {
  color: #fff !important;
  background: var(--r40-coral) !important;
  border-color: var(--r40-coral) !important;
  box-shadow: inset 3px 0 0 #ffd3ce !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-item.active span { color: #fff !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-item b { background: var(--r40-red) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .sidebar-footer {
  color: #9eb1c8 !important;
  border-top-color: rgba(223, 235, 247, .16) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .online-dot { background: #59c98f !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page,
body.workspace-mode .app-shell[data-ui-shell="r26"] .page { background: var(--r40-canvas) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .topbar {
  height: 68px !important;
  padding: 0 26px !important;
  background: rgba(255, 255, 255, .98) !important;
  border-bottom: 1px solid var(--r40-line) !important;
  box-shadow: 0 1px 0 rgba(21, 36, 58, .03) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .topbar h1 {
  color: var(--r40-ink) !important;
  font-size: 19px !important;
  font-weight: 780 !important;
  letter-spacing: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .topbar-kicker { color: var(--r40-faint) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .top-actions { gap: 8px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .search {
  width: clamp(220px, 28vw, 360px) !important;
  height: 38px !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: var(--r40-radius) !important;
  background: var(--r40-surface-soft) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .search:focus-within {
  border-color: #8db4df !important;
  box-shadow: 0 0 0 3px #e5effb !important;
  background: #fff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .tenant-switcher,
body.workspace-mode .app-shell[data-ui-shell="r26"] .user-menu,
body.workspace-mode .app-shell[data-ui-shell="r26"] #logoutButton,
body.workspace-mode .app-shell[data-ui-shell="r26"] .icon-button,
body.workspace-mode .app-shell[data-ui-shell="r26"] .secondary {
  min-height: 36px !important;
  color: var(--r40-ink-2) !important;
  background: var(--r40-surface) !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: var(--r40-radius) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.tenant-switcher,.user-menu,#logoutButton,.icon-button,.secondary):hover {
  color: var(--r40-blue) !important;
  border-color: #93b8df !important;
  background: #f8fbff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #logoutButton { padding-inline: 12px !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tabs {
  min-height: 44px !important;
  padding: 6px 26px !important;
  background: #fff !important;
  border-bottom: 1px solid var(--r40-line) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab {
  min-height: 31px !important;
  color: var(--r40-muted) !important;
  background: #fff !important;
  border: 1px solid transparent !important;
  border-radius: var(--r40-radius) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab.active {
  color: var(--r40-coral-dark) !important;
  background: var(--r40-coral-soft) !important;
  border-color: #f6c3bd !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] .page {
  width: min(calc(100% - 48px), 1880px) !important;
  max-width: none !important;
  margin-inline: auto !important;
  padding: 24px 0 52px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .toolbar,
body.workspace-mode .app-shell[data-ui-shell="r26"] .dashboard-hero,
body.workspace-mode .app-shell[data-ui-shell="r26"] .operation-data-hero,
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-center-toolbar {
  margin-bottom: 16px !important;
  padding: 18px 20px !important;
  color: var(--r40-ink) !important;
  background: var(--r40-surface) !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: var(--r40-radius) !important;
  box-shadow: var(--r40-shadow) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.toolbar,.dashboard-hero,.operation-data-hero,.product-center-toolbar) h2 {
  color: var(--r40-ink) !important;
  font-size: 21px !important;
  font-weight: 780 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.toolbar,.dashboard-hero,.operation-data-hero,.product-center-toolbar) p,
body.workspace-mode .app-shell[data-ui-shell="r26"] .toolbar-note { color: var(--r40-muted) !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] .panel,
body.workspace-mode .app-shell[data-ui-shell="r26"] .metric,
body.workspace-mode .app-shell[data-ui-shell="r26"] .metric-card,
body.workspace-mode .app-shell[data-ui-shell="r26"] .summary-card,
body.workspace-mode .app-shell[data-ui-shell="r26"] .role-card,
body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-kpi,
body.workspace-mode .app-shell[data-ui-shell="r26"] .operation-connector-card,
body.workspace-mode .app-shell[data-ui-shell="r26"] .work-card,
body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-card,
body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-product-card,
body.workspace-mode .app-shell[data-ui-shell="r26"] .ledger-inspector {
  color: var(--r40-ink) !important;
  background: var(--r40-surface) !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: var(--r40-radius) !important;
  box-shadow: var(--r40-shadow) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .panel-head,
body.workspace-mode .app-shell[data-ui-shell="r26"] .ledger-inspector-head {
  min-height: 52px !important;
  padding: 13px 16px !important;
  color: var(--r40-ink) !important;
  background: #fbfcfd !important;
  border-bottom: 1px solid var(--r40-line) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.panel-head h3,.section-title,.section-heading .section-title) {
  color: var(--r40-ink) !important;
  font-size: 15px !important;
  font-weight: 760 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.subtle,.muted,.toolbar p,.field-help,.helper-text,.meta,small) { color: var(--r40-muted) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(h1,h2,h3,h4,h5,h6,strong,dt,dd,label,legend,caption,summary) { color: var(--r40-ink) !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] .primary,
body.workspace-mode .app-shell[data-ui-shell="r26"] .auth-submit,
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.btn-primary,.button-primary,.danger-button,.destructive-button) {
  min-height: 36px !important;
  padding: 0 14px !important;
  color: #fff !important;
  background: var(--r40-coral) !important;
  border: 1px solid var(--r40-coral) !important;
  border-radius: var(--r40-radius) !important;
  box-shadow: 0 5px 12px rgba(240, 91, 80, .16) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.primary,.auth-submit,.btn-primary,.button-primary,.danger-button,.destructive-button):hover {
  background: var(--r40-coral-dark) !important;
  border-color: var(--r40-coral-dark) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .secondary { padding: 0 12px !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] :is(input,select,textarea,.field input,.field select,.field textarea) {
  min-width: 0 !important;
  max-width: 100% !important;
  color: var(--r40-ink) !important;
  background: #fff !important;
  border: 1px solid var(--r40-line-strong) !important;
  border-radius: var(--r40-radius) !important;
  color-scheme: light !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(input,select,textarea):focus {
  border-color: #7da7d8 !important;
  box-shadow: 0 0 0 3px #e8f1fc !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(input,textarea)::placeholder { color: var(--r40-faint) !important; opacity: 1 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.form,.fields,.form-grid) { min-width: 0 !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.metrics,.dashboard-kpi-grid,.dashboard-sales-grid,.dashboard-intelligence-grid,.dashboard-module-grid,.schedule-kpis) {
  gap: 10px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.metric,.metric-card,.dashboard-kpi-card,.schedule-kpi) {
  min-width: 0 !important;
  min-height: 104px !important;
  padding: 14px 15px !important;
  box-shadow: none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.metric-label,.dashboard-kpi-card span,.schedule-kpi span) { color: var(--r40-muted) !important; font-size: 11px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.metric-value,.dashboard-kpi-card strong,.schedule-kpi strong) { color: var(--r40-ink) !important; font-size: 25px !important; font-weight: 780 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.dashboard-kpi-card:first-child,.schedule-kpi.ok) { background: var(--r40-green-soft) !important; border-color: #bfe5d1 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.dashboard-kpi-card.alert,.schedule-kpi.warning) { background: var(--r40-amber-soft) !important; border-color: #efd29d !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] .table-wrap,
body.workspace-mode .app-shell[data-ui-shell="r26"] .hr-table-wrap,
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table-wrap {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  background: var(--r40-surface) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.product-table,.data-table,.order-line-table,.hr-table,.account-table,.contract-table,.finance-invoice-table) {
  color: var(--r40-ink) !important;
  background: #fff !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.product-table,.data-table,.order-line-table,.hr-table,.account-table,.contract-table,.finance-invoice-table) th {
  padding: 10px 12px !important;
  color: #536477 !important;
  background: #f4f7fa !important;
  border-bottom: 1px solid var(--r40-line-strong) !important;
  font-size: 11px !important;
  font-weight: 760 !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.product-table,.data-table,.order-line-table,.hr-table,.account-table,.contract-table,.finance-invoice-table) td {
  padding: 11px 12px !important;
  color: var(--r40-ink-2) !important;
  background: #fff !important;
  border-bottom: 1px solid #e8edf2 !important;
  vertical-align: middle !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.product-table,.data-table,.order-line-table,.hr-table,.account-table,.contract-table,.finance-invoice-table) tbody tr:hover td { background: #f7fbff !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.style-code,.action-link,a,.link) { color: var(--r40-blue) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.style-code,.action-link,a,.link):hover { color: #1c5aa9 !important; }

/* Contract list product identity: the thumbnail is part of the record at
 * every layout width, so desktop-mode mobile browsers cannot hide it. */
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-style-cell {
  display: grid !important;
  justify-items: start !important;
  gap: 4px !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-style-thumb {
  display: block !important;
  width: 82px !important;
  height: 108px !important;
  margin-top: 6px !important;
  object-fit: cover !important;
  background: var(--r40-surface-soft) !important;
  border: 1px solid var(--r40-line-strong) !important;
  border-radius: var(--r40-radius) !important;
  cursor: zoom-in !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table {
  width: 100% !important;
  min-width: 1260px !important;
  table-layout: fixed !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th,
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td {
  padding: 8px 10px !important;
  line-height: 1.3 !important;
  vertical-align: middle !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(1),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(1) { width: 300px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(2),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(2) { width: 190px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(3),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(3) { width: 150px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(4),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(4) { width: 170px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(5),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(5) { width: 140px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(6),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(6) { width: 140px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(7),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(7) { width: 160px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(8),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(8) { width: 360px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-style-cell {
  grid-template-columns: 82px 110px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 8px !important;
  row-gap: 3px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-style-cell .contract-style-thumb {
  grid-row: 1 / span 2 !important;
  margin-top: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-style-cell .style-code,
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-style-cell .subtle {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-actions-cell {
  width: 360px !important;
  min-width: 360px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-row-actions.is-expanded {
  justify-content: flex-start !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  padding: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-row-actions.is-expanded > .row-primary-action {
  flex: 0 0 auto !important;
  max-width: none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-row-actions.is-expanded .contract-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-row-actions.is-expanded .contract-status-wrap {
  flex: 1 1 100% !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-row-actions.is-expanded .contract-summary {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 28px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.tag,.status-tag,.chip,.effect-status,.revision-alert-badge,.risk-level,.operation-data-status) {
  min-height: 22px !important;
  padding: 2px 7px !important;
  color: var(--r40-ink-2) !important;
  background: #eef2f6 !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.tag.blue,.status-tag.blue,.chip.blue) { color: #245ca8 !important; background: var(--r40-blue-soft) !important; border-color: #c5daf6 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.tag.green,.status-tag.green,.chip.green) { color: #16734b !important; background: var(--r40-green-soft) !important; border-color: #bfe5d1 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.tag.orange,.status-tag.orange,.chip.orange) { color: #945a17 !important; background: var(--r40-amber-soft) !important; border-color: #efd29d !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.tag.red,.status-tag.red,.chip.red) { color: #aa3048 !important; background: var(--r40-red-soft) !important; border-color: #efc1c9 !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.empty-state,.permission-empty,.detail-fields-empty,.dashboard-empty,.schedule-empty,.schedule-empty-board,.ledger-inspector-empty,.ledger-inspector-empty-state) {
  color: var(--r40-muted) !important;
  background: var(--r40-surface-soft) !important;
  border: 1px dashed var(--r40-line-strong) !important;
  border-radius: var(--r40-radius) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.detail-module,.pattern-progress,.pattern-progress-section,.pattern-requirement-section,.pattern-timeline,.detail-focus-section,.detail-module-actions,.detail-module-contract-actions,.sku-grid,.detail-fields-empty) {
  color: var(--r40-ink) !important;
  background: var(--r40-surface) !important;
  border-color: var(--r40-line) !important;
  box-shadow: none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.detail-module-head,.pattern-progress-head) { background: #f7f9fb !important; border-bottom-color: var(--r40-line) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.detail-module-index,.pattern-progress-index) { background: var(--r40-coral) !important; color: #fff !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .sku-chip { background: #fff !important; border-color: var(--r40-line) !important; border-radius: var(--r40-radius-sm) !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell {
  color: var(--r40-ink) !important;
  background: var(--r40-canvas) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top {
  grid-template-columns: 120px minmax(0, 1fr) auto !important;
  gap: 16px !important;
  padding: 14px !important;
  background: #fff !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: var(--r40-radius) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) { width: 120px !important; height: 150px !important; border-radius: var(--r40-radius-sm) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-title { color: var(--r40-ink) !important; font-size: 21px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-actions { min-width: 180px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-module-nav { background: #fff !important; border-color: var(--r40-line) !important; box-shadow: none !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-module-nav-item.is-active { color: var(--r40-coral-dark) !important; background: var(--r40-coral-soft) !important; border-color: #f6c3bd !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .ledger-workbench-layout { grid-template-columns: minmax(0, 1fr) 300px !important; gap: 14px !important; }

/* 2026-09-02 pattern-flow-distill=20260902
 * The pattern workbench row is one operational record, not a stack of cards.
 * Keep its progress, requirement, hand-off and task facts in one flat flow. */
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell > .stack:has(> .pattern-progress.is-compact) {
  display: grid !important;
  gap: 0 !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .pattern-progress.is-compact {
  display: grid !important;
  gap: 6px !important;
  width: 100% !important;
  padding: 0 0 8px !important;
  overflow: visible !important;
  color: var(--r40-ink) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table
  .product-flow-cell > .stack:has(> .pattern-progress.is-compact)
  > .pattern-progress.is-compact {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .pattern-progress.is-compact .pattern-progress-head {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .pattern-progress.is-compact .pattern-progress-mode {
  min-width: 0 !important;
  min-height: 20px !important;
  padding: 1px 6px !important;
  color: #147452 !important;
  background: var(--r40-green-soft) !important;
  border: 1px solid #bfe5d1 !important;
  border-radius: var(--r40-radius-sm) !important;
  font-size: 10px !important;
  line-height: 1.25 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .pattern-progress.is-compact .pattern-progress-mode.external {
  color: #8b581b !important;
  background: var(--r40-amber-soft) !important;
  border-color: #efd29d !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .pattern-progress.is-compact .pattern-progress-head strong {
  min-width: 0 !important;
  overflow: visible !important;
  color: var(--r40-ink) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  text-overflow: clip !important;
  white-space: normal !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .pattern-progress.is-compact .pattern-progress-head b {
  color: var(--r40-ink) !important;
  font-size: 12px !important;
  font-variant-numeric: tabular-nums !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .pattern-progress.is-compact .pattern-progress-track {
  height: 4px !important;
  background: #dfe5eb !important;
  border-radius: 2px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .pattern-progress.is-compact .pattern-progress-track i {
  background: var(--r40-blue) !important;
  border-radius: inherit !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .pattern-progress.is-compact .pattern-progress-meta {
  color: var(--r40-muted) !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell > .stack:has(> .pattern-progress.is-compact)
  > :is(.pattern-requirement-preview, .external-pattern-contact, .work-attention-list) {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 7px 0 !important;
  color: var(--r40-muted) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-top: 1px solid #e5eaf0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .work-attention-list {
  display: grid !important;
  gap: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .work-attention {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: baseline !important;
  gap: 7px !important;
  padding: 0 !important;
  color: var(--r40-ink-2) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .work-attention strong {
  color: #16685f !important;
  font-size: 11px !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .work-attention small {
  color: var(--r40-muted) !important;
  font-size: 11px !important;
  line-height: inherit !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table
  .product-flow-cell .work-attention-return strong {
  color: var(--r40-red) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.hr-hero,.hr-account-provisioning,.hr-role-mapping-editor,.hr-directory-editor,.hr-supervisor-editor,.hr-organization-quick-person,.schedule-product-picker,.schedule-communication-notes,.operation-data-note) {
  color: var(--r40-ink-2) !important;
  background: var(--r40-surface-tint) !important;
  border-color: var(--r40-line) !important;
  border-radius: var(--r40-radius) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.finance-invoice-tabs,.finance-payment-tabs,.finance-report-tabs,.detail-module-nav) { border-bottom-color: var(--r40-line) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.finance-invoice-tabs button,.finance-payment-tabs button,.finance-report-tabs button,.detail-module-nav-item).is-active { color: var(--r40-coral-dark) !important; border-bottom-color: var(--r40-coral) !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.dialog,.dialog-inner) {
  color: var(--r40-ink) !important;
  background: #fff !important;
  border: 1px solid var(--r40-line-strong) !important;
  border-radius: 6px !important;
  box-shadow: 0 22px 56px rgba(21, 36, 58, .22) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .dialog::backdrop { background: rgba(15, 28, 46, .46) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.dialog-head,.form-footer,.history-head) { background: #f7f9fb !important; border-color: var(--r40-line) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .dialog .close { color: var(--r40-muted) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .dialog .close:hover { color: var(--r40-coral-dark) !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"] :is(button,input,select,textarea,a):focus-visible {
  outline: 3px solid rgba(47, 118, 210, .28) !important;
  outline-offset: 2px !important;
}

@media (min-width: 1920px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] .page { width: min(calc(100% - 72px), 2200px) !important; }
}

@media (max-width: 1100px) and (min-width: 761px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] { grid-template-columns: 188px minmax(0, 1fr) !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .sidebar { width: 188px !important; min-width: 188px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .topbar { padding-inline: 18px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .page { width: min(calc(100% - 32px), 1600px) !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .search { width: 230px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top { grid-template-columns: 100px minmax(0, 1fr) !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-actions { grid-column: 1 / -1 !important; justify-content: flex-start !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .ledger-workbench-layout { grid-template-columns: 1fr !important; }
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] { display: flex !important; flex-direction: column !important; min-height: 100dvh !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace { order: 1 !important; min-height: 0 !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .sidebar { order: 2 !important; width: 100% !important; min-width: 0 !important; height: 62px !important; min-height: 62px !important; padding: 0 !important; border-top: 1px solid #2b4562 !important; border-right: 0 !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .sidebar .brand,
  body.workspace-mode .app-shell[data-ui-shell="r26"] .sidebar-footer,
  body.workspace-mode .app-shell[data-ui-shell="r26"] .nav-group-trigger { display: none !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .sidebar .nav { display: flex !important; height: 62px !important; gap: 4px !important; padding: 5px 8px !important; overflow-x: auto !important; overflow-y: hidden !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .sidebar .nav-group,
  body.workspace-mode .app-shell[data-ui-shell="r26"] .sidebar .nav-group-menu { display: contents !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .sidebar :is(.nav-item,.nav-group-menu .nav-item) { flex: 0 0 76px !important; min-height: 52px !important; padding: 4px 5px !important; font-size: 10px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .topbar { min-height: 60px !important; height: auto !important; padding: 8px 12px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .topbar h1 { font-size: 16px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .top-actions { max-width: 62vw !important; overflow: hidden !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .top-actions .search,
  body.workspace-mode .app-shell[data-ui-shell="r26"] .top-actions .tenant-switcher { display: none !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tabs { min-height: 38px !important; padding: 5px 10px !important; overflow-x: auto !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .page { width: auto !important; padding: 14px 10px 24px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.toolbar,.dashboard-hero,.operation-data-hero,.product-center-toolbar) { padding: 14px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.toolbar,.dashboard-hero,.operation-data-hero,.product-center-toolbar) h2 { font-size: 18px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.metrics,.dashboard-kpi-grid,.dashboard-sales-grid,.dashboard-intelligence-grid,.dashboard-module-grid,.schedule-kpis) { grid-template-columns: 1fr 1fr !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .dashboard-module-grid { grid-template-columns: 1fr !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top { grid-template-columns: 76px minmax(0, 1fr) !important; gap: 10px !important; padding: 10px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top :is(.image-block,.detail-image-drop,.detail-image,.detail-image-drop img) { width: 76px !important; height: 98px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-actions { grid-column: 1 / -1 !important; min-width: 0 !important; justify-content: flex-start !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .ledger-workbench-layout { grid-template-columns: 1fr !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .ledger-inspector { order: -1 !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] :is(.form-grid,.hr-role-mapping-row,.hr-supervisor-row) { grid-template-columns: 1fr !important; }
}

/* 2026-09-02 module-edit-only=20260902: keep row-level operations compact;
 * workflow actions live in module editors. Actions may wrap when a module
 * exposes more than one legal command; the record itself must stay readable. */
.product-table td:last-child .row-actions,
.product-table td:last-child .row-actions > * {
  white-space: normal !important;
}
.product-table td:last-child .row-actions {
  flex-wrap: wrap !important;
  gap: 8px !important;
  min-width: 0 !important;
}

/* Final shell contract: this block intentionally lives at EOF so no legacy
 * module stylesheet can reintroduce the desktop rail at small widths. */
@media (max-width: 1100px) and (min-width: 761px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] { grid-template-columns: 188px minmax(0, 1fr) !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .sidebar { width: 188px !important; min-width: 188px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .workspace { width: 100% !important; min-width: 0 !important; }
}
@media (max-width: 760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    grid-template-rows: minmax(0, 1fr) 64px !important;
    width: 100% !important;
    min-height: 100dvh !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .workspace {
    order: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .sidebar {
    order: 2 !important;
    position: fixed !important;
    inset: auto 0 0 0 !important;
    width: 100vw !important;
    min-width: 0 !important;
    height: 64px !important;
    min-height: 64px !important;
    box-sizing: border-box !important;
  }
} /* r40-shell-eof */

/* Final empty-table neutralization, kept after every historical override. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) tbody,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) tr,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) td {
  color: var(--r40-muted) !important;
  background: #fff !important;
  background-image: none !important;
  border-color: var(--r40-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) .empty-state {
  color: var(--r40-muted) !important;
  background: var(--r40-surface-soft) !important;
  border-color: var(--r40-line-strong) !important;
}

/* 2026-09-02 manual-admin-assignment
 * Keep the high-impact administrator choice explicit without adding another
 * card or competing action surface to the account table. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"] #page .role-assignment-note {
  display: grid !important;
  gap: 3px !important;
  margin-top: -3px !important;
  padding: 10px 12px !important;
  border: 1px solid #c5daf6 !important;
  border-radius: 7px !important;
  background: #edf4ff !important;
  color: #52677d !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"] #page .role-assignment-note[hidden] {
  display: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"] #page .role-assignment-note strong {
  color: #245ca8 !important;
  font-size: 12px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"] #page .account-role-scope {
  display: block !important;
  color: #52677d !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

/* Sidebar navigation refinement, 2026-09-02. One active signal is enough:
 * a solid coral surface replaces the legacy red rail + pulsing green dot +
 * outlined tile combination. The whole row remains the click target. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-group-menu .nav-item {
  min-height: 40px !important;
  padding: 0 11px !important;
  gap: 9px !important;
  border: 1px solid transparent !important;
  border-radius: 4px !important;
  color: #c8d5e4 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 620 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-group-menu .nav-item > svg {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 17px !important;
  stroke-width: 1.9 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-group-menu .nav-item:hover {
  color: #fff !important;
  background: #24415f !important;
  border-color: #355777 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-item.active,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-dashboard-entry.active {
  color: #fff !important;
  background: var(--r40-coral) !important;
  border-color: var(--r40-coral) !important;
  box-shadow: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-item.active::before,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-item.active::after {
  display: none !important;
  content: none !important;
  animation: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-item.active > :is(span,svg,i) {
  color: #fff !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-group:has(.nav-item.active) > .nav-group-trigger {
  color: #e4edf7 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar :is(.nav-item,.nav-group-trigger):focus-visible {
  outline: 2px solid #9cc9f5 !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

@media (max-width: 760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-item.active,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-dashboard-entry.active {
    color: var(--r40-coral) !important;
    background: transparent !important;
    border-color: transparent !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav-item.active > :is(span,svg,i) {
    color: var(--r40-coral) !important;
  }
}

/* 2026-09-02 record-card-list=20260902-final
 * Final cascade for the broad visual correction. The HTML table remains for
 * semantics and existing event delegation; authenticated users see a calm
 * record list with one card per style, not a spreadsheet grid. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .product-list-head {
  min-height: 0 !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-list-head .panel-kicker,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-list-legend {
  display: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-list-head h3 {
  margin: 0 !important;
  color: var(--r40-ink) !important;
  font-size: 19px !important;
  line-height: 1.25 !important;
  font-weight: 780 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-list-head .subtle {
  display: block !important;
  margin-top: 5px !important;
  color: var(--r40-muted) !important;
  font-size: 11px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .table-wrap {
  overflow: visible !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  table-layout: auto !important;
  border: 0 !important;
  border-collapse: separate !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
  display: grid !important;
  grid-template-columns: 72px 56px minmax(132px, 1fr) minmax(130px, .95fr) minmax(220px, 1.35fr) minmax(140px, 1fr) minmax(132px, .95fr) minmax(110px, .8fr) auto !important;
  align-items: center !important;
  gap: 0 12px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 14px 16px !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: 12px !important;
  background: var(--r40-surface) !important;
  box-shadow: 0 4px 14px rgba(21, 36, 58, .045) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr:has(td[colspan]) {
  display: block !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr:hover,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr.is-selected {
  background: var(--r40-surface) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr:hover td,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr.is-selected td {
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr.is-selected {
  border-color: #efb2aa !important;
  box-shadow: 0 0 0 2px var(--r40-coral-soft), 0 4px 14px rgba(21, 36, 58, .045) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  vertical-align: middle !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .style-code {
  display: inline !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--r40-blue) !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  font-weight: 780 !important;
  white-space: nowrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-image {
  width: 48px !important;
  height: 62px !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: 8px !important;
  object-fit: cover !important;
  background: var(--r40-surface-soft) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .stack {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .stack strong {
  color: var(--r40-ink) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .stack span,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .subtle {
  color: var(--r40-muted) !important;
  font-size: 10px !important;
  line-height: 1.4 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7)::before {
  display: block !important;
  margin-bottom: 3px !important;
  color: var(--r40-faint) !important;
  content: "规格与 SKU" !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 7px !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions > :is(.action-detail, .row-primary-action, .row-action-menu-trigger, .action-button) {
  min-height: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--r40-blue) !important;
  box-shadow: none !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .pagination {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 0 !important;
  margin-top: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--r40-muted) !important;
  font-size: 11px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .pagination-actions button {
  min-height: 28px !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--r40-blue) !important;
  box-shadow: none !important;
}

/* Workspace tabs are a lightweight recent-module strip, not a row of cells. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
  min-height: 46px !important;
  height: 46px !important;
  padding: 0 26px !important;
  align-items: stretch !important;
  gap: 22px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--r40-line) !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:first-child {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--r40-muted) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-main {
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-close {
  width: 20px !important;
  height: 20px !important;
  margin-left: 6px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--r40-faint) !important;
  font-size: 16px !important;
  line-height: 20px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:is(:hover, .active) {
  color: var(--r40-ink) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab.active::after {
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  height: 2px !important;
  border-radius: 2px 2px 0 0 !important;
  background: var(--r40-coral) !important;
  content: "" !important;
}

@media (min-width: 761px) and (max-width: 1180px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    grid-template-columns: 64px 52px minmax(150px, 1fr) minmax(180px, 1.2fr) minmax(130px, 1fr) auto !important;
    grid-template-areas:
      "style image identity identity owner actions"
      "style image category flow attrs match" !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(1) { grid-area: style !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(2) { grid-area: image !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(3) { grid-area: identity !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(4) { grid-area: category !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(5) { grid-area: flow !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(6) { grid-area: owner !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7) { grid-area: attrs !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(8) { grid-area: match !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(9) { grid-area: actions !important; }
}

@media (max-width: 760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 12px !important;
    gap: 18px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:first-child {
    height: 42px !important;
    min-height: 42px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody {
    gap: 10px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    grid-template-columns: 54px minmax(0, 1fr) !important;
    grid-template-areas:
      "image style"
      "image identity"
      "category category"
      "flow flow"
      "owner owner"
      "attrs attrs"
      "actions actions" !important;
    gap: 9px 12px !important;
    padding: 13px !important;
    border-radius: 12px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(1) { grid-area: style !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(2) { grid-area: image !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(3) { grid-area: identity !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(4) { grid-area: category !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(5) { grid-area: flow !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(6) { grid-area: owner !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7) { grid-area: attrs !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(8) { display: none !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(9) {
    grid-area: actions !important;
    justify-self: start !important;
    padding-top: 9px !important;
    border-top: 1px solid #e8edf2 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-image {
    width: 54px !important;
    height: 68px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .style-code {
    font-size: 15px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions {
    justify-content: flex-start !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .pagination {
    align-items: flex-start !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
  }
}

/* 2026-09-02 content-surface-normalization=20260902-final
 * Final cascade for authenticated business content. Only the navigation rail
 * and intentional image-preview backdrops stay dark; all readable work
 * surfaces share the light ledger palette. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) {
  --ui-canvas: #f4f6f8 !important;
  --ui-canvas-raised: #ffffff !important;
  --ui-surface: #ffffff !important;
  --ui-surface-soft: #f8fafc !important;
  --ui-surface-raised: #f1f6fb !important;
  --ui-surface-elevated: #ffffff !important;
  --ui-ink: #15243a !important;
  --ui-ink-soft: #33445b !important;
  --ui-muted: #69788b !important;
  --canvas: #f4f6f8 !important;
  --surface: #ffffff !important;
  --surface-soft: #f8fafc !important;
  --surface-raised: #f1f6fb !important;
  --surface-elevated: #ffffff !important;
  --ink: #15243a !important;
  --ink-soft: #33445b !important;
  --muted: #69788b !important;
  color-scheme: light !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.panel,.metric,.metric-card,.summary-card,.schedule-kpi,.dashboard-module-card,.dashboard-intelligence-card,.dashboard-sales-card,.dashboard-chart-panel,.operation-connector-card,.hr-department-card,.finance-invoice-preview,.operation-data-note,.order-product-summary,.role-banner,.schedule-hero,.privacy-notice,.flow,.feed li,.attention-item,.risk-item,.table-wrap,.product-table,.data-table,.order-line-table,.hr-table,.account-table,.contract-table,.product-detail-shell,.details,.detail-module,.detail-module-content,.detail-focus-section,.pattern-progress,.pattern-progress-section,.pattern-requirement-section,.pattern-timeline,.fields,.field,.detail-more-fields,.sku-grid,.empty-state,.permission-empty,.detail-fields-empty,.model-reference-slot,.consent-check,.styling-output-section,.styling-output-preview,.model-image-inline-empty,.model-image-output-empty,.model-scene-reference,.ai-chat-panel,.ai-chat-stage,.ai-assistant-mode,.ai-chat-turn > p,.knowledge-answer-copy,.ai-chat-file-card,.ai-chat-image-wrap,.ai-chat-quick-prompt,.form-footer,.row-action-menu-panel,.schedule-product-option,.order-product-results,.order-product-result) {
  color: #33445b !important;
  background: #ffffff !important;
  background-image: none !important;
  border-color: #dbe3eb !important;
  box-shadow: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.panel-head,.detail-module-head,.pattern-progress-head,.history-head,.form-footer,.dashboard-module-head) {
  color: #15243a !important;
  background: #f7f9fb !important;
  background-image: none !important;
  border-color: #dbe3eb !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.fields,.sku-grid) { background: #f8fafc !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.detail-module-content,.field,.detail-focus-section,.detail-module) { background: #fff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .detail-module-actions {
  color: #33445b !important; background: #eff9f5 !important; border-color: #c9e3da !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .detail-module-contract-actions {
  color: #6a4a10 !important; background: #fff8eb !important; border-color: #efd39b !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.detail-module-nav,.detail-more-fields summary,.model-reference-slot,.consent-check) {
  color: #69788b !important; background: #f3f4f6 !important; border-color: #dbe3eb !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(input,select,textarea,.order-product-search,.schedule-product-search input) {
  color: #15243a !important; background: #fff !important; border-color: #c4d0dc !important; color-scheme: light !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(h1,h2,h3,h4,h5,h6,strong,dt,dd,label,legend,caption,summary) { color: #15243a !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(p,small,.subtle,.muted,.helper-text,.field-help,.meta,.detail-meta,.dialog-help) { color: #69788b !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.image-drop,.detail-image-drop,.attachment-picker,.model-image-inline-empty,.detail-fields-empty,.permission-empty) {
  color: #69788b !important; background: #f8fafc !important; border-color: #c4d0dc !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.ai-chat-turn.user > p,.ai-chat-file-card .compact-button) {
  color: #fff !important; background: #2f76d2 !important; border-color: #2f76d2 !important;
}

/* 2026-09-02 content-surface-normalization=20260902
 * One authenticated content contract. The rail remains graphite by design;
 * business surfaces use paper white, cool-gray separators and light semantic
 * tints. This terminal block neutralizes legacy dark-theme declarations in a
 * single place instead of fixing individual screenshots one at a time. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) {
  --r40-canvas: #f4f6f8 !important;
  --r40-surface: #ffffff !important;
  --r40-surface-soft: #f8fafc !important;
  --r40-surface-tint: #f1f6fb !important;
  --r40-line: #dbe3eb !important;
  --r40-line-strong: #c4d0dc !important;
  --r40-ink: #15243a !important;
  --r40-ink-2: #33445b !important;
  --r40-muted: #69788b !important;
  --r40-faint: #8c98a8 !important;
  --ui-canvas: #f4f6f8 !important;
  --ui-canvas-raised: #ffffff !important;
  --ui-surface: #ffffff !important;
  --ui-surface-soft: #f8fafc !important;
  --ui-surface-raised: #f1f6fb !important;
  --ui-surface-elevated: #ffffff !important;
  --ui-ink: #15243a !important;
  --ui-ink-soft: #33445b !important;
  --ui-muted: #69788b !important;
  color-scheme: light !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.panel,.metric,.metric-card,.summary-card,.schedule-kpi,.dashboard-module-card,.dashboard-intelligence-card,.dashboard-sales-card,.dashboard-chart-panel,.operation-connector-card,.hr-department-card,.finance-invoice-preview,.operation-data-note,.order-product-summary,.role-banner,.schedule-hero,.privacy-notice,.flow,.feed li,.attention-item,.risk-item,.table-wrap,.product-table,.data-table,.order-line-table,.hr-table,.account-table,.contract-table,.dialog,.dialog-inner,.product-detail-shell,.details,.detail-module,.detail-module-content,.detail-focus-section,.pattern-progress,.pattern-progress-section,.pattern-requirement-section,.pattern-timeline,.fields,.field,.detail-more-fields,.sku-grid,.empty-state,.permission-empty,.detail-fields-empty,.model-reference-slot,.consent-check,.styling-output-section,.styling-output-preview,.model-image-inline-empty,.model-image-output-empty,.model-scene-reference,.ai-chat-panel,.ai-chat-stage,.ai-assistant-mode,.ai-chat-turn > p,.knowledge-answer-copy,.ai-chat-file-card,.ai-chat-image-wrap,.ai-chat-quick-prompt,.form-footer,.row-action-menu-panel,.schedule-product-option,.order-product-results,.order-product-result) {
  color: var(--r40-ink-2) !important;
  background: var(--r40-surface) !important;
  background-image: none !important;
  border-color: var(--r40-line) !important;
  box-shadow: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.panel-head,.detail-module-head,.pattern-progress-head,.history-head,.form-footer,.dashboard-module-head) {
  color: var(--r40-ink) !important;
  background: #f7f9fb !important;
  background-image: none !important;
  border-color: var(--r40-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.fields,.sku-grid) { background: #f8fafc !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.detail-module-content,.field,.detail-focus-section,.detail-module) { background: #ffffff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.detail-module-actions,.detail-module-contract-actions) {
  color: var(--r40-ink-2) !important;
  background: #eff9f5 !important;
  border-color: #c9e3da !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .detail-module-contract-actions {
  color: #6a4a10 !important;
  background: #fff8eb !important;
  border-color: #efd39b !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.detail-module-nav,.detail-more-fields summary,.model-reference-slot,.consent-check) {
  color: var(--r40-muted) !important;
  background: #f3f4f6 !important;
  border-color: var(--r40-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(input,select,textarea,.order-product-search,.schedule-product-search input) {
  color: var(--r40-ink) !important;
  background: #ffffff !important;
  border-color: var(--r40-line-strong) !important;
  color-scheme: light !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(h1,h2,h3,h4,h5,h6,strong,dt,dd,label,legend,caption,summary) { color: var(--r40-ink) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(p,small,.subtle,.muted,.helper-text,.field-help,.meta,.detail-meta,.dialog-help) { color: var(--r40-muted) !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.tag,.status-tag,.chip,.effect-status,.revision-alert-badge,.risk-level,.operation-data-status) {
  background: #eef2f6 !important;
  color: var(--r40-ink-2) !important;
  border-color: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.tag.blue,.status-tag.blue,.chip.blue) { color: #245ca8 !important; background: var(--r40-blue-soft) !important; border-color: #c5daf6 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.tag.green,.status-tag.green,.chip.green) { color: #16734b !important; background: var(--r40-green-soft) !important; border-color: #bfe5d1 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.tag.orange,.status-tag.orange,.chip.orange) { color: #945a17 !important; background: var(--r40-amber-soft) !important; border-color: #efd29d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.tag.red,.status-tag.red,.chip.red) { color: #aa3048 !important; background: var(--r40-red-soft) !important; border-color: #efc1c9 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.image-drop,.detail-image-drop,.attachment-picker,.model-image-inline-empty,.detail-fields-empty,.permission-empty) {
  color: var(--r40-muted) !important;
  background: #f8fafc !important;
  border-color: var(--r40-line-strong) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.ai-chat-turn.user > p,.ai-chat-file-card .compact-button) {
  color: #ffffff !important;
  background: var(--r40-blue) !important;
  border-color: var(--r40-blue) !important;
}

/* Final empty-table neutralization, kept after every historical override. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) tbody,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) tr,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) td {
  color: var(--r40-muted) !important;
  background: #fff !important;
  background-image: none !important;
  border-color: var(--r40-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) .empty-state {
  color: var(--r40-muted) !important;
  background: var(--r40-surface-soft) !important;
  border-color: var(--r40-line-strong) !important;
}

/* Final empty-table neutralization, kept after every historical override. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) tbody,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) tr,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) td {
  color: var(--r40-muted) !important;
  background: #fff !important;
  background-image: none !important;
  border-color: var(--r40-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) .empty-state {
  color: var(--r40-muted) !important;
  background: var(--r40-surface-soft) !important;
  border-color: var(--r40-line-strong) !important;
}

/* Empty tables are message states, never dark data canvases. The historical
 * visual layer styles tbody directly, so neutralize that surface as well as
 * the inner cell at the terminal specificity. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) tbody,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) tr,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) td {
  color: var(--r40-muted) !important;
  background: #fff !important;
  background-image: none !important;
  border-color: var(--r40-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) .empty-state {
  color: var(--r40-muted) !important;
  background: var(--r40-surface-soft) !important;
  border-color: var(--r40-line-strong) !important;
}

/* 2026-09-02 record-card-list=20260902
 * Keep the table DOM and its keyboard/event contracts, but present each
 * product as one readable record. The list surface owns spacing; cells no
 * longer pretend to be independent spreadsheet tiles. */
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .product-list-head {
  min-height: 0 !important;
  margin: 0 0 14px !important;
  padding: 0 0 2px !important;
  border: 0 !important;
  background: transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .product-list-head .panel-kicker {
  display: none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .product-list-head h3 {
  margin: 0 !important;
  color: var(--r40-ink) !important;
  font-size: 19px !important;
  line-height: 1.25 !important;
  font-weight: 780 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .product-list-head .subtle {
  display: block !important;
  margin-top: 5px !important;
  color: var(--r40-muted) !important;
  font-size: 11px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .table-wrap {
  overflow: visible !important;
  background: transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  table-layout: auto !important;
  border: 0 !important;
  border-collapse: separate !important;
  background: transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table thead {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody tr {
  display: grid !important;
  grid-template-columns: 72px 56px minmax(132px, 1fr) minmax(130px, .95fr) minmax(220px, 1.35fr) minmax(140px, 1fr) minmax(132px, .95fr) minmax(110px, .8fr) auto !important;
  align-items: center !important;
  gap: 0 12px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 14px 16px !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: 12px !important;
  background: var(--r40-surface) !important;
  box-shadow: 0 4px 14px rgba(21, 36, 58, .045) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody tr:hover,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody tr.is-selected {
  background: var(--r40-surface) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody tr:hover td,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody tr.is-selected td {
  background: transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody tr.is-selected {
  border-color: #efb2aa !important;
  box-shadow: 0 0 0 2px var(--r40-coral-soft), 0 4px 14px rgba(21, 36, 58, .045) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  vertical-align: middle !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .style-code {
  display: inline !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--r40-blue) !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  font-weight: 780 !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .style-code:hover {
  color: #1c5aa9 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-image {
  width: 48px !important;
  height: 62px !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: 8px !important;
  object-fit: cover !important;
  background: var(--r40-surface-soft) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .stack {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .stack strong {
  min-width: 0 !important;
  color: var(--r40-ink) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .stack span,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .subtle {
  min-width: 0 !important;
  color: var(--r40-muted) !important;
  font-size: 10px !important;
  line-height: 1.4 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(7)::before {
  display: block !important;
  margin-bottom: 3px !important;
  color: var(--r40-faint) !important;
  content: "规格与 SKU" !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(9) {
  justify-self: end !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-row-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 7px !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-row-actions > :is(.action-detail, .row-primary-action, .row-action-menu-trigger, .action-button) {
  min-height: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--r40-blue) !important;
  box-shadow: none !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-row-actions > :is(.action-detail, .row-primary-action, .row-action-menu-trigger, .action-button):hover {
  color: var(--r40-coral-dark) !important;
  background: transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .pagination {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 0 !important;
  margin-top: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--r40-muted) !important;
  font-size: 11px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .pagination-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .pagination-actions button {
  min-height: 28px !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--r40-blue) !important;
  box-shadow: none !important;
  font-size: 11px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .pagination-actions button:hover:not(:disabled) {
  color: var(--r40-coral-dark) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Recent module tabs are navigation, not spreadsheet cells. */
body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tabs {
  min-height: 46px !important;
  padding: 0 26px !important;
  align-items: stretch !important;
  gap: 22px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--r40-line) !important;
  background: transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab,
body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab:first-child {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--r40-muted) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab-main {
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab-close {
  width: 20px !important;
  height: 20px !important;
  margin-left: 6px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--r40-faint) !important;
  font-size: 16px !important;
  line-height: 20px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab-close:hover {
  background: var(--r40-surface-soft) !important;
  color: var(--r40-ink) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab:is(:hover, .active) {
  color: var(--r40-ink) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab.active::after {
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  height: 2px !important;
  border-radius: 2px 2px 0 0 !important;
  background: var(--r40-coral) !important;
  content: "" !important;
}

@media (min-width: 761px) and (max-width: 1180px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody tr {
    grid-template-columns: 64px 52px minmax(150px, 1fr) minmax(180px, 1.2fr) minmax(130px, 1fr) auto !important;
    grid-template-areas:
      "style image identity identity owner actions"
      "style image category flow attrs match" !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(1) { grid-area: style !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(2) { grid-area: image !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(3) { grid-area: identity !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(4) { grid-area: category !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(5) { grid-area: flow !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(6) { grid-area: owner !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(7) { grid-area: attrs !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(8) { grid-area: match !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(9) { grid-area: actions !important; }
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tabs {
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 12px !important;
    gap: 18px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab,
  body.workspace-mode .app-shell[data-ui-shell="r26"] .workspace-tab:first-child {
    height: 42px !important;
    min-height: 42px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .product-list-head {
    margin-bottom: 10px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .product-list-head h3 {
    font-size: 17px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody {
    gap: 10px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody tr {
    grid-template-columns: 54px minmax(0, 1fr) !important;
    grid-template-areas:
      "image style"
      "image identity"
      "category category"
      "flow flow"
      "owner owner"
      "attrs attrs"
      "actions actions" !important;
    gap: 9px 12px !important;
    padding: 13px !important;
    border-radius: 12px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(1) { grid-area: style !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(2) { grid-area: image !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(3) { grid-area: identity !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(4) { grid-area: category !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(5) { grid-area: flow !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(6) { grid-area: owner !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(7) { grid-area: attrs !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(8) { display: none !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(9) {
    grid-area: actions !important;
    justify-self: start !important;
    padding-top: 9px !important;
    border-top: 1px solid #e8edf2 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-image {
    width: 54px !important;
    height: 68px !important;
    border-radius: 8px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .style-code {
    font-size: 15px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-row-actions {
    justify-content: flex-start !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-panel .pagination {
    align-items: flex-start !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
  }
}

/* Shell precedence repair: legacy r26 rules use :has() and otherwise win
 * the tablet/mobile cascade. Keep the same scope at the terminal layer so
 * the reference breakpoints are deterministic across every module. */
@media (max-width: 1100px) and (min-width: 761px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] {
    grid-template-columns: 188px minmax(0, 1fr) !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .sidebar {
    width: 188px !important;
    min-width: 188px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .workspace {
    min-width: 0 !important;
    width: 100% !important;
  }
}

@media (max-width: 760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    grid-template-rows: minmax(0, 1fr) 64px !important;
    min-height: 100dvh !important;
    width: 100% !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .workspace {
    order: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .sidebar {
    order: 2 !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    min-width: 0 !important;
    height: 64px !important;
    min-height: 64px !important;
    box-sizing: border-box !important;
    padding: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] *,
  body.workspace-mode .app-shell[data-ui-shell="r26"] *::before,
  body.workspace-mode .app-shell[data-ui-shell="r26"] *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* 2026-09-02 contract-table-density=r2
 * The contract grid uses explicit fields rather than a catch-all overflow
 * menu. Fixed content widths keep records compact on wide screens, while the
 * narrow-screen card rules below retain every field without large dead gaps. */
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table {
  width: max-content !important;
  min-width: 1617px !important;
  table-layout: fixed !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(1),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(1) { width: 92px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(2),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(2) { width: 105px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(3),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(3) { width: 145px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(4),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(4) { width: 190px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(5),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(5) { width: 150px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(6),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(6) { width: 170px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(7),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(7) { width: 140px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(8),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(8) { width: 120px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(9),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(9) { width: 160px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(10),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(10) { width: 360px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .contract-image-cell {
  padding: 8px 10px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .contract-style-thumb {
  width: 72px !important;
  height: 94px !important;
  margin: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .contract-style-name {
  display: block !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .product-row-actions.is-expanded {
  min-width: 0 !important;
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: auto !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table thead { display: none !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table tbody,
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table tr,
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td { display: block !important; width: 100% !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table tr {
    padding: 8px 12px !important;
    border-bottom: 1px solid var(--r40-line) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td {
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 4px 0 !important;
    border: 0 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td::before {
    color: var(--r40-muted) !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(1)::before { content: "图片"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(2)::before { content: "款号"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(3)::before { content: "款式"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(4)::before { content: "合同编号"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(5)::before { content: "达人 / 品牌"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(6)::before { content: "供应商"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(7)::before { content: "订单"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(8)::before { content: "状态"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(9)::before { content: "打印记录"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(10)::before { content: "操作"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .contract-style-thumb {
    width: 72px !important;
    height: 94px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .product-row-actions.is-expanded {
    justify-content: flex-start !important;
    gap: 4px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .product-row-actions.is-expanded .contract-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
  }
}

/* 2026-09-02 compact-action-and-detail=r3
 * Keep the operation cell dense and keep the detail cover image from taking
 * over the entire first viewport. */
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .product-actions-cell {
  vertical-align: top !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .product-row-actions.is-expanded {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: center !important;
  justify-content: stretch !important;
  gap: 5px !important;
  width: 100% !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .product-row-actions.is-expanded .contract-actions {
  display: contents !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .product-row-actions.is-expanded > .action-button,
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .product-row-actions.is-expanded .contract-actions .action-button {
  width: 100% !important;
  max-width: none !important;
  min-height: 32px !important;
  padding-inline: 7px !important;
  font-size: 11px !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .product-row-actions.is-expanded .contract-esign-button {
  grid-column: 1 / -1 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top {
  grid-template-columns: 132px minmax(0, 1fr) auto !important;
  gap: 12px !important;
  padding: 12px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top .image-block,
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top .detail-image-drop {
  width: 132px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top .detail-image-frame {
  width: 132px !important;
  height: 164px !important;
  padding: 6px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top :is(.detail-image,.detail-image-drop img) {
  width: 118px !important;
  height: 150px !important;
  border-radius: 4px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top .image-drop-copy {
  max-width: 132px !important;
  gap: 2px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top .image-drop-copy small {
  font-size: 10px !important;
  line-height: 1.3 !important;
}

/* 2026-09-02 product-detail-scroll=r45
 * The product archive is a long-form working surface. The outer dialog owns
 * its viewport while the archive shell owns exactly one vertical scrollbar.
 * This keeps revision notes, videos and later workflow modules reachable. */
body.workspace-mode #productDialog:has(> .dialog-inner.product-detail-shell) {
  height:min(92dvh,980px) !important;
  max-height:min(92dvh,980px) !important;
  overflow:hidden !important;
}
body.workspace-mode #productDialog > .dialog-inner.product-detail-shell {
  height:100% !important;
  max-height:100% !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior-y:contain !important;
  scrollbar-gutter:stable !important;
  -webkit-overflow-scrolling:touch;
}
body.workspace-mode #productDialog > .product-detail-shell .dialog-head {
  position:sticky !important;
  top:0 !important;
  z-index:3 !important;
}
body.workspace-mode #productDialog > .product-detail-shell .details {
  min-height:0 !important;
  padding-bottom:28px !important;
}
body.workspace-mode #productDialog > .product-detail-shell :is(.revision-opinions-section,.design-image-strip,.detail-module) {
  scroll-margin-top:74px !important;
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .product-row-actions.is-expanded {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top {
    grid-template-columns: 76px minmax(0, 1fr) !important;
    gap: 9px !important;
    padding: 9px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top .image-block,
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top .detail-image-drop {
    width: 76px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top .detail-image-frame {
    width: 76px !important;
    height: 98px !important;
    padding: 4px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top :is(.detail-image,.detail-image-drop img) {
    width: 68px !important;
    height: 88px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top .image-drop-copy { max-width: 76px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .product-detail-shell .detail-top .image-drop-copy small { display: none !important; }
  body.workspace-mode #productDialog:has(> .dialog-inner.product-detail-shell) {
    height:calc(100dvh - 20px) !important;
    max-height:calc(100dvh - 20px) !important;
  }
}

/* 2026-09-02 contract-action-columns=r1
 * Keep each contract command visible in its own compact column. */
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table {
  min-width: 1762px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(10),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(10),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(11),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(11),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(12),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(12),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(13),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(13),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table th:nth-child(14),
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(14) {
  width: 100px !important;
  min-width: 100px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .contract-action-cell {
  padding: 8px 6px !important;
  vertical-align: top !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .contract-action-cell .action-button {
  width: 100% !important;
  min-height: 30px !important;
  padding: 0 5px !important;
  font-size: 11px !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table .contract-action-empty {
  display: block !important;
  padding-top: 7px !important;
  text-align: center !important;
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table {
    min-width: 0 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(10)::before { content: "编辑"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(11)::before { content: "编辑合同"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(12)::before { content: "下载合同"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(13)::before { content: "打印合同"; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td:nth-child(14)::before { content: "电子签"; }
}

/* 2026-09-02 product-action-single-edit=20260902
 * Product and order lists stay focused on locating a record. The pattern
 * workbench is the intentional exception: assignment and the next legal step
 * are surfaced beside the row, while generic editing remains out of the list. */
body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(.product-workbench-table, .order-table) .product-actions-cell {
  overflow: visible !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(.product-workbench-table, .order-table) .product-actions-cell .product-row-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  flex-wrap: nowrap !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(.product-workbench-table, .order-table) .product-actions-cell .product-row-actions > .action-detail {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 78px !important;
  max-width: 100% !important;
  min-height: 34px !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(.product-workbench-table, .order-table) .product-actions-cell .product-row-actions
  > :is(.row-primary-action, .row-action-menu) {
  display: none !important;
}

/* 2026-09-02 workbench-action-single-line=20260902
 * Reference: output/uiux-gpt-image-2-r41/designer-workbench-compact-table.png
 * Compact the descriptive columns and reserve enough room for the workflow
 * action plus its overflow menu. The existing mobile record cards stay intact. */
@media (min-width: 761px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    min-width: 920px !important;
    table-layout: fixed !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table th:nth-child(1),
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table td:nth-child(1) { width: 84px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table th:nth-child(2),
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table td:nth-child(2) { width: 58px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table th:nth-child(3),
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table td:nth-child(3) { width: 132px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table th:nth-child(4),
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table td:nth-child(4) { width: 104px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table th:nth-child(5),
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table td:nth-child(5) { width: 120px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table th:nth-child(6),
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table td:nth-child(6) { width: 180px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table th:nth-child(7),
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table td:nth-child(7) { width: 126px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table th:nth-child(9),
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table td:nth-child(9) { width: 220px !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-actions-cell {
    overflow: visible !important;
    white-space: nowrap !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions {
    flex-wrap: nowrap !important;
  }
}

/* 2026-09-02 pattern-inline-dispatch=r1
 * The pattern workbench is the one list where the next legal workflow step
 * belongs beside the record. Keep the action rail compact and scoped; other
 * product lists retain their single-detail entry contract. */
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-actions-cell:has(.pattern-row-actions) {
  width: 260px !important;
  min-width: 260px !important;
  overflow: visible !important;
  white-space: normal !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-row-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  min-width: 0 !important;
  padding: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-row-actions > .row-primary-action {
  flex: 1 1 100% !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 32px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-row-actions > :is(.pattern-row-edit, .action-detail, .pattern-inline-more) {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-row-actions > .pattern-inline-more {
  display: flex !important;
  position: relative !important;
  align-self: stretch !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-inline-more .row-action-menu-trigger {
  min-height: 34px !important;
  padding-inline: 10px !important;
  font-size: 11px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-inline-more[open] {
  display: flex !important;
  flex: 1 1 100% !important;
  flex-direction: column !important;
  align-items: stretch !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-inline-more .row-action-menu-panel {
  width: 100% !important;
  max-width: none !important;
  margin-top: 4px !important;
  box-shadow: 0 8px 18px rgba(21, 36, 58, .12) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-owner-cell:has(.pattern-assignment-list) {
  width: 180px !important;
  min-width: 180px !important;
  vertical-align: middle !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-assignment-list {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-assignment-line {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-assignment-person {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: baseline !important;
  column-gap: 6px !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-assignment-person span {
  color: var(--r40-faint) !important;
  font-size: 10px !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-assignment-person strong {
  min-width: 0 !important;
  overflow: hidden !important;
  color: var(--r40-ink-2) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-assignment-person small {
  grid-column: 2 !important;
  min-width: 0 !important;
  color: var(--r40-faint) !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-assign-button {
  min-height: 28px !important;
  padding-inline: 8px !important;
  border-color: #b8d6d1 !important;
  color: #1b6f65 !important;
  background: #f4fbf9 !important;
  font-size: 10px !important;
  font-weight: 750 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-assign-button:hover,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-assign-button:focus-visible {
  border-color: #72afa5 !important;
  color: #0e5b52 !important;
  background: #e9f7f3 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-requirement-preview {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  color: var(--r40-muted) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-requirement-preview b {
  color: var(--r40-ink-2) !important;
  font-weight: 700 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .pattern-requirement-preview.is-empty {
  color: var(--r40-faint) !important;
}
@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-actions-cell:has(.pattern-row-actions) {
    width: 220px !important;
    min-width: 220px !important;
  }
}

/* 2026-09-02 full-layout-audit=r1
 * The product dialog lives beside #page, so page-scoped shell rules cannot
 * constrain its image frame. Keep every detail variant inside its grid track
 * and prevent legacy 280px image rules from covering the metadata/actions. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .details {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  gap: 10px !important;
  padding: 12px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top {
  display: grid !important;
  grid-template-columns: 132px minmax(0, 1fr) minmax(0, auto) !important;
  align-items: start !important;
  min-width: 0 !important;
  max-width: 100% !important;
  gap: 12px !important;
  padding: 12px !important;
  overflow: hidden !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > * {
  min-width: 0 !important;
  max-width: 100% !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block {
  width: 132px !important;
  min-width: 132px !important;
  max-width: 132px !important;
  overflow: hidden !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-drop {
  width: 132px !important;
  min-width: 132px !important;
  max-width: 132px !important;
  padding: 5px !important;
  gap: 5px !important;
  overflow: hidden !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-frame {
  width: 120px !important;
  height: 152px !important;
  max-width: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 5px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top :is(.detail-image,.detail-image-drop img) {
  width: 118px !important;
  height: 150px !important;
  max-width: 100% !important;
  object-fit: cover !important;
  border-radius: 5px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-drop-copy {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-main-action-row {
  width: 132px !important;
  max-width: 132px !important;
  min-width: 0 !important;
  align-items: stretch !important;
  flex-direction: column !important;
  gap: 4px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-main-action-row .image-main-action {
  width: 100% !important;
  min-width: 0 !important;
  padding-inline: 6px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-permission-note {
  max-width: 132px !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-actions {
  min-width: 0 !important;
  max-width: 360px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell :is(.detail-title,.detail-meta,.detail-top p,.detail-top strong,.detail-top span) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell :is(.detail-module-nav,.details > *, .detail-module-content, .fields, .form-grid, .sku-grid) {
  min-width: 0 !important;
  max-width: 100% !important;
}

@media (max-width: 900px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top {
    grid-template-columns: 112px minmax(0, 1fr) !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-drop {
    width: 112px !important;
    min-width: 112px !important;
    max-width: 112px !important;
    padding: 3px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-frame {
    width: 104px !important;
    height: 134px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top :is(.detail-image,.detail-image-drop img) {
    width: 102px !important;
    height: 132px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-actions {
    grid-column: 1 / -1 !important;
    max-width: 100% !important;
    justify-content: flex-start !important;
  }
}

@media (max-width: 560px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .details {
    padding: 8px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top {
    grid-template-columns: 80px minmax(0, 1fr) !important;
    gap: 9px !important;
    padding: 9px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-drop {
    width: 80px !important;
    min-width: 80px !important;
    max-width: 80px !important;
    padding: 3px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .detail-image-frame {
    width: 72px !important;
    height: 98px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top :is(.detail-image,.detail-image-drop img) {
    width: 70px !important;
    height: 96px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-drop-copy,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-permission-note,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .design-image-strip {
    max-width: 80px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-drop-copy small {
    display: none !important;
  }
}

/* Mobile contract cards: every visible field, including each command, gets
 * its own compact row instead of a tall anonymous action stack. */
@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table tr {
    padding: 7px 10px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td {
    grid-template-columns: 68px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 6px !important;
    min-height: 0 !important;
    padding: 3px 0 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td.contract-action-cell {
    align-items: center !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td.contract-action-cell .action-button {
    width: auto !important;
    min-height: 28px !important;
    justify-self: start !important;
    padding: 0 8px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .contract-table td.contract-action-cell .contract-action-empty {
    padding-top: 0 !important;
    text-align: left !important;
  }
}

/* Image ownership boundary, 2026-09-02: existing style details are a compact
 * read-only gallery; image upload/edit remains in the new-style design form. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block-readonly {
  width: 132px !important;
  min-width: 132px !important;
  max-width: 132px !important;
  gap: 6px !important;
  overflow: hidden !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block-readonly .detail-image-frame {
  width: 120px !important;
  height: 152px !important;
  padding: 0 !important;
  border: 1px solid #d8e0eb !important;
  border-radius: 6px !important;
  background: #f3f5f8 !important;
  box-shadow: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block-readonly .detail-image {
  width: 118px !important;
  height: 150px !important;
  object-fit: cover !important;
  border-radius: 5px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block-readonly .image-block-head {
  min-height: 0 !important;
  gap: 5px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block-readonly .image-block-head small {
  display: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block-readonly .design-image-strip {
  width: 132px !important;
  max-width: 132px !important;
  gap: 4px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top .image-block-readonly .image-permission-note {
  display: block !important;
  max-width: 132px !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}

/* Terminal shell contract (EOF): keep historical :has() rules from
 * reintroducing the desktop rail at tablet and mobile breakpoints. */
@media (max-width: 1100px) and (min-width: 761px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] { grid-template-columns: 188px minmax(0, 1fr) !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .sidebar { width: 188px !important; min-width: 188px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .workspace { width: 100% !important; min-width: 0 !important; }
}
@media (max-width: 760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    grid-template-rows: minmax(0, 1fr) 64px !important;
    width: 100% !important;
    min-height: 100dvh !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .workspace {
    order: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .sidebar {
    order: 2 !important;
    position: fixed !important;
    inset: auto 0 0 0 !important;
    width: 100vw !important;
    min-width: 0 !important;
    height: 64px !important;
    min-height: 64px !important;
    box-sizing: border-box !important;
  }
}

/* 2026-09-02 record-card-list=20260902-terminal
 * This final block intentionally follows every legacy compatibility layer so
 * no later table rule can restore spreadsheet cells or tab boxes. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .product-list-head {
  min-height: 0 !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-list-head .panel-kicker,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-list-legend {
  display: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-list-head h3 {
  margin: 0 !important;
  color: var(--r40-ink) !important;
  font-size: 19px !important;
  line-height: 1.25 !important;
  font-weight: 780 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-list-head .subtle {
  display: block !important;
  margin-top: 5px !important;
  color: var(--r40-muted) !important;
  font-size: 11px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .table-wrap {
  overflow: visible !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  table-layout: auto !important;
  border: 0 !important;
  border-collapse: separate !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
  display: grid !important;
  grid-template-columns: 72px 56px minmax(132px, 1fr) minmax(130px, .95fr) minmax(220px, 1.35fr) minmax(140px, 1fr) minmax(132px, .95fr) minmax(110px, .8fr) auto !important;
  align-items: center !important;
  gap: 0 12px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 14px 16px !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: 12px !important;
  background: var(--r40-surface) !important;
  box-shadow: 0 4px 14px rgba(21, 36, 58, .045) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr:has(td[colspan]) {
  display: block !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr:hover,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr.is-selected {
  background: var(--r40-surface) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr:hover td,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr.is-selected td {
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr.is-selected {
  border-color: #efb2aa !important;
  box-shadow: 0 0 0 2px var(--r40-coral-soft), 0 4px 14px rgba(21, 36, 58, .045) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  vertical-align: middle !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .style-code {
  display: inline !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--r40-blue) !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  font-weight: 780 !important;
  white-space: nowrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-image {
  width: 48px !important;
  height: 62px !important;
  border: 1px solid var(--r40-line) !important;
  border-radius: 8px !important;
  object-fit: cover !important;
  background: var(--r40-surface-soft) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .stack {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .stack strong {
  color: var(--r40-ink) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .stack span,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .subtle {
  color: var(--r40-muted) !important;
  font-size: 10px !important;
  line-height: 1.4 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7)::before {
  display: block !important;
  margin-bottom: 3px !important;
  color: var(--r40-faint) !important;
  content: "规格与 SKU" !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 7px !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions > :is(.action-detail, .row-primary-action, .row-action-menu-trigger, .action-button) {
  min-height: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--r40-blue) !important;
  box-shadow: none !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .pagination {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 0 !important;
  margin-top: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--r40-muted) !important;
  font-size: 11px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .pagination-actions button {
  min-height: 28px !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--r40-blue) !important;
  box-shadow: none !important;
}

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
  min-height: 46px !important;
  height: 46px !important;
  padding: 0 26px !important;
  align-items: stretch !important;
  gap: 22px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--r40-line) !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:first-child {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--r40-muted) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-main {
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-close {
  width: 20px !important;
  height: 20px !important;
  margin-left: 6px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--r40-faint) !important;
  font-size: 16px !important;
  line-height: 20px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:is(:hover, .active) {
  color: var(--r40-ink) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab.active::after {
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  height: 2px !important;
  border-radius: 2px 2px 0 0 !important;
  background: var(--r40-coral) !important;
  content: "" !important;
}

@media (min-width: 761px) and (max-width: 1180px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    grid-template-columns: 64px 52px minmax(150px, 1fr) minmax(180px, 1.2fr) minmax(130px, 1fr) auto !important;
    grid-template-areas:
      "style image identity identity owner actions"
      "style image category flow attrs match" !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(1) { grid-area: style !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(2) { grid-area: image !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(3) { grid-area: identity !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(4) { grid-area: category !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(5) { grid-area: flow !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(6) { grid-area: owner !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7) { grid-area: attrs !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(8) { grid-area: match !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(9) { grid-area: actions !important; }
}

@media (max-width: 760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 12px !important;
    gap: 18px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:first-child {
    height: 42px !important;
    min-height: 42px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    grid-template-columns: 54px minmax(0, 1fr) !important;
    grid-template-areas:
      "image style"
      "image identity"
      "category category"
      "flow flow"
      "owner owner"
      "attrs attrs"
      "actions actions" !important;
    gap: 9px 12px !important;
    padding: 13px !important;
    border-radius: 12px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(1) { grid-area: style !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(2) { grid-area: image !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(3) { grid-area: identity !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(4) { grid-area: category !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(5) { grid-area: flow !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(6) { grid-area: owner !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7) { grid-area: attrs !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(8) { display: none !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(9) {
    grid-area: actions !important;
    justify-self: start !important;
    padding-top: 9px !important;
    border-top: 1px solid #e8edf2 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-image {
    width: 54px !important;
    height: 68px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .style-code {
    font-size: 15px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .pagination {
    align-items: flex-start !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
  }
} /* r40-eof-anchor */

/* The owner assignment is part of the record narrative. Keep the two roles
 * readable, but avoid rebuilding a miniature button grid inside every card. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table
  .product-owner-cell:has(.pattern-assignment-list) {
  width: auto !important;
  min-width: 0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table
  .pattern-assignment-list {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table
  .pattern-assignment-line {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table
  .pattern-assign-button {
  min-width: max-content !important;
  min-height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--r40-blue) !important;
  box-shadow: none !important;
}

/* 2026-09-02 content-surface-normalization=20260902-terminal
 * The final authenticated surface contract. The rail and image-preview
 * backdrop remain intentionally dark; business content does not. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) {
  --ui-canvas: #f4f6f8 !important;
  --ui-canvas-raised: #ffffff !important;
  --ui-surface: #ffffff !important;
  --ui-surface-soft: #f8fafc !important;
  --ui-surface-raised: #f1f6fb !important;
  --ui-surface-elevated: #ffffff !important;
  --ui-ink: #15243a !important;
  --ui-ink-soft: #33445b !important;
  --ui-muted: #69788b !important;
  --canvas: #f4f6f8 !important;
  --surface: #ffffff !important;
  --surface-soft: #f8fafc !important;
  --surface-raised: #f1f6fb !important;
  --surface-elevated: #ffffff !important;
  --ink: #15243a !important;
  --ink-soft: #33445b !important;
  --muted: #69788b !important;
  color-scheme: light !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.panel,.metric,.metric-card,.summary-card,.schedule-kpi,.dashboard-module-card,.dashboard-intelligence-card,.dashboard-sales-card,.dashboard-chart-panel,.operation-connector-card,.hr-department-card,.finance-invoice-preview,.operation-data-note,.order-product-summary,.role-banner,.schedule-hero,.privacy-notice,.flow,.feed li,.attention-item,.risk-item,.table-wrap,.product-table,.data-table,.order-line-table,.hr-table,.account-table,.contract-table,.product-detail-shell,.details,.detail-module,.detail-module-content,.detail-focus-section,.pattern-progress,.pattern-progress-section,.pattern-requirement-section,.pattern-timeline,.fields,.field,.detail-more-fields,.sku-grid,.empty-state,.permission-empty,.detail-fields-empty,.model-reference-slot,.consent-check,.styling-section,.styling-output-section,.styling-output-preview,.model-image-inline-empty,.model-image-output-empty,.model-scene-reference,.ai-chat-panel,.ai-chat-stage,.ai-assistant-mode,.ai-chat-turn > p,.knowledge-answer-copy,.ai-chat-file-card,.ai-chat-image-wrap,.ai-chat-quick-prompt,.form-footer,.row-action-menu-panel,.schedule-product-option,.order-product-results,.order-product-result) {
  color: #33445b !important;
  background: #ffffff !important;
  background-image: none !important;
  border-color: #dbe3eb !important;
  box-shadow: none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.panel-head,.detail-module-head,.pattern-progress-head,.history-head,.form-footer,.dashboard-module-head) {
  color: #15243a !important;
  background: #f7f9fb !important;
  background-image: none !important;
  border-color: #dbe3eb !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.detail-module-content,.field,.detail-focus-section,.detail-module) { background: #ffffff !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.fields,.sku-grid) { background: #f8fafc !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .detail-module-actions { color: #33445b !important; background: #eff9f5 !important; border-color: #c9e3da !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .detail-module-contract-actions { color: #6a4a10 !important; background: #fff8eb !important; border-color: #efd39b !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.detail-module-nav,.detail-more-fields summary,.model-reference-slot,.consent-check) { color: #69788b !important; background: #f3f4f6 !important; border-color: #dbe3eb !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(input,select,textarea,.order-product-search,.schedule-product-search input) { color: #15243a !important; background: #fff !important; border-color: #c4d0dc !important; color-scheme: light !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(h1,h2,h3,h4,h5,h6,strong,dt,dd,label,legend,caption,summary) { color: #15243a !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(p,small,.subtle,.muted,.helper-text,.field-help,.meta,.detail-meta,.dialog-help) { color: #69788b !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.image-drop,.detail-image-drop,.attachment-picker,.model-image-inline-empty,.detail-fields-empty,.permission-empty) { color: #69788b !important; background: #f8fafc !important; border-color: #c4d0dc !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.tag,.status-tag,.chip,.effect-status,.revision-alert-badge,.risk-level,.operation-data-status) { color: #33445b !important; background: #eef2f6 !important; border-color: transparent !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.tag.blue,.status-tag.blue,.chip.blue) { color: #245ca8 !important; background: #edf4ff !important; border-color: #c5daf6 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.tag.green,.status-tag.green,.chip.green) { color: #16734b !important; background: #eaf8f1 !important; border-color: #bfe5d1 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.tag.orange,.status-tag.orange,.chip.orange) { color: #945a17 !important; background: #fff6e6 !important; border-color: #efd29d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.tag.red,.status-tag.red,.chip.red) { color: #aa3048 !important; background: #fff0f2 !important; border-color: #efc1c9 !important; }

/* Final empty-table neutralization, kept after every historical override. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) tbody,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) tr,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) td {
  color: var(--r40-muted) !important;
  background: #fff !important;
  background-image: none !important;
  border-color: var(--r40-line) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] #page table:has(.empty-state) .empty-state {
  color: var(--r40-muted) !important;
  background: var(--r40-surface-soft) !important;
  border-color: var(--r40-line-strong) !important;
}
/* r40-eof-hook */

/* 2026-09-02 r40 visual closeout (terminal)
 * This block is intentionally last. It resolves only cascade conflicts that
 * affect scanability and responsive fit; business markup and event hooks stay
 * untouched. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.product-table,.order-table) .product-actions-cell {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
  white-space: normal !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.product-table,.order-table) .product-actions-cell .product-row-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.product-table,.order-table) .product-actions-cell .product-row-actions > * {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

/* Tabs are a recent-module navigation strip, not a set of cells. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
  display: flex !important;
  align-items: stretch !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: thin !important;
  scrollbar-color: #c4d0dc transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab {
  flex: 0 0 auto !important;
  max-width: min(30vw, 220px) !important;
  white-space: nowrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-main {
  min-width: 0 !important;
  max-width: min(24vw, 180px) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Gallery controls live below the thumbnail instead of covering it. The
 * dialog is a sibling of the app shell, so this selector avoids #page. */
body.workspace-mode .dialog .design-image-strip,
body.workspace-mode .product-detail-shell .design-image-strip {
  display: flex !important;
  align-items: flex-start !important;
  gap: 6px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}
body.workspace-mode .dialog .design-image-thumb-wrap,
body.workspace-mode .product-detail-shell .design-image-thumb-wrap {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 20px !important;
  grid-template-rows: auto auto auto !important;
  align-items: start !important;
  justify-items: stretch !important;
  width: 64px !important;
  min-width: 64px !important;
  min-height: 88px !important;
  gap: 3px !important;
  overflow: visible !important;
}
body.workspace-mode .dialog .design-image-thumb,
body.workspace-mode .product-detail-shell .design-image-thumb {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  width: 60px !important;
  height: 62px !important;
  min-width: 0 !important;
  padding: 2px !important;
  border-radius: 5px !important;
}
body.workspace-mode .dialog .design-image-thumb-label,
body.workspace-mode .product-detail-shell .design-image-thumb-label {
  grid-column: 1 !important;
  grid-row: 2 !important;
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: var(--r40-muted) !important;
  font-size: 10px !important;
  line-height: 1.25 !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body.workspace-mode .dialog .design-image-delete,
body.workspace-mode .product-detail-shell .design-image-delete {
  position: static !important;
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: center !important;
  justify-self: end !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  box-shadow: none !important;
}
body.workspace-mode .dialog .design-image-replace,
body.workspace-mode .product-detail-shell .design-image-replace {
  position: static !important;
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  justify-self: center !important;
  transform: none !important;
  min-width: 0 !important;
  min-height: 20px !important;
  margin: 0 !important;
  padding-inline: 6px !important;
  font-size: 10px !important;
  line-height: 18px !important;
  white-space: nowrap !important;
}

/* Permission guidance stays quiet and readable, without becoming another
 * elevated card in admin or detail surfaces. */
body.workspace-mode .dialog :is(.permission-empty,.permission-empty-copy,.role-assignment-note,.account-role-scope),
body.workspace-mode .app-shell[data-ui-shell="r26"] #page :is(.permission-empty,.permission-empty-copy,.role-assignment-note,.account-role-scope) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .dialog .permission-empty,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .permission-empty {
  display: grid !important;
  gap: 6px !important;
  justify-items: start !important;
  padding: 18px !important;
  border: 1px dashed var(--r40-line-strong) !important;
  border-radius: 6px !important;
  background: var(--r40-surface-soft) !important;
}
body.workspace-mode .dialog .role-assignment-note,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .role-assignment-note {
  margin-inline: 0 !important;
  border: 1px solid #c5daf6 !important;
  border-radius: 4px !important;
  background: #f3f7fc !important;
}

/* Narrow tablet: preserve the rail but switch workbench rows to readable
 * records before the six-column layout becomes wider than the viewport. */
@media (min-width: 761px) and (max-width: 900px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    grid-template-columns: 56px minmax(0, 1fr) !important;
    grid-template-areas:
      "image style"
      "image identity"
      "category category"
      "flow flow"
      "owner owner"
      "attrs attrs"
      "actions actions" !important;
    gap: 9px 12px !important;
    padding: 13px !important;
    border-radius: 8px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(1) { grid-area: style !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(2) { grid-area: image !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(3) { grid-area: identity !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(4) { grid-area: category !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(5) { grid-area: flow !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(6) { grid-area: owner !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7) { grid-area: attrs !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(8) { display: none !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(9) {
    grid-area: actions !important;
    justify-self: start !important;
    padding-top: 9px !important;
    border-top: 1px solid #e8edf2 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-image {
    width: 54px !important;
    height: 68px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-actions-cell:has(.pattern-row-actions) {
    width: auto !important;
    min-width: 0 !important;
  }
}

@media (min-width: 761px) and (max-width: 900px) {
  body.workspace-mode .product-detail-shell .detail-top .image-block-readonly {
    width: 112px !important;
    min-width: 112px !important;
    max-width: 112px !important;
  }
  body.workspace-mode .product-detail-shell .detail-top .image-block-readonly .detail-image-frame {
    width: 104px !important;
    height: 134px !important;
  }
  body.workspace-mode .product-detail-shell .detail-top .image-block-readonly .detail-image {
    width: 102px !important;
    height: 132px !important;
  }
  body.workspace-mode .product-detail-shell .detail-top .image-block-readonly .design-image-strip {
    width: 112px !important;
    max-width: 112px !important;
  }
}

@media (max-width: 760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
    gap: 16px !important;
    padding-inline: 12px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab {
    max-width: 42vw !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-main {
    max-width: 34vw !important;
  }
  body.workspace-mode .product-detail-shell .detail-top .image-block-readonly {
    width: 80px !important;
    min-width: 80px !important;
    max-width: 80px !important;
  }
  body.workspace-mode .product-detail-shell .detail-top .image-block-readonly .detail-image-frame {
    width: 72px !important;
    height: 98px !important;
  }
  body.workspace-mode .product-detail-shell .detail-top .image-block-readonly .detail-image {
    width: 70px !important;
    height: 96px !important;
  }
  body.workspace-mode .product-detail-shell .detail-top .image-block-readonly .design-image-strip {
    width: 80px !important;
    max-width: 80px !important;
    gap: 4px !important;
  }
  body.workspace-mode .product-detail-shell .detail-top .image-block-readonly .image-permission-note {
    max-width: 80px !important;
    font-size: 9px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.workspace-mode .workspace-tab,
  body.workspace-mode .design-image-thumb {
    transition: none !important;
  }
}

/* END frontend/assets/ui-system-r40.css */

/* BEGIN frontend/assets/ui-system-r50.css */
/*
 * UI system r50 · image-to-front from gpt-image-2
 * Reference: output/uiux-gpt-image-2-r50/operations-workspace-rebuild.png
 * The reference resolves the repeated airy-row problem as a compact
 * operations ledger: one status band, one record list, and one contextual
 * action surface. This terminal layer keeps existing semantics and only
 * changes the authenticated workspace presentation.
 */
:root {
  --r50-canvas:#f4f6f8;
  --r50-surface:#fff;
  --r50-line:#dfe5eb;
  --r50-line-strong:#c9d3dd;
  --r50-ink:#17324d;
  --r50-muted:#52677d;
  --r50-faint:#7d8b99;
  --r50-coral:#e86b5d;
  --r50-coral-soft:#fff2ef;
  --r50-blue:#175cd3;
  --r50-green:#13795b;
  --r50-green-soft:#eef9f4;
  --r50-amber:#9a6700;
  --r50-amber-soft:#fff8e8;
  --r50-radius:6px;
}

/* 2026-09-03 activity-panel-surface=20260903-r1
 * The activity drawer lives outside .app-shell. Re-establish its complete
 * light surface contract here so legacy dark feed rules cannot leak into
 * reminders or system history. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel {
  z-index:5 !important;
  width:min(380px,100vw) !important;
  max-width:100vw !important;
  min-width:0 !important;
  height:calc(100dvh - 80px) !important;
  min-height:0 !important;
  padding:20px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior:contain !important;
  color:var(--r50-ink) !important;
  background:var(--r50-surface) !important;
  background-image:none !important;
  border-left:1px solid var(--r50-line) !important;
  box-shadow:-14px 0 30px rgba(23,50,77,.12) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-head {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:start !important;
  gap:12px !important;
  min-width:0 !important;
  margin:0 0 12px !important;
  padding:0 0 15px !important;
  border-bottom:1px solid var(--r50-line) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-head > div:first-child,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-head-actions {
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-head h2,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-heading {
  color:var(--r50-ink) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-head h2 {
  margin:0 !important;
  font-size:18px !important;
  line-height:1.3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-summary,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-filter-note,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-meta,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-change,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .subtle {
  color:var(--r50-muted) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-summary {
  display:block !important;
  margin-top:3px !important;
  font-size:11px !important;
  line-height:1.45 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-head-actions {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:wrap !important;
  gap:6px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-filter-note {
  margin:0 0 12px !important;
  padding:8px 10px !important;
  border:1px solid var(--r50-line) !important;
  border-radius:5px !important;
  background:#f7f9fb !important;
  font-size:12px !important;
  line-height:1.55 !important;
  overflow-wrap:anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel :is(.feed,.notification-feed) {
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
  background:transparent !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel :is(.feed-item,.notification-item) {
  display:grid !important;
  grid-template-columns:8px minmax(0,1fr) !important;
  align-items:start !important;
  gap:10px !important;
  min-width:0 !important;
  margin:0 0 8px !important;
  padding:12px !important;
  border:1px solid var(--r50-line) !important;
  border-radius:var(--r50-radius) !important;
  color:var(--r50-ink) !important;
  background:var(--r50-surface) !important;
  background-image:none !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel :is(.feed-item,.notification-item):last-child {
  margin-bottom:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-item.unread,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .notification-item.unread {
  border-color:#efd9a7 !important;
  background:var(--r50-amber-soft) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel :is(.feed-item[data-open],.notification-item):is(:hover,:focus-within) {
  border-color:var(--r50-line-strong) !important;
  background:#f7f9fb !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-item[data-open]:focus-visible {
  outline:2px solid #9cbef4 !important;
  outline-offset:2px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-item > div {
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-mark {
  width:8px !important;
  height:8px !important;
  margin-top:6px !important;
  border-radius:50% !important;
  background:var(--r50-blue) !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-item.unread .feed-mark {
  background:var(--r50-coral) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-title,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-title strong {
  min-width:0 !important;
  color:var(--r50-ink) !important;
  font-size:13px !important;
  line-height:1.45 !important;
  overflow-wrap:anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-title strong {
  font-weight:700 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-meta,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-change,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .notification-message,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .notification-context,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-record-id {
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-meta {
  margin-top:4px !important;
  font-size:11px !important;
  line-height:1.5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .notification-message {
  margin-top:7px !important;
  color:#334e68 !important;
  font-size:12px !important;
  line-height:1.55 !important;
  white-space:pre-wrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .notification-context {
  margin-top:7px !important;
  color:#176b61 !important;
  font-size:12px !important;
  line-height:1.55 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .feed-change {
  margin-top:7px !important;
  padding:6px 8px !important;
  border-left:2px solid #9bb9d7 !important;
  background:#f4f7fa !important;
  font-size:11px !important;
  line-height:1.5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-record-id {
  color:#5e7185 !important;
  background:#eef2f5 !important;
  border-radius:3px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .notification-actions,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .history-actions {
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  min-width:0 !important;
  margin-top:9px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel :is(.secondary,.compact-button) {
  min-width:0 !important;
  min-height:34px !important;
  padding:7px 10px !important;
  border:1px solid var(--r50-line-strong) !important;
  border-radius:5px !important;
  color:var(--r50-ink) !important;
  background:#fff !important;
  background-image:none !important;
  font-size:12px !important;
  font-weight:650 !important;
  line-height:1.25 !important;
  white-space:normal !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel :is(.secondary,.compact-button):is(:hover,:focus-visible) {
  border-color:#8eb1e7 !important;
  color:var(--r50-blue) !important;
  background:#eef5ff !important;
  outline:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel :is(.secondary,.compact-button):disabled {
  cursor:not-allowed !important;
  color:#7d8b99 !important;
  border-color:var(--r50-line) !important;
  background:#f4f6f8 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .action-link {
  min-height:30px !important;
  padding:4px 0 !important;
  border:0 !important;
  color:var(--r50-blue) !important;
  background:transparent !important;
  font-size:12px !important;
  line-height:1.35 !important;
  text-decoration:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .action-link:is(:hover,:focus-visible) {
  color:#1249ad !important;
  text-decoration:underline !important;
  outline:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .empty-state {
  display:grid !important;
  gap:6px !important;
  min-width:0 !important;
  margin:0 0 8px !important;
  padding:18px 14px !important;
  border:1px dashed var(--r50-line-strong) !important;
  border-radius:var(--r50-radius) !important;
  color:var(--r50-muted) !important;
  background:#fbfcfd !important;
  text-align:left !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .empty-state strong {
  color:var(--r50-ink) !important;
  font-size:13px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .empty-state span {
  color:var(--r50-muted) !important;
  font-size:12px !important;
  line-height:1.55 !important;
  overflow-wrap:anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-heading {
  margin:22px 0 9px !important;
  padding-top:17px !important;
  border-top:1px solid var(--r50-line) !important;
  font-size:16px !important;
  line-height:1.35 !important;
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel {
    top:0 !important;
    width:100vw !important;
    height:100dvh !important;
    padding:16px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-head {
    grid-template-columns:minmax(0,1fr) minmax(112px,38%) !important;
    gap:10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-head-actions {
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    gap:6px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel .activity-head-actions :is(.secondary,.compact-button) {
    width:100% !important;
    min-height:36px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #activityPanel.activity-panel :is(.feed-item,.notification-item) {
    padding:11px 10px !important;
  }
}

/* mobile-upload=20260904-r1: one consistent, light-weight QR intake surface */
html body.workspace-mode .mobile-upload-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1200 !important;
  display: grid !important;
  place-items: center !important;
  padding: 20px !important;
  background: rgba(15, 23, 42, .52) !important;
  color-scheme: light !important;
}
html body.workspace-mode .mobile-upload-dialog {
  width: min(760px, calc(100vw - 32px)) !important;
  max-height: min(720px, calc(100vh - 40px)) !important;
  overflow: auto !important;
  border: 1px solid #d8e0e9 !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: #172033 !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .28) !important;
}
html body.workspace-mode .mobile-upload-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 20px 24px 16px !important;
  border-bottom: 1px solid #e6ebf1 !important;
}
html body.workspace-mode .mobile-upload-head h2 { margin: 4px 0 0 !important; color: #16283f !important; font-size: 22px !important; }
html body.workspace-mode .mobile-upload-body { padding: 24px !important; }
html body.workspace-mode .mobile-upload-grid { display: grid !important; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr) !important; gap: 28px !important; align-items: center !important; }
html body.workspace-mode .mobile-upload-qr { display: grid !important; justify-items: center !important; gap: 10px !important; color: #687386 !important; text-align: center !important; }
html body.workspace-mode .mobile-upload-qr img { width: 250px !important; height: 250px !important; max-width: 100% !important; padding: 10px !important; border: 1px solid #e1e7ef !important; border-radius: 8px !important; background: #fff !important; }
html body.workspace-mode .mobile-upload-instructions { display: grid !important; gap: 10px !important; min-width: 0 !important; color: #526174 !important; }
html body.workspace-mode .mobile-upload-instructions strong { color: #173452 !important; font-size: 17px !important; }
html body.workspace-mode .mobile-upload-instructions p { margin: 0 !important; line-height: 1.55 !important; }
html body.workspace-mode .mobile-upload-instructions label { display: grid !important; gap: 5px !important; color: #687386 !important; font-size: 12px !important; }
html body.workspace-mode .mobile-upload-instructions input { min-width: 0 !important; width: 100% !important; padding: 9px 10px !important; border: 1px solid #d5dde7 !important; border-radius: 6px !important; background: #f8fafc !important; color: #34465b !important; }
html body.workspace-mode .mobile-upload-actions { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
html body.workspace-mode .mobile-upload-status { color: #2f7a62 !important; font-size: 13px !important; }
html body.workspace-mode .mobile-upload-loading, html body.workspace-mode .mobile-upload-error { padding: 32px 8px !important; color: #526174 !important; text-align: center !important; }
html body.workspace-mode .model-reference-slot.drag-over, html body.workspace-mode .model-reference-upload.drag-over, html body.workspace-mode .image-drop.drag-over { outline: 2px solid #4d8fe8 !important; outline-offset: 2px !important; background: #eef6ff !important; }
html body.workspace-mode .profile-mobile-upload { justify-self: start !important; margin-top: 4px !important; }
html body.workspace-mode .model-reference-upload { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 12px !important; }
html body.workspace-mode .image-field-actions { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: 8px !important; }
@media (max-width: 700px) {
  html body.workspace-mode .mobile-upload-grid { grid-template-columns: 1fr !important; gap: 18px !important; }
  html body.workspace-mode .mobile-upload-qr img { width: 210px !important; height: 210px !important; }
  html body.workspace-mode .mobile-upload-head, html body.workspace-mode .mobile-upload-body { padding-left: 16px !important; padding-right: 16px !important; }
  html body.workspace-mode .model-reference-upload { grid-template-columns: 1fr !important; align-items: start !important; }
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) {
  background:var(--r50-canvas) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar {
  width:196px !important;
  min-width:196px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .page {
  padding-top:18px !important;
  padding-bottom:36px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.panel,.toolbar,.table-wrap,.metric,.work-card) {
  border-color:var(--r50-line) !important;
  box-shadow:none !important;
}

/* Recent views are a quiet navigation strip rather than a row of boxes. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
  min-height:40px !important;
  height:40px !important;
  padding:0 22px !important;
  gap:18px !important;
  align-items:stretch !important;
  border-bottom:1px solid var(--r50-line) !important;
  background:var(--r50-surface) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:first-child {
  height:40px !important;
  min-height:40px !important;
  max-width:190px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--r50-muted) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-main {
  max-width:160px !important;
  height:100% !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:inherit !important;
  font-size:12px !important;
  font-weight:700 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-close {
  width:20px !important;
  height:20px !important;
  margin-left:5px !important;
  border:0 !important;
  border-radius:50% !important;
  background:transparent !important;
  color:var(--r50-faint) !important;
  font-size:15px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:is(:hover,.active) {
  color:var(--r50-ink) !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab.active::after {
  height:2px !important;
  right:0 !important;
  bottom:0 !important;
  left:0 !important;
  border-radius:0 !important;
  background:var(--r50-coral) !important;
}

/* Work cards become one segmented status band with a single clear affordance. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-cards {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:1px !important;
  margin:0 0 14px !important;
  padding:1px !important;
  border:1px solid var(--r50-line) !important;
  border-radius:var(--r50-radius) !important;
  background:var(--r50-line) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card {
  min-width:0 !important;
  min-height:92px !important;
  padding:14px 16px !important;
  border:0 !important;
  border-radius:0 !important;
  background:var(--r50-surface) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card h3 {
  margin:0 !important;
  color:var(--r50-ink) !important;
  font-size:13px !important;
  line-height:1.35 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card p {
  min-height:32px !important;
  margin:4px 0 10px !important;
  color:var(--r50-muted) !important;
  font-size:11px !important;
  line-height:1.45 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card .number {
  display:flex !important;
  align-items:baseline !important;
  gap:6px !important;
  color:var(--r50-ink) !important;
  font-size:24px !important;
  line-height:1 !important;
  font-weight:780 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card .number span {
  color:var(--r50-blue) !important;
  font-size:11px !important;
  font-weight:700 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card-number {
  width:auto !important;
  min-height:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card-number:hover {
  color:var(--r50-coral) !important;
}

/* All record lists share the same compact rhythm. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel {
  border-radius:var(--r50-radius) !important;
  background:var(--r50-surface) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .product-list-head {
  min-height:48px !important;
  margin-bottom:8px !important;
  padding:0 2px 10px !important;
  border-bottom:1px solid var(--r50-line) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel .product-list-head h3 {
  color:var(--r50-ink) !important;
  font-size:17px !important;
  line-height:1.3 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody {
  gap:8px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
  grid-template-columns:60px 48px minmax(130px,1.15fr) minmax(110px,.9fr) minmax(170px,1.35fr) minmax(125px,1fr) minmax(122px,.9fr) minmax(92px,.7fr) max-content !important;
  gap:0 10px !important;
  min-height:78px !important;
  padding:11px 13px !important;
  border-radius:var(--r50-radius) !important;
  border-color:var(--r50-line) !important;
  background:var(--r50-surface) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr:hover,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr.is-selected {
  border-color:#e6b0a9 !important;
  box-shadow:0 0 0 2px var(--r50-coral-soft) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-image {
  width:42px !important;
  height:56px !important;
  border-radius:4px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .stack strong {
  font-size:11px !important;
  line-height:1.35 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .stack span,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .subtle {
  font-size:10px !important;
  line-height:1.35 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions {
  justify-content:flex-start !important;
  flex-wrap:nowrap !important;
  gap:7px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions > :is(.action-detail,.row-primary-action,.row-action-menu-trigger,.action-button) {
  min-height:28px !important;
  font-size:11px !important;
}

/* Order ledger: keep semantics in the DOM, but expose only decision fields. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .table-wrap {
  overflow:visible !important;
  background:transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table {
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  table-layout:auto !important;
  border-collapse:separate !important;
  background:transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table thead {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  white-space:nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody {
  display:grid !important;
  gap:8px !important;
  background:transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody tr {
  display:grid !important;
  grid-template-columns:72px 52px minmax(135px,1.2fr) minmax(110px,.9fr) 104px 72px minmax(140px,1fr) minmax(140px,1fr) max-content !important;
  grid-template-areas:"style image identity category progress qty procurement schedule actions" !important;
  align-items:center !important;
  gap:0 10px !important;
  min-width:0 !important;
  padding:11px 13px !important;
  border:1px solid var(--r50-line) !important;
  border-radius:var(--r50-radius) !important;
  background:var(--r50-surface) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td {
  display:block !important;
  width:auto !important;
  min-width:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  overflow-wrap:anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:nth-child(1) { grid-area:style !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:nth-child(2) { grid-area:image !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:nth-child(3) { grid-area:identity !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:nth-child(4) { grid-area:category !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:nth-child(6) { grid-area:progress !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:nth-child(7) { grid-area:qty !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:nth-child(14) { grid-area:procurement !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:nth-child(15) { grid-area:schedule !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td:nth-child(16) { grid-area:actions !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table :is(th:nth-child(5),td:nth-child(5),th:nth-child(8),td:nth-child(8),th:nth-child(9),td:nth-child(9),th:nth-child(10),td:nth-child(10),th:nth-child(11),td:nth-child(11),th:nth-child(12),td:nth-child(12),th:nth-child(13),td:nth-child(13)) {
  display:none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-image {
  width:44px !important;
  height:58px !important;
  border-radius:4px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .stack {
  display:grid !important;
  gap:2px !important;
  min-width:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .stack > :is(strong,span),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .subtle {
  min-width:0 !important;
  font-size:10px !important;
  line-height:1.35 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .style-code {
  font-size:12px !important;
  font-weight:780 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-actions-cell,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-row-actions {
  min-width:0 !important;
  white-space:normal !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-row-actions {
  display:flex !important;
  flex-wrap:nowrap !important;
  justify-content:flex-start !important;
  gap:6px !important;
}

/* Secondary order facts are an intentional disclosure, not a second table. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-record-more {
  margin-top:6px !important;
  color:var(--r50-muted) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-record-more summary {
  cursor:pointer !important;
  color:var(--r50-blue) !important;
  font-size:10px !important;
  font-weight:700 !important;
  list-style:none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-record-more summary::-webkit-details-marker { display:none !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-record-more summary::before { content:"+ " !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-record-more[open] summary::before { content:"− " !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-record-more-grid {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(130px,1fr)) !important;
  gap:6px 10px !important;
  min-width:260px !important;
  margin-top:7px !important;
  padding:8px !important;
  border:1px solid var(--r50-line) !important;
  border-radius:4px !important;
  background:#f8fafc !important;
  font-size:10px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .order-record-more-grid span {
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .order-record-more-grid b {
  display:block !important;
  margin-bottom:2px !important;
  color:var(--r50-faint) !important;
  font-size:9px !important;
}

/* r64 order-disclosure-boundary · 2026-09-02 · image-to-front=gpt-image-2 */
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table tbody td.order-record-more-cell {
  grid-column:1/-1 !important;
  grid-row:2 !important;
  width:auto !important;
  min-width:0 !important;
  padding:8px 0 0 !important;
  border-top:1px solid var(--r50-line) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-record-more-cell .order-record-more {
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  margin-top:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-record-more-cell .order-record-more-grid {
  width:100% !important;
  min-width:0 !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}

/* Finance and HR tables use the same compact record language. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table {
  border-collapse:separate !important;
  border-spacing:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table tbody tr,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table tbody tr {
  border-bottom:1px solid var(--r50-line) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table td,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table td {
  padding:9px 10px !important;
  line-height:1.35 !important;
  vertical-align:middle !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table .row-actions {
  display:flex !important;
  flex-wrap:wrap !important;
  gap:5px !important;
  margin-top:5px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table .compact-button {
  min-height:28px !important;
  padding:0 8px !important;
  font-size:10px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table-wrap {
  overflow-x:auto !important;
  scrollbar-gutter:stable !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table th:first-child,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table td:first-child {
  position:sticky !important;
  left:0 !important;
  z-index:1 !important;
  background:var(--r50-surface) !important;
  box-shadow:1px 0 0 var(--r50-line) !important;
}

@media (max-width:1080px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar {
    width:188px !important;
    min-width:188px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    grid-template-columns:54px 46px minmax(120px,1fr) minmax(105px,.9fr) minmax(140px,1.1fr) minmax(110px,.9fr) minmax(110px,.9fr) max-content !important;
    grid-template-areas:"style image identity identity owner actions actions actions" "style image category flow attrs attrs match actions" !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody tr {
    grid-template-columns:64px 48px minmax(120px,1.1fr) minmax(100px,.9fr) 94px 64px minmax(120px,1fr) minmax(120px,1fr) max-content !important;
  }
}

@media (max-width:760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
    min-height:38px !important;
    height:38px !important;
    padding:0 12px !important;
    gap:15px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:first-child {
    height:38px !important;
    min-height:38px !important;
    max-width:44vw !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-main { max-width:34vw !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-cards {
    grid-template-columns:1fr !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card {
    min-height:74px !important;
    padding:11px 13px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card p {
    min-height:0 !important;
    margin-bottom:6px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    grid-template-columns:52px minmax(0,1fr) !important;
    grid-template-areas:"image style" "image identity" "category category" "flow flow" "owner owner" "attrs attrs" "match match" "actions actions" !important;
    gap:8px 11px !important;
    padding:12px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(9) {
    justify-self:start !important;
    padding-top:8px !important;
    border-top:1px solid var(--r50-line) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody tr {
    grid-template-columns:1fr !important;
    grid-template-areas:"style" "image" "identity" "category" "progress" "qty" "procurement" "schedule" "actions" !important;
    gap:8px !important;
    padding:12px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td {
    display:block !important;
    grid-column:1/-1 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td::before {
    display:block !important;
    margin-bottom:2px !important;
    color:var(--r50-faint) !important;
    content:attr(data-label) !important;
    font-size:9px !important;
    font-weight:700 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table .product-actions-cell {
    padding-top:8px !important;
    border-top:1px solid var(--r50-line) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-record-more-grid {
    grid-template-columns:1fr !important;
    min-width:0 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-panel .order-table tbody td.order-record-more-cell {
    grid-column:1/-1 !important;
    grid-row:auto !important;
    width:auto !important;
    min-width:0 !important;
    padding:8px 0 0 !important;
    border-top:1px solid var(--r50-line) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .order-record-more-cell .order-record-more-grid {
    width:100% !important;
    min-width:0 !important;
    grid-template-columns:1fr !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table {
    display:block !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table thead,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table thead {
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    overflow:hidden !important;
    clip:rect(0 0 0 0) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table tbody,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table tbody {
    display:grid !important;
    gap:8px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table tbody tr,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table tbody tr {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:0 !important;
    overflow:hidden !important;
    border:1px solid var(--r50-line) !important;
    border-radius:var(--r50-radius) !important;
    background:var(--r50-surface) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table td,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table td {
    position:static !important;
    display:block !important;
    min-width:0 !important;
    padding:8px 10px !important;
    border:0 !important;
    border-bottom:1px solid #edf0f3 !important;
    box-shadow:none !important;
    overflow-wrap:anywhere !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table td::before,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table td::before {
    display:block !important;
    margin-bottom:2px !important;
    color:var(--r50-faint) !important;
    content:attr(data-label) !important;
    font-size:9px !important;
    font-weight:700 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .finance-invoice-table td:last-child,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .hr-table td:last-child { grid-column:1/-1 !important; }
}

/* 2026-09-03 queued-work-continuation=20260903-r88
 * The continuation queue is a compact decision surface: fitting items are
 * sorted once at the top, role editing stays searchable, and material rows
 * keep optional supplier context without introducing dark surfaces. */
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue {
  display:grid !important;
  gap:10px !important;
  padding:14px 16px !important;
  border-left:3px solid #ef6a5b !important;
  background:#fffdfc !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-head {
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:16px !important;
  min-width:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-head h3 {
  margin:2px 0 3px !important;
  color:#17324d !important;
  font-size:18px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-head .subtle {
  display:block !important;
  max-width:78ch !important;
  line-height:1.45 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-count {
  flex:0 0 auto !important;
  color:#b84538 !important;
  font-size:18px !important;
  line-height:1.35 !important;
  white-space:nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-list {
  display:grid !important;
  gap:6px !important;
  min-width:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-row {
  display:grid !important;
  grid-template-columns:28px minmax(72px,110px) minmax(150px,1.2fr) minmax(110px,.9fr) minmax(110px,.8fr) max-content !important;
  align-items:center !important;
  gap:10px !important;
  min-width:0 !important;
  min-height:46px !important;
  padding:7px 8px !important;
  border:1px solid #e4e9ef !important;
  border-radius:5px !important;
  background:#fff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-index {
  color:#b84538 !important;
  font-size:12px !important;
  font-variant-numeric:tabular-nums !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-product,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-time,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-owner {
  display:grid !important;
  gap:2px !important;
  min-width:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-product strong,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-time strong,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-owner strong {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:#20364e !important;
  font-size:13px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-product small,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-time small,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-owner small {
  color:#7a8a9b !important;
  font-size:11px !important;
  line-height:1.3 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-action {
  display:flex !important;
  justify-content:flex-end !important;
  min-width:0 !important;
  white-space:nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-material-table th,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-material-table td {
  min-width:110px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-material-table th:first-child,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-material-table td:first-child { min-width:170px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-material-editor-wrap { overflow-x:auto !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-material-editor { min-width:980px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .role-dialog .permission-group,
body.workspace-mode .app-shell[data-ui-shell="r26"] .role-dialog .permission-option {
  color:#20364e !important;
  background:#fff !important;
  border-color:#dce5ee !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .role-dialog .permission-group-head {
  color:#20364e !important;
  background:#f4f7fb !important;
  border-color:#e2e8ef !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .role-dialog .permission-group-head h4,
body.workspace-mode .app-shell[data-ui-shell="r26"] .role-dialog .permission-option strong { color:#20364e !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .role-dialog .permission-group-head span,
body.workspace-mode .app-shell[data-ui-shell="r26"] .role-dialog .permission-option small { color:#6f8194 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .role-dialog .permission-option:has(input:checked) {
  background:#eef6ff !important;
  border-color:#9fc4ee !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .permission-toolbar > div:first-child {
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  min-width:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .permission-selected-count {
  color:#1768d2 !important;
  font-size:12px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .permission-toolbar > div:last-child {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:7px !important;
  flex-wrap:wrap !important;
  min-width:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .permission-search { display:block !important; margin:0 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .permission-search input { width:210px !important; min-width:0 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .permission-option[hidden],
body.workspace-mode .app-shell[data-ui-shell="r26"] .permission-group[hidden] { display:none !important; }
@media (max-width:760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-row {
    grid-template-columns:24px minmax(70px,1fr) minmax(0,1.6fr) max-content !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-time,
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .design-fitting-queue-owner { display:none !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .role-dialog .permission-toolbar,
  body.workspace-mode .app-shell[data-ui-shell="r26"] .role-dialog .permission-toolbar > div:last-child { align-items:stretch !important; justify-content:flex-start !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] .permission-search input { width:100% !important; }
}

/* r86 current-order-routes-only · 2026-09-03 · image-to-front=gpt-image-2
 * New orders have two active dealer routes. Legacy orders stay available as
 * a quiet disclosure only when they exist, so compatibility never competes
 * with the current procurement decision. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy {
  margin-top:8px !important;
  padding-top:7px !important;
  border-top:1px solid #edf1f3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy summary {
  display:grid !important;
  grid-template-columns:18px minmax(0,1fr) auto 16px !important;
  align-items:center !important;
  gap:7px !important;
  min-width:0 !important;
  cursor:pointer !important;
  list-style:none !important;
  color:#6d7d88 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy summary::-webkit-details-marker { display:none !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy-mark {
  display:grid !important;
  place-items:center !important;
  width:18px !important;
  height:18px !important;
  border:1px solid #c8d4dc !important;
  border-radius:50% !important;
  color:#7b8c97 !important;
  font-size:12px !important;
  line-height:1 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy-copy {
  display:grid !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy-copy strong {
  color:#536a78 !important;
  font-size:11px !important;
  font-weight:700 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy-copy small {
  margin-top:1px !important;
  color:#8a99a2 !important;
  font-size:10px !important;
  line-height:1.35 !important;
  overflow-wrap:anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy summary > b {
  color:#657783 !important;
  font-size:13px !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy summary > b em {
  margin-left:2px !important;
  color:#8b99a1 !important;
  font-size:9px !important;
  font-style:normal !important;
  font-weight:500 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy summary::after {
  content:"+" !important;
  color:#718591 !important;
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1 !important;
  text-align:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy[open] summary::after { content:"−" !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy-body {
  display:flex !important;
  flex-wrap:wrap !important;
  gap:5px 16px !important;
  padding:7px 0 1px 25px !important;
  color:#7a8992 !important;
  font-size:10px !important;
  line-height:1.4 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-legacy-body span { overflow-wrap:anywhere !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-lane.is-material-list ol {
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}
@media (max-width:900px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .workflow-route-lane.is-material-list ol {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:640px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .workflow-route-lane.is-material-list ol {
    grid-template-columns:1fr !important;
  }
}

/* 2026-09-03 account-onboarding-no-employee-number=r85
 * Employee numbers remain an internal compatibility field, but the tenant
 * account flow is phone-first and the duplicate state offers a direct edit. */
.account-dialog .role-banner {
  border-color:#cce7e1 !important;
  background:#f1faf8 !important;
  color:#355d5a !important;
}
.account-dialog .role-banner strong { color:#146c63 !important; }
.account-dialog .account-dialog-hint {
  border-color:#cfe4f4 !important;
  background:#f5faff !important;
  color:#4f667d !important;
}
.account-dialog .dialog-inline-error.account-existing-conflict {
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  border-color:#efd9a7 !important;
  background:#fff9ed !important;
  color:#76591d !important;
}
.account-dialog .dialog-inline-error.account-existing-conflict .action-link {
  margin-left:auto !important;
  color:#b42318 !important;
  font-weight:700 !important;
}
@media (max-width:760px) {
  .account-dialog .dialog-inline-error.account-existing-conflict .action-link {
    width:100% !important;
    margin-left:0 !important;
    text-align:left !important;
  }
}

/* Supplier online signing: keep the internal action compact while making the
 * external hand-off legible and confidence-building. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .contract-actions {
  display:inline-flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:7px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .contract-request-sign-button {
  border-color:#0e9f9a !important;
  background:#0e9f9a !important;
  color:#fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .contract-request-sign-button:hover {
  background:#087b78 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .contract-esign-complete {
  display:inline-flex !important;
  align-items:center !important;
  min-height:32px !important;
  padding:0 10px !important;
  border:1px solid #8ad7c5 !important;
  border-radius:7px !important;
  background:#f1fcf9 !important;
  color:#197e72 !important;
  font-size:12px !important;
  font-weight:700 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .contract-row-actions {
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:6px !important;
}
.contract-signing-dialog { width:min(720px, calc(100vw - 28px)); }
.contract-signing-context { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:14px; padding:13px 15px; border:1px solid #dce4ec; border-radius:9px; background:#f7f9fb; }
.contract-signing-context strong, .contract-signing-context span { display:block; }
.contract-signing-context strong { color:#17253b; }
.contract-signing-context span { margin-top:4px; color:#718096; font-size:12px; }
.contract-signing-link-card { padding:16px; border:1px solid #8ad7c5; border-radius:10px; background:#f1fcf9; }
.contract-signing-link-card strong { color:#197e72; }
.contract-signing-link-card p { margin:7px 0 12px; color:#5c827f; font-size:13px; }
.contract-signing-link-row { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:7px; }
.contract-signing-link-row input { min-width:0; padding:0 10px; border:1px solid #b7d8d1; border-radius:7px; background:#fff; color:#475d6f; font-size:12px; }
@media (max-width:620px) {
  .contract-signing-context { grid-template-columns:1fr; }
  .contract-signing-link-row { grid-template-columns:1fr 1fr; }
  .contract-signing-link-row input { grid-column:1/-1; min-height:38px; }
}

/* r51 task-closure and account-onboarding contract · 2026-09-02
 * Keep the next action visible without turning the workbench into a dense
 * dashboard. The mobile rule stacks only the task row action, preserving the
 * same information order as desktop.
 */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip {
  display:grid !important;
  gap:10px !important;
  margin:0 0 12px !important;
  padding:14px 16px !important;
  border:1px solid #d9e4eb !important;
  border-left:3px solid #0f9d9a !important;
  border-radius:8px !important;
  background:#fff !important;
  box-shadow:0 5px 16px rgba(24,55,78,.05) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip-head {
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:12px !important;
  min-width:0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip-head h3 {
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  margin:0 !important;
  font-size:15px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-count {
  display:inline-grid !important;
  place-items:center !important;
  min-width:22px !important;
  height:22px !important;
  padding:0 6px !important;
  border-radius:999px !important;
  background:#e6f6f5 !important;
  color:#0b817f !important;
  font-size:12px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip-head .subtle {
  display:block !important;
  margin-top:3px !important;
  font-size:11px !important;
  line-height:1.45 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-list {
  display:grid !important;
  gap:6px !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-row {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  min-width:0 !important;
  padding:8px 10px !important;
  border:1px solid #e5edf1 !important;
  border-radius:6px !important;
  background:#fbfdfd !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-copy {
  display:grid !important;
  gap:2px !important;
  min-width:0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-copy strong,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-copy span {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-copy span,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-more,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-empty {
  color:#6d7c87 !important;
  font-size:11px !important;
  line-height:1.4 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-open-button {
  white-space:nowrap !important;
  min-width:76px !important;
}
@media (max-width:760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip { padding:12px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip-head { display:grid !important; grid-template-columns:minmax(0,1fr) auto !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-row { align-items:flex-start !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-action { flex:0 0 auto !important; }
}

/* 2026-09-02 knowledge-chat-reliability=20260902
 * The assistant transcript is a work surface, not a branded blue panel.
 * Keep blue for information links and use semantic tints for user turns and
 * provider failures so an outage cannot be mistaken for a normal answer. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-stage,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-stage.has-transcript {
  background:#f7f8fa !important;
  background-image:none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-turn > p {
  color:var(--r50-ink) !important;
  background:#fff !important;
  border-color:var(--r50-line) !important;
  box-shadow:none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-turn.user > p {
  color:#274260 !important;
  background:#eaf1f7 !important;
  border-color:#c9d9e7 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-turn.has-error > p,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .knowledge-answer-copy.has-error {
  background:#fffaf8 !important;
  border-color:#efc9c2 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-turn-actions,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .knowledge-answer-actions {
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-action {
  display:inline-flex !important;
  align-items:center !important;
  gap:5px !important;
  min-height:26px !important;
  padding:3px 7px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  color:var(--r50-faint) !important;
  background:transparent !important;
  font-size:10px !important;
  line-height:1 !important;
  cursor:pointer !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-action svg {
  width:13px !important;
  height:13px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-action:hover,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-action:focus-visible {
  color:var(--r50-ink) !important;
  border-color:var(--r50-line-strong) !important;
  background:#f4f6f8 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-action.is-copied {
  color:var(--r50-green) !important;
  border-color:#bfe5d1 !important;
  background:var(--r50-green-soft) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-action-retry,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-turn.has-error .ai-chat-turn-meta {
  color:#a15c16 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .knowledge-answer-status {
  align-items:center !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .knowledge-answer-actions {
  margin-left:auto !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .schedule-card-note,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .schedule-communication-notes {
  color:var(--r50-muted) !important;
  border-color:var(--r50-line) !important;
  background:#f8fafc !important;
}

@media (max-width:760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-turn-actions {
    flex-wrap:wrap !important;
  }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .knowledge-answer-actions {
  margin-left:0 !important;
  width:100% !important;
}
}

/* 2026-09-02 knowledge-composer-density=20260902
 * Keep the transcript as the primary work surface. The desktop composer is a
 * single compact action row; image/file-only controls can add one supporting
 * row without pushing the conversation below the fold. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-page {
  gap:12px !important;
  min-height:calc(100vh - 150px) !important;
  grid-template-rows:auto minmax(0,1fr) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-hero {
  min-height:76px !important;
  padding:16px 20px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-panel {
  grid-template-rows:auto minmax(0,1fr) auto auto !important;
  gap:10px !important;
  min-height:clamp(440px,calc(100vh - 260px),760px) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-session-bar {
  padding:10px 16px 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-session-bar .compact-button {
  min-height:30px !important;
  padding:6px 10px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-stage {
  min-height:260px !important;
  padding:28px 5% !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-stage.has-transcript {
  min-height:0 !important;
  padding:12px max(5%,18px) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-stage.has-transcript .ai-chat-transcript {
  height:100% !important;
  max-height:none !important;
  min-height:0 !important;
  gap:10px !important;
  padding:2px 6px 2px 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer {
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  grid-template-rows:auto auto !important;
  column-gap:8px !important;
  row-gap:5px !important;
  margin:0 16px !important;
  padding:10px 0 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer .ai-assistant-mode {
  grid-column:1 !important;
  grid-row:1 !important;
  align-self:end !important;
  gap:2px !important;
  padding:2px !important;
  border-radius:7px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer .ai-assistant-mode button {
  min-height:34px !important;
  padding:6px 10px !important;
  border-radius:5px !important;
  font-size:11px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer textarea {
  grid-column:2 !important;
  grid-row:1 !important;
  min-height:54px !important;
  max-height:132px !important;
  padding:11px 13px !important;
  border-radius:8px !important;
  line-height:1.45 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer > .primary {
  grid-column:3 !important;
  grid-row:1 !important;
  min-width:92px !important;
  min-height:54px !important;
  border-radius:8px !important;
  gap:7px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer > .primary b {
  font-size:16px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer > small {
  grid-column:2 / 4 !important;
  grid-row:2 !important;
  font-size:10px !important;
  line-height:1.2 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer .ai-image-reference-picker {
  grid-column:1 / -1 !important;
  grid-row:2 !important;
  padding:7px 10px !important;
  border-radius:8px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer.is-image-mode > .primary,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer.is-file-mode > .primary {
  grid-column:3 !important;
  grid-row:1 / span 2 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer.is-image-mode > small,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer.is-file-mode > small {
  grid-column:1 / -1 !important;
  grid-row:3 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-footnote {
  margin:0 16px !important;
  padding:0 0 11px !important;
  font-size:10px !important;
  line-height:1.35 !important;
}

@media (max-width:760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-page {
    gap:10px !important;
    min-height:calc(100vh - 110px) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-hero {
    min-height:0 !important;
    padding:14px 16px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-panel {
    gap:8px !important;
    min-height:clamp(430px,calc(100vh - 190px),680px) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-stage {
    min-height:220px !important;
    padding:20px 14px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-stage.has-transcript {
    min-height:0 !important;
    padding:12px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-stage.has-transcript .ai-chat-transcript {
    height:min(52vh,420px) !important;
    max-height:420px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer {
    grid-template-columns:1fr !important;
    grid-template-rows:auto !important;
    row-gap:7px !important;
    margin:0 12px !important;
    padding-top:8px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer .ai-assistant-mode,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer textarea,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer > .primary,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer > small,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer .ai-image-reference-picker,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer.is-image-mode > .primary,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer.is-file-mode > .primary,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer.is-image-mode > small,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer.is-file-mode > small {
    grid-column:1 !important;
    grid-row:auto !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer .ai-assistant-mode {
    align-self:start !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer textarea {
    min-height:56px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-composer > .primary {
    width:100% !important;
    min-height:48px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-chat-footnote {
    display:grid !important;
    gap:3px !important;
    margin:0 12px !important;
    padding-bottom:10px !important;
  }
}

/* 2026-09-02 empty-table-scroll-seal=20260902-r76
 * The product-ledger scroll rule above applies only to populated records;
 * keep empty-state tables as compact message surfaces with no scrollbar. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-ledger-layout > .product-workbench-panel > .table-wrap:has(> table > tbody > tr:only-child > td > .empty-state) {
  overflow-x:hidden !important;
  scrollbar-gutter:auto !important;
}

@media (prefers-reduced-motion:reduce) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) * { transition:none !important; }
}

/* 2026-09-03 empty-workbench-layout=20260903-r1
 * A grid-based record row does not understand a table cell's colspan. When a
 * workbench has no matching styles, the empty cell can therefore collapse into
 * the first narrow grid track and render Chinese copy one character per line.
 * Empty workbenches are message surfaces: hide the unused column header and
 * give the message the full panel width. Populated rows keep their existing
 * responsive record-card/table layouts and business columns unchanged. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.is-empty {
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  table-layout:auto !important;
  border-collapse:separate !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.is-empty thead {
  display:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.is-empty tbody {
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  padding:0 !important;
  margin:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.is-empty tbody tr {
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  background:transparent !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.is-empty tbody tr > td {
  display:block !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:visible !important;
  grid-area:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.is-empty .empty-state {
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-height:136px !important;
  box-sizing:border-box !important;
  margin:0 !important;
  padding:30px 20px !important;
  text-align:center !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}

/* r50 cascade seal: r40 used a :has()-scoped tab rule, so the final visual
 * contract repeats that scope to remove the last boxed-tab regression. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
  min-height:40px !important;
  height:40px !important;
  padding:0 22px !important;
  gap:18px !important;
  align-items:stretch !important;
  border:0 !important;
  border-bottom:1px solid var(--r50-line) !important;
  background:var(--r50-surface) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:first-child {
  height:40px !important;
  min-height:40px !important;
  max-width:190px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-main {
  max-width:160px !important;
  height:100% !important;
  padding:0 !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:inherit !important;
  font-size:12px !important;
  font-weight:700 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab-close {
  width:20px !important;
  height:20px !important;
  margin-left:5px !important;
  padding:0 !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  border:0 !important;
  border-radius:50% !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:is(:hover,.active) {
  background:transparent !important;
  box-shadow:none !important;
}

@media (max-width:760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
    min-height:38px !important;
    height:38px !important;
    padding:0 12px !important;
    gap:15px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tab:first-child {
    height:38px !important;
    min-height:38px !important;
  }
}

/* r52 procurement-primary-action · 2026-09-02 · image-to-front=gpt-image-2
 * Workbench rows surface the next legal business action; generic editing stays
 * inside the detail sheet so role-specific users do not scan unrelated fields. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .focused-workbench-more {
  flex:0 0 auto !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .focused-workbench-more .row-action-menu-trigger {
  min-width:54px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .procurement-row-actions .row-primary-action {
  min-width:142px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .focused-workbench-more .row-action-menu-panel {
  min-width:170px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .workbench-row-idle {
  display:inline-flex !important;
  align-items:center !important;
  min-height:28px !important;
  color:var(--r50-muted) !important;
  font-size:11px !important;
}
@media (max-width:760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .procurement-row-actions .row-primary-action {
    min-width:0 !important;
  }
}

/* r53 production-route-followup · 2026-09-02 · image-to-front=gpt-image-2
 * Make procurement-to-production branching visible before a user opens a row. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-strip {
  margin:0 0 12px !important;
  padding:13px 15px !important;
  border:1px solid #d9e4eb !important;
  border-left:3px solid #2b83c6 !important;
  border-radius:8px !important;
  background:#fff !important;
  box-shadow:0 5px 16px rgba(24,55,78,.05) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-strip-head {
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:12px !important;
  min-width:0 !important;
  margin-bottom:10px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-strip-head h3 {
  margin:0 !important;
  font-size:15px !important;
  line-height:1.3 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-strip-head .subtle {
  display:block !important;
  margin-top:3px !important;
  font-size:11px !important;
  line-height:1.45 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-grid {
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:8px !important;
  min-width:0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-item {
  display:grid !important;
  gap:3px !important;
  min-width:0 !important;
  padding:8px 10px !important;
  border-top:2px solid #cbd8e2 !important;
  background:#fbfcfd !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-item strong,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-item span {
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-item b {
  font-size:20px !important;
  line-height:1 !important;
  color:#183653 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-item span {
  color:#6d7c87 !important;
  font-size:10px !important;
  line-height:1.4 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-item.is-waiting { border-top-color:#d79a39 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-item.is-ready { border-top-color:#24a39b !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-item.is-active { border-top-color:#3f8bd0 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-item.is-done { border-top-color:#7a8794 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .procurement-route-hint,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .production-route-hint,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .production-phase-hint {
  display:block !important;
  min-width:0 !important;
  overflow-wrap:anywhere !important;
  color:#6d7c87 !important;
  font-size:10px !important;
  line-height:1.35 !important;
}
@media (max-width:900px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-strip { padding:12px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-strip-head { display:grid !important; grid-template-columns:minmax(0,1fr) auto !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-grid { grid-template-columns:1fr !important; }
}

/* r54 production-routing-visible · 2026-09-02 · image-to-front=gpt-image-2
 * Keep the three real business routes visible even when a workbench has zero
 * matching rows; each lane is a compact process map, not decorative copy. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-panel {
  margin:0 0 14px !important;
  padding:16px 18px 14px !important;
  border:1px solid #d8e2e8 !important;
  border-left:4px solid #e25d52 !important;
  border-radius:8px !important;
  background:#fff !important;
  box-shadow:0 8px 20px rgba(24,55,78,.06) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-head {
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:16px !important;
  margin-bottom:13px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-head .eyebrow {
  margin:0 0 3px !important;
  color:#b34a42 !important;
  font-size:10px !important;
  letter-spacing:.08em !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-head h3 {
  margin:0 !important;
  color:#17334d !important;
  font-size:17px !important;
  line-height:1.3 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-head .subtle {
  display:block !important;
  max-width:780px !important;
  margin-top:4px !important;
  color:#6a7a86 !important;
  font-size:11px !important;
  line-height:1.5 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lanes {
  display:grid !important;
  gap:8px !important;
  min-width:0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane {
  display:grid !important;
  grid-template-columns:minmax(175px, .9fr) minmax(0, 2.35fr) minmax(150px, .8fr) !important;
  align-items:center !important;
  gap:14px !important;
  min-width:0 !important;
  min-height:66px !important;
  padding:9px 11px !important;
  border:1px solid #e2e9ed !important;
  border-left:3px solid #d5dde3 !important;
  background:#fbfcfd !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane.is-material { border-left-color:#df8f3d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane.is-existing { border-left-color:#31a47d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane.is-distribution { border-left-color:#6a86aa !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane-title {
  display:grid !important;
  grid-template-columns:30px minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:8px !important;
  min-width:0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-index {
  display:grid !important;
  place-items:center !important;
  width:26px !important;
  height:26px !important;
  border-radius:50% !important;
  color:#fff !important;
  background:#e25d52 !important;
  font-size:11px !important;
  font-weight:700 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane.is-existing .workflow-route-index { background:#31a47d !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane.is-distribution .workflow-route-index { background:#6a86aa !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane-title strong,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane-title small,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane-title b,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane-title em {
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane-title strong {
  display:block !important;
  color:#17334d !important;
  font-size:13px !important;
  line-height:1.25 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane-title small {
  display:block !important;
  margin-top:2px !important;
  color:#82919a !important;
  font-size:10px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane-title b {
  color:#17334d !important;
  font-size:18px !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane-title em {
  margin-left:2px !important;
  color:#7b8a94 !important;
  font-size:10px !important;
  font-style:normal !important;
  font-weight:500 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane ol {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:8px !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-step {
  position:relative !important;
  min-width:0 !important;
  padding:8px 7px 7px 10px !important;
  border-bottom:2px solid #d8e0e5 !important;
  color:#89969e !important;
  font-size:11px !important;
  line-height:1.25 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-step:not(:last-child)::after {
  content:"→" !important;
  position:absolute !important;
  right:-8px !important;
  top:7px !important;
  color:#b8c4cb !important;
  font-size:13px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-step.is-current { border-bottom-color:#e25d52 !important; color:#b34a42 !important; font-weight:700 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-step.is-ready { border-bottom-color:#31a47d !important; color:#277d60 !important; font-weight:700 !important; }
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-note {
  min-width:0 !important;
  color:#71818b !important;
  font-size:10px !important;
  line-height:1.4 !important;
  overflow-wrap:anywhere !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-summary {
  display:flex !important;
  flex-wrap:wrap !important;
  gap:7px 18px !important;
  margin-top:11px !important;
  padding-top:10px !important;
  border-top:1px solid #edf1f3 !important;
  color:#778791 !important;
  font-size:10px !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .production-route-summary b { color:#17334d !important; font-size:13px !important; }
@media (max-width:900px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane { grid-template-columns:minmax(150px,.9fr) minmax(0,2fr) !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-note { grid-column:2 !important; margin-top:-8px !important; }
}
@media (max-width:640px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-panel { padding:13px 12px 12px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-head { display:grid !important; grid-template-columns:minmax(0,1fr) auto !important; gap:8px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-lane { grid-template-columns:1fr !important; gap:9px !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workflow-route-note { grid-column:auto !important; margin-top:0 !important; }
}

/* r55 mac-detail-responsive · 2026-09-02 · image-to-front=gpt-image-2
 * The narrow dialog previously kept an 80px grid track while the read-only
 * image block still required 132px, so the thumbnail overflowed into the
 * title column. Keep the dialog bounded, then give the image block its own
 * compact two-column layout before metadata and actions continue. */
@media (max-width:760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.dialog.product-detail-shell,.dialog:has(.product-detail-shell)) {
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
    min-width:0 !important;
    overflow-x:hidden !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.dialog.product-detail-shell,.dialog:has(.product-detail-shell)) > .product-detail-shell,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .details {
    min-width:0 !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top {
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto auto !important;
    gap:12px !important;
    min-width:0 !important;
    padding:12px !important;
    overflow:visible !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top > .image-block {
    display:grid !important;
    grid-template-columns:116px minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    column-gap:12px !important;
    row-gap:4px !important;
    align-items:center !important;
    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    overflow:visible !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top > .image-block > .image-block-head {
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:6px !important;
    width:auto !important;
    min-width:0 !important;
    height:auto !important;
    overflow:visible !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top > .image-block > .detail-image-frame {
    grid-column:1 !important;
    grid-row:1 / span 2 !important;
    width:116px !important;
    max-width:116px !important;
    height:148px !important;
    min-width:0 !important;
    margin:0 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top > .image-block > .detail-image-frame > .detail-image {
    width:114px !important;
    max-width:114px !important;
    height:146px !important;
    object-fit:cover !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top > .image-block > .image-permission-note {
    grid-column:2 !important;
    grid-row:2 !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
    overflow-wrap:anywhere !important;
    line-height:1.35 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top > div:not(.image-block):not(.detail-actions) {
    grid-column:1 !important;
    width:100% !important;
    min-width:0 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top > .detail-actions {
    grid-column:1 !important;
    width:100% !important;
    min-width:0 !important;
    justify-content:flex-start !important;
    flex-wrap:wrap !important;
  }
}

@media (max-width:420px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top > .image-block {
    grid-template-columns:96px minmax(0,1fr) !important;
    column-gap:10px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top > .image-block > .detail-image-frame {
    width:96px !important;
    max-width:96px !important;
    height:122px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-detail-shell .detail-top > .image-block > .detail-image-frame > .detail-image {
    width:94px !important;
    max-width:94px !important;
    height:120px !important;
  }
}

/* r55 mount-point correction: productDialog is mounted directly under body,
 * outside #page, so keep the same contract on the actual dialog subtree. */
@media (max-width:760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog.product-detail-shell,.dialog:has(.product-detail-shell)) {
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
    min-width:0 !important;
    overflow-x:hidden !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.dialog.product-detail-shell,.dialog:has(.product-detail-shell)) > .product-detail-shell,
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .details {
    min-width:0 !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top {
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto auto !important;
    gap:12px !important;
    min-width:0 !important;
    padding:12px !important;
    overflow:visible !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > .image-block {
    display:grid !important;
    grid-template-columns:116px minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    column-gap:12px !important;
    row-gap:4px !important;
    align-items:center !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    overflow:visible !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > .image-block > .image-block-head {
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:6px !important;
    width:auto !important;
    min-width:0 !important;
    height:auto !important;
    overflow:visible !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > .image-block > .detail-image-frame {
    grid-column:1 !important;
    grid-row:1 / span 2 !important;
    width:116px !important;
    max-width:116px !important;
    height:148px !important;
    min-width:0 !important;
    margin:0 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > .image-block > .detail-image-frame > .detail-image {
    width:114px !important;
    max-width:114px !important;
    height:146px !important;
    object-fit:cover !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > .image-block > .image-permission-note {
    grid-column:2 !important;
    grid-row:2 !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
    overflow-wrap:anywhere !important;
    line-height:1.35 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > div:not(.image-block):not(.detail-actions) {
    grid-column:1 !important;
    width:100% !important;
    min-width:0 !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > .detail-actions {
    grid-column:1 !important;
    width:100% !important;
    min-width:0 !important;
    justify-content:flex-start !important;
    flex-wrap:wrap !important;
  }
}

@media (max-width:420px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > .image-block {
    grid-template-columns:96px minmax(0,1fr) !important;
    column-gap:10px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > .image-block > .detail-image-frame {
    width:96px !important;
    max-width:96px !important;
    height:122px !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .product-detail-shell .detail-top > .image-block > .detail-image-frame > .detail-image {
    width:94px !important;
    max-width:94px !important;
    height:120px !important;
  }
}

/* r58 pattern-workbench-fields · 2026-09-02 · image-to-front=gpt-image-2
 * Record-card styling hid the shared table head even on desktop, which left
 * dense rows without column context. Re-introduce one aligned header row for
 * desktop workbenches while retaining labelled cards on narrow screens. */
@media (min-width:761px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    --workbench-record-grid-columns:72px 56px minmax(132px,1fr) minmax(130px,.95fr) minmax(220px,1.35fr) minmax(140px,1fr) minmax(132px,.95fr) minmax(110px,.8fr) minmax(96px,.7fr);
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead {
    position:static !important;
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 0 8px !important;
    padding:0 !important;
    overflow:visible !important;
    clip:auto !important;
    white-space:normal !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead tr {
    display:grid !important;
    grid-template-columns:var(--workbench-record-grid-columns) !important;
    align-items:center !important;
    gap:0 12px !important;
    min-width:0 !important;
    padding:0 16px !important;
    border:1px solid #dbe3eb !important;
    border-radius:8px !important;
    background:#f7f9fb !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead th {
    display:block !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    padding:9px 8px !important;
    border:0 !important;
    background:transparent !important;
    color:#61758a !important;
    font-size:10px !important;
    line-height:1.3 !important;
    font-weight:750 !important;
    white-space:normal !important;
    text-align:left !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead th:first-child { padding-left:0 !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead th:last-child { padding-right:0 !important; text-align:right !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    grid-template-columns:var(--workbench-record-grid-columns) !important;
  }
}

@media (max-width:760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead {
    display:none !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td::before {
    display:block !important;
    margin:0 0 3px !important;
    color:#8392a1 !important;
    font-size:10px !important;
    line-height:1.2 !important;
    font-weight:700 !important;
    content:"" !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(1)::before { content:"款号" !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(2)::before { content:"图片" !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(3)::before { content:"达人 / 品牌" !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(4)::before { content:"品类" !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(5)::before { content:"状态 / 版师需求" !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(6)::before { content:"负责人 / 分配" !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7)::before { content:"颜色 / 尺码 / SKU" !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(8)::before { content:"搭配款" !important; }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(9)::before { content:"操作" !important; }
}

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .pattern-assignment-context .pattern-assignment-person span {
  color:#8291a0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .pattern-assignment-context .pattern-assignment-person strong {
  color:#52677d !important;
  font-weight:650 !important;
}

/* r61 pattern-owner-label-fit · 2026-09-02 · image-to-front=gpt-image-2
 * “样衣承接方” is wider than the old 42px label track. Let the label use
 * its intrinsic width and keep the assignee value as the flexible track so
 * long Chinese labels never collide with the value or its hint. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .pattern-assignment-person {
  grid-template-columns:minmax(54px,max-content) minmax(0,1fr) !important;
  column-gap:6px !important;
  min-width:0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .pattern-assignment-person > span {
  width:auto !important;
  min-width:0 !important;
  overflow:visible !important;
  white-space:nowrap !important;
  text-overflow:clip !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .pattern-assignment-person > strong {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

/* r62 ai-reference-contrast · 2026-09-02 · image-to-front=gpt-image-2
 * The image-reference dropzone intentionally stays a dark action surface, but
 * the light workspace cascade was recoloring its nested strong/small copy.
 * Reassert the surface-owned contrast and interaction states at the final
 * cascade layer; no other AI or business content inherits these colors. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker {
  color:#f8fafc !important;
  background:#17354a !important;
  border-color:#42c8ba !important;
  box-shadow:inset 0 0 0 1px rgba(66,200,186,.12) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker:hover,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker:focus-visible,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker.drag-over {
  background:#1d4258 !important;
  border-color:#72e0d2 !important;
  box-shadow:0 0 0 3px rgba(66,200,186,.16),inset 0 0 0 1px rgba(114,224,210,.18) !important;
  outline:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker > span {
  color:#063c3a !important;
  background:#63e6d6 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .ai-image-reference-picker strong {
  color:#f8fafc !important;
  font-weight:700 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .ai-image-reference-picker small {
  color:#b8cadc !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .ai-image-reference-clear {
  color:#c2d2e2 !important;
  background:transparent !important;
  border-color:transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .ai-image-reference-clear:hover,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"] .ai-image-reference-clear:focus-visible {
  color:#fff1f2 !important;
  background:#4a2732 !important;
  border-color:#9b5362 !important;
}

/* r63 ai-reference-copy-specificity · 2026-09-02
 * Match the high-specificity light-workspace typography reset so the nested
 * copy cannot fall back to dark text on the intentional dark dropzone. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker strong {
  color:#f8fafc !important;
  font-weight:700 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker small {
  color:#b8cadc !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-clear {
  color:#c2d2e2 !important;
  background:transparent !important;
  border-color:transparent !important;
}

/* r65 dashboard-kpi-surface-consistency · 2026-09-02 · image-to-front=gpt-image-2
 * KPI cards share one neutral surface. Status belongs to the data, not the
 * card position: a narrow inset line and value color carry the distinction. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card:first-child,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.alert {
  position:relative !important;
  color:var(--r50-ink) !important;
  background:var(--r50-surface) !important;
  border-color:var(--r50-line) !important;
  box-shadow:inset 0 3px 0 transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card > span {
  color:var(--r50-muted) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card > strong {
  color:var(--r50-ink) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card > small {
  color:var(--r50-faint) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.sales.is-connected {
  box-shadow:inset 0 3px 0 var(--r50-green) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.sales.is-connected > strong {
  color:var(--r50-green) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.sales.is-pending {
  box-shadow:inset 0 3px 0 #c98a23 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.sales.is-pending > strong {
  color:var(--r50-amber) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.sales.is-disconnected {
  box-shadow:inset 0 3px 0 #7890a6 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.sales.is-restricted {
  box-shadow:inset 0 3px 0 #aab6c1 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.sales.is-disconnected > strong,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.sales.is-restricted > strong {
  color:var(--r50-muted) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.alert.has-risk {
  box-shadow:inset 0 3px 0 #d69a2d !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.alert.has-risk > strong {
  color:var(--r50-amber) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.alert.is-clear {
  box-shadow:inset 0 3px 0 var(--r50-green) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-kpi-grid > .dashboard-kpi-card.alert.is-clear > strong {
  color:var(--r50-green) !important;
}

/* r66 light-workspace-surface-seal · 2026-09-02 · image-to-front=gpt-image-2
 * Keep business content on one light visual plane. Navigation, backdrops and
 * full-screen media remain intentionally dark; only workspace-owned scrolling
 * surfaces receive the neutral track/thumb treatment. */
html:has(body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode)),
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)),
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.workspace, dialog.dialog, .activity-panel),
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.workspace, dialog.dialog, .activity-panel) * {
  scrollbar-color:#a8b4c0 #eef2f5 !important;
  scrollbar-width:thin !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.workspace, dialog.dialog, .activity-panel)::-webkit-scrollbar-track,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.workspace, dialog.dialog, .activity-panel) *::-webkit-scrollbar-track {
  background:#eef2f5 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.workspace, dialog.dialog, .activity-panel)::-webkit-scrollbar-thumb,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) :is(.workspace, dialog.dialog, .activity-panel) *::-webkit-scrollbar-thumb {
  border:2px solid #eef2f5 !important;
  border-radius:5px !important;
  background:#a8b4c0 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .sidebar .nav {
  scrollbar-color:#496a8e #142d49 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .sidebar .nav::-webkit-scrollbar-track {
  background:#142d49 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .sidebar .nav::-webkit-scrollbar-thumb {
  border:2px solid #142d49 !important;
  border-radius:5px !important;
  background:#496a8e !important;
}

/* Empty tables should read as an empty state, not as a clipped data grid. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .table-wrap:has(> table > tbody > tr:only-child > td > .empty-state) {
  overflow-x:hidden !important;
  scrollbar-gutter:auto !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .table-wrap:has(> table > tbody > tr:only-child > td > .empty-state) > table {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  table-layout:fixed !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .contract-empty-state {
  min-height:112px !important;
  display:grid !important;
  place-content:center !important;
  gap:4px !important;
  margin:0 !important;
  padding:28px 20px !important;
  border:1px dashed #c9d4de !important;
  border-radius:4px !important;
  background:#fbfcfd !important;
  text-align:center !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .contract-empty-state strong {
  color:var(--r50-ink) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .contract-empty-state span {
  color:var(--r50-muted) !important;
}

/* The reference dropzone is business content, so it follows the light
 * workspace surface while keeping the teal upload affordance. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker {
  color:var(--r50-ink) !important;
  background:#f3f8fb !important;
  background-image:none !important;
  border-color:#b9cbd9 !important;
  box-shadow:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker:hover,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker:focus-visible,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker.drag-over {
  background:#edf6f5 !important;
  border-color:#4aa9a2 !important;
  box-shadow:0 0 0 3px rgba(74,169,162,.14) !important;
  outline:none !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker > span {
  color:#063c3a !important;
  background:#63e6d6 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker strong {
  color:var(--r50-ink) !important;
  font-weight:700 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-picker small {
  color:var(--r50-muted) !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-clear {
  color:#708092 !important;
  background:transparent !important;
  border-color:transparent !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-clear:hover,
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ai-image-reference-clear:focus-visible {
  color:#a42336 !important;
  background:#ffedf0 !important;
  border-color:#efc8ce !important;
}

/* r71 empty-table-and-dealer-route · 2026-09-02
 * Empty tables are message surfaces, while populated tables keep their
 * intentional inner horizontal scroll. Dealer procurement must remain a
 * visible branch of the production route without adding another card layer.
 * Compatibility selector token: .table-wrap:has(> table > tbody > tr > td > .empty-state) */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.table-wrap,.hr-table-wrap,.account-table-wrap):has(> table > tbody > tr:only-child > td > .empty-state) {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:hidden !important;
  scrollbar-gutter:auto !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.table-wrap,.hr-table-wrap,.account-table-wrap):has(> table > tbody > tr:only-child > td > .empty-state) > table {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  table-layout:fixed !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.table-wrap,.hr-table-wrap,.account-table-wrap):has(> table > tbody > tr:only-child > td > .empty-state) > table > tbody > tr:only-child > td {
  width:100% !important;
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.procurement-route-panel,.production-route-panel) .workflow-route-lane.is-distribution {
  border-left-color:#8194aa !important;
  background:#f7f9fc !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.procurement-route-panel,.production-route-panel) .workflow-route-lane.is-distribution .workflow-route-index {
  background:#7489a4 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.procurement-route-panel,.production-route-panel) .workflow-route-lane.is-distribution .workflow-route-step.is-current {
  border-bottom-color:#6c8fb9 !important;
  color:#315f94 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-step.is-pending {
  border-bottom-color:#e3c98e !important;
  color:#896d35 !important;
}
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workflow-route-step.is-done {
  border-bottom-color:#cbd5dd !important;
  color:#687887 !important;
}

/* 2026-09-02 product-ledger-scroll-seal=20260902-r73
 * The product workbench keeps a deliberately information-dense record row.
 * Its inner table must own horizontal overflow; letting the row paint outside
 * the table-wrap causes the selected-row inspector to cover the right side of
 * the record on medium-width and Mac screenshots. Empty-state wrappers retain
 * the r71 full-width rule above, while populated rows remain fully readable
 * and scrollable without widening the page itself. */
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-ledger-layout > .product-workbench-panel > .table-wrap {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  max-height:none !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  overscroll-behavior-x:contain !important;
  scrollbar-gutter:stable !important;
}
@media (min-width:761px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-ledger-layout > .product-workbench-panel > .table-wrap > .product-workbench-table {
    width:max-content !important;
    min-width:100% !important;
    max-width:none !important;
  }
}

@media (max-width:760px) {
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-ledger-layout > .product-workbench-panel > .table-wrap {
    overflow-x:hidden !important;
    scrollbar-gutter:auto !important;
  }
  body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-ledger-layout > .product-workbench-panel > .table-wrap > .product-workbench-table {
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }
}

/* 2026-09-02 workspace-tab-polish-terminal=20260902-r77 · image-to-front=gpt-image-2
 * Match the legacy html-prefixed selector so the recent-module strip itself
 * and every tab child share one final cascade contract. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) {
  display:flex !important;
  align-items:stretch !important;
  gap:0 !important;
  min-width:0 !important;
  min-height:42px !important;
  height:42px !important;
  padding:0 22px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  scrollbar-width:none !important;
  background:#fff !important;
  border-bottom:1px solid var(--r50-line) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden])::-webkit-scrollbar { display:none !important; }

/* html-weight terminal seal: match the legacy html-prefixed selector so the
 * centered close affordance wins the cascade on every authenticated shell. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab:first-child {
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  height:42px !important;
  min-height:42px !important;
  max-width:220px !important;
  padding:0 10px 0 14px !important;
  border:0 !important;
  border-right:1px solid #eef1f4 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab.active {
  background:#fff !important;
  color:var(--r50-ink) !important;
  box-shadow:inset 0 -2px 0 var(--r50-coral) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab-main {
  display:flex !important;
  align-items:center !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1.2 !important;
  text-decoration:none !important;
  text-decoration-line:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab-close {
  display:grid !important;
  align-self:center !important;
  width:24px !important;
  min-width:24px !important;
  height:24px !important;
  min-height:24px !important;
  margin:0 0 0 6px !important;
  line-height:1 !important;
  text-decoration:none !important;
  text-decoration-line:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab.active::after {
  content:none !important;
  display:none !important;
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab:first-child {
    height:40px !important;
    min-height:40px !important;
    max-width:42vw !important;
    padding:0 8px 0 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs:not([hidden]) .workspace-tab-close {
    width:22px !important;
    min-width:22px !important;
    height:22px !important;
    min-height:22px !important;
    margin-left:5px !important;
  }
}

/* 2026-09-02 workbench-priority-density=20260902-r78 · image-to-front=gpt-image-2
 * The shared task rail is intentionally a compact priority surface. It keeps
 * the total count and existing deep links, while preventing the same work from
 * occupying a full card stack above the role-specific process summary. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip {
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:10px !important;
  margin:0 0 10px !important;
  padding:8px 10px !important;
  border:1px solid #dfe7ec !important;
  border-left:1px solid #dfe7ec !important;
  border-radius:6px !important;
  background:#fff !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip-head {
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip-head > div {
  display:flex !important;
  align-items:baseline !important;
  gap:6px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip-head h3 {
  margin:0 !important;
  color:var(--r50-ink) !important;
  font-size:13px !important;
  line-height:1.3 !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip-head .work-task-count {
  min-width:19px !important;
  height:19px !important;
  padding:0 5px !important;
  border-radius:10px !important;
  font-size:11px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip-head .work-task-status {
  margin-left:0 !important;
  min-height:24px !important;
  padding:0 8px !important;
  font-size:10px !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-list {
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-row {
  flex:1 1 240px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:8px !important;
  min-width:0 !important;
  min-height:30px !important;
  padding:4px 7px !important;
  border:1px solid #e4ebef !important;
  border-radius:4px !important;
  background:#fbfcfd !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-copy {
  display:flex !important;
  align-items:baseline !important;
  gap:7px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-copy strong {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:var(--r50-ink) !important;
  font-size:11px !important;
  line-height:1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-copy span {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:var(--r50-muted) !important;
  font-size:10px !important;
  line-height:1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-action {
  flex:0 0 auto !important;
  min-height:26px !important;
  padding:0 8px !important;
  font-size:11px !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-more {
  min-width:74px !important;
  color:var(--r50-muted) !important;
  font-size:10px !important;
  line-height:1.35 !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-empty {
  grid-column:2/-1 !important;
  color:var(--r50-muted) !important;
  font-size:11px !important;
  line-height:1.35 !important;
}

/* Keep role cards and filters useful without letting their explanatory copy
 * compete with the actual records below. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-cards {
  margin-bottom:10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card {
  min-height:82px !important;
  padding:11px 13px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card p {
  min-height:28px !important;
  max-height:2.8em !important;
  margin:3px 0 7px !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  overflow:hidden !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-card .number {
  font-size:22px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-bar {
  gap:8px !important;
  margin-bottom:10px !important;
  padding:10px 12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-controls {
  gap:8px !important;
}

/* The procurement and production route maps remain the single source of
 * truth for mode-specific flow, but use a tighter row rhythm after the task
 * rail has been reduced. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-route-panel,.production-route-panel) {
  margin-bottom:10px !important;
  padding:13px 15px 12px !important;
  border-left-width:2px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-route-panel,.production-route-panel) .workflow-route-head {
  margin-bottom:9px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-route-panel,.production-route-panel) .workflow-route-lane {
  min-height:58px !important;
  padding:7px 10px !important;
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-strip {
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:start !important;
    gap:8px !important;
    padding:8px 10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-list,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-more,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-empty {
    grid-column:1/-1 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-list {
    display:grid !important;
    gap:5px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-row {
    width:100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-more {
    min-width:0 !important;
  }
}

/* 2026-09-03 product-master-detail-reflow=20260903-r80
 * The product inspector is useful context, but it must not reduce a nine-field
 * record to a clipped sliver on ordinary desktop widths. Keep side-by-side
 * master/detail only on genuinely wide canvases; otherwise promote the
 * inspector to a compact context band and let the list own the full width.
 * Shared workbench records also reflow before their semantic columns collide. */
@media (min-width:901px) and (max-width:1760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-ledger-layout {
    grid-template-columns:minmax(0,1fr) !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-ledger-layout > .ledger-inspector {
    order:-1 !important;
    position:relative !important;
    top:auto !important;
    display:grid !important;
    grid-template-columns:minmax(220px,.8fr) minmax(280px,1.55fr) minmax(176px,.7fr) !important;
    grid-template-areas:
      "head body actions"
      "head body tabs" !important;
    max-height:196px !important;
    overflow:hidden !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector-head {
    grid-area:head !important;
    grid-template-columns:58px minmax(0,1fr) !important;
    align-content:start !important;
    border-right:1px solid #dbe3eb !important;
    border-bottom:0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector-head > .tag {
    grid-column:2 !important;
    width:max-content !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector-actions {
    grid-area:actions !important;
    grid-template-columns:1fr !important;
    align-content:start !important;
    border-bottom:1px solid #dbe3eb !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector-tabs {
    grid-area:tabs !important;
    align-self:end !important;
    border-bottom:0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-inspector-body {
    grid-area:body !important;
    max-height:194px !important;
    border-right:1px solid #dbe3eb !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-facts {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (min-width:901px) and (max-width:1680px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel > .table-wrap,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-ledger-layout > .product-workbench-panel > .table-wrap {
    overflow-x:hidden !important;
    scrollbar-gutter:auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead {
    display:block !important;
    width:100% !important;
    height:auto !important;
    margin:0 0 8px !important;
    padding:0 !important;
    overflow:visible !important;
    clip:auto !important;
    white-space:normal !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead tr {
    display:grid !important;
    grid-template-columns:64px 52px minmax(128px,1fr) minmax(150px,1.2fr) minmax(120px,.95fr) minmax(88px,.7fr) !important;
    grid-template-rows:26px 26px !important;
    grid-template-areas:
      "style image identity identity owner actions"
      "style image category flow attrs match" !important;
    align-items:stretch !important;
    align-content:stretch !important;
    gap:0 !important;
    min-width:0 !important;
    min-height:52px !important;
    padding:0 12px !important;
    border:1px solid #dbe3eb !important;
    border-radius:6px !important;
    background:#f7f9fb !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead th {
    display:flex !important;
    align-items:center !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 7px !important;
    border:0 !important;
    background:transparent !important;
    color:#61758a !important;
    font-size:10px !important;
    line-height:1.2 !important;
    font-weight:750 !important;
    white-space:normal !important;
    text-align:left !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead th:nth-child(1),
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead th:nth-child(2) {
    align-items:center !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead th:last-child {
    justify-content:flex-end !important;
    padding-right:4px !important;
    text-align:right !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead tr,tbody tr) {
    grid-template-columns:64px 52px minmax(128px,1fr) minmax(150px,1.2fr) minmax(120px,.95fr) minmax(88px,.7fr) !important;
    grid-template-areas:
      "style image identity identity owner actions"
      "style image category flow attrs match" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(th,td):nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(th,td):nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(th,td):nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(th,td):nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(th,td):nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(th,td):nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(th,td):nth-child(7) { grid-area:attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(th,td):nth-child(8) { grid-area:match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(th,td):nth-child(9) { grid-area:actions !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(.stack,.stack strong,.stack span,.subtle) {
    min-width:0 !important;
    max-width:100% !important;
    overflow-wrap:anywhere !important;
    white-space:normal !important;
  }
}

@media (min-width:761px) and (max-width:900px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel > .table-wrap {
    overflow-x:hidden !important;
    scrollbar-gutter:auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead {
    display:none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    grid-template-columns:56px minmax(0,1fr) !important;
    grid-template-areas:
      "image style"
      "image identity"
      "category category"
      "flow flow"
      "owner owner"
      "attrs attrs"
      "actions actions" !important;
    gap:9px 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7) { grid-area:attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(8) { display:none !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(9) {
    grid-area:actions !important;
    justify-self:start !important;
  }
}

/* 2026-09-03 module-health-surface=20260903-r81
 * Dashboard module health is shared by design, pattern, procurement,
 * production, operations and finance. The legacy visual layer kept the
 * healthy state on a dark green token, which made only some cards look like
 * a different theme. Keep the state meaning, but place every health badge on
 * the same light workspace surface with explicit readable contrast. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-module-health {
  display:inline-flex !important;
  align-items:center !important;
  min-height:22px !important;
  padding:0 8px !important;
  border:1px solid transparent !important;
  border-radius:4px !important;
  box-shadow:none !important;
  font-size:11px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
}

/* 2026-09-03 workbench-header-grid=20260903-r82
 * The medium-width record layout uses two semantic rows. Keep its header as
 * a compact, explicit two-row legend instead of letting automatic grid
 * placement create large gaps or apparently misplaced labels. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-module-health.healthy {
  color:#176d5f !important;
  background:#effaf4 !important;
  border-color:#b9dfc9 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-module-health.active {
  color:#245ca8 !important;
  background:#edf4ff !important;
  border-color:#c5daf6 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-module-health.warning {
  color:#8a5a00 !important;
  background:#fff8eb !important;
  border-color:#e8c77f !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .dashboard-module-health.alert {
  color:#aa3048 !important;
  background:#fff5f4 !important;
  border-color:#efc0ba !important;
}

/* 2026-09-03 product-center-action-distill=20260903-r83
 * The product-center toolbar is for filtering and entering the design flow.
 * Selected-style actions already live in the persistent inspector, so keep
 * the toolbar to one creation shortcut and remove its duplicate action rail. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-center-toolbar {
  grid-template-columns:minmax(0,1fr) !important;
  grid-template-areas:"copy" "filters" !important;
  align-items:center !important;
  gap:8px !important;
  margin:0 0 10px !important;
  padding:12px 14px 10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-center-toolbar .toolbar-copy h2 {
  margin:0 !important;
  font-size:18px !important;
  line-height:1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-center-toolbar .toolbar-copy p {
  margin:3px 0 0 !important;
  font-size:11px !important;
  line-height:1.4 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-center-toolbar > .toolbar-actions.filters {
  display:flex !important;
  align-items:center !important;
  min-height:32px !important;
  padding-top:8px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-center-toolbar .product-center-create-action {
  flex:0 0 auto !important;
  min-height:30px !important;
  margin-left:auto !important;
  padding:0 11px !important;
  border-radius:4px !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-center-toolbar .ledger-toolbar-actions {
  display:none !important;
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-center-toolbar .product-center-create-action {
    margin-left:6px !important;
  }
}

/* 2026-09-03 station-timeline=20260903-r84
 * Workflow nodes use one station grammar across the full pattern timeline and
 * the compact product inspector: completed, current, next, and pending remain
 * visually distinct without changing business status or routing data. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline {
  display:grid !important;
  gap:0 !important;
  margin:12px 0 0 !important;
  padding:14px 4px 4px !important;
  border-top:1px solid #e1e7ee !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline li {
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) !important;
  gap:12px !important;
  min-height:58px !important;
  position:relative !important;
  padding:0 0 16px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline li:last-child {
  min-height:0 !important;
  padding-bottom:4px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline li:not(:last-child)::after {
  content:"" !important;
  position:absolute !important;
  top:30px !important;
  bottom:0 !important;
  left:15px !important;
  width:2px !important;
  background:#d5e0ea !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline li.current:not(:last-child)::after {
  background:#7ca9df !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline-station {
  position:relative !important;
  z-index:1 !important;
  display:grid !important;
  place-items:center !important;
  width:32px !important;
  height:32px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline-dot {
  display:block !important;
  width:22px !important;
  height:22px !important;
  margin:0 !important;
  border:2px solid #a9b9c8 !important;
  border-radius:50% !important;
  background:#fff !important;
  color:#7b8d9f !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline li.done .pattern-timeline-dot {
  border-color:#2caa85 !important;
  background:#e9f8f2 !important;
  box-shadow:inset 0 0 0 5px #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline li.current .pattern-timeline-dot {
  border-color:#1768d2 !important;
  background:#1768d2 !important;
  box-shadow:0 0 0 7px #e8f2ff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline li.next .pattern-timeline-dot {
  border-color:#1768d2 !important;
  background:#eef5ff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline-content {
  display:grid !important;
  min-width:0 !important;
  gap:4px !important;
  align-content:start !important;
  padding-top:1px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline-title {
  display:flex !important;
  min-width:0 !important;
  align-items:center !important;
  gap:8px !important;
  flex-wrap:wrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline-title strong {
  min-width:0 !important;
  color:#17324d !important;
  font-size:14px !important;
  line-height:1.3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline small {
  color:#687b90 !important;
  font-size:12px !important;
  line-height:1.45 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline-badge {
  display:inline-flex !important;
  align-items:center !important;
  min-height:20px !important;
  padding:2px 7px !important;
  border:1px solid #a9c9ef !important;
  border-radius:999px !important;
  color:#175cd3 !important;
  background:#e8f2ff !important;
  font-size:11px !important;
  font-weight:700 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-timeline {
  gap:0 !important;
  margin:0 !important;
  padding:10px 14px 16px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-timeline li {
  grid-template-columns:28px minmax(0,1fr) !important;
  gap:10px !important;
  min-height:52px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-timeline li:not(:last-child)::after {
  top:26px !important;
  bottom:-2px !important;
  left:13px !important;
  width:2px !important;
  background:#d5e0ea !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-timeline-mark {
  width:26px !important;
  height:26px !important;
  border-color:#a9b9c8 !important;
  color:#7b8d9f !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-timeline li.done .ledger-timeline-mark {
  border-color:#2caa85 !important;
  background:#e9f8f2 !important;
  color:#157658 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-timeline li.active .ledger-timeline-mark {
  border-color:#1768d2 !important;
  background:#eef5ff !important;
  color:#1768d2 !important;
  box-shadow:0 0 0 5px #e8f2ff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .ledger-timeline li > div {
  min-width:0 !important;
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline li {
    grid-template-columns:28px minmax(0,1fr) !important;
    gap:10px !important;
    min-height:54px !important;
    padding-bottom:14px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline-station {
    width:28px !important;
    height:28px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline-dot {
    width:18px !important;
    height:18px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline li:not(:last-child)::after {
    top:26px !important;
    left:13px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-timeline-title strong {
    font-size:13px !important;
  }
}

/* 2026-09-03 pattern-action-visibility=20260903-r1
 * ui-system-r40's list-only contract hides row primary actions and overflow
 * menus for ordinary tables. The pattern workbench is the deliberate
 * workflow exception: its current legal action must remain visible beside
 * the record, while the permission/state calculation stays in app.js. Keep
 * this override last so the visibility contract wins the cascade. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-workbench-table .pattern-row-actions > .row-primary-action {
  display: inline-flex !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-workbench-table .pattern-row-actions > .pattern-inline-more {
  display: flex !important;
}

/* 2026-09-03 direct-status-actions=20260903-r1
 * Every workbench record now exposes its currently legal actions directly.
 * The first action remains the primary decision; later actions stay visible
 * as neutral or warning controls, so no business step is hidden behind an
 * overflow menu. The legacy menu selectors above remain only for old cached
 * markup and are disabled whenever the new rail marker is present. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-workbench-table .workbench-direct-actions {
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:6px !important;
  min-width:0 !important;
  padding:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-workbench-table .workbench-direct-actions > .action-button {
  flex:0 1 auto !important;
  min-width:0 !important;
  max-width:100% !important;
  min-height:34px !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-workbench-table .workbench-direct-actions > .row-primary-action {
  display:inline-flex !important;
  flex:1 1 auto !important;
  min-width:112px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-workbench-table .workbench-direct-actions > .action-secondary:not(.workflow-return-button) {
  color:#31534f !important;
  border-color:#cfe1de !important;
  background:#fff !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-workbench-table .workbench-direct-actions > .workflow-return-button.action-secondary {
  color:#8a5a12 !important;
  border-color:#e2bf84 !important;
  background:#fff8eb !important;
  box-shadow:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-workbench-table .workbench-direct-actions > .action-detail {
  flex:0 1 auto !important;
  min-width:78px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .product-workbench-table .workbench-direct-actions .row-action-menu {
  display:none !important;
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-workbench-table .workbench-direct-actions > .action-button {
    flex:1 1 auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-workbench-table .workbench-direct-actions > .row-primary-action {
    flex:1 1 100% !important;
    min-width:0 !important;
  }
}

/* 2026-09-03 status-contrast=20260903-r1
 * Detail dialogs are mounted beside #page, so the earlier page-scoped light
 * rules could not beat the legacy dark .tag palette. Keep every authenticated
 * status token readable in both list rows and dialogs without changing its
 * semantic class or business value. */
body.workspace-mode :is(.app-shell:not(.auth-mode), .dialog, .dialog-inner, #activityPanel) :is(.tag, .status-tag, .chip) {
  border:1px solid #d6dde5 !important;
  border-radius:999px !important;
  color:#33445b !important;
  background:#eef2f6 !important;
}
body.workspace-mode :is(.app-shell:not(.auth-mode), .dialog, .dialog-inner, #activityPanel) :is(.tag.blue, .status-tag.blue, .chip.blue) {
  color:#175cd3 !important;
  border-color:#a9c7f5 !important;
  background:#eef5ff !important;
}
body.workspace-mode :is(.app-shell:not(.auth-mode), .dialog, .dialog-inner, #activityPanel) :is(.tag.green, .status-tag.green, .chip.green) {
  color:#176d5f !important;
  border-color:#b9dfc9 !important;
  background:#effaf4 !important;
}
body.workspace-mode :is(.app-shell:not(.auth-mode), .dialog, .dialog-inner, #activityPanel) :is(.tag.orange, .status-tag.orange, .chip.orange) {
  color:#8a5a00 !important;
  border-color:#e8c77f !important;
  background:#fff8eb !important;
}
body.workspace-mode :is(.app-shell:not(.auth-mode), .dialog, .dialog-inner, #activityPanel) :is(.tag.red, .status-tag.red, .chip.red) {
  color:#b42318 !important;
  border-color:#efb5ae !important;
  background:#fff5f4 !important;
}
body.workspace-mode :is(.app-shell:not(.auth-mode), .dialog, .dialog-inner, #activityPanel) :is(.tag.gray, .status-tag.gray, .chip.gray) {
  color:#59616b !important;
  border-color:#d5dbe1 !important;
  background:#f1f2f3 !important;
}
body.workspace-mode :is(.app-shell:not(.auth-mode), .dialog, .dialog-inner, #activityPanel) :is(.tag.purple, .status-tag.purple, .chip.purple) {
  color:#6959a8 !important;
  border-color:#d9d1ef !important;
  background:#f1effb !important;
}

/* 2026-09-03 workbench-priority-surface=20260903-r2
 * Promote the next legal action into a small, scannable queue. The design
 * workbench gets two lanes (materials and fitting); other workbenches reuse
 * the same row contract without changing their underlying workflow state. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-fitting-queue:not(.workbench-status-board),.workbench-priority-panel:not(.workbench-status-board)) {
  display: grid !important;
  gap: 11px !important;
  margin: 0 0 10px !important;
  padding: 14px 16px !important;
  border: 1px solid #dfe7ec !important;
  border-left: 3px solid #e46d5d !important;
  border-radius: 7px !important;
  background: #fff !important;
  box-shadow: 0 4px 14px rgba(24,55,78,.045) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-fitting-queue-head,.workbench-priority-head) {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 14px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-fitting-queue-head h3,.workbench-priority-head h3) {
  margin: 2px 0 3px !important;
  color: #17324d !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-fitting-queue-head .subtle,.workbench-priority-head .subtle) {
  display: block !important;
  max-width: 78ch !important;
  color: #738293 !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-fitting-queue-count {
  flex: 0 0 auto !important;
  color: #b84538 !important;
  font-size: 17px !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-priority-head .status-tag {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-grid,.workbench-priority-grid) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-priority-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-lane,.workbench-priority-lane) {
  display: grid !important;
  align-content: start !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding: 10px !important;
  border: 1px solid #e7edf0 !important;
  border-radius: 6px !important;
  background: #fbfcfd !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-priority-lane.is-material { border-top: 2px solid #e5a448 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-priority-lane.is-fitting { border-top: 2px solid #3b8ec4 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-lane-head,.workbench-priority-lane-head) {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-lane-head h4,.workbench-priority-lane-head h4) {
  margin: 0 !important;
  color: #20364e !important;
  font-size: 13px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-lane-head span,.workbench-priority-lane-head span) {
  display: block !important;
  margin-top: 2px !important;
  color: #7b8a98 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-lane-head b,.workbench-priority-lane-head b) {
  color: #20364e !important;
  font-size: 16px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-list,.workbench-priority-list) {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-row,.design-fitting-queue-row,.workbench-priority-row) {
  display: grid !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 6px 7px !important;
  border: 1px solid #e3eaee !important;
  border-radius: 5px !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-priority-row {
  grid-template-columns: 25px minmax(65px, 85px) minmax(0, 1fr) minmax(78px, .7fr) max-content !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-priority-row {
  grid-template-columns: minmax(65px, 85px) minmax(0, 1fr) max-content !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-fitting-queue-row {
  grid-template-columns: 25px minmax(65px, 85px) minmax(0, 1fr) minmax(80px, .7fr) minmax(78px, .6fr) max-content !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-copy,.design-fitting-queue-product,.design-fitting-queue-time,.design-fitting-queue-owner,.workbench-priority-copy) {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-copy strong,.design-fitting-queue-product strong,.design-fitting-queue-time strong,.design-fitting-queue-owner strong,.workbench-priority-copy strong) {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #20364e !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-copy small,.design-fitting-queue-product small,.design-fitting-queue-time small,.design-fitting-queue-owner small,.workbench-priority-copy small) {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #7a8a98 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-fitting-queue-index,.design-priority-more,.workbench-priority-more) {
  color: #b84538 !important;
  font-size: 10px !important;
  font-variant-numeric: tabular-nums !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-fitting-queue-action,.workbench-priority-action) {
  display: flex !important;
  justify-content: flex-end !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-empty,.workbench-priority-wait) {
  min-height: 38px !important;
  display: grid !important;
  place-items: center !important;
  color: #8795a1 !important;
  font-size: 11px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-priority-panel .workbench-priority-more {
  display: block !important;
  margin-top: 1px !important;
  color: #7b8a98 !important;
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-fitting-queue,.workbench-priority-panel) {
    padding: 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-fitting-queue-head,.workbench-priority-head) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-priority-grid,.workbench-priority-grid) {
    grid-template-columns: 1fr !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-priority-row {
    grid-template-columns: 23px minmax(62px, 75px) minmax(0, 1fr) max-content !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-priority-row .design-fitting-queue-time {
    display: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-fitting-queue-row {
    grid-template-columns: 23px minmax(62px, 78px) minmax(0, 1fr) max-content !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-fitting-queue-time,.design-fitting-queue-owner) {
    display: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-priority-row {
    grid-template-columns: minmax(62px, 78px) minmax(0, 1fr) max-content !important;
  }
}

/* operation-lifecycle-surface=20260903-r1: keep order and schedule cards on
 * the same read-only lifecycle facts as the shared workbench table. */
.operation-order-lifecycle,
.schedule-product-status {
  min-width: 0;
}
.operation-order-lifecycle .workbench-lifecycle-inline {
  margin-top: 2px;
  padding-left: 7px;
}
.schedule-product-status {
  display: grid !important;
  gap: 4px;
  align-items: start !important;
  overflow: visible !important;
  white-space: normal !important;
}
.schedule-product-status .workbench-lifecycle-inline {
  width: 100%;
  padding-left: 6px;
}
.schedule-product-status > span {
  display: inline-flex;
  width: fit-content;
}
@media (max-width: 760px) {
  .operation-order-lifecycle .workbench-lifecycle-inline,
  .schedule-product-status .workbench-lifecycle-inline {
    padding-left: 5px;
  }
}

/* workbench-lifecycle-r1: keep list summaries aligned with the detail-page
 * lifecycle without adding another table column or changing permissions. */
.workbench-lifecycle-inline {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.workbench-lifecycle-inline-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}
.workbench-lifecycle-inline-head > strong {
  min-width: 0;
  color: #17324d;
  font-size: 12px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.workbench-lifecycle-inline > small,
.workbench-lifecycle-next {
  min-width: 0;
  color: #68788b;
  font-size: 11px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.workbench-lifecycle-inline.is-current {
  padding-left: 8px;
  border-left: 3px solid #d56b3f;
}
.workbench-lifecycle-inline.is-done {
  padding-left: 8px;
  border-left: 3px solid #2d7a67;
}
.workbench-lifecycle-inline.is-pending {
  padding-left: 8px;
  border-left: 3px solid #c6d3dc;
}
.procurement-status-stack .workbench-lifecycle-inline {
  padding-left: 0;
  border-left: 0;
}
@media (max-width: 760px) {
  .workbench-lifecycle-inline-head > strong {
    font-size: 11px;
  }
  .workbench-lifecycle-inline > small,
  .workbench-lifecycle-next {
    font-size: 10px;
  }
}

/* product-lifecycle-r1: canonical cross-module hand-off summary. */
.product-lifecycle-summary {
  margin: 18px 0 22px;
  padding: 18px 20px 16px;
  border: 1px solid #d7e2ea;
  border-radius: 8px;
  background: #f7fafc;
  color: #17324d;
}
.product-lifecycle-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.product-lifecycle-head .eyebrow {
  margin-bottom: 5px;
  color: #60758a;
}
.product-lifecycle-head h3 {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  font-size: 18px;
  line-height: 1.35;
  color: #17324d;
}
.product-lifecycle-head h3 small {
  color: #486681;
  font-size: 13px;
  font-weight: 600;
}
.product-lifecycle-head p {
  margin: 6px 0 0;
  overflow-wrap: anywhere;
}
.product-lifecycle-percent {
  flex: 0 0 auto;
  min-width: 56px;
  color: #1d6b59;
  font-size: 20px;
  line-height: 1;
  text-align: right;
}
.product-lifecycle-track {
  height: 7px;
  margin: 15px 0 16px;
  overflow: hidden;
  border-radius: 99px;
  background: #dbe5ec;
}
.product-lifecycle-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #2d7a67;
  transition: width .2s ease;
}
.product-lifecycle-summary.is-overdue .product-lifecycle-track i {
  background: #c56a3f;
}
.product-lifecycle-stages {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.product-lifecycle-stage {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 9px;
  min-width: 0;
  padding: 10px 9px;
  border-left: 3px solid #c6d3dc;
  background: #fff;
}
.product-lifecycle-stage.is-current {
  border-left-color: #d56b3f;
  background: #fff8f4;
}
.product-lifecycle-stage.is-done {
  border-left-color: #2d7a67;
}
.product-lifecycle-index {
  color: #8093a3;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}
.product-lifecycle-stage div {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.product-lifecycle-stage strong,
.product-lifecycle-stage small,
.product-lifecycle-stage em {
  min-width: 0;
  overflow-wrap: anywhere;
}
.product-lifecycle-stage strong {
  color: #17324d;
  font-size: 13px;
  line-height: 1.35;
}
.product-lifecycle-stage small {
  color: #486681;
  font-size: 12px;
  line-height: 1.35;
}
.product-lifecycle-stage em {
  color: #8093a3;
  font-size: 11px;
  font-style: normal;
  line-height: 1.3;
}
.product-lifecycle-next {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 10px;
  align-items: baseline;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #dce6ed;
}
.product-lifecycle-next > span {
  color: #60758a;
  font-size: 12px;
  font-weight: 700;
}
.product-lifecycle-next strong,
.product-lifecycle-next small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.product-lifecycle-next strong {
  color: #17324d;
  font-size: 13px;
  line-height: 1.4;
}
.product-lifecycle-next small {
  grid-column: 2;
  color: #a35d3e;
  font-size: 11px;
  line-height: 1.35;
}
@media (max-width: 900px) {
  .product-lifecycle-stages {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .product-lifecycle-summary {
    padding: 15px 14px 14px;
  }
  .product-lifecycle-head h3 {
    font-size: 16px;
  }
  .product-lifecycle-stages {
    grid-template-columns: 1fr;
    gap: 7px;
  }
  .product-lifecycle-stage {
    grid-template-columns: 30px minmax(0, 1fr);
  }
}

/* 2026-09-03 pattern-return-guide=20260903-r1
 * The guide is conditional and may include a count plus a longer action
 * sentence; let it wrap within the panel action area instead of overflowing. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .pattern-return-guide {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}

/* 2026-09-03 workbench-density=20260903-r9
 * The shared workbench record has nine cells, but the previous desktop grid
 * let identity span two tracks. The content stayed at the left edge of that
 * span, leaving a dead middle column in every design, pattern, procurement,
 * production and product-center list. Keep the cells and labels intact while
 * assigning each fact to one bounded track; identity and category now stack
 * in one track, and every text-bearing cell can shrink without overlap. */
@media (min-width: 1181px) {
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    --workbench-dense-grid: 72px 64px minmax(190px,1.35fr) minmax(200px,1.3fr) minmax(170px,1.05fr) minmax(150px,.9fr) minmax(130px,.8fr) minmax(136px,.85fr);
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 0 6px !important;
    overflow: visible !important;
    clip: auto !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead tr {
    display: grid !important;
    grid-template-columns: var(--workbench-dense-grid) !important;
    grid-template-rows: 24px 24px !important;
    grid-template-areas:
      "style image identity flow owner attrs match actions"
      "style image category flow owner attrs match actions" !important;
    align-items: center !important;
    gap: 0 8px !important;
    min-width: 0 !important;
    min-height: 48px !important;
    padding: 0 12px !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead th,
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td {
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead th {
    display: flex !important;
    align-items: center !important;
    width: auto !important;
    min-height: 0 !important;
    padding: 0 6px !important;
    overflow: hidden !important;
    color: #61758a !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    text-overflow: ellipsis !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table :is(thead th, tbody td):nth-child(1) { grid-area: style !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table :is(thead th, tbody td):nth-child(2) { grid-area: image !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table :is(thead th, tbody td):nth-child(3) { grid-area: identity !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table :is(thead th, tbody td):nth-child(4) { grid-area: category !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table :is(thead th, tbody td):nth-child(5) { grid-area: flow !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table :is(thead th, tbody td):nth-child(6) { grid-area: owner !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table :is(thead th, tbody td):nth-child(7) { grid-area: attrs !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table :is(thead th, tbody td):nth-child(8) { grid-area: match !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table :is(thead th, tbody td):nth-child(9) { grid-area: actions !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table tbody tr {
    display: grid !important;
    grid-template-columns: var(--workbench-dense-grid) !important;
    grid-template-areas:
      "style image identity flow owner attrs match actions"
      "style image category flow owner attrs match actions" !important;
    align-items: center !important;
    gap: 4px 8px !important;
    min-height: 96px !important;
    padding: 10px 12px !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table tbody td:not(.product-actions-cell) {
    overflow: hidden !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table tbody td.product-actions-cell {
    align-self: stretch !important;
    overflow: visible !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table tbody td :is(.stack, .match-style-list, .product-row-actions, .pattern-progress),
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table tbody td :is(strong, span, small, b) {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table tbody td :is(.stack, .match-style-list) {
    overflow-wrap: anywhere !important;
    white-space: normal !important;
    line-height: 1.35 !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table .product-image {
    width: 56px !important;
    height: 74px !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table .product-row-actions {
    min-width: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 5px !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] .product-workbench-table .product-row-actions :is(.action-button, .row-action-menu, .row-action-menu-trigger) {
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead {
    display: none !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody tr {
    display: grid !important;
    grid-template-columns: 64px 56px minmax(0,1fr) minmax(138px,.85fr) !important;
    grid-template-areas:
      "style image identity actions"
      "style image category actions"
      "flow flow flow actions"
      "owner owner attrs actions"
      "match match match actions" !important;
    gap: 8px 10px !important;
    min-height: 0 !important;
    padding: 11px 12px !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(1) { grid-area: style !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(2) { grid-area: image !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(3) { grid-area: identity !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(4) { grid-area: category !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(5) { grid-area: flow !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(6) { grid-area: owner !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(7) { grid-area: attrs !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(8) { display: block !important; grid-area: match !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(9) { grid-area: actions !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:not(.product-actions-cell) { overflow: hidden !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-row-actions { height: 100% !important; justify-content: center !important; }
}

@media (max-width: 760px) {
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 92px !important;
    grid-template-areas:
      "style image"
      "identity image"
      "category category"
      "flow flow"
      "owner owner"
      "attrs attrs"
      "match match"
      "actions actions" !important;
    gap: 8px 10px !important;
    min-height: 0 !important;
    padding: 12px !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(1) { grid-area: style !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(2) { grid-area: image !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(3) { grid-area: identity !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(4) { grid-area: category !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(5) { grid-area: flow !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(6) { grid-area: owner !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(7) { grid-area: attrs !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(8) { display: block !important; grid-area: match !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:nth-child(9) { grid-area: actions !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table tbody td:not(.product-actions-cell) { overflow: hidden !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-workbench-table .product-row-actions {
    height: auto !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
  }
}

/* 2026-09-03 operations-detail-focus=20260903-r2: keep the role-owned detail compact and scannable. */
body.workspace-mode .operation-detail-context {
  margin: 18px 0 6px;
  padding: 18px 20px;
  border: 1px solid var(--r50-line, #dce4ee);
  border-radius: 8px;
  background: #f7faff;
}
body.workspace-mode .operation-detail-context .section-heading {
  margin: 0 0 14px;
}
body.workspace-mode .operation-detail-context-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
body.workspace-mode .operation-detail-context-grid > div {
  min-width: 0;
  display: grid;
  gap: 4px;
}
body.workspace-mode .operation-detail-context-grid span {
  color: #6b7a90;
  font-size: 12px;
}
body.workspace-mode .operation-detail-context-grid strong {
  color: #17354a;
  font-size: 16px;
  overflow-wrap: anywhere;
}
body.workspace-mode .operation-detail-owner {
  color: #49627b;
}
@media (max-width: 760px) {
  body.workspace-mode .operation-detail-context {
    padding: 14px;
  }
  body.workspace-mode .operation-detail-context-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

body.workspace-mode .operation-order-dialog .order-product-summary {
  display:grid !important;
  grid-template-columns:52px minmax(0,1fr) !important;
  align-items:center !important;
  gap:10px !important;
}
body.workspace-mode .operation-order-dialog .order-product-summary img {
  width:52px !important;
  height:68px !important;
  object-fit:contain !important;
  border:1px solid #dbe3ea !important;
  border-radius:4px !important;
}
body.workspace-mode .operation-order-dialog .order-product-summary > div {
  display:grid !important;
  gap:3px !important;
  min-width:0 !important;
}
body.workspace-mode .operation-order-dialog .order-product-summary > div > :is(strong,span,small) {
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}

/* 2026-09-03 workbench-status-board=20260903-r3
 * Keep all role-owned statuses visible on the first workbench screen while
 * preserving compact rows and the existing light workspace visual language. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board {
  gap: 12px !important;
  margin-bottom: 12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board-design .workbench-status-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 10px !important;
  border: 1px solid #e7edf0 !important;
  border-top: 2px solid #cbd8df !important;
  border-radius: 6px !important;
  background: #fbfcfd !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane.is-material,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane.is-todo { border-top-color: #e5a448 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane.is-fitting,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane.is-progress { border-top-color: #3b8ec4 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane.is-alert { border-top-color: #d56559 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane.is-confirm { border-top-color: #8b78b7 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane.is-done { border-top-color: #6ba37e !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-row {
  grid-template-columns: minmax(66px, 88px) minmax(0, 1fr) max-content !important;
  min-height: 40px !important;
  padding: 6px 7px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-copy {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.workbench-status-copy strong,.workbench-status-copy small) {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-copy strong {
  color: #20364e !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-copy small {
  color: #7a8a98 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-action {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 5px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-action .action-button {
  max-width: 138px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-wait {
  max-width: 118px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #8795a1 !important;
  font-size: 10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane-footer {
  min-height: 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  padding-top: 2px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane-link {
  color: #587891 !important;
  font-size: 10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-empty-row,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-empty {
  min-height: 38px !important;
  display: grid !important;
  place-items: center !important;
  color: #8795a1 !important;
  font-size: 11px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-more {
  flex: 0 0 auto !important;
}
@media (max-width: 980px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-grid,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board-design .workbench-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-grid,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board-design .workbench-status-grid {
    grid-template-columns: 1fr !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-row {
    grid-template-columns: minmax(62px, 78px) minmax(0, 1fr) max-content !important;
  }
}

/* 2026-09-03 product-center-toolbar-removal=20260903-r92
 * Hide the retired product-center banner even when an already-open tab runs
 * an older operations-ledger bundle for one render cycle. The old inspector
 * wrapper is flattened so removing it cannot leave a blank right column. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.product-center-toolbar,.ledger-summary,.ledger-inspector) {
  display: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-ledger-layout {
  display: block !important;
  grid-template-columns: minmax(0,1fr) !important;
}

/* 2026-09-03 workbench-priority-summary=20260903-r4
 * Keep role workbenches calm: the work-card band is the single summary entry
 * point, while the older priority panels no longer repeat individual rows. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.design-fitting-queue:not(.workbench-status-board),.workbench-priority-panel:not(.workbench-status-board)) {
  display: none !important;
}

/* 2026-09-03 design-fitting-queue-priority=20260903-r5
 * The design workbench has one focused exception to the compact summary rule:
 * every style waiting for fitting is visible in its own chronological lane.
 * Other role priority panels remain collapsed so the home page does not grow
 * into a second detail table. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue.design-fitting-queue-dedicated {
  display: grid !important;
  gap: 12px !important;
  margin: 0 0 14px !important;
  padding: 14px 16px !important;
  border: 1px solid #dfe7ec !important;
  border-left: 3px solid #3b8ec4 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 14px rgba(24,55,78,.045) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated .design-fitting-queue-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 14px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated .design-fitting-queue-head h3 {
  margin: 2px 0 3px !important;
  color: #17324d !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated .design-fitting-queue-head .subtle {
  display: block !important;
  max-width: 78ch !important;
  color: #738293 !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated .design-fitting-queue-count {
  flex: 0 0 auto !important;
  color: #1768a8 !important;
  font-size: 17px !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated .design-fitting-queue-list {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated .design-fitting-queue-row {
  display: grid !important;
  grid-template-columns: 28px minmax(72px, 100px) minmax(0, 1fr) minmax(122px, .7fr) minmax(112px, .65fr) max-content !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  min-height: 46px !important;
  padding: 7px 8px !important;
  border: 1px solid #e4e9ef !important;
  border-radius: 5px !important;
  background: #fbfcfd !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated .design-fitting-queue-index {
  color: #3b8ec4 !important;
  font-size: 12px !important;
  font-variant-numeric: tabular-nums !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated :is(.design-fitting-queue-product,.design-fitting-queue-time,.design-fitting-queue-owner) {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated :is(.design-fitting-queue-product strong,.design-fitting-queue-time strong,.design-fitting-queue-owner strong) {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #20364e !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated :is(.design-fitting-queue-product small,.design-fitting-queue-time small,.design-fitting-queue-owner small) {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #7a8a98 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-fitting-queue-dedicated .design-fitting-queue-action {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 5px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .design-fitting-queue.design-fitting-queue-dedicated {
    padding: 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .design-fitting-queue-dedicated .design-fitting-queue-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .design-fitting-queue-dedicated .design-fitting-queue-row {
    grid-template-columns: 24px minmax(62px, 78px) minmax(0, 1fr) max-content !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .design-fitting-queue-dedicated :is(.design-fitting-queue-time,.design-fitting-queue-owner) {
    display: none !important;
  }
}

/* 2026-09-03 workbench-summary-detail=20260903-r6-final
 * Legacy summary selector :is(.design-fitting-queue,.workbench-priority-panel)
 * remains documented for compatibility; the new status board is the deliberate
 * first-screen exception and stays visible. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.design-fitting-queue:not(.workbench-status-board):not(.design-fitting-queue-dedicated),.workbench-priority-panel:not(.workbench-status-board)) {
  display: none !important;
}

/* 2026-09-03 operations-focus=20260903-r1
 * Operations owns the demand and launch decisions. Procurement, production and
 * cost details stay in their workbenches instead of competing for first-screen
 * attention in the order list. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-summary {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
  margin:0 0 14px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-metric {
  display:grid !important;
  gap:5px !important;
  min-width:0 !important;
  padding:16px 18px !important;
  border:1px solid #dfe5eb !important;
  border-left:3px solid #8da6ba !important;
  border-radius:6px !important;
  background:#fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-metric.is-ready { border-left-color:#2c9b75 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-metric.is-active { border-left-color:#3b82b8 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-metric.is-attention { border-left-color:#d58b3d !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-metric span,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-metric small {
  color:#6f7b86 !important;
  font-size:12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-metric strong {
  color:#1e3348 !important;
  font-size:28px !important;
  line-height:1.1 !important;
  font-variant-numeric:tabular-nums !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-toolbar {
  align-items:flex-end !important;
  margin:0 0 10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-toolbar h2 {
  margin:0 !important;
  color:#1e3348 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-toolbar p:not(.eyebrow) {
  margin:5px 0 0 !important;
  color:#697786 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-filter-panel {
  margin:0 0 14px !important;
  padding:12px 16px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-filter-row {
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:flex-start !important;
  gap:18px 28px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-filter-row > div {
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-filter-label {
  color:#647381 !important;
  font-size:12px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-filter-group {
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-filter-group .filter-chip {
  min-height:30px !important;
  padding:5px 10px !important;
  border-radius:4px !important;
  font-size:12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-orders-panel {
  padding:0 !important;
  overflow:hidden !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-orders-head {
  min-height:64px !important;
  padding:14px 18px !important;
  border-bottom:1px solid #e2e7ec !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-orders-head h3 {
  margin:0 !important;
  color:#20364e !important;
  font-size:17px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-count {
  color:#62768a !important;
  font-size:12px !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-grid {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;
  padding:14px !important;
  background:#f8fafb !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-card {
  display:grid !important;
  gap:12px !important;
  min-width:0 !important;
  padding:14px !important;
  border:1px solid #dfe5eb !important;
  border-radius:6px !important;
  background:#fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-head,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-identity,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-code-row,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-foot {
  display:flex !important;
  align-items:center !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-head {
  justify-content:space-between !important;
  gap:12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-identity {
  gap:11px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-image {
  width:60px !important;
  height:78px !important;
  flex:0 0 60px !important;
  object-fit:contain !important;
  border:1px solid #d9e1e8 !important;
  border-radius:4px !important;
  background:#f5f7f9 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy {
  display:grid !important;
  gap:4px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-code-row {
  gap:8px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy > :is(strong,span),
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy .style-code {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy .style-code {
  padding:0 !important;
  color:#175cd3 !important;
  font-size:15px !important;
  font-weight:750 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy strong { color:#263c51 !important; font-size:13px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy span { color:#738294 !important; font-size:11px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-quantity {
  display:flex !important;
  align-items:baseline !important;
  gap:4px !important;
  flex:0 0 auto !important;
  color:#667787 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-quantity strong {
  color:#20364e !important;
  font-size:26px !important;
  font-variant-numeric:tabular-nums !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-facts {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:8px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-facts > div {
  display:grid !important;
  gap:3px !important;
  min-width:0 !important;
  padding:8px 9px !important;
  border:1px solid #edf0f3 !important;
  border-radius:4px !important;
  background:#fafbfc !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-facts span { color:#7a8793 !important; font-size:10px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-facts strong {
  min-width:0 !important;
  overflow-wrap:anywhere !important;
  color:#30485f !important;
  font-size:12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-lines {
  min-width:0 !important;
  border-top:1px solid #edf0f3 !important;
  border-bottom:1px solid #edf0f3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-lines summary {
  display:flex !important;
  justify-content:space-between !important;
  gap:10px !important;
  padding:9px 0 !important;
  color:#3f6a91 !important;
  cursor:pointer !important;
  font-size:12px !important;
  font-weight:650 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-lines summary span { color:#87939d !important; font-weight:500 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-lines p {
  margin:0 0 10px !important;
  color:#65788a !important;
  font-size:12px !important;
  line-height:1.55 !important;
  overflow-wrap:anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-foot {
  justify-content:space-between !important;
  gap:10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-time {
  color:#88939d !important;
  font-size:10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-actions {
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
  gap:6px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-empty {
  display:grid !important;
  justify-items:center !important;
  gap:7px !important;
  grid-column:1/-1 !important;
  padding:48px 20px !important;
  color:#708090 !important;
  text-align:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-empty-mark {
  display:grid !important;
  width:36px !important;
  height:36px !important;
  place-items:center !important;
  border:1px solid #c7d6e1 !important;
  border-radius:50% !important;
  color:#3d83aa !important;
  font-size:22px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-empty strong { color:#30485f !important; font-size:14px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-empty span { max-width:420px !important; color:#768492 !important; font-size:12px !important; line-height:1.6 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-dialog .role-banner {
  margin-bottom:2px !important;
  border-left-color:#3d83aa !important;
  background:#f1f7fb !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-dialog .order-product-summary {
  display:grid !important;
  grid-template-columns:52px minmax(0,1fr) !important;
  align-items:center !important;
  gap:10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-dialog .order-product-summary img {
  width:52px !important;
  height:68px !important;
  object-fit:contain !important;
  border:1px solid #dbe3ea !important;
  border-radius:4px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-dialog .order-product-summary div {
  display:grid !important;
  gap:3px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-dialog .order-product-summary :is(strong,span,small) { min-width:0 !important; overflow-wrap:anywhere !important; }
@media (max-width: 920px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-grid { grid-template-columns:1fr !important; }
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-summary { grid-template-columns:1fr !important; gap:8px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-metric { padding:12px 14px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-focus-metric strong { font-size:24px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-filter-row { display:grid !important; gap:10px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-filter-row > div { display:grid !important; gap:6px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-grid { padding:10px !important; gap:10px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-card { padding:12px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-facts { grid-template-columns:1fr 1fr !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-facts > div:last-child { grid-column:1/-1 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-foot { align-items:flex-start !important; flex-direction:column !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-actions { justify-content:flex-start !important; width:100% !important; }
}

/* 2026-09-03 product-center-inspector-seal=20260903-r93
 * Product Center keeps one full-width catalog surface. This final selector
 * protects already-open tabs and older enhancement bundles from restoring a
 * right-hand inspector or leaving an empty grid column after it is removed. */
#page .view-panel[data-view="products"] :is(.product-center-toolbar,.ledger-summary,.ledger-inspector) {
  display: none !important;
}
#page .view-panel[data-view="products"] .ledger-inspector {
  display: none !important;
}
#page .view-panel[data-view="products"] .product-ledger-layout {
  display: block !important;
  grid-template-columns: minmax(0, 1fr) !important;
}
#page .view-panel[data-view="products"] .product-ledger-layout > .product-workbench-panel {
  width: 100% !important;
  min-width: 0 !important;
}

/* 2026-09-03 workbench-summary-only=20260903-r7
 * The first-level status board is a compact index, not a second record list.
 * Keep the status, aggregate count and one drill-down action here; record
 * fields and processing controls remain in the original detail surface. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board .workbench-status-lane {
  display: grid !important;
  grid-template-rows: auto minmax(24px, 1fr) auto !important;
  min-height: 124px !important;
  padding: 12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-priority-lane-head,.workbench-priority-lane-head) {
  min-height: 58px !important;
  align-items: start !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-priority-lane-head h4,.workbench-priority-lane-head h4) {
  font-size: 14px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-priority-lane-head span,.workbench-priority-lane-head span) {
  max-width: 34em !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-priority-lane-head b,.workbench-priority-lane-head b) {
  min-width: 42px !important;
  font-size: 27px !important;
  line-height: 1 !important;
  text-align: right !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane-body {
  display: flex !important;
  align-items: center !important;
  color: #8a98a4 !important;
  font-size: 11px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane-footer {
  min-height: 30px !important;
  padding-top: 8px !important;
  border-top: 1px solid #edf1f3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane-link {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 0 2px !important;
  color: #3d83aa !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-lane-link:hover {
  color: #245f82 !important;
  text-decoration: underline !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-empty {
  font-size: 11px !important;
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board .workbench-status-lane {
    min-height: 112px !important;
    padding: 11px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-priority-lane-head span,.workbench-priority-lane-head span) {
    max-width: 24em !important;
  }
}

/* 2026-09-03 workbench-summary-detail=20260903-r7-final
 * The work-card summary is the only first-screen entry point.  Legacy status
 * boards remain in source for compatibility but are removed from layout and
 * accessibility trees so they cannot duplicate the detail list. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.design-fitting-queue:not(.workbench-status-board),.workbench-priority-panel:not(.workbench-status-board)) {
  display: none !important;
}

/* 2026-09-03 workbench-density=20260903-r8
 * One compact status index is enough on the first screen. The original
 * detail list remains below the index and opens through each lane action. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page:has(.workbench-status-board) .work-cards {
  display: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board {
  gap: 8px !important;
  margin-bottom: 8px !important;
  padding: 10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-fitting-queue-head,.workbench-priority-head) {
  gap: 8px !important;
  align-items: center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-fitting-queue-head h3,.workbench-priority-head h3) {
  margin: 0 !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-fitting-queue-head .subtle,.workbench-priority-head .subtle) {
  margin-top: 2px !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-total {
  padding: 4px 8px !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board .workbench-status-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
/* workbench-role-owned-summary=20260903-r10: mirrored handoff lanes stay
 * explicit, while two-lane boards use both columns instead of leaving a
 * third empty resource slot. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board-count-2 .workbench-status-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board-design .workbench-status-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board .workbench-status-lane {
  grid-template-rows: auto auto !important;
  min-height: 76px !important;
  padding: 8px !important;
  border-radius: 5px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board .workbench-status-lane-body {
  display: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-priority-lane-head,.workbench-priority-lane-head) {
  min-height: 42px !important;
  align-items: start !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-priority-lane-head h4,.workbench-priority-lane-head h4) {
  font-size: 13px !important;
  line-height: 1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-priority-lane-head span,.workbench-priority-lane-head span) {
  margin-top: 2px !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board :is(.design-priority-lane-head b,.workbench-priority-lane-head b) {
  min-width: 30px !important;
  font-size: 23px !important;
  line-height: 1 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board .workbench-status-lane-footer {
  min-height: 22px !important;
  padding-top: 4px !important;
  border-top: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board .workbench-status-empty {
  min-height: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board .workbench-status-lane-link {
  min-height: 22px !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-route-panel,.production-route-panel) {
  margin-bottom: 8px !important;
  padding: 10px 12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-route-panel,.production-route-panel) .workflow-route-head {
  gap: 8px !important;
  margin-bottom: 7px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-route-panel,.production-route-panel) .workflow-route-head h3 {
  font-size: 15px !important;
  line-height: 1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-route-panel,.production-route-panel) .workflow-route-head .subtle {
  max-width: 68ch !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-route-panel,.production-route-panel) .workflow-route-lane {
  min-height: 48px !important;
  padding: 6px 8px !important;
  gap: 8px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-route-panel,.production-route-panel) .workflow-route-note {
  display: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-route-panel,.production-route-panel) .workflow-route-step {
  padding: 5px 6px 4px 8px !important;
  font-size: 10px !important;
}
@media (max-width: 980px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board-design .workbench-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board .workbench-status-grid,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-status-board-design .workbench-status-grid {
    grid-template-columns: 1fr !important;
  }
}

/* 2026-09-03 order-row-list=20260903-r1
 * Operations orders are records, not dashboard cards. Keep one compact row
 * per order so the list can be scanned without wasting vertical space. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  padding: 0 !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row {
  display: grid !important;
  grid-template-columns: minmax(220px, 1.7fr) minmax(190px, 1.45fr) 92px 126px 150px minmax(150px, 1.15fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  min-height: 70px !important;
  padding: 10px 18px !important;
  border-bottom: 1px solid #e5e9ed !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row:last-child {
  border-bottom: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row:hover {
  background: #fbfcfd !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-main {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-image {
  width: 42px !important;
  height: 54px !important;
  flex: 0 0 42px !important;
  object-fit: contain !important;
  border: 1px solid #d9e1e8 !important;
  border-radius: 4px !important;
  background: #f5f7f9 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-cell {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-code-row {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy :is(.style-code,strong,span),
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-cell :is(strong,small) {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy .style-code {
  padding: 0 !important;
  color: #175cd3 !important;
  font-size: 14px !important;
  font-weight: 750 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy strong {
  color: #263c51 !important;
  font-size: 12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy span,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-cell > span {
  color: #7a8793 !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-cell > strong {
  color: #30485f !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-lines-cell strong {
  overflow-wrap: anywhere !important;
  white-space: normal !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-meta small {
  color: #88939d !important;
  font-size: 10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-quantity strong {
  color: #20364e !important;
  font-size: 18px !important;
  font-variant-numeric: tabular-nums !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  min-width: 0 !important;
}

/* The order dialog lives beside the app shell, so the shell-only light-surface
 * rules cannot reach its product picker. This terminal override seals the
 * picker and empty selection summary against the legacy dark theme. */
body.workspace-mode .dialog .operation-order-dialog :is(.order-product-search,.order-product-results,.order-product-result,.order-product-summary) {
  color: #24364a !important;
  border-color: #cbd5df !important;
  background: #fff !important;
  color-scheme: light !important;
  box-shadow: none !important;
}
body.workspace-mode .dialog .operation-order-dialog .order-product-search input {
  color: #15243a !important;
  background: transparent !important;
}
body.workspace-mode .dialog .operation-order-dialog .order-product-search input::placeholder {
  color: #858b93 !important;
  opacity: 1 !important;
}
body.workspace-mode .dialog .operation-order-dialog .order-product-result:hover,
body.workspace-mode .dialog .operation-order-dialog .order-product-result:focus-visible {
  background: #f4f7fa !important;
}
body.workspace-mode .dialog .operation-order-dialog .order-product-summary {
  color: #596777 !important;
  background: #f7f9fb !important;
}
body.workspace-mode .dialog .operation-order-dialog .order-product-summary .subtle {
  color: #69788b !important;
}
body.workspace-mode .dialog .operation-order-dialog .order-product-results[hidden] {
  display: none !important;
}

@media (max-width: 980px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row {
    grid-template-columns: minmax(210px, 1.5fr) minmax(180px, 1.25fr) 86px 118px minmax(140px, 1fr) auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-meta {
    display: none !important;
  }
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 9px 12px !important;
    min-height: 0 !important;
    padding: 11px 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-main {
    min-width: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-lines-cell,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-cell:not(.operation-order-quantity):not(.operation-order-main),
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-actions {
    grid-column: 1 / -1 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-quantity {
    justify-items: end !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-actions {
    justify-content: flex-start !important;
  }
}

/* 2026-09-03 workbench-density=20260903-r10-final
 * Terminal cascade lock. Older workbench rules use :has()-scoped selectors
 * and appear later than the original density pass on some breakpoints. This
 * final layer repeats only the layout contract with matching specificity so
 * no stale six-track or spanning identity grid can win in the cascade. */
@media (min-width: 1181px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    --workbench-dense-final-grid: 72px 64px minmax(190px,1.35fr) minmax(200px,1.3fr) minmax(170px,1.05fr) minmax(150px,.9fr) minmax(130px,.8fr) minmax(136px,.85fr);
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead {
    display:block !important;
    width:100% !important;
    height:auto !important;
    margin:0 0 6px !important;
    overflow:visible !important;
    clip:auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead tr,tbody tr) {
    display:grid !important;
    grid-template-columns:var(--workbench-dense-final-grid) !important;
    grid-template-areas:
      "style image identity flow owner attrs match actions"
      "style image category flow owner attrs match actions" !important;
    align-items:center !important;
    gap:4px 8px !important;
    min-width:0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead tr {
    grid-template-rows:24px 24px !important;
    min-height:48px !important;
    padding:0 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    min-height:96px !important;
    padding:10px 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th,tbody td):nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th,tbody td):nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th,tbody td):nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th,tbody td):nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th,tbody td):nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th,tbody td):nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th,tbody td):nth-child(7) { grid-area:attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th,tbody td):nth-child(8) { grid-area:match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th,tbody td):nth-child(9) { grid-area:actions !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:not(.product-actions-cell) { overflow:hidden !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td.product-actions-cell { overflow:visible !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-image {
    width:56px !important;
    height:74px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions {
    width:100% !important;
    height:100% !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:stretch !important;
    gap:5px !important;
  }
}

@media (min-width:761px) and (max-width:1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead { display:none !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    display:grid !important;
    grid-template-columns:64px 56px minmax(0,1fr) minmax(138px,.85fr) !important;
    grid-template-areas:
      "style image identity actions"
      "style image category actions"
      "flow flow flow actions"
      "owner owner attrs actions"
      "match match match actions" !important;
    gap:8px 10px !important;
    min-height:0 !important;
    padding:11px 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7) { grid-area:attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(8) { display:block !important; grid-area:match !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(9) { grid-area:actions !important; }
}

/* 2026-09-04 workbench-grid-fix=20260904-r1
 * The design and pattern workbenches render ten cells, while older terminal
 * rules mapped only eight or nine areas. Keep every rendered cell in an
 * explicit track so the final operation column remains visible and clickable.
 * The design list also exposes high-frequency edit entry points in its own
 * direct-maintenance column. */
@media (min-width: 1181px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design) {
    --workbench-grid-final: 78px 58px minmax(160px,1.15fr) minmax(132px,1fr) minmax(150px,1fr) minmax(130px,.9fr) minmax(140px,1fr) minmax(108px,.78fr) minmax(126px,.86fr);
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design {
    --workbench-grid-final: 78px 58px minmax(160px,1.1fr) minmax(132px,.95fr) minmax(148px,1fr) minmax(182px,1.08fr) minmax(128px,.9fr) minmax(138px,.96fr) minmax(108px,.78fr) minmax(126px,.86fr);
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern {
    --workbench-grid-final: 78px 58px minmax(160px,1.1fr) minmax(132px,.95fr) minmax(178px,1.08fr) minmax(128px,.9fr) minmax(116px,.78fr) minmax(138px,.96fr) minmax(108px,.78fr) minmax(126px,.86fr);
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead tr, tbody tr) {
    display: grid !important;
    grid-template-columns: var(--workbench-grid-final) !important;
    align-items: center !important;
    gap: 4px 8px !important;
    min-width: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead tr {
    grid-template-areas: "style image identity category flow direct owner assign attrs match actions" !important;
    min-height: 38px !important;
    padding: 0 10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    min-height: 90px !important;
    padding: 8px 10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design) :is(thead tr, tbody tr) {
    grid-template-areas: "style image identity category flow owner attrs match actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead tr, tbody tr) {
    grid-template-areas: "style image identity category flow direct owner attrs match actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern :is(thead tr, tbody tr) {
    grid-template-areas: "style image identity category flow owner assign attrs match actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td) {
    position: relative !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: visible !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td):nth-child(1) { grid-area: style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td):nth-child(2) { grid-area: image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td):nth-child(3) { grid-area: identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td):nth-child(4) { grid-area: category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td):nth-child(5) { grid-area: flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td):nth-child(6) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td):nth-child(7) { grid-area: assign !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td):nth-child(8) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td):nth-child(9) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td):nth-child(10) { grid-area: actions !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design) :is(thead th, tbody td):nth-child(6) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design) :is(thead th, tbody td):nth-child(7) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design) :is(thead th, tbody td):nth-child(8) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design) :is(thead th, tbody td):nth-child(9) { grid-area: actions !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-actions-cell {
    z-index: 5 !important;
    overflow: visible !important;
    pointer-events: auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions {
    position: relative !important;
    z-index: 6 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    pointer-events: auto !important;
    gap: 4px !important;
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead { display: table-header-group !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead tr, tbody tr) {
    display: grid !important;
    grid-template-columns: 72px 54px 158px 132px 160px 126px 112px 132px 104px 120px !important;
    gap: 4px 7px !important;
    min-width: max-content !important;
    padding: 8px 10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design) :is(thead tr, tbody tr) {
    grid-template-columns: 72px 54px 158px 132px 160px 126px 132px 104px 120px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td) {
    position: relative !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: visible !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-actions-cell {
    z-index: 5 !important;
    pointer-events: auto !important;
  }
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody tr {
    grid-template-areas:
      "style image"
      "identity image"
      "category category"
      "flow flow"
      "direct direct"
      "owner owner"
      "attrs attrs"
      "match match"
      "actions actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody tr {
    grid-template-areas:
      "style image"
      "identity image"
      "category category"
      "flow flow"
      "owner owner"
      "assign assign"
      "attrs attrs"
      "match match"
      "actions actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(6) { grid-area: direct !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(7) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(8) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(9) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(10) { grid-area: actions !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody td:nth-child(6) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody td:nth-child(7) { grid-area: assign !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody td:nth-child(8) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody td:nth-child(9) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody td:nth-child(10) { grid-area: actions !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-actions-cell {
    z-index: 5 !important;
    overflow: visible !important;
    pointer-events: auto !important;
  }
}

/* 2026-09-04 workbench-direct-fields=20260904-r1 */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-direct-cell {
  display: grid !important;
  align-content: center !important;
  gap: 5px !important;
  min-width: 0 !important;
  padding-block: 4px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-direct-summary {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
  color: #6d7d8e !important;
  font-size: 10px !important;
  line-height: 1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-direct-summary span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-direct-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-direct-actions > :is(button, .action-button) {
  min-width: 0 !important;
  min-height: 28px !important;
  padding: 4px 7px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

/* 2026-09-04 workbench-image-fill=20260904-r1 */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-image,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-image {
  display: block !important;
  width: 56px !important;
  height: 74px !important;
  max-width: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  background: #eef2f5 !important;
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-image {
    width: 56px !important;
    height: 72px !important;
  }
}

/* procurement-direct-table=20260903-r6-terminal
 * This terminal contract wins over the legacy shared card media queries. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-workbench-panel > .procurement-table-wrap {
  overflow-x: auto !important;
  overflow-y: visible !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.procurement-workbench-table {
  display: table !important;
  width: 100% !important;
  min-width: 1480px !important;
  max-width: none !important;
  table-layout: fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table thead {
  display: table-header-group !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody {
  display: table-row-group !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(thead tr, tbody tr) {
  display: table-row !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  gap: 0 !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td) {
  display: table-cell !important;
  max-width: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table .style-code {
  display: inline !important;
  width: max-content !important;
  max-width: 100% !important;
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.procurement-workbench-table {
    width: 1380px !important;
    min-width: 1380px !important;
    max-width: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(thead tr, tbody tr) {
    display: table-row !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    padding: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody td:nth-child(8) {
    display: table-cell !important;
    position: static !important;
  }
}

/* role-permission-layout=20260903-r2
 * The role editor is the terminal owner of its permission layout. The shared
 * dialog contract intentionally makes text inputs fluid, but that rule must
 * never stretch native checkboxes or force permission cards to fill a grid
 * track. Keep every row intrinsic and let long labels wrap inside the card. */
#createDialog > .dialog-inner.role-dialog {
  box-sizing:border-box !important;
  min-height:0 !important;
  height:auto !important;
  max-height:100% !important;
  overflow:auto !important;
}
#createDialog > .dialog-inner.role-dialog > .form {
  display:grid !important;
  grid-auto-rows:max-content !important;
  align-content:start !important;
  min-height:0 !important;
  height:auto !important;
}
#createDialog > .dialog-inner.role-dialog .permission-toolbar {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:end !important;
  gap:12px !important;
  min-width:0 !important;
}
#createDialog > .dialog-inner.role-dialog .permission-toolbar > div:first-child {
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  min-width:0 !important;
}
#createDialog > .dialog-inner.role-dialog .permission-toolbar > div:last-child {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  min-width:0 !important;
}
#createDialog > .dialog-inner.role-dialog .permission-search {
  display:block !important;
  min-width:0 !important;
  margin:0 !important;
}
#createDialog > .dialog-inner.role-dialog .permission-search input[type="search"] {
  width:240px !important;
  min-width:0 !important;
  max-width:100% !important;
}
#createDialog > .dialog-inner.role-dialog .permission-groups {
  display:grid !important;
  grid-auto-rows:max-content !important;
  align-content:start !important;
  align-items:start !important;
  gap:14px !important;
  min-height:0 !important;
  height:auto !important;
}
#createDialog > .dialog-inner.role-dialog .permission-group {
  display:block !important;
  align-self:start !important;
  min-height:0 !important;
  height:auto !important;
  overflow:visible !important;
}
#createDialog > .dialog-inner.role-dialog .permission-group-head {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:start !important;
  gap:12px !important;
  min-width:0 !important;
}
#createDialog > .dialog-inner.role-dialog .permission-group-head > div:first-child {
  min-width:0 !important;
}
#createDialog > .dialog-inner.role-dialog .permission-group-head :is(h4,span) {
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}
#createDialog > .dialog-inner.role-dialog .permission-select-all {
  display:inline-flex !important;
  align-items:center !important;
  justify-self:end !important;
  width:max-content !important;
  max-width:100% !important;
  min-width:0 !important;
  white-space:nowrap !important;
}
#createDialog > .dialog-inner.role-dialog .permission-grid {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  grid-auto-rows:max-content !important;
  align-content:start !important;
  align-items:stretch !important;
  gap:10px !important;
  min-height:0 !important;
  height:auto !important;
}
#createDialog > .dialog-inner.role-dialog .permission-option {
  display:grid !important;
  grid-template-columns:20px minmax(0,1fr) !important;
  align-items:start !important;
  align-self:start !important;
  width:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  height:auto !important;
  box-sizing:border-box !important;
  padding:11px 12px !important;
  gap:9px !important;
}
#createDialog > .dialog-inner.role-dialog .permission-option input[type="checkbox"],
#createDialog > .dialog-inner.role-dialog .permission-select-all input[type="checkbox"] {
  appearance:auto !important;
  display:block !important;
  width:18px !important;
  min-width:18px !important;
  max-width:18px !important;
  height:18px !important;
  min-height:18px !important;
  max-height:18px !important;
  margin:2px 0 0 !important;
  padding:0 !important;
  flex:0 0 18px !important;
  align-self:start !important;
  accent-color:#175cd3 !important;
}
#createDialog > .dialog-inner.role-dialog .permission-select-all input[type="checkbox"] {
  margin-top:0 !important;
}
#createDialog > .dialog-inner.role-dialog .permission-option > span {
  display:grid !important;
  align-content:start !important;
  gap:3px !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  overflow:visible !important;
}
#createDialog > .dialog-inner.role-dialog .permission-option > span :is(strong,small) {
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  white-space:normal !important;
  overflow:visible !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}

@media (max-width:760px) {
  #createDialog > .dialog-inner.role-dialog .permission-toolbar {
    grid-template-columns:minmax(0,1fr) !important;
    align-items:stretch !important;
  }
  #createDialog > .dialog-inner.role-dialog .permission-toolbar > div:last-child {
    justify-content:flex-start !important;
    width:100% !important;
  }
  #createDialog > .dialog-inner.role-dialog .permission-search,
  #createDialog > .dialog-inner.role-dialog .permission-search input[type="search"] {
    width:100% !important;
  }
  #createDialog > .dialog-inner.role-dialog .permission-group-head {
    grid-template-columns:minmax(0,1fr) !important;
  }
  #createDialog > .dialog-inner.role-dialog .permission-select-all {
    justify-self:start !important;
  }
  #createDialog > .dialog-inner.role-dialog .permission-grid {
    grid-template-columns:minmax(0,1fr) !important;
  }
}

/* 2026-09-03 procurement-direct-table=20260903-r6
 * Procurement is a decision and execution queue. Keep its real headings,
 * execution facts and legal actions in one wide table instead of inheriting
 * the generic record-card layout used by the other role workbenches. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-workbench-panel {
  overflow: hidden !important;
  border-color: #d8dee6 !important;
  border-radius: 6px !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-list-head {
  min-height: 76px !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid #dfe4ea !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-list-head h3 {
  margin: 2px 0 3px !important;
  color: #1d2c3e !important;
  font-size: 17px !important;
  line-height: 1.3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-list-head .subtle {
  color: #637184 !important;
  font-size: 12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-list-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 58px !important;
  min-height: 28px !important;
  padding: 0 10px !important;
  border: 1px solid #d7dde5 !important;
  border-radius: 4px !important;
  color: #45566a !important;
  background: #f7f8fa !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-workbench-panel > .procurement-table-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table {
  display: table !important;
  width: 100% !important;
  min-width: 1480px !important;
  max-width: none !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: #25364a !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table thead {
  display: table-header-group !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody {
  display: table-row-group !important;
  width: auto !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(thead tr, tbody tr) {
  display: table-row !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  gap: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td) {
  display: table-cell !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 12px 14px !important;
  overflow: visible !important;
  vertical-align: middle !important;
  text-align: left !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table thead th {
  height: 44px !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid #d7dde5 !important;
  color: #526175 !important;
  background: #f5f7f9 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody td {
  height: 112px !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid #e5e9ee !important;
  color: #2f4054 !important;
  background: #fff !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody tr:hover td {
  background: #f8fafc !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(1) { width: 250px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(2) { width: 145px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(3) { width: 140px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(4) { width: 180px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(5) { width: 170px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(6) { width: 180px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(7) { width: 170px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(8) {
  width: 245px !important;
  position: sticky !important;
  right: 0 !important;
  z-index: 3 !important;
  border-left: 1px solid #dfe4ea !important;
  background: #fbfcfd !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table thead th:nth-child(8) {
  z-index: 5 !important;
  background: #f0f3f6 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody tr:hover td:nth-child(8) {
  background: #f6f8fa !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-style-summary {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-style-summary .product-image {
  width: 52px !important;
  height: 68px !important;
  border: 1px solid #d8dee6 !important;
  border-radius: 4px !important;
  object-fit: cover !important;
  background: #f1f3f5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-style-summary > div > div {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-workbench-table .style-code {
  display: inline !important;
  width: max-content !important;
  max-width: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #1769d2 !important;
  background: transparent !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  line-height: 1.3 !important;
  text-align: left !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-style-summary strong {
  color: #25364a !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-style-summary span {
  color: #748194 !important;
  font-size: 11px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-cell-stack {
  display: grid !important;
  align-content: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-cell-stack > strong {
  color: #26384b !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.4 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-cell-stack > span {
  color: #56667a !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-cell-stack > small {
  color: #8590a0 !important;
  font-size: 10px !important;
  line-height: 1.4 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-status-stack > :is(.tag, .status-tag, .chip) {
  justify-self: start !important;
  max-width: 100% !important;
  min-height: 24px !important;
  padding: 3px 8px !important;
  white-space: normal !important;
  line-height: 1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-workbench-table .procurement-actions-cell {
  padding: 10px 12px !important;
  overflow: visible !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-direct-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-content: center !important;
  align-items: stretch !important;
  gap: 6px !important;
  width: 100% !important;
  height: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  background: transparent !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-direct-actions > :is(button, .action-button) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 32px !important;
  padding: 5px 8px !important;
  border: 1px solid #cfd6df !important;
  border-radius: 4px !important;
  color: #35475b !important;
  background: #fff !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-direct-actions > .row-primary-action {
  border-color: #e5372f !important;
  color: #fff !important;
  background: #e5372f !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-direct-actions > .action-detail {
  color: #526175 !important;
  background: #f7f8fa !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-row-idle {
  grid-column: 1 / -1 !important;
  color: #788596 !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-workbench-panel > .procurement-table-wrap {
    overflow-x: auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table {
    width: 1380px !important;
    min-width: 1380px !important;
    max-width: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table thead {
    display: table-header-group !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody tr {
    display: table-row !important;
    padding: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody td {
    display: table-cell !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(8) {
    position: static !important;
  }
}

/* 2026-09-03 text-overlap-audit=20260903-r1
 * Terminal containment contract for every shared product workbench. The
 * previous cascade combined fixed grid tracks, width:100%, table-layout:fixed
 * and overflow:hidden on business cells. At narrow widths that made the style
 * code paint beneath the image column. Scrolling now belongs to the table
 * wrapper; text cells may wrap and never hide the business value. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel {
  min-width: 0 !important;
  max-width: 100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code {
  display: inline-block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  line-height: 1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
  box-sizing: border-box !important;
  max-width: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(th, td) {
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead th {
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  line-height: 1.3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:not(.product-actions-cell) {
  overflow: visible !important;
  text-overflow: clip !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .style-code {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding-inline: 0 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  line-height: 1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(.stack, .stack > *, .match-style-list, .pattern-progress, .product-row-actions) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
@media (min-width: 1181px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    --workbench-dense-final-grid: 96px 64px minmax(190px,1.35fr) minmax(200px,1.3fr) minmax(170px,1.05fr) minmax(150px,.9fr) minmax(130px,.8fr) minmax(136px,.85fr);
    width: max-content !important;
    min-width: 100% !important;
  }
}
@media (min-width: 761px) and (max-width: 1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width: max-content !important;
    min-width: 100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    grid-template-columns: 88px 64px minmax(0,1fr) minmax(138px,.85fr) !important;
  }
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap {
    overflow-x: hidden !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

/* 2026-09-03 operation-action-label-contrast=20260903-r3
 * Keep the operation order's workflow action readable after the shared
 * workspace button layers are loaded. The row is intentionally scoped so
 * other workbenches retain their existing action treatment. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-actions > :is(button, .action-button, .action-link) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 96px !important;
  min-height: 34px !important;
  padding: 7px 12px !important;
  color: #33445b !important;
  -webkit-text-fill-color: #33445b !important;
  background: #fff !important;
  border: 1px solid #b8c4d1 !important;
  border-radius: 4px !important;
  opacity: 1 !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-indent: 0 !important;
  visibility: visible !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-actions > :is(.primary, .action-button.primary, .row-primary-action):not(:disabled) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: #b4232f !important;
  border-color: #b4232f !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-actions > :is(button, .action-button, .action-link):disabled {
  color: #7b8794 !important;
  -webkit-text-fill-color: #7b8794 !important;
  background: #f4f6f8 !important;
  border-color: #d5dce3 !important;
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-actions {
    justify-content: flex-start !important;
  }
}

/* 2026-09-03 operation-order-card-stack=20260903-r4
 * Turn each submitted operation order into a calm summary card. The
 * information remains compact, but related facts are grouped instead of
 * reading as a row of unrelated table cells. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 14px !important;
  padding: 14px !important;
  background: #f5f7fa !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1.4fr) minmax(240px, 1fr) auto !important;
  grid-template-areas:
    "main lines actions"
    "facts facts actions" !important;
  align-items: start !important;
  gap: 16px 22px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 18px 20px 16px !important;
  border: 1px solid #e1e7ee !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 2px 6px rgba(32, 54, 78, 0.05) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row:hover {
  border-color: #cbd8e4 !important;
  background: #fff !important;
  box-shadow: 0 5px 14px rgba(32, 54, 78, 0.08) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-main {
  display: flex !important;
  grid-area: main !important;
  align-items: flex-start !important;
  gap: 14px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-image {
  width: 68px !important;
  height: 86px !important;
  flex: 0 0 68px !important;
  object-fit: contain !important;
  border: 1px solid #dce4eb !important;
  border-radius: 6px !important;
  background: #f7f9fb !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy {
  display: grid !important;
  align-content: start !important;
  gap: 5px !important;
  min-width: 0 !important;
  padding-top: 2px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-code-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy .style-code {
  display: inline-flex !important;
  width: fit-content !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: #175cd3 !important;
  background: transparent !important;
  font-size: 21px !important;
  font-weight: 760 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy .style-code:hover {
  color: #124aa8 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy > strong {
  color: #20364e !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy > span {
  color: #728196 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-lines-cell {
  display: grid !important;
  grid-area: lines !important;
  align-content: start !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: #f6f9fc !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-lines-cell > span {
  color: #718399 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-lines-cell > strong {
  display: -webkit-box !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: #2b435a !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
  overflow-wrap: anywhere !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-facts {
  display: grid !important;
  grid-area: facts !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 20px !important;
  min-width: 0 !important;
  padding-top: 13px !important;
  border-top: 1px solid #edf0f3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-fact {
  display: grid !important;
  align-content: start !important;
  gap: 3px !important;
  min-width: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-fact > span {
  color: #8290a0 !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-fact > strong,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-fact > small {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
  color: #30485f !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-fact.operation-order-quantity > strong {
  color: #20364e !important;
  font-size: 22px !important;
  font-variant-numeric: tabular-nums !important;
  line-height: 1.1 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-meta > small {
  color: #8a96a3 !important;
  font-size: 10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-actions {
  display: flex !important;
  grid-area: actions !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 8px !important;
  min-width: 116px !important;
  padding-left: 16px !important;
  border-left: 1px solid #edf0f3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-actions > :is(button, .action-button, .action-link) {
  width: 100% !important;
  min-width: 116px !important;
}
@media (max-width:1100px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "main actions"
      "lines actions"
      "facts facts" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-facts {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-grid {
    gap: 10px !important;
    padding: 10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "main"
      "lines"
      "facts"
      "actions" !important;
    gap: 13px !important;
    padding: 14px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-image {
    width: 56px !important;
    height: 72px !important;
    flex-basis: 56px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-copy .style-code {
    font-size: 19px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 16px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-actions {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
    padding-top: 13px !important;
    padding-left: 0 !important;
    border-top: 1px solid #edf0f3 !important;
    border-left: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-actions > :is(button, .action-button, .action-link) {
    width: auto !important;
    min-width: 112px !important;
    flex: 1 1 112px !important;
  }
}
@media (max-width:440px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-facts {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }
}

/* 2026-09-03 operation-image-fill=20260903-r1
 * Product photos should use the available thumbnail frame instead of showing
 * letterbox space around portrait or landscape source images. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-image {
  object-fit: cover !important;
  object-position: center !important;
  background: #eef2f5 !important;
}

/* 2026-09-03 neutral-account-state=20260903-r5
 * An enabled employee account is the normal state, not an alert. Keep the
 * label compact and neutral so the organization directory does not grow a
 * full-width green band inside every table row. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .org-account-state.is-bound {
  display: inline-flex !important;
  align-self: start !important;
  width: max-content !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #69798a !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody tr {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 92px !important;
    grid-template-areas:
      "style image"
      "identity image"
      "category category"
      "flow flow"
      "owner owner"
      "attrs attrs"
      "match match"
      "actions actions" !important;
    gap:8px 10px !important;
    min-height:0 !important;
    padding:12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(7) { grid-area:attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(8) { display:block !important; grid-area:match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table tbody td:nth-child(9) { grid-area:actions !important; }
}

/* 2026-09-04 workbench-grid-fix=20260904-r1-final
 * Final cascade: every workbench row gets the same number of explicit grid
 * tracks as its rendered cells. This prevents the operation column from
 * falling into an unreachable implicit column. */
@media (min-width: 1181px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design) :is(thead tr, tbody tr) {
    display: grid !important;
    grid-template-columns: 78px 58px minmax(160px,1.15fr) minmax(132px,1fr) minmax(150px,1fr) minmax(130px,.9fr) minmax(140px,1fr) minmax(108px,.78fr) minmax(126px,.86fr) !important;
    grid-template-areas: "style image identity category flow owner attrs match actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead tr, tbody tr) {
    display: grid !important;
    grid-template-columns: 94px 72px minmax(220px,1.15fr) minmax(168px,1fr) minmax(220px,1.05fr) minmax(188px,.98fr) minmax(188px,.98fr) minmax(160px,.9fr) minmax(176px,.96fr) minmax(150px,.82fr) minmax(148px,.86fr) !important;
    grid-template-areas: "style image identity category flow direct owner attrs match actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern :is(thead tr, tbody tr) {
    display: grid !important;
    grid-template-columns: 94px 72px minmax(220px,1.15fr) minmax(168px,1fr) minmax(240px,1.12fr) minmax(170px,.94fr) minmax(150px,.84fr) minmax(176px,.96fr) minmax(150px,.82fr) minmax(148px,.86fr) !important;
    grid-template-areas: "style image identity category flow owner assign attrs match actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead tr, tbody tr) {
    align-items: center !important;
    gap: 8px 12px !important;
    min-width: 0 !important;
    padding: 12px 14px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td) {
    position: relative !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: visible !important;
    overflow-wrap: anywhere !important;
    white-space: normal !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(6) { grid-area: direct !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(7) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-actions-cell {
    position: relative !important;
    z-index: 10 !important;
    overflow: visible !important;
    pointer-events: auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-row-actions {
    position: relative !important;
    z-index: 11 !important;
    width: 100% !important;
    min-width: 0 !important;
    pointer-events: auto !important;
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table {
    display: table !important;
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table thead { display: block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead tr, tbody tr) {
    display: grid !important;
    grid-template-columns: 90px 68px 200px 160px 210px 154px 142px 166px 142px 142px !important;
    grid-template-areas: "style image identity category flow owner assign attrs match actions" !important;
    gap: 8px 10px !important;
    min-width: max-content !important;
    padding: 11px 13px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design) :is(thead tr, tbody tr) {
    grid-template-columns: 90px 68px 200px 160px 210px 154px 166px 142px 142px !important;
    grid-template-areas: "style image identity category flow owner attrs match actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(6) { grid-area: direct !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead tr, tbody tr) { grid-template-areas: "style image identity category flow direct owner attrs match actions" !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td) { min-width: 0 !important; max-width: none !important; overflow: visible !important; overflow-wrap: anywhere !important; white-space: normal !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-actions-cell { z-index: 10 !important; pointer-events: auto !important; }
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody tr { grid-template-areas: "style image" "identity image" "category category" "flow flow" "direct direct" "owner owner" "attrs attrs" "match match" "actions actions" !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody tr { grid-template-areas: "style image" "identity image" "category category" "flow flow" "owner owner" "assign assign" "attrs attrs" "match match" "actions actions" !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(6) { grid-area: direct !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(7) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody td:nth-child(6) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody td:nth-child(7) { grid-area: assign !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table :is(thead th, tbody td) { min-width: 0 !important; max-width: 100% !important; overflow: visible !important; }
}

/* 2026-09-04 workbench-direct-fields=20260904-r1-final */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-direct-cell { display: grid !important; align-content: center !important; gap: 4px !important; min-width: 0 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-direct-summary { display: grid !important; gap: 2px !important; min-width: 0 !important; color: #6d7d8e !important; font-size: 10px !important; line-height: 1.25 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-direct-summary span { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-direct-actions { display: flex !important; flex-wrap: wrap !important; gap: 4px !important; min-width: 0 !important; }

/* 2026-09-03 workbench-progress-unified=20260903-r1
 * Keep the current status and the next useful step in one progress column;
 * this avoids repeating separate status fields while preserving the action
 * context that operators need when scanning a row. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-progress-summary { display: grid !important; align-content: center !important; gap: 4px !important; min-width: 0 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-progress-summary > :is(.status-tag, .tag, .chip) { justify-self: start !important; max-width: 100% !important; white-space: normal !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .workbench-progress-summary > .subtle { min-width: 0 !important; color: #68788b !important; line-height: 1.35 !important; overflow-wrap: anywhere !important; }

/* 2026-09-04 workbench-image-fill=20260904-r1-final */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-image { display: block !important; width: 56px !important; height: 74px !important; max-width: 100% !important; object-fit: cover !important; object-position: center !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .operation-order-row .operation-order-image { object-fit: cover !important; object-position: center !important; }

/* 2026-09-04 workbench-grid-map=20260904-r1-final */
@media (min-width: 761px) and (max-width: 1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(6) { grid-area: direct !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(7) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(8) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(9) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(10) { grid-area: actions !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(6) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(7) { grid-area: assign !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(8) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(9) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(10) { grid-area: actions !important; }
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(8) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(9) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(10) { grid-area: actions !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody td:nth-child(8) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody td:nth-child(9) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-pattern tbody td:nth-child(10) { grid-area: actions !important; }
}

/* 2026-09-04 workbench-columns=20260904-r2
 * Design rows intentionally expose separate资料 and物料 columns. The table
 * wrapper owns horizontal scrolling, so adding useful columns never hides the
 * final operation controls. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-panel > .table-wrap {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}
@media (min-width: 1181px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead tr, tbody tr) {
    grid-template-columns: 96px 78px minmax(220px,1.18fr) minmax(170px,1fr) minmax(230px,1.1fr) minmax(176px,.95fr) minmax(176px,.95fr) minmax(156px,.9fr) minmax(176px,1fr) minmax(140px,.82fr) minmax(148px,.86fr) !important;
    grid-template-areas: "style image identity category flow direct material owner attrs match actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(6) { grid-area: direct !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(7) { grid-area: material !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(8) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(9) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(10) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(11) { grid-area: actions !important; }
}
@media (min-width: 761px) and (max-width: 1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead tr, tbody tr) {
    grid-template-columns: 94px 74px 210px 170px 220px 164px 160px 150px 150px 146px 146px !important;
    grid-template-areas: "style image identity category flow direct material owner attrs match actions" !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(6) { grid-area: direct !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(7) { grid-area: material !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(8) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(9) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(10) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design :is(thead th, tbody td):nth-child(11) { grid-area: actions !important; }
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody tr { grid-template-areas: "style image" "identity image" "category category" "flow flow" "direct direct" "material material" "owner owner" "attrs attrs" "match match" "actions actions" !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(6) { grid-area: direct !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(7) { grid-area: material !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(8) { grid-area: owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(9) { grid-area: attrs !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(10) { grid-area: match !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table.product-workbench-table-design tbody td:nth-child(11) { grid-area: actions !important; }
}

/* 2026-09-03 business-table-columns=20260903-r1
 * Business columns are allowed to grow; only the table boundary scrolls. The
 * final rule also restores mobile scrolling after legacy record-card rules and
 * gives native tables one alignment contract for headers, rows and long text. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap > table:not(.product-workbench-table[data-presentation="record-cards"]) {
  box-sizing: border-box !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap > table:not(.product-workbench-table[data-presentation="record-cards"]) :is(thead th, tbody td) {
  box-sizing: border-box !important;
  min-width: 0 !important;
  vertical-align: middle !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap > table[data-presentation="table"] :is(thead tr, tbody tr) {
  display: table-row !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  gap: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap > table[data-presentation="table"] :is(thead th, tbody td) {
  display: table-cell !important;
}

/* inbound-module=20260903-r1
 * Keep receiving work focused: queue first, ledger second, and a compact
 * confirmation form for partial receipts. The surface deliberately reuses
 * the light workspace tokens so the module does not introduce a dark island. */
.inbound-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.inbound-toolbar { align-items: flex-start; }
.inbound-toolbar > .status-tag { flex: 0 0 auto; margin-top: 6px; }
.inbound-queue-list { display: grid; gap: 8px; }
.inbound-queue-item { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-width: 0; padding: 14px 16px; border: 1px solid var(--line, #d9e2ec); border-radius: 6px; background: var(--surface, #fff); }
.inbound-queue-main, .inbound-queue-meta, .inbound-line-row > div:first-child { display: grid; gap: 3px; min-width: 0; }
.inbound-queue-main strong, .inbound-line-row strong { color: var(--ink-strong, #17324d); }
.inbound-queue-main span { color: var(--ink, #2d4661); overflow-wrap: anywhere; }
.inbound-queue-main small { color: var(--muted, #7c8da1); }
.inbound-queue-meta { justify-items: end; color: var(--muted, #7c8da1); white-space: nowrap; }
.inbound-table th:last-child, .inbound-table td:last-child { min-width: 160px; }
.inbound-table td > .subtle, .inbound-table td > .inbound-status-pill { display: block; margin-top: 4px; }
.inbound-status-pill { display: inline-flex !important; align-items: center; width: fit-content; padding: 3px 8px; border-radius: 999px; font-size: 12px; line-height: 1.2; font-weight: 600; }
.inbound-status-pill.pending { color: #8a5b00; background: #fff4d6; }
.inbound-status-pill.progress { color: #1d5ca8; background: #eaf3ff; }
.inbound-status-pill.success { color: #19724f; background: #e7f7ef; }
.inbound-status-pill.danger { color: #a23c37; background: #ffebe8; }
.inbound-status-pill.muted { color: #68798d; background: #eef2f6; }
.inbound-dialog { width: min(920px, calc(100vw - 32px)); }
.inbound-lines-grid { display: grid; gap: 10px; margin: 8px 0 16px; }
.inbound-line-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(420px, 1.2fr); align-items: center; gap: 18px; padding: 12px 14px; border: 1px solid var(--line, #d9e2ec); border-radius: 6px; background: #fbfcfe; }
.inbound-qty-inputs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.inbound-qty-inputs label { display: grid; gap: 4px; color: var(--muted, #68798d); font-size: 12px; }
.inbound-qty-inputs input { min-width: 0; }
@media (max-width: 900px) {
  .inbound-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inbound-line-row { grid-template-columns: 1fr; gap: 10px; }
}
@media (max-width: 640px) {
  .inbound-toolbar { display: grid; }
  .inbound-toolbar > .status-tag { margin-top: 0; justify-self: start; }
  .inbound-summary { grid-template-columns: 1fr 1fr; }
  .inbound-queue-item { align-items: flex-start; flex-direction: column; gap: 10px; }
  .inbound-queue-meta { width: 100%; align-items: flex-start; justify-items: start; }
  .inbound-qty-inputs { grid-template-columns: 1fr; }
}

/* 2026-09-03 owner-role-labels=20260903-r1
 * Make the shared owner column self-explanatory. Each role gets its own
 * aligned line so two names are never mistaken for one combined owner. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-owner-cell {
  min-width: 0 !important;
  max-width: 100% !important;
  vertical-align: middle !important;
  overflow: visible !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .product-owner-cell::before {
  display: none !important;
  content: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .owner-role-list {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .owner-role-line {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  column-gap: 8px !important;
  align-items: baseline !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .owner-role-line > span {
  min-width: 0 !important;
  color: #718096 !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .owner-role-line > strong {
  min-width: 0 !important;
  max-width: 100% !important;
  color: #17324d !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .owner-role-list {
    gap: 6px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .owner-role-line {
    grid-template-columns: 56px minmax(0, 1fr) !important;
    column-gap: 8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-workbench-table .owner-role-line > strong {
    font-size: 12px !important;
  }
}

/* work-task-lifecycle=20260903-r1
 * Keep the task title/date compact while exposing the canonical node context
 * before the user opens the style detail. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-copy {
  flex-wrap: wrap !important;
  row-gap: 1px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-task-copy .work-task-lifecycle {
  flex: 1 1 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: var(--r50-muted) !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
}

/* END frontend/assets/ui-system-r50.css */

/* BEGIN frontend/assets/pattern-workbench.css */
/* pattern-workbench-terminal=20260903-r1
 * Final, pattern-only layout contract. The shared workbench remains a
 * nine-cell record list; pattern rows add one explicit dispatch cell. */
@media (min-width:1181px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern {
    --pattern-workbench-grid:72px 58px minmax(150px,1.05fr) minmax(126px,.9fr) minmax(240px,1.6fr) minmax(160px,1.05fr) 96px minmax(128px,.9fr) minmax(96px,.7fr) minmax(136px,.9fr);
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr, tbody tr) {
    display:grid !important;
    grid-template-columns:var(--pattern-workbench-grid) !important;
    grid-template-areas:
      "style image identity flow owner assign attrs match actions actions"
      "style image category flow owner assign attrs match actions actions" !important;
    align-items:center !important;
    gap:4px 8px !important;
    min-width:0 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern thead tr {
    grid-template-rows:24px 24px !important;
    min-height:48px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
    min-height:108px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(1) { grid-area:style !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(2) { grid-area:image !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(3) { grid-area:identity !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(4) { grid-area:category !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(5) { grid-area:flow !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(6) { grid-area:owner !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(7) { grid-area:assign !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(8) { grid-area:attrs !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(9) { grid-area:match !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td):nth-child(10) { grid-area:actions !important; }
}

/* pattern-workbench-final-grid=20260903-r7
 * Final override for the twelve-cell pattern table. Progress is intentionally
 * one combined column; the remaining execution fields stay independently
 * operable and the outer wrapper owns horizontal scrolling. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table.product-workbench-table-pattern) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  overscroll-behavior-x:contain !important;
  scrollbar-gutter:stable !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
  display:block !important;
  width:max-content !important;
  min-width:2025px !important;
  max-width:none !important;
  table-layout:fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody {
  display:block !important;
  width:max-content !important;
  min-width:100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
  display:grid !important;
  width:100% !important;
  min-width:2025px !important;
  grid-template-columns:90px 72px minmax(210px,1.15fr) minmax(165px,.95fr) minmax(230px,1.2fr) minmax(230px,1.2fr) minmax(170px,.95fr) minmax(150px,.85fr) minmax(160px,.9fr) minmax(150px,.85fr) minmax(150px,.85fr) minmax(148px,.86fr) !important;
  grid-template-areas:"style image identity category flow details owner assign attrs match plan actions" !important;
  grid-template-rows:minmax(0,auto) !important;
  align-items:stretch !important;
  column-gap:12px !important;
  row-gap:0 !important;
  box-sizing:border-box !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead tr {
  min-height:48px !important;
  padding:0 14px !important;
  align-items:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
  min-height:122px !important;
  padding:12px 14px !important;
  align-items:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
  display:block !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  box-sizing:border-box !important;
  padding:7px 8px !important;
  line-height:1.35 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  align-self:stretch !important;
  min-height:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(1) { grid-area:style !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(2) { grid-area:image !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(3) { grid-area:identity !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(4) { grid-area:category !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(5) { grid-area:flow !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(6) { grid-area:details !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(7) { grid-area:owner !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(8) { grid-area:assign !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(9) { grid-area:attrs !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(10) { grid-area:match !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(11) { grid-area:plan !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(12) { grid-area:actions !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td.product-actions-cell {
  position:relative !important;
  z-index:3 !important;
  overflow:visible !important;
  pointer-events:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td.product-actions-cell :is(button,a,[role="button"]) {
  position:relative !important;
  z-index:4 !important;
  pointer-events:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .product-image {
  display:block !important;
  width:56px !important;
  height:74px !important;
  margin:0 auto !important;
  object-fit:cover !important;
  object-position:center !important;
}

@media (max-width:1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    min-width:1880px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:84px 68px 190px 150px 210px 210px 156px 138px 148px 138px 138px 136px !important;
    column-gap:10px !important;
  }
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    min-width:1720px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:74px 60px 172px 136px 190px 190px 140px 124px 136px 124px 124px 124px !important;
    column-gap:8px !important;
  }
}

/* pattern-workbench-clean-layout=20260904-r2
 * Content-led final contract for the pattern workbench. The legacy grid used
 * 100% cell heights and stretch alignment, spreading three short assignment
 * lines across the full row. Rows now size from their content while retaining
 * a stable twelve-column desktop layout and responsive horizontal scrolling. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table.product-workbench-table-pattern) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  overscroll-behavior-x:contain !important;
  scrollbar-gutter:stable !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
  display:block !important;
  width:max-content !important;
  min-width:1760px !important;
  max-width:none !important;
  table-layout:fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead,tbody) {
  display:block !important;
  width:max-content !important;
  min-width:100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
  display:grid !important;
  width:100% !important;
  min-width:1760px !important;
  grid-template-columns:84px 66px 176px 138px 220px 196px 138px 122px 140px 118px 138px 136px !important;
  grid-template-areas:"style image identity category flow details owner assign attrs match plan actions" !important;
  grid-template-rows:minmax(0,auto) !important;
  align-items:start !important;
  column-gap:8px !important;
  row-gap:0 !important;
  box-sizing:border-box !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead tr {
  min-height:42px !important;
  padding:0 12px !important;
  align-items:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
  min-height:122px !important;
  height:auto !important;
  padding:12px !important;
  align-items:start !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
  display:block !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  height:auto !important;
  min-height:0 !important;
  box-sizing:border-box !important;
  padding:6px 7px !important;
  line-height:1.35 !important;
  align-self:start !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(2) {
  align-self:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(.pattern-assignee-cell,.pattern-assignment-cell) {
  align-self:start !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-list {
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  align-content:flex-start !important;
  gap:6px !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-line {
  display:flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  min-height:28px !important;
  height:auto !important;
  padding:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-person {
  flex:1 1 auto !important;
  width:auto !important;
  min-width:0 !important;
  align-items:baseline !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line {
  justify-content:flex-start !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line .pattern-assign-button {
  width:auto !important;
  min-width:84px !important;
  min-height:26px !important;
  padding:4px 8px !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line :is(.pattern-assignment-action-empty,.pattern-assignment-action-note) {
  width:auto !important;
  min-width:84px !important;
  text-align:left !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details {
  display:flex !important;
  flex-direction:column !important;
  gap:4px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-facts {
  display:flex !important;
  flex-direction:column !important;
  gap:3px !important;
  margin:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact {
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) !important;
  gap:0 5px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact span,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .external-pattern-contact {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-plan {
  display:flex !important;
  flex-direction:column !important;
  align-content:flex-start !important;
  gap:3px !important;
  min-width:0 !important;
}

@media (max-width:1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    min-width:1602px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:76px 60px 160px 124px 190px 176px 132px 112px 128px 110px 126px 120px !important;
    column-gap:8px !important;
  }
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    min-width:1494px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:68px 54px 150px 116px 176px 160px 124px 106px 120px 104px 116px 112px !important;
    column-gap:8px !important;
  }
}

/* pattern-workbench-clean-layout=20260903-r1
 * The assignment cells are content-led. The previous 100% height plus
 * repeat(3, 1fr) contract stretched three short lines across the whole row,
 * which made dashes and assignment actions appear far away from their labels.
 * Keep the twelve business columns, but let every row and assignment stack
 * size itself from its content and use a narrower, stable grid. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .table-wrap:has(> table.product-workbench-table.product-workbench-table-pattern) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  overscroll-behavior-x:contain !important;
  scrollbar-gutter:stable !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern {
  width:max-content !important;
  min-width:1760px !important;
  max-width:none !important;
  table-layout:fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
  width:100% !important;
  min-width:1760px !important;
  grid-template-columns:84px 66px 176px 138px 220px 196px 138px 122px 140px 118px 138px 136px !important;
  grid-template-areas:"style image identity category flow details owner assign attrs match plan actions" !important;
  align-items:start !important;
  column-gap:8px !important;
  row-gap:0 !important;
  box-sizing:border-box !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern thead tr {
  min-height:42px !important;
  padding:0 12px !important;
  align-items:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern tbody tr {
  min-height:122px !important;
  height:auto !important;
  padding:12px !important;
  align-items:start !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
  align-self:start !important;
  height:auto !important;
  min-height:0 !important;
  padding:6px 7px !important;
  line-height:1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(2) {
  align-self:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern :is(.pattern-assignee-cell,.pattern-assignment-cell) {
  align-self:start !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-list {
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  align-content:flex-start !important;
  gap:6px !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-line {
  display:flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  min-height:28px !important;
  height:auto !important;
  padding:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-person {
  flex:1 1 auto !important;
  width:auto !important;
  min-width:0 !important;
  align-items:baseline !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line {
  justify-content:flex-start !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line .pattern-assign-button {
  width:auto !important;
  min-width:84px !important;
  min-height:26px !important;
  padding:4px 8px !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line :is(.pattern-assignment-action-empty,.pattern-assignment-action-note) {
  width:auto !important;
  min-width:84px !important;
  text-align:left !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details {
  display:flex !important;
  flex-direction:column !important;
  gap:4px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-facts {
  display:flex !important;
  flex-direction:column !important;
  gap:3px !important;
  margin:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact {
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) !important;
  gap:0 5px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact span,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .external-pattern-contact {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-plan {
  display:flex !important;
  flex-direction:column !important;
  align-content:flex-start !important;
  gap:3px !important;
  min-width:0 !important;
}

@media (max-width:1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    min-width:1602px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:76px 60px 160px 124px 190px 176px 132px 112px 128px 110px 126px 120px !important;
    column-gap:8px !important;
  }
}
@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    min-width:1494px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:68px 54px 150px 116px 176px 160px 124px 106px 120px 104px 116px 112px !important;
    column-gap:8px !important;
  }
}

@media (min-width:761px) and (max-width:1180px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
    display:grid !important;
    grid-template-columns:64px 56px minmax(0,1fr) minmax(150px,.9fr) !important;
    grid-template-areas:
      "style image identity actions"
      "style image category actions"
      "flow flow flow actions"
      "owner owner assign actions"
      "attrs attrs attrs actions"
      "match match match actions" !important;
    gap:8px 10px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(1) { grid-area:style !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(2) { grid-area:image !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(3) { grid-area:identity !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(4) { grid-area:category !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(5) { grid-area:flow !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(6) { grid-area:owner !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(7) { grid-area:assign !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(8) { grid-area:attrs !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(9) { grid-area:match !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(10) { grid-area:actions !important; }
}

@media (max-width:760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 104px !important;
    grid-template-areas:
      "style image"
      "identity image"
      "category category"
      "flow flow"
      "owner assign"
      "attrs attrs"
      "match match"
      "actions actions" !important;
    gap:8px 10px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(1) { grid-area:style !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(2) { grid-area:image !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(3) { grid-area:identity !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(4) { grid-area:category !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(5) { grid-area:flow !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(6) { grid-area:owner !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(7) { grid-area:assign !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(8) { grid-area:attrs !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(9) { grid-area:match !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(10) { grid-area:actions !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(6)::before { content:"负责人" !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(7)::before { content:"分配" !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(8)::before { content:"颜色 / 尺码 / SKU" !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(9)::before { content:"搭配款" !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(10)::before { content:"操作" !important; }
}

body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(tbody td.pattern-assignee-cell, tbody td.pattern-assignment-cell) {
  align-self:stretch !important;
  overflow:visible !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-list {
  display:grid !important;
  grid-template-rows:repeat(3,minmax(0,1fr)) !important;
  align-content:stretch !important;
  gap:4px !important;
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-line {
  display:flex !important;
  align-items:center !important;
  min-width:0 !important;
  min-height:0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-person {
  width:100% !important;
  grid-template-columns:minmax(56px,max-content) minmax(0,1fr) !important;
  column-gap:6px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line { justify-content:stretch !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line .pattern-assign-button {
  width:100% !important;
  min-width:0 !important;
  min-height:28px !important;
  padding:5px 6px !important;
  font-size:10px !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern :is(.pattern-assignment-action-empty,.pattern-assignment-action-note) {
  display:block !important;
  width:100% !important;
  color:#8b99a8 !important;
  font-size:10px !important;
  line-height:1.25 !important;
  text-align:center !important;
  overflow-wrap:anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-note {
  color:#2878c8 !important;
  font-weight:700 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-facts {
  display:grid !important;
  grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) !important;
  gap:2px 8px !important;
  min-width:0 !important;
  margin-top:4px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact {
  display:grid !important;
  grid-template-columns:max-content minmax(0,1fr) !important;
  gap:0 5px !important;
  min-width:0 !important;
  color:#6d7c87 !important;
  font-size:10px !important;
  line-height:1.3 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact:first-child { grid-column:1 / -1 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact b { color:#8292a1 !important; font-weight:700 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact span {
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
@media (max-width:760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-list {
    grid-template-rows:repeat(3,minmax(0,auto)) !important;
    gap:5px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-facts {
    grid-template-columns:1fr !important;
    gap:3px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact span {
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }
}

/* pattern-workbench-containment=20260903-r2
 * The shared workbench has late generic 9/8/6/2-track rules. Pattern rows
 * contain ten cells, so this final layer owns the complete responsive map and
 * resets legacy fixed widths before the cells enter the grid. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  table-layout:fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table.product-workbench-table-pattern) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:hidden !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
  box-sizing:border-box !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:not(.product-actions-cell) {
  overflow:hidden !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(.stack,.pattern-progress,.pattern-workbench-facts,.pattern-assignment-list,.match-style-list) {
  min-width:0 !important;
  max-width:100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(.stack strong,.stack span,.subtle,.pattern-progress strong,.pattern-progress span,.pattern-assignment-person strong) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
}

@media (min-width:1681px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
    --pattern-workbench-final-grid:72px 58px minmax(140px,1.05fr) minmax(110px,.9fr) minmax(220px,1.55fr) minmax(145px,1fr) 100px minmax(120px,.9fr) minmax(92px,.7fr) minmax(148px,1fr);
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    display:grid !important;
    grid-template-columns:var(--pattern-workbench-final-grid) !important;
    grid-template-areas:
      "style image identity flow owner assign attrs match actions actions"
      "style image category flow owner assign attrs match actions actions" !important;
    align-items:center !important;
    gap:4px 8px !important;
    min-width:0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead {
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 0 8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead tr {
    grid-template-rows:24px 24px !important;
    min-height:48px !important;
    padding:0 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
    min-height:108px !important;
    padding:10px 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(7) { grid-area:assign !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(8) { grid-area:attrs !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(9) { grid-area:match !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(10) { grid-area:actions !important; display:block !important; }
}

/* pattern-workbench-columns=20260903-r6
 * The pattern row now has twelve real cells. Keep progress in one unified
 * column, expose the supporting fields as separate columns, and let the
 * table boundary scroll instead of collapsing the last action cell. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table.product-workbench-table-pattern) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  overscroll-behavior-x:contain !important;
  scrollbar-gutter:stable !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
  width:max-content !important;
  min-width:2025px !important;
  max-width:none !important;
  table-layout:fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody {
  display:block !important;
  width:max-content !important;
  min-width:100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
  display:grid !important;
  grid-template-columns:90px 72px minmax(210px,1.15fr) minmax(165px,.95fr) minmax(230px,1.2fr) minmax(230px,1.2fr) minmax(170px,.95fr) minmax(150px,.85fr) minmax(160px,.9fr) minmax(150px,.85fr) minmax(150px,.85fr) minmax(148px,.86fr) !important;
  grid-template-areas:"style image identity category flow details owner assign attrs match plan actions" !important;
  align-items:center !important;
  column-gap:12px !important;
  min-width:2025px !important;
  width:100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead tr {
  min-height:48px !important;
  padding:0 14px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
  min-height:122px !important;
  padding:12px 14px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
  display:block !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  box-sizing:border-box !important;
  padding:7px 8px !important;
  line-height:1.35 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  align-self:stretch !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(1) { grid-area:style !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(2) { grid-area:image !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(3) { grid-area:identity !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(4) { grid-area:category !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(5) { grid-area:flow !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(6) { grid-area:details !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(7) { grid-area:owner !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(8) { grid-area:assign !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(9) { grid-area:attrs !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(10) { grid-area:match !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(11) { grid-area:plan !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(12) { grid-area:actions !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td.product-actions-cell {
  position:relative !important;
  z-index:3 !important;
  overflow:visible !important;
  pointer-events:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td.product-actions-cell :is(button,a,[role="button"]) {
  position:relative !important;
  z-index:4 !important;
  pointer-events:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .product-image {
  display:block !important;
  width:56px !important;
  height:74px !important;
  margin:0 auto !important;
  object-fit:cover !important;
  object-position:center !important;
}

@media (max-width:1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    min-width:1880px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:84px 68px 190px 150px 210px 210px 156px 138px 148px 138px 138px 136px !important;
    column-gap:10px !important;
  }
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    min-width:1720px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:74px 60px 172px 136px 190px 190px 140px 124px 136px 124px 124px 124px !important;
    column-gap:8px !important;
  }
}

/* pattern-workbench-semantic-grid-fix=20260903-r6
 * Final semantic contract: every viewport keeps the same twelve business
 * columns. The table boundary scrolls; cells wrap inside their own track. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table.product-workbench-table-pattern) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  overscroll-behavior-x:contain !important;
  scrollbar-gutter:stable !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
  display:block !important;
  width:max-content !important;
  min-width:1753px !important;
  max-width:none !important;
  table-layout:fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody {
  display:block !important;
  width:100% !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
  display:grid !important;
  width:100% !important;
  min-width:1753px !important;
  grid-template-columns:64px 52px 150px 110px 200px 220px 150px 150px 140px 110px 135px 160px !important;
  grid-template-areas:"style image identity category flow details owner assign attrs match plan actions" !important;
  grid-template-rows:minmax(0,auto) !important;
  align-items:stretch !important;
  column-gap:8px !important;
  row-gap:0 !important;
  box-sizing:border-box !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead tr {
  min-height:48px !important;
  padding:0 12px !important;
  align-items:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
  min-height:126px !important;
  padding:12px !important;
  align-items:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
  display:block !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  padding:7px 8px !important;
  line-height:1.35 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  align-self:stretch !important;
  min-height:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(1) { grid-area:style !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(2) { grid-area:image !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(3) { grid-area:identity !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(4) { grid-area:category !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(5) { grid-area:flow !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(6) { grid-area:details !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(7) { grid-area:owner !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(8) { grid-area:assign !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(9) { grid-area:attrs !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(10) { grid-area:match !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(11) { grid-area:plan !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(12) { grid-area:actions !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:not(.product-actions-cell) {
  overflow:hidden !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td.product-actions-cell {
  overflow:visible !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td::before {
  display:none !important;
  content:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(.stack,.stack strong,.stack span,.subtle,.pattern-progress,.pattern-progress strong,.pattern-progress span,.pattern-assignment-list,.pattern-assignment-person,.pattern-assignment-person span,.pattern-assignment-person strong,.pattern-workbench-details,.pattern-workbench-facts,.pattern-workbench-fact,.pattern-workbench-fact span,.pattern-workbench-plan,.pattern-workbench-plan strong,.pattern-workbench-plan span,.pattern-workbench-plan small,.match-style-list) {
  min-width:0 !important;
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}

/* pattern-workbench-spacing=20260903-r4
 * Keep the scroll contract compact: columns use stable business widths and
 * only the table boundary scrolls when the viewport is smaller than the list. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
  width:max-content !important;
  min-width:1526px !important;
  max-width:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
  padding:7px 8px !important;
  line-height:1.35 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:not(.product-actions-cell) {
  overflow:visible !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(.stack,.stack strong,.stack span,.subtle,.pattern-progress,.pattern-progress strong,.pattern-progress span,.pattern-assignment-person,.pattern-assignment-person span,.pattern-assignment-person strong,.pattern-workbench-facts,.pattern-workbench-fact,.pattern-workbench-fact span,.match-style-list) {
  min-width:0 !important;
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
  width:100% !important;
  grid-template-columns:72px 58px 170px 120px 240px 150px 170px 150px 120px 180px !important;
  gap:4px 8px !important;
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
    min-width:1360px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:56px 52px 150px 110px 210px 140px 150px 130px 110px 150px !important;
    gap:4px 8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
    padding:7px 8px !important;
  }
}

/* pattern-workbench-semantic-columns=20260903-r5
 * One flow column owns stage and percentage. Supporting pattern facts and the
 * plan date get their own columns so the status cell stays scannable. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
  width:max-content !important;
  min-width:1753px !important;
  max-width:none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
  width:100% !important;
  grid-template-columns:64px 52px 150px 110px 200px 220px 150px 150px 140px 110px 135px 160px !important;
  grid-template-areas:
    "style image identity flow status details owner assign attrs match plan actions"
    "style image category flow status details owner assign attrs match plan actions" !important;
  gap:4px 8px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
  padding:7px 8px !important;
  line-height:1.35 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:not(.product-actions-cell) {
  overflow:visible !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(.stack,.stack strong,.stack span,.subtle,.pattern-progress,.pattern-progress strong,.pattern-progress span,.pattern-assignment-person,.pattern-assignment-person span,.pattern-assignment-person strong,.pattern-workbench-details,.pattern-workbench-facts,.pattern-workbench-fact,.pattern-workbench-fact span,.pattern-workbench-plan,.pattern-workbench-plan strong,.pattern-workbench-plan span,.pattern-workbench-plan small,.match-style-list) {
  min-width:0 !important;
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(1) { grid-area:style !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(2) { grid-area:image !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(3) { grid-area:identity !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(4) { grid-area:category !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(5) { grid-area:flow !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(6) { grid-area:details !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(7) { grid-area:owner !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(8) { grid-area:assign !important; display:block !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(9) { grid-area:attrs !important; display:block !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(10) { grid-area:match !important; display:block !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(11) { grid-area:plan !important; display:block !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(12) { grid-area:actions !important; display:block !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details {
  display:grid !important;
  gap:6px !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details .pattern-workbench-facts {
  grid-template-columns:1fr !important;
  gap:4px !important;
  margin-top:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact:first-child {
  grid-column:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-plan {
  display:grid !important;
  gap:4px !important;
  align-content:center !important;
  min-width:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-plan strong {
  color:#17324d !important;
  font-size:13px !important;
  font-weight:750 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-plan span {
  color:#60758a !important;
  font-size:10px !important;
  font-weight:700 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-plan small {
  color:#7a8997 !important;
  font-size:10px !important;
  line-height:1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-plan.is-overdue strong { color:#b33b32 !important; }

@media (min-width:901px) and (max-width:1680px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead { display:none !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
    display:grid !important;
    grid-template-columns:64px 56px minmax(0,1fr) minmax(138px,.85fr) !important;
    grid-template-areas:
      "style image identity actions"
      "style image category actions"
      "flow flow flow actions"
      "owner owner assign actions"
      "attrs attrs attrs actions"
      "match match match actions" !important;
    gap:8px 10px !important;
    min-height:0 !important;
    padding:11px 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(7) { grid-area:assign !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(8) { grid-area:attrs !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(9) { grid-area:match !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(10) { grid-area:actions !important; display:block !important; }
}

@media (min-width:761px) and (max-width:900px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead { display:none !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
    display:grid !important;
    grid-template-columns:56px minmax(0,1fr) !important;
    grid-template-areas:
      "image style"
      "image identity"
      "category category"
      "flow flow"
      "owner owner"
      "assign assign"
      "attrs attrs"
      "match match"
      "actions actions" !important;
    gap:9px 12px !important;
    min-height:0 !important;
    padding:13px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(7) { grid-area:assign !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(8) { grid-area:attrs !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(9) { grid-area:match !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(10) { grid-area:actions !important; display:block !important; }
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead { display:none !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 104px !important;
    grid-template-areas:
      "style image"
      "identity image"
      "category category"
      "flow flow"
      "owner assign"
      "attrs attrs"
      "match match"
      "actions actions" !important;
    gap:8px 10px !important;
    min-height:0 !important;
    padding:12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(7) { grid-area:assign !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(8) { grid-area:attrs !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(9) { grid-area:match !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(10) { grid-area:actions !important; display:block !important; }
}

/* pattern-workbench-scroll=20260903-r3
 * Pattern workbench keeps all ten business columns. Horizontal overflow is
 * owned by the table boundary, so narrow viewports scroll the complete record
 * instead of letting shared card rules hide or remap cells. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table.product-workbench-table-pattern) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  overscroll-behavior-x:contain !important;
  scrollbar-gutter:stable !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
  width:100% !important;
  min-width:1540px !important;
  max-width:none !important;
  table-layout:fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
  box-sizing:border-box !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:not(.product-actions-cell) {
  overflow:hidden !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(.stack,.pattern-progress,.pattern-workbench-facts,.pattern-assignment-list,.match-style-list) {
  min-width:0 !important;
  max-width:100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(.stack strong,.stack span,.subtle,.pattern-progress strong,.pattern-progress span,.pattern-assignment-person strong) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-wrap:anywhere !important;
}

@media (min-width:761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
    --pattern-workbench-scroll-grid:72px 58px minmax(140px,1.05fr) minmax(110px,.9fr) minmax(220px,1.55fr) minmax(145px,1fr) 100px minmax(120px,.9fr) minmax(92px,.7fr) minmax(148px,1fr);
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead {
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 0 8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    display:grid !important;
    grid-template-columns:var(--pattern-workbench-scroll-grid) !important;
    grid-template-areas:
      "style image identity flow owner assign attrs match actions actions"
      "style image category flow owner assign attrs match actions actions" !important;
    align-items:center !important;
    gap:4px 8px !important;
    min-width:0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead tr {
    grid-template-rows:24px 24px !important;
    min-height:48px !important;
    padding:0 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
    min-height:108px !important;
    padding:10px 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(7) { grid-area:assign !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(8) { grid-area:attrs !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(9) { grid-area:match !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(10) { grid-area:actions !important; display:block !important; }
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
    min-width:1360px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead {
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 0 8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    display:grid !important;
    grid-template-columns:56px 52px minmax(120px,1.05fr) minmax(108px,.9fr) minmax(220px,1.45fr) minmax(150px,1fr) 100px minmax(120px,.9fr) minmax(92px,.7fr) minmax(148px,1fr) !important;
    grid-template-areas:
      "style image identity flow owner assign attrs match actions actions"
      "style image category flow owner assign attrs match actions actions" !important;
    align-items:center !important;
    gap:4px 8px !important;
    min-width:0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead tr {
    grid-template-rows:24px 24px !important;
    min-height:48px !important;
    padding:0 10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
    min-height:108px !important;
    padding:10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td::before {
    display:none !important;
    content:none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(1) { grid-area:style !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(2) { grid-area:image !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(3) { grid-area:identity !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(4) { grid-area:category !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(5) { grid-area:flow !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(6) { grid-area:owner !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(7) { grid-area:assign !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(8) { grid-area:attrs !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(9) { grid-area:match !important; display:block !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(10) { grid-area:actions !important; display:block !important; }
}

/* pattern-workbench-final-grid=20260903-r7
 * Final override for the twelve-cell pattern table. Progress is intentionally
 * one combined column; the remaining execution fields stay independently
 * operable and the outer wrapper owns horizontal scrolling. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table.product-workbench-table-pattern) {
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  overscroll-behavior-x:contain !important;
  scrollbar-gutter:stable !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
  display:block !important;
  width:max-content !important;
  min-width:2025px !important;
  max-width:none !important;
  table-layout:fixed !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody {
  display:block !important;
  width:max-content !important;
  min-width:100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
  display:grid !important;
  width:100% !important;
  min-width:2025px !important;
  grid-template-columns:90px 72px minmax(210px,1.15fr) minmax(165px,.95fr) minmax(230px,1.2fr) minmax(230px,1.2fr) minmax(170px,.95fr) minmax(150px,.85fr) minmax(160px,.9fr) minmax(150px,.85fr) minmax(150px,.85fr) minmax(148px,.86fr) !important;
  grid-template-areas:"style image identity category flow details owner assign attrs match plan actions" !important;
  grid-template-rows:minmax(0,auto) !important;
  align-items:stretch !important;
  column-gap:12px !important;
  row-gap:0 !important;
  box-sizing:border-box !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead tr {
  min-height:48px !important;
  padding:0 14px !important;
  align-items:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
  min-height:122px !important;
  padding:12px 14px !important;
  align-items:center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td) {
  display:block !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  box-sizing:border-box !important;
  padding:7px 8px !important;
  line-height:1.35 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  align-self:stretch !important;
  min-height:0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(1) { grid-area:style !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(2) { grid-area:image !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(3) { grid-area:identity !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(4) { grid-area:category !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(5) { grid-area:flow !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(6) { grid-area:details !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(7) { grid-area:owner !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(8) { grid-area:assign !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(9) { grid-area:attrs !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(10) { grid-area:match !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(11) { grid-area:plan !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th,tbody td):nth-child(12) { grid-area:actions !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td.product-actions-cell {
  position:relative !important;
  z-index:3 !important;
  overflow:visible !important;
  pointer-events:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td.product-actions-cell :is(button,a,[role="button"]) {
  position:relative !important;
  z-index:4 !important;
  pointer-events:auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .product-image {
  display:block !important;
  width:56px !important;
  height:74px !important;
  margin:0 auto !important;
  object-fit:cover !important;
  object-position:center !important;
}

@media (max-width:1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    min-width:1880px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:84px 68px 190px 150px 210px 210px 156px 138px 148px 138px 138px 136px !important;
    column-gap:10px !important;
  }
}

@media (max-width:760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    min-width:1720px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr,tbody tr) {
    grid-template-columns:74px 60px 172px 136px 190px 190px 140px 124px 136px 124px 124px 124px !important;
    column-gap:8px !important;
  }
}

/* END frontend/assets/pattern-workbench.css */

/* BEGIN frontend/assets/pattern-workbench-clean-layout.css */
/* pattern-workbench-clean-layout=20260903-r3
 * Final content-led layout for the pattern workbench. The legacy grid stretched
 * short assignment stacks to the full row height, leaving dashes, people and
 * actions far apart. This layer is loaded last so the visual contract is stable.
 */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table.product-workbench-table-pattern) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern {
  display: block !important;
  width: max-content !important;
  min-width: 1760px !important;
  max-width: none !important;
  table-layout: fixed !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead, tbody) {
  display: block !important;
  width: max-content !important;
  min-width: 100% !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr, tbody tr) {
  display: grid !important;
  width: 100% !important;
  min-width: 1760px !important;
  grid-template-columns: 84px 66px 176px 138px 220px 196px 138px 122px 140px 118px 138px 136px !important;
  grid-template-areas: "style image identity category flow details owner assign attrs match plan actions" !important;
  grid-template-rows: minmax(0, auto) !important;
  align-items: start !important;
  column-gap: 8px !important;
  row-gap: 0 !important;
  box-sizing: border-box !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern thead tr {
  min-height: 42px !important;
  padding: 0 12px !important;
  align-items: center !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody tr {
  min-height: 122px !important;
  height: auto !important;
  padding: 12px !important;
  align-items: start !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead th, tbody td) {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
  padding: 6px 7px !important;
  line-height: 1.35 !important;
  align-self: start !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(2) {
  align-self: center !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(.pattern-assignee-cell, .pattern-assignment-cell) {
  align-self: start !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-list {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  align-content: flex-start !important;
  gap: 6px !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-line {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  min-height: 28px !important;
  height: auto !important;
  padding: 0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-person {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  align-items: baseline !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line {
  justify-content: flex-start !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line .pattern-assign-button {
  width: auto !important;
  min-width: 84px !important;
  min-height: 26px !important;
  padding: 4px 8px !important;
  white-space: nowrap !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-line :is(.pattern-assignment-action-empty, .pattern-assignment-action-note) {
  width: auto !important;
  min-width: 84px !important;
  text-align: left !important;
  white-space: nowrap !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  min-width: 0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-facts {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  margin: 0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact {
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  gap: 0 5px !important;
  min-width: 0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-fact span,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .external-pattern-contact {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-plan {
  display: flex !important;
  flex-direction: column !important;
  align-content: flex-start !important;
  gap: 3px !important;
  min-width: 0 !important;
}

/* Rebalance the same contract on narrower viewports without allowing columns
 * to collapse into unreadable overlaps. The table remains horizontally scrollable. */
@media (max-width: 1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr, tbody tr) {
    min-width: 1602px !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr, tbody tr) {
    grid-template-columns: 76px 60px 160px 124px 190px 176px 132px 112px 128px 110px 126px 120px !important;
    column-gap: 8px !important;
  }
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr, tbody tr) {
    min-width: 1494px !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.product-workbench-table-pattern :is(thead tr, tbody tr) {
    grid-template-columns: 68px 54px 150px 116px 176px 160px 124px 106px 120px 104px 116px 112px !important;
    column-gap: 8px !important;
  }
}

/* END frontend/assets/pattern-workbench-clean-layout.css */

/* BEGIN frontend/assets/hr-organization-dialog.css */
/* organization-dialog=20260903-r1: compact, aligned directory maintenance */
#createDialog:has(> .dialog-inner.hr-organization-dialog) {
  width: min(980px, calc(100vw - 28px)) !important;
  max-width: min(980px, calc(100vw - 28px)) !important;
  max-height: min(860px, calc(100dvh - 24px)) !important;
}

#createDialog > .dialog-inner.hr-organization-dialog {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  max-height: inherit;
  overflow: auto;
  color: #243b53;
  background: #fff;
}

#createDialog > .dialog-inner.hr-organization-dialog > .dialog-head {
  padding: 18px 24px 15px;
  background: #fff;
}

#createDialog > .dialog-inner.hr-organization-dialog > .dialog-head h2 {
  color: #203b59;
  font-size: 19px;
}

#createDialog > .dialog-inner.hr-organization-dialog > .dialog-help {
  margin: 0;
  padding: 10px 24px 0;
  color: #6f8295;
  font-size: 12px;
  line-height: 1.5;
}

#createDialog > .dialog-inner.hr-organization-dialog > .form {
  display: grid;
  gap: 12px;
  padding: 14px 24px 20px;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-editor-simple {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 12px;
  border: 1px solid #dfe7ee;
  border-radius: 10px;
  background: #f8fafc;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px;
  border: 0;
  background: transparent;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-head strong {
  color: #203b59;
  font-size: 14px;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-head small {
  color: #7b8da0;
  font-size: 11px;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-column {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #dfe7ee;
  border-radius: 8px;
  background: #fff;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-column-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  padding-bottom: 8px;
  border-bottom: 1px solid #edf1f5;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-column-head > div:first-child {
  display: grid;
  gap: 2px;
  min-width: 0;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-column-head strong {
  color: #294665;
  font-size: 13px;
  line-height: 1.2;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-column-head small {
  color: #8797a8;
  font-size: 10px;
  line-height: 1.35;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-column-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-column-actions .status-tag {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 7px;
  border: 1px solid #d9e3ec;
  border-radius: 12px;
  color: #5b7187;
  background: #f4f7fa;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-column-actions .compact-button {
  min-height: 28px;
  padding: 0 9px;
  border-radius: 6px;
  font-size: 11px;
  white-space: nowrap;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 6px;
  min-width: 0;
  max-height: 290px;
  overflow: auto;
  padding: 0 2px 2px 0;
  scrollbar-gutter: stable;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-item input {
  width: 100%;
  min-width: 0;
  min-height: 32px;
  padding: 6px 8px;
  border: 1px solid #d5e0e9;
  border-radius: 6px;
  color: #273f5b;
  background: #fff;
  font-size: 12px;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-item input:focus {
  border-color: #5c94c7;
  box-shadow: 0 0 0 3px #eaf3fb;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-remove {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0;
  border: 1px solid #d5e0e9;
  border-radius: 6px;
  color: #7a8b9a;
  background: #fff;
  font-size: 16px;
  line-height: 1;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-remove:hover,
#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-remove:focus-visible {
  border-color: #e4aaa8;
  color: #b4534d;
  background: #fff8f7;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 18px 8px;
  color: #8b9aaa;
  font-size: 12px;
  text-align: center;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-directory-editor-simple > .hr-directory-hint {
  margin: 0;
  padding: 8px 10px;
  border: 1px solid #efe0b6;
  border-radius: 6px;
  color: #7a6a4a;
  background: #fffaf1;
  font-size: 11px;
  line-height: 1.45;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-supervisor-editor {
  margin: 0;
  padding: 0;
  border: 1px solid #dfe7ee;
  border-radius: 10px;
  background: #fff;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-supervisor-editor > .hr-collapsible-head {
  min-height: 48px;
  padding: 10px 13px;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-supervisor-list {
  display: grid;
  gap: 6px;
  padding: 0 12px 12px;
}

#createDialog > .dialog-inner.hr-organization-dialog .hr-supervisor-row {
  min-height: 42px;
  padding: 7px 9px;
  border-radius: 6px;
}

#createDialog > .dialog-inner.hr-organization-dialog .form-footer {
  position: sticky;
  bottom: 0;
  z-index: 2;
  margin: 0 -24px -20px;
  padding: 12px 24px;
  border-top: 1px solid #e5ebf0;
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(6px);
}

@media (max-width: 820px) {
  #createDialog:has(> .dialog-inner.hr-organization-dialog) {
    width: calc(100vw - 18px) !important;
    max-width: calc(100vw - 18px) !important;
  }

  #createDialog > .dialog-inner.hr-organization-dialog > .dialog-head,
  #createDialog > .dialog-inner.hr-organization-dialog > .dialog-help,
  #createDialog > .dialog-inner.hr-organization-dialog > .form {
    padding-left: 16px;
    padding-right: 16px;
  }

  #createDialog > .dialog-inner.hr-organization-dialog .hr-directory-columns {
    grid-template-columns: 1fr;
  }

  #createDialog > .dialog-inner.hr-organization-dialog .hr-directory-items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: 220px;
  }

  #createDialog > .dialog-inner.hr-organization-dialog .form-footer {
    margin-left: -16px;
    margin-right: -16px;
    padding-left: 16px;
    padding-right: 16px;
  }
}

@media (max-width: 480px) {
  #createDialog > .dialog-inner.hr-organization-dialog .hr-directory-items {
    grid-template-columns: 1fr;
  }

  #createDialog > .dialog-inner.hr-organization-dialog .hr-directory-column-head {
    align-items: flex-start;
  }
}

/* END frontend/assets/hr-organization-dialog.css */

/* BEGIN frontend/assets/procurement-workbench.css */
/* 2026-09-03 procurement-direct-table=20260903-r10
 * Procurement owns a dense execution table. This file loads after the shared
 * workbench layers so legacy record-card rules cannot hide its headings or
 * move legal workflow actions back behind the detail view. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-workbench-panel {
  overflow: hidden !important;
  border-color: #d8dee6 !important;
  border-radius: 6px !important;
  background: #fff !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-list-head {
  min-height: 76px !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid #dfe4ea !important;
  background: #fff !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-list-head h3 {
  margin: 2px 0 3px !important;
  color: #1d2c3e !important;
  font-size: 17px !important;
  line-height: 1.3 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-list-head .subtle {
  color: #637184 !important;
  font-size: 12px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-list-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 58px !important;
  min-height: 28px !important;
  padding: 0 10px !important;
  border: 1px solid #d7dde5 !important;
  border-radius: 4px !important;
  color: #45566a !important;
  background: #f7f8fa !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-list-tools,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-scroll-controls {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-scroll-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  border: 1px solid #cfd6df !important;
  border-radius: 4px !important;
  color: #34465a !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-scroll-button:hover {
  border-color: #91a0b2 !important;
  background: #f5f7f9 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-scroll-button:focus-visible,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-table-wrap:focus-visible {
  outline: 2px solid #1769d2 !important;
  outline-offset: 2px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-scroll-button:disabled {
  cursor: default !important;
  opacity: 0.38 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-scroll-button :is(svg, i) {
  width: 16px !important;
  height: 16px !important;
  pointer-events: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-workbench-panel > .procurement-table-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
  scrollbar-color: #aab4c0 #eef1f4 !important;
  scrollbar-width: thin !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-table-wrap::-webkit-scrollbar {
  height: 10px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-table-wrap::-webkit-scrollbar-track {
  background: #eef1f4 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-table-wrap::-webkit-scrollbar-thumb {
  border: 2px solid #eef1f4 !important;
  border-radius: 5px !important;
  background: #aab4c0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.procurement-workbench-table {
  display: table !important;
  width: 1855px !important;
  min-width: 1855px !important;
  max-width: none !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: #25364a !important;
  background: #fff !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table thead {
  display: table-header-group !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody {
  display: table-row-group !important;
  width: auto !important;
  background: #fff !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(thead tr, tbody tr) {
  display: table-row !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  gap: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #fff !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td) {
  display: table-cell !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 12px !important;
  overflow: visible !important;
  vertical-align: middle !important;
  text-align: left !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table thead th {
  height: 44px !important;
  border: 0 !important;
  border-bottom: 1px solid #d7dde5 !important;
  color: #526175 !important;
  background: #f5f7f9 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody td {
  height: 118px !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e9ee !important;
  color: #2f4054 !important;
  background: #fff !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody tr:hover td {
  background: #f8fafc !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):first-child {
  position: sticky !important;
  left: 0 !important;
  z-index: 2 !important;
  border-right: 1px solid #dfe4ea !important;
  background: #fff !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table thead th:first-child {
  z-index: 5 !important;
  background: #f0f3f6 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody tr:hover td:first-child {
  background: #f6f8fa !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(1) { width: 155px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(2) { width: 130px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(3) { width: 115px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(4) { width: 190px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(5) { width: 150px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(6) { width: 155px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(7) { width: 165px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(8) { width: 160px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(9) { width: 170px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(10) { width: 110px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(11) { width: 145px !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):nth-child(12) {
  width: 210px !important;
  position: sticky !important;
  right: 0 !important;
  z-index: 3 !important;
  border-left: 1px solid #dfe4ea !important;
  background: #fbfcfd !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table thead th:nth-child(12) {
  z-index: 5 !important;
  background: #f0f3f6 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table tbody tr:hover td:nth-child(12) {
  background: #f6f8fa !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-style-summary {
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-style-summary .product-image {
  width: 44px !important;
  height: 58px !important;
  border: 1px solid #d8dee6 !important;
  border-radius: 4px !important;
  object-fit: cover !important;
  background: #f1f3f5 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-style-summary > div {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-workbench-table .style-code {
  display: inline !important;
  width: max-content !important;
  max-width: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #1769d2 !important;
  background: transparent !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  line-height: 1.3 !important;
  text-align: left !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-style-summary strong,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-cell-stack > strong {
  color: #26384b !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.4 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-style-summary span,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-cell-stack > span {
  color: #56667a !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-cell-stack {
  display: grid !important;
  align-content: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-cell-stack > small {
  color: #8590a0 !important;
  font-size: 10px !important;
  line-height: 1.4 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-order-lines {
  display: grid !important;
  align-content: center !important;
  gap: 2px !important;
  min-width: 0 !important;
  color: #45566a !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-order-lines > span {
  white-space: normal !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-order-lines > strong {
  color: #26384b !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1.35 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-order-lines > small {
  margin-top: 2px !important;
  color: #8590a0 !important;
  font-size: 10px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.procurement-number, .procurement-date, .procurement-amount) > strong {
  white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-number > strong {
  font-size: 17px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-status-stack > :is(.tag, .status-tag, .chip) {
  justify-self: start !important;
  max-width: 100% !important;
  min-height: 24px !important;
  padding: 3px 8px !important;
  white-space: normal !important;
  line-height: 1.25 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-workbench-table .procurement-actions-cell {
  padding: 10px 12px !important;
  overflow: visible !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-direct-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-content: center !important;
  align-items: stretch !important;
  gap: 6px !important;
  width: 100% !important;
  height: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  background: transparent !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-direct-actions > :is(button, .action-button) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 32px !important;
  padding: 5px 8px !important;
  border: 1px solid #cfd6df !important;
  border-radius: 4px !important;
  color: #35475b !important;
  background: #fff !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-direct-actions > .row-primary-action {
  border-color: #e5372f !important;
  color: #fff !important;
  background: #e5372f !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-direct-actions > .action-detail {
  color: #526175 !important;
  background: #f7f8fa !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-row-idle {
  grid-column: 1 / -1 !important;
  color: #788596 !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table.procurement-workbench-table {
    width: 1855px !important;
    min-width: 1855px !important;
    max-width: none !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(thead tr, tbody tr) {
    display: table-row !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    padding: 0 !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td) {
    display: table-cell !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.procurement-workbench-table :is(th, td):is(:first-child, :nth-child(12)) {
    position: static !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .procurement-list-head {
    align-items: flex-start !important;
    gap: 12px !important;
  }
}

/* procurement-table-alignment=20260903-r3
 * The procurement ledger has 12 independent business columns. Continuous
 * workflow states stay in one progress column; native table tracks keep every
 * header aligned with its row content while the table wrapper owns overflow. */
body.workspace-mode .app-shell[data-ui-shell="r26"] .procurement-workbench-table :is(thead tr, tbody tr) {
  display: table-row !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  align-items: initial !important;
  gap: 0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] .procurement-workbench-table :is(thead th, tbody td) {
  display: table-cell !important;
  vertical-align: middle !important;
  box-sizing: border-box !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] .procurement-workbench-table thead th:last-child,
body.workspace-mode .app-shell[data-ui-shell="r26"] .procurement-workbench-table tbody td:last-child {
  text-align: center !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] .procurement-workbench-table thead th:last-child,
body.workspace-mode .app-shell[data-ui-shell="r26"] .procurement-workbench-table .procurement-actions-cell {
  padding-left: 12px !important;
  padding-right: 12px !important;
}

/* Match the shared workbench selector's specificity so later generic grid and
 * flex alignment rules cannot turn this page back into record cards. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .procurement-workbench-panel > .procurement-table-wrap {
  display: block !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table {
  display: table !important;
  width: 1855px !important;
  min-width: 1855px !important;
  max-width: none !important;
  table-layout: fixed !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table thead {
  display: table-header-group !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table tbody {
  display: table-row-group !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table :is(thead tr, tbody tr) {
  display: table-row !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  gap: 0 !important;
  padding: 0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table :is(thead th, tbody td) {
  display: table-cell !important;
  justify-content: normal !important;
  align-items: initial !important;
  vertical-align: middle !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table thead th:last-child,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table tbody td:last-child {
  display: table-cell !important;
  justify-content: normal !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
  text-align: center !important;
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.procurement-workbench-table :is(th, td):is(:first-child, :last-child) {
    position: static !important;
  }
}

/* 2026-09-03 procurement-surface-unification=20260903-r9
 * The shared r50 sheet still treated column eight as a legacy sticky rail and
 * tinted the real action column separately. Procurement owns twelve columns;
 * only the first and last columns are anchored, and both now follow the row
 * surface so the table reads as one continuous ledger. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table :is(th, td):nth-child(8) {
  position: static !important;
  right: auto !important;
  z-index: auto !important;
  border-left: 0 !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table tbody tr:hover td:nth-child(8) {
  background: #f8fafc !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table :is(th, td):nth-child(12) {
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table thead th:nth-child(12) {
  background: #f5f7f9 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table tbody tr:hover td:nth-child(12) {
  background: #f8fafc !important;
}

/* procurement-column-contract=20260903-r10
 * The attribute is part of the component contract and lifts this native table
 * above shared record-card selectors, including their :not() specificity. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] {
  display: table !important;
  width: 1855px !important;
  min-width: 1855px !important;
  max-width: none !important;
  table-layout: fixed !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] thead {
  display: table-header-group !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] tbody {
  display: table-row-group !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(thead tr, tbody tr) {
  display: table-row !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  align-items: initial !important;
  gap: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(thead th, tbody td) {
  display: table-cell !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  z-index: auto !important;
  grid-area: auto !important;
  justify-content: normal !important;
  align-items: initial !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 12px !important;
  overflow: visible !important;
  vertical-align: middle !important;
  text-align: left !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] tbody td::before {
  display: none !important;
  content: none !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(1) { width: 155px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(2) { width: 130px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(3) { width: 115px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(4) { width: 190px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(5) { width: 150px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(6) { width: 155px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(7) { width: 165px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(8) { width: 160px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(9) { width: 170px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(10) { width: 110px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(11) { width: 145px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):nth-child(12) { width: 210px !important; }

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):first-child {
  position: sticky !important;
  left: 0 !important;
  z-index: 4 !important;
  border-right: 1px solid #dfe4ea !important;
  background: #fff !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):last-child {
  position: sticky !important;
  right: 0 !important;
  z-index: 4 !important;
  border-left: 1px solid #dfe4ea !important;
  background: #fff !important;
  justify-content: normal !important;
  text-align: center !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table[data-presentation="table"] thead :is(th:first-child, th:last-child) {
  z-index: 6 !important;
  background: #f5f7f9 !important;
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.procurement-workbench-table[data-presentation="table"] :is(th, td):is(:first-child, :last-child) {
    position: static !important;
  }
}

/* END frontend/assets/procurement-workbench.css */

/* BEGIN frontend/assets/workspace-contrast-safety.css */
/* workspace-contrast-safety=20260903-r3
 * Final light-workspace guard. The authenticated content area has several
 * legacy theme layers; these explicit foreground/surface pairs prevent
 * white or pastel text from landing on white surfaces while leaving the
 * dark sidebar, sign-in screen and intentionally dark AI stage untouched. */

/* The sign-in form is light even while the shell is in auth-mode. Keep its
 * helper copy and platform trust strip readable without touching the dark
 * brand panel. */
body.auth-mode .app-shell.auth-mode .auth-form-hint,
body.auth-mode .app-shell.auth-mode .auth-login-note {
  color: #5f7184 !important;
  -webkit-text-fill-color: #5f7184 !important;
}

body.auth-mode .app-shell.auth-mode .platform-legal-trust,
body.auth-mode .app-shell.auth-mode .platform-trust-item,
body.auth-mode .app-shell.auth-mode .platform-legal-links,
body.auth-mode .app-shell.auth-mode .platform-filing-link,
body.auth-mode .app-shell.auth-mode .platform-legal-copy,
body.auth-mode .app-shell.auth-mode .platform-legal-copy span {
  color: #52677d !important;
  -webkit-text-fill-color: #52677d !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page {
  color: #213449 !important;
}

/* Dialogs and the activity drawer sit outside #page. Keep their light
 * surfaces on the same readable foreground contract as the workspaces. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  :is(.dialog[open], #activityPanel) {
  color: #213449 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  :is(.dialog[open], #activityPanel)
  :is(h1, h2, h3, h4, h5, p, span, small, label, legend, th, td, strong, em) {
  -webkit-text-fill-color: currentColor !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  :is(.dialog[open], #activityPanel)
  :is(.dialog-inner, .panel, .section, .table-wrap, .form, .activity-panel-body) {
  color: #213449 !important;
  background-color: #fff !important;
}

/* Shared light surfaces inherit a dark readable base before their semantic
 * status/link rules below take precedence. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.panel, .metric, .work-card, .dashboard-module, .dashboard-intelligence-card,
      .operation-order-row, .workbench-status-card, .product-table, .table-wrap,
      .detail-module, .section, .form, .card) {
  color: #213449 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.panel, .metric, .work-card, .dashboard-module, .dashboard-intelligence-card,
      .operation-order-row, .workbench-status-card, .product-table, .table-wrap,
      .detail-module, .section, .form, .card)
  :is(h1, h2, h3, h4, h5, p, span, small, label, legend, th, td, strong, em) {
  -webkit-text-fill-color: currentColor !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(button.primary, .primary, .row-primary-action, [data-primary]):not(:disabled) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: #b4232f !important;
  border-color: #b4232f !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(button.primary, .primary, .row-primary-action, [data-primary]):not(:disabled):hover {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: #8f1d2a !important;
  border-color: #8f1d2a !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(button.secondary, .secondary, button.action-button, .action-detail):not(.selected):not(.active):not([aria-pressed="true"]):not(:disabled) {
  color: #263b50 !important;
  -webkit-text-fill-color: #263b50 !important;
  background: #fff !important;
  border-color: #c5cfdb !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(button.primary, .primary, .row-primary-action, [data-primary]):not(:disabled) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(button.secondary, .secondary, button.action-button, .action-detail):not(.selected):not(.active):not([aria-pressed="true"]):not(:disabled):hover {
  color: #17354d !important;
  -webkit-text-fill-color: #17354d !important;
  background: #f4f7fa !important;
  border-color: #93a4b7 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.dashboard-module-stats .done-count > b, .dashboard-module-stats .doing-count > b) {
  color: #275f49 !important;
  -webkit-text-fill-color: #275f49 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .dashboard-module-stats .doing-count > b {
  color: #7a531c !important;
  -webkit-text-fill-color: #7a531c !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.workbench-status-empty, .workbench-status-lane-link, .workspace-tab-close, .operation-order-count) {
  color: #52677d !important;
  -webkit-text-fill-color: #52677d !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .workbench-status-lane-link {
  color: #175cd3 !important;
  -webkit-text-fill-color: #175cd3 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.tag.gray, .status-tag.gray, .chip.gray) {
  color: #435264 !important;
  -webkit-text-fill-color: #435264 !important;
  background: #eef2f6 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.tag.blue, .status-tag.blue, .chip.blue) {
  color: #18558a !important;
  -webkit-text-fill-color: #18558a !important;
  background: #e6f1ff !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.tag.green, .status-tag.green, .chip.green) {
  color: #1d6b4a !important;
  -webkit-text-fill-color: #1d6b4a !important;
  background: #e4f6ec !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.tag.orange, .status-tag.orange, .chip.orange) {
  color: #815311 !important;
  -webkit-text-fill-color: #815311 !important;
  background: #fff4dc !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.tag.red, .status-tag.red, .chip.red) {
  color: #8f283b !important;
  -webkit-text-fill-color: #8f283b !important;
  background: #ffeaee !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.operation-order-copy > span, .operation-order-fact > span, .operation-order-meta > small,
      .operation-order-empty > span, .operation-orders-panel > .panel-head .subtle,
      .product-workbench-panel > .panel-head .subtle, .dashboard-module-health,
      .dashboard-module-health *, .operation-data-note, .operation-data-empty,
      .schedule-note, .pattern-progress-next span, .pattern-progress-mode,
      .account-binding-state, .org-account-state) {
  color: #5f7184 !important;
  -webkit-text-fill-color: #5f7184 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(input, select, textarea)::placeholder {
  color: #68798b !important;
  opacity: 1 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.panel, .table-wrap, .product-workbench-table, .operation-order-row)
  :is(h1, h2, h3, h4, p, label, th, td, strong) {
  text-shadow: none !important;
}

/* workspace-scroll-surface=20260903-r4
 * The last global theme layer paints every scrollbar with a navy track. That
 * track leaks into light work tables as a dark strip at the bottom while the
 * user scrolls horizontally. Content surfaces own a quiet neutral scrollbar;
 * the graphite navigation rail keeps its intentional dark treatment. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page * {
  scrollbar-color: #b8c2cd #f1f3f5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page *::-webkit-scrollbar-track {
  background: #f1f3f5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page *::-webkit-scrollbar-thumb {
  border-color: #f1f3f5 !important;
  border-radius: 5px !important;
  background: #b8c2cd !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page *::-webkit-scrollbar-thumb:hover {
  background: #9daab8 !important;
}

@media (prefers-reduced-motion: reduce) {
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .procurement-table-wrap {
    scroll-behavior: auto !important;
  }
}

/* END frontend/assets/workspace-contrast-safety.css */

/* BEGIN frontend/assets/workspace-responsive-safety.css */
/* workspace-responsive-safety=20260903-r1
 * Final responsive contract for the authenticated workspace. Empty states are
 * message surfaces, while populated business ledgers keep their own scroll.
 */

html:has(body.workspace-mode) {
  max-width: 100vw !important;
  overflow-x: hidden !important;
  background: #f3f4f6 !important;
}

/* table-column-contract=20260903-r2
 * Product workbenches have one source of truth for column order. Older layers
 * treated these rows as 9-, 10-, or 12-track grids, so the header and body could
 * silently resolve different tracks. The terminal contract below restores
 * native table layout on wider screens and uses runtime data-label values on
 * narrow screens. Procurement keeps its dedicated 12-column contract. */

@media (min-width: 761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .table-wrap:has(> table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table)),
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    .table-wrap:has(> table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table)) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    overscroll-behavior-x: contain !important;
    scrollbar-gutter: stable !important;
    box-sizing: border-box !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table),
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) {
    display: table !important;
    width: 1364px !important;
    min-width: 1364px !important;
    max-width: none !important;
    table-layout: fixed !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table).product-workbench-table-design,
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table).product-workbench-table-design {
    width: 1640px !important;
    min-width: 1640px !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table).product-workbench-table-pattern,
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table).product-workbench-table-pattern {
    width: 1777px !important;
    min-width: 1777px !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody,
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead,
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody {
    display: table-header-group !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody,
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody {
    display: table-row-group !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead tr, tbody tr),
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead tr, tbody tr) {
    display: table-row !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    gap: 0 !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead th, tbody td),
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead th, tbody td) {
    display: table-cell !important;
    position: static !important;
    grid-area: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    box-sizing: border-box !important;
    padding: 9px 10px !important;
    vertical-align: middle !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  /* standard-9 */
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract="standard-9"] :is(th, td),
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract="standard-9"] :is(th, td) {
    width: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(1),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(1) { width: 96px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(2),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(2) { width: 68px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(3),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(3) { width: 176px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(4),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(4) { width: 136px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(5),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(5) { width: 220px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(6),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(6) { width: 180px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(7),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(7) { width: 150px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(8),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(8) { width: 150px !important; display: table-cell !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(9),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(9) { width: 188px !important; }

  /* design-11 */
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td) { width: 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(1),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(1) { width: 86px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(2),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(2) { width: 68px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(3),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(3) { width: 180px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(4),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(4) { width: 136px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(5),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(5) { width: 220px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(6),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(6) { width: 168px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(7),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(7) { width: 168px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(8),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(8) { width: 160px !important; display: table-cell !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(9),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(9) { width: 164px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(10),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(10) { width: 150px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(11),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(11) { width: 190px !important; }

  /* pattern-12 */
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td) { width: 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(1),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(1) { width: 86px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(2),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(2) { width: 68px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(3),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(3) { width: 180px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(4),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(4) { width: 136px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(5),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(5) { width: 220px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(6),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(6) { width: 205px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(7),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(7) { width: 152px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(8),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(8) { width: 138px !important; display: table-cell !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(9),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(9) { width: 154px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(10),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(10) { width: 136px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(11),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(11) { width: 132px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(12),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] :is(th, td):nth-child(12) { width: 170px !important; }
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table),
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: auto !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead,
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead {
    display: none !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody,
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 8px !important;
    padding: 8px !important;
    box-sizing: border-box !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr,
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: none !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 12px !important;
    margin: 0 !important;
    gap: 0 !important;
    box-sizing: border-box !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td,
  html body.workspace-mode .app-shell:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td {
    display: block !important;
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 8px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid #e7eaee !important;
    grid-area: auto !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td:last-child,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td:last-child {
    border-bottom: 0 !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td::before,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td::before {
    content: attr(data-label) !important;
    display: block !important;
    margin-bottom: 3px !important;
    color: #6f7780 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
  }
}

/* collapsed-sidebar-rail=20260904-r1
 * A persisted collapsed preference must leave a usable icon rail. Zero-width
 * collapse hid every navigation entry and exposed only the rail border. */
@media (min-width: 761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode),
  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) {
    grid-template-columns: 64px minmax(0, 1fr) !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar,
  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar {
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
    overflow: hidden !important;
  }

  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar .nav {
    gap: 4px !important;
    padding: 10px 8px 14px !important;
  }

  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar .nav-group {
    display: block !important;
    margin: 0 !important;
  }

  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar .nav-group-trigger {
    display: none !important;
  }

  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar .nav-group-menu,
  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar .nav-group.is-collapsed .nav-group-menu {
    display: grid !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar .nav-item {
    position: relative !important;
    width: 48px !important;
    min-width: 48px !important;
    min-height: 40px !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 0 !important;
  }

  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar .nav-item > span {
    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;
  }

  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar .nav-item > svg {
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
  }

  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar .nav-item > b {
    position: absolute !important;
    top: 2px !important;
    right: 2px !important;
    min-width: 15px !important;
    height: 15px !important;
    padding: 0 3px !important;
    font-size: 9px !important;
  }

  html body.workspace-mode
    .app-shell[data-ui-shell="r26"][data-sidebar-collapsed="true"]:not(.auth-mode) .sidebar .sidebar-footer {
    display: none !important;
  }
}

body.workspace-mode {
  min-width: 0 !important;
  max-width: 100vw !important;
  overflow-x: hidden !important;
}

body.workspace-mode .app-shell:not(.auth-mode),
body.workspace-mode .app-shell:not(.auth-mode) .workspace,
body.workspace-mode .app-shell:not(.auth-mode) #page,
body.workspace-mode .app-shell:not(.auth-mode) .page,
body.workspace-mode .app-shell:not(.auth-mode) .view-panel {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.workspace-mode .app-shell:not(.auth-mode) {
  width: 100% !important;
  overflow-x: hidden !important;
}

body.workspace-mode .app-shell:not(.auth-mode) .workspace {
  width: 100% !important;
  overflow-x: hidden !important;
}

body.workspace-mode .app-shell:not(.auth-mode) #page {
  width: 100% !important;
  overflow-x: hidden !important;
}

/* A single empty row must not inherit the record-card/grid presentation used
 * by populated workbenches. That grid is what turns Chinese copy into one
 * character per line on narrow screens. */
body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr:only-child > td > .empty-state),
body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr > td > .empty-state) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  box-sizing: border-box !important;
}

body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr:only-child > td > .empty-state) > table,
body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr > td > .empty-state) > table {
  display: table !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr:only-child > td > .empty-state) > table > tbody,
body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr > td > .empty-state) > table > tbody {
  display: table-row-group !important;
  width: 100% !important;
  padding: 0 !important;
}

body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr:only-child > td > .empty-state) > table > tbody > tr,
body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr > td > .empty-state) > table > tbody > tr {
  display: table-row !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr:only-child > td > .empty-state) > table > tbody > tr > td[colspan],
body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr > td > .empty-state) > table > tbody > tr > td[colspan] {
  display: table-cell !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  padding: 0 !important;
  vertical-align: middle !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr > td > .empty-state) .empty-state,
body.workspace-mode .app-shell:not(.auth-mode) .empty-state.compact {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: center !important;
  align-items: center !important;
  width: min(100%, 680px) !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 132px !important;
  margin: 0 auto !important;
  padding: 30px 24px !important;
  box-sizing: border-box !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  white-space: normal !important;
  text-align: center !important;
}

body.workspace-mode .app-shell:not(.auth-mode) .empty-state :is(strong, span),
body.workspace-mode .app-shell:not(.auth-mode) .empty-state.compact :is(strong, span) {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  text-align: center !important;
}

body.workspace-mode .app-shell:not(.auth-mode) :is(.org-department-list, .org-role-list, .role-grid, .hr-department-grid, .dashboard-empty, .permission-empty) > .empty-state,
body.workspace-mode .app-shell:not(.auth-mode) :is(.org-department-list, .org-role-list, .role-grid, .hr-department-grid, .dashboard-empty, .permission-empty) .empty-state.compact {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell:not(.auth-mode) {
    display: block !important;
    width: 100% !important;
    min-height: 100vh !important;
  }

  body.workspace-mode .app-shell:not(.auth-mode) .sidebar {
    position: fixed !important;
    inset: auto 0 0 0 !important;
    z-index: 60 !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 60px !important;
    min-height: 60px !important;
    padding: 0 !important;
    border-top: 1px solid #343a42 !important;
    border-right: 0 !important;
  }

  body.workspace-mode .app-shell:not(.auth-mode) .sidebar .nav {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    gap: 3px !important;
    width: 100% !important;
    height: 60px !important;
    margin: 0 !important;
    padding: 4px 7px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
  }

  body.workspace-mode .app-shell:not(.auth-mode) .sidebar .nav-group,
  body.workspace-mode .app-shell:not(.auth-mode) .sidebar .nav-group-menu {
    display: contents !important;
  }

  body.workspace-mode .app-shell:not(.auth-mode) .sidebar .nav-group-trigger,
  body.workspace-mode .app-shell:not(.auth-mode) .sidebar .brand,
  body.workspace-mode .app-shell:not(.auth-mode) .sidebar .sidebar-footer {
    display: none !important;
  }

  body.workspace-mode .app-shell:not(.auth-mode) .sidebar :is(.nav-item, .nav-group-trigger) {
    flex: 0 0 70px !important;
    width: 70px !important;
    min-width: 70px !important;
    min-height: 50px !important;
    padding: 4px !important;
    justify-content: center !important;
    gap: 2px !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
    text-align: center !important;
    white-space: normal !important;
  }

  body.workspace-mode .app-shell:not(.auth-mode) .workspace {
    width: 100% !important;
    max-width: 100% !important;
    padding-bottom: 60px !important;
  }

  body.workspace-mode .app-shell:not(.auth-mode) .topbar {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 56px !important;
    padding: 8px 12px !important;
    box-sizing: border-box !important;
  }

  body.workspace-mode .app-shell:not(.auth-mode) :is(.workbench-switcher, .workspace-tabs) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-sizing: border-box !important;
  }

  body.workspace-mode .app-shell:not(.auth-mode) #page {
    padding: 12px 10px 76px !important;
  }

  body.workspace-mode .app-shell:not(.auth-mode) .table-wrap:has(> table > tbody > tr > td > .empty-state) .empty-state,
  body.workspace-mode .app-shell:not(.auth-mode) .empty-state.compact {
    min-height: 116px !important;
    padding: 24px 18px !important;
  }
}

/* table-column-contract=20260903-r2-terminal
 * This is intentionally the last rule in the cascade. The repository keeps
 * older responsive layers for compatibility, but every populated workbench
 * now resolves columns from the same explicit table contract. */

@media (min-width: 761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table)),
  html body.workspace-mode .app-shell:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table)) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    overscroll-behavior-x: contain !important;
    scrollbar-gutter: stable !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) {
    display: table !important;
    width: 1364px !important;
    min-width: 1364px !important;
    max-width: none !important;
    table-layout: fixed !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"],
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] { width: 1640px !important; min-width: 1640px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"],
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] { width: 1777px !important; min-width: 1777px !important; }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody {
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead { display: table-header-group !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody { display: table-row-group !important; }
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead { display: table-header-group !important; }
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody { display: table-row-group !important; }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead tr, tbody tr),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead tr, tbody tr) {
    display: table-row !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    gap: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead th, tbody td),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead th, tbody td) {
    display: table-cell !important;
    position: static !important;
    grid-area: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    box-sizing: border-box !important;
    padding: 9px 10px !important;
    vertical-align: middle !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  /* All width maps are indexed by the same nth-child order as the markup. */
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td) { width: 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(1), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(1) { width: 86px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(2), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(2) { width: 68px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(3), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(3) { width: 180px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(4), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(4) { width: 136px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(5), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(5) { width: 220px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(6), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(6) { width: 205px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(7), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(7) { width: 152px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(8), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(8) { width: 138px !important; display: table-cell !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(9), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(9) { width: 154px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(10), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(10) { width: 136px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(11), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(11) { width: 132px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(12), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(12) { width: 170px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(6), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(6) { width: 180px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(7), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(7) { width: 150px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(8), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(8) { width: 150px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(9), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(9) { width: 188px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(11), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(11) { width: 190px !important; }
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead { display: none !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 8px !important;
    padding: 8px !important;
    box-sizing: border-box !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 12px !important;
    margin: 0 !important;
    gap: 0 !important;
    box-sizing: border-box !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td {
    display: block !important;
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 8px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid #e7eaee !important;
    grid-area: auto !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td:last-child,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td:last-child { border-bottom: 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td::before,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td::before {
    content: attr(data-label) !important;
    display: block !important;
    margin-bottom: 3px !important;
    color: #6f7780 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
  }
}

/* END frontend/assets/workspace-responsive-safety.css */

/* BEGIN frontend/assets/workspace-table-contract.css */
/* workspace-table-contract=20260903-r1
 * All populated business tables preserve their semantic columns. The table
 * boundary owns horizontal scrolling so the page shell never clips a field;
 * empty states keep the compact, full-width message treatment from the
 * responsive safety layer.
 */

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page {
  --workspace-table-cell-gap: 10px;
  --workspace-table-border: #dfe7e5;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .table-wrap:not(:has(> table > tbody > tr > td > .empty-state)),
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .procurement-material-scroll:not(:has(> table > tbody > tr > td > .empty-state)),
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .design-material-editor-wrap:not(:has(> table > tbody > tr > td > .empty-state)) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
  padding-bottom: 4px !important;
  box-sizing: border-box !important;
}

/* The pattern workbench has its own twelve-column grid contract. Procurement
 * also owns a dedicated table layer, so the shared rules below leave both
 * layouts intact while giving them the same text and scroll guarantees. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.product-workbench-table-pattern):not(.procurement-workbench-table),
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.finance-invoice-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.hr-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.org-members-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.account-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.supplier-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.tenant-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.inbound-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.contract-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.audit-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.operation-data-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.operation-sync-log-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.procurement-archive-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.dealer-material-list-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.design-material-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.procurement-material-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-line-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.design-material-editor {
  display: table !important;
  width: max-content !important;
  max-width: none !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

/* Restore complete table semantics where earlier mobile card rules hid or
 * converted columns. This applies only to populated tables via the wrapper
 * selector and intentionally leaves print-only/generated document tables out. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .table-wrap:not(:has(> table > tbody > tr > td > .empty-state)) > table.order-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .table-wrap:not(:has(> table > tbody > tr > td > .empty-state)) > table.finance-invoice-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .table-wrap:not(:has(> table > tbody > tr > td > .empty-state)) > table.hr-table {
  display: table !important;
  width: max-content !important;
  max-width: none !important;
  table-layout: fixed !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-table thead,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.finance-invoice-table thead,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.hr-table thead {
  display: table-header-group !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-table tbody,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.finance-invoice-table tbody,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.hr-table tbody {
  display: table-row-group !important;
  width: auto !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-table :is(thead tr, tbody tr),
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.finance-invoice-table :is(thead tr, tbody tr),
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.hr-table :is(thead tr, tbody tr) {
  display: table-row !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-table :is(th, td),
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.finance-invoice-table :is(th, td),
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.hr-table :is(th, td) {
  display: table-cell !important;
  position: static !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 10px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--workspace-table-border) !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  line-height: 1.4 !important;
  vertical-align: middle !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-table :is(th, td)::before,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.finance-invoice-table :is(th, td)::before,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.hr-table :is(th, td)::before {
  display: none !important;
  content: none !important;
}

/* The extra order-record disclosure cell is a secondary detail surface. The
 * 16 primary order columns remain aligned with their header; the same detail
 * remains reachable from the row actions/detail view. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-table tbody td.order-record-more-cell {
  display: none !important;
}

/* Shared column budgets. Values are wide enough for normal Chinese labels and
 * action controls, but bounded so a table does not grow from one long value. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-design {
  min-width: 1640px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design):not(.procurement-workbench-table) {
  min-width: 1320px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.procurement-workbench-table {
  min-width: 1680px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-table {
  min-width: 2200px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.finance-invoice-table { min-width: 860px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.hr-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.account-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.org-members-table { min-width: 980px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.supplier-table { min-width: 1320px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.tenant-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.inbound-table { min-width: 820px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.contract-table { min-width: 1420px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table { min-width: 1080px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.audit-table { min-width: 980px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.operation-data-table { min-width: 1080px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.operation-sync-log-table { min-width: 860px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.procurement-archive-table { min-width: 980px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.dealer-material-list-table { min-width: 860px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.design-material-table { min-width: 920px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.procurement-material-table { min-width: 1500px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-line-table { min-width: 640px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.design-material-editor { min-width: 1060px !important; }

/* Generic table cells get the same containment rule. This keeps long names,
 * notes and status explanations inside their own column instead of pushing
 * into the next one. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-table, table.order-line-table, table.design-material-editor) :is(th, td) {
  min-width: 0 !important;
  max-width: none !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  line-height: 1.4 !important;
  vertical-align: middle !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-table, table.order-line-table, table.design-material-editor) :is(td, th) > * {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-table, table.order-line-table, table.design-material-editor) .row-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Headers may wrap; status tags and buttons retain their own compact shape. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-table, table.order-line-table, table.design-material-editor) th {
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  padding: 10px 12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-table, table.order-line-table, table.design-material-editor) td {
  padding: 10px 12px !important;
}

/* Compact report tables are intentionally narrower than operational ledgers. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .dashboard-grid .table-wrap > table.product-table:not(.finance-invoice-table) {
  min-width: 560px !important;
}

@media (max-width: 1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-design { min-width: 1500px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design):not(.procurement-workbench-table) { min-width: 1220px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.order-table { min-width: 2040px !important; }
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-design { min-width: 1420px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:not(.product-workbench-table-pattern):not(.product-workbench-table-design):not(.procurement-workbench-table) { min-width: 1160px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.order-table { min-width: 1900px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    :is(table.product-table, table.order-line-table, table.design-material-editor) :is(th, td) {
    padding: 9px 10px !important;
  }
}

/* workspace-table-contract=20260903-r2-final
 * A legacy mobile continuation below the shared workbench styles converted
 * product rows back into stacked cards. Keep the final behavior consistent
 * with the all-module contract: headers stay visible, every business column
 * remains reachable, and only the explicit table boundary scrolls. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .table-wrap:has(> table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table)) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) {
  display: table !important;
  width: max-content !important;
  min-width: 1320px !important;
  max-width: none !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table[data-column-contract="design-11"] {
  min-width: 1500px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table[data-column-contract="standard-9"] {
  min-width: 1220px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) > thead {
  display: table-header-group !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) > tbody {
  display: table-row-group !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) :is(thead tr, tbody tr) {
  display: table-row !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) :is(thead th, tbody td) {
  display: table-cell !important;
  position: static !important;
  grid-area: auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 10px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--workspace-table-border) !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  vertical-align: middle !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) :is(th, td)::before {
  display: none !important;
  content: none !important;
}

/* Empty rows are messages, not data ledgers. Restore the responsive safety
 * contract after the populated-table width budgets above. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
.table-wrap:has(> table > tbody > tr > td > .empty-state) > table {
  display: table !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  table-layout: fixed !important;
}

/* workspace-scroll-surface=20260904-r1
 * The document owns page scrolling. Legacy shell rules used overflow:hidden
 * on the authenticated workspace, which collapsed the grid item to the
 * viewport and clipped long pages on macOS trackpads. Table wrappers remain
 * the only horizontal scroll boundary for wide business tables. */
html body.workspace-mode {
  min-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: auto !important;
}

html body.workspace-mode .app-shell:not(.auth-mode),
html body.workspace-mode .app-shell:not(.auth-mode) .workspace {
  height: auto !important;
  min-height: 100vh !important;
  overflow: visible !important;
}

html body.workspace-mode .app-shell:not(.auth-mode) #page,
html body.workspace-mode .app-shell:not(.auth-mode) .page {
  overflow: visible !important;
}

/* class-based fallback for cached app.js responses; kept after every legacy
 * rule so the alignment fix also applies before the data-column-contract
 * attribute is available. */
@media (min-width: 761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table:not(.procurement-workbench-table)),
  html body.workspace-mode .app-shell:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table:not(.procurement-workbench-table)) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scrollbar-gutter: stable !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) {
    display: table !important;
    width: 1364px !important;
    min-width: 1364px !important;
    max-width: none !important;
    table-layout: fixed !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-design,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-design { width: 1640px !important; min-width: 1640px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-pattern,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-pattern { width: 1777px !important; min-width: 1777px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > thead,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > thead { display: table-header-group !important; width: auto !important; min-width: 0 !important; padding: 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody { display: table-row-group !important; width: auto !important; min-width: 0 !important; padding: 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(thead tr, tbody tr),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(thead tr, tbody tr) {
    display: table-row !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    gap: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(thead th, tbody td),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(thead th, tbody td) {
    display: table-cell !important;
    position: static !important;
    grid-area: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    box-sizing: border-box !important;
    padding: 9px 10px !important;
    vertical-align: middle !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td) { width: 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(1), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(1) { width: 86px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(2), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(2) { width: 68px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(3), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(3) { width: 180px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(4), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(4) { width: 136px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(5), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(5) { width: 220px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(6), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(6) { width: 180px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(7), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(7) { width: 150px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(8), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(8) { width: 150px !important; display: table-cell !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(9), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(9) { width: 188px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(6), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(6) { width: 168px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(7), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(7) { width: 168px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(8), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(8) { width: 160px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(9), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(9) { width: 164px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(10), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(10) { width: 150px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(11), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-design :is(th, td):nth-child(11) { width: 190px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(6), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(6) { width: 205px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(7), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(7) { width: 152px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(8), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(8) { width: 138px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(9), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(9) { width: 154px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(10), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(10) { width: 136px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(11), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(11) { width: 132px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(12), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table-pattern :is(th, td):nth-child(12) { width: 170px !important; }
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > thead,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > thead { display: none !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; width: 100% !important; min-width: 0 !important; gap: 8px !important; padding: 8px !important; box-sizing: border-box !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody > tr,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody > tr { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; width: 100% !important; min-width: 0 !important; min-height: 0 !important; height: auto !important; padding: 12px !important; margin: 0 !important; gap: 0 !important; box-sizing: border-box !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody > tr > td,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody > tr > td { display: block !important; position: static !important; width: 100% !important; min-width: 0 !important; max-width: none !important; min-height: 0 !important; height: auto !important; padding: 8px 0 !important; border: 0 !important; border-bottom: 1px solid #e7eaee !important; grid-area: auto !important; box-sizing: border-box !important; overflow-wrap: anywhere !important; word-break: break-word !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody > tr > td:last-child,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody > tr > td:last-child { border-bottom: 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody > tr > td::before,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table:not(.procurement-workbench-table) > tbody > tr > td::before { content: attr(data-label) !important; display: block !important; margin-bottom: 3px !important; color: #6f7780 !important; font-size: 11px !important; font-weight: 700 !important; line-height: 1.35 !important; }
}

/* table-column-contract=20260903-r2-terminal
 * Final contract for populated product workbenches. Header and body are never
 * allowed to resolve different grid tracks; the column index is the only
 * mapping used by both. Procurement remains on its dedicated 12-column CSS. */

@media (min-width: 761px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table)),
  html body.workspace-mode .app-shell:not(.auth-mode) #page .table-wrap:has(> table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table)) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    overscroll-behavior-x: contain !important;
    scrollbar-gutter: stable !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) {
    display: table !important;
    width: 1364px !important;
    min-width: 1364px !important;
    max-width: none !important;
    table-layout: fixed !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"],
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] { width: 1640px !important; min-width: 1640px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"],
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="pattern-12"] { width: 1777px !important; min-width: 1777px !important; }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead,
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody {
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead { display: table-header-group !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody { display: table-row-group !important; }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead tr, tbody tr),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead tr, tbody tr) {
    display: table-row !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    gap: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead th, tbody td),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) :is(thead th, tbody td) {
    display: table-cell !important;
    position: static !important;
    grid-area: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    box-sizing: border-box !important;
    padding: 9px 10px !important;
    vertical-align: middle !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td) { width: 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(1), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(1) { width: 86px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(2), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(2) { width: 68px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(3), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(3) { width: 180px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(4), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(4) { width: 136px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(5), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(5) { width: 220px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(6), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(6) { width: 205px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(7), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(7) { width: 152px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(8), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(8) { width: 138px !important; display: table-cell !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(9), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(9) { width: 154px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(10), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(10) { width: 136px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(11), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(11) { width: 132px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(12), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract] :is(th, td):nth-child(12) { width: 170px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(6), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(6) { width: 180px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(7), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(7) { width: 150px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(8), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(8) { width: 150px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(9), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="standard-9"] :is(th, td):nth-child(9) { width: 188px !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(11), html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract="design-11"] :is(th, td):nth-child(11) { width: 190px !important; }
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table),
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: auto !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > thead { display: none !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
    gap: 8px !important;
    padding: 8px !important;
    box-sizing: border-box !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 12px !important;
    margin: 0 !important;
    gap: 0 !important;
    box-sizing: border-box !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td {
    display: block !important;
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 8px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid #e7eaee !important;
    grid-area: auto !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td:last-child,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td:last-child { border-bottom: 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td::before,
  html body.workspace-mode .app-shell:not(.auth-mode) #page table.product-workbench-table[data-column-contract]:not(.procurement-workbench-table) > tbody > tr > td::before {
    content: attr(data-label) !important;
    display: block !important;
    margin-bottom: 3px !important;
    color: #6f7780 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
  }
}

/* workspace-table-contract=20260903-r3-final
 * This is intentionally the last rule in the stylesheet. It closes the
 * cascade over legacy mobile card rules so every viewport keeps the same
 * full-column workbench behavior. */
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) {
    display: table !important;
    width: max-content !important;
    min-width: 1220px !important;
    max-width: none !important;
    table-layout: fixed !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract="design-11"] {
    min-width: 1420px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) > thead {
    display: table-header-group !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) > tbody {
    display: table-row-group !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) :is(thead tr, tbody tr) {
    display: table-row !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    gap: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) :is(thead th, tbody td) {
    display: table-cell !important;
    position: static !important;
    grid-area: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 9px 10px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--workspace-table-border) !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    vertical-align: middle !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table[data-column-contract]:not(.product-workbench-table-pattern):not(.procurement-workbench-table) :is(th, td)::before {
    display: none !important;
    content: none !important;
  }
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .table-wrap:has(> table > tbody > tr > td > .empty-state) > table {
  display: table !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  table-layout: fixed !important;
}

/* END frontend/assets/workspace-table-contract.css */

/* BEGIN frontend/assets/workbench-spacing-final.css */
/* workbench-spacing-final=20260904-r1; wide-table-fill=20260904-r1
 * One final layout contract for every authenticated workbench. The business
 * columns stay intact, while the table boundary owns horizontal scrolling and
 * each column keeps a content-led minimum while wide screens remain fully used.
 */

html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page {
  --workbench-cell-x: 10px;
  --workbench-cell-y: 9px;
  --workbench-table-line: #dfe6ec;
  --workbench-table-head: #f6f8fa;
  --workbench-table-text: #26384d;
}

html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.table-wrap, .procurement-table-wrap, .procurement-material-scroll, .design-material-editor-wrap) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
  padding-bottom: 4px !important;
  -webkit-overflow-scrolling: touch !important;
}

html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.order-table,
      table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
      table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
      table.risk-table, table.audit-table, table.operation-data-table,
      table.operation-sync-log-table, table.procurement-archive-table,
      table.dealer-material-list-table, table.design-material-table,
      table.procurement-material-table, table.order-line-table, table.design-material-editor) {
  display: table !important;
  width: 100% !important;
  max-width: none !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: var(--workbench-table-text) !important;
}

html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.order-table,
      table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
      table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
      table.risk-table, table.audit-table, table.operation-data-table,
      table.operation-sync-log-table, table.procurement-archive-table,
      table.dealer-material-list-table, table.design-material-table,
      table.procurement-material-table, table.order-line-table, table.design-material-editor)
  > thead {
  display: table-header-group !important;
  width: auto !important;
  height: auto !important;
  position: static !important;
  overflow: visible !important;
  clip: auto !important;
}

html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.order-table,
      table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
      table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
      table.risk-table, table.audit-table, table.operation-data-table,
      table.operation-sync-log-table, table.procurement-archive-table,
      table.dealer-material-list-table, table.design-material-table,
      table.procurement-material-table, table.order-line-table, table.design-material-editor)
  > tbody {
  display: table-row-group !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
}

html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.order-table,
      table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
      table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
      table.risk-table, table.audit-table, table.operation-data-table,
      table.operation-sync-log-table, table.procurement-archive-table,
      table.dealer-material-list-table, table.design-material-table,
      table.procurement-material-table, table.order-line-table, table.design-material-editor)
  :is(thead tr, tbody tr) {
  display: table-row !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  gap: 0 !important;
}

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.order-table,
      table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
      table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
      table.risk-table, table.audit-table, table.operation-data-table,
      table.operation-sync-log-table, table.procurement-archive-table,
      table.dealer-material-list-table, table.design-material-table,
      table.procurement-material-table, table.order-line-table, table.design-material-editor)
  :is(thead th, tbody td) {
  display: table-cell !important;
  position: static !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  padding: var(--workbench-cell-y) var(--workbench-cell-x) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--workbench-table-line) !important;
  background: transparent !important;
  box-shadow: none !important;
  vertical-align: middle !important;
  text-align: left !important;
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  line-height: 1.4 !important;
}

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.order-table,
      table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
      table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
      table.risk-table, table.audit-table, table.operation-data-table,
      table.operation-sync-log-table, table.procurement-archive-table,
      table.dealer-material-list-table, table.design-material-table,
      table.procurement-material-table, table.order-line-table, table.design-material-editor)
  thead :is(th, td) {
  background: var(--workbench-table-head) !important;
  color: #52677d !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.order-table,
      table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
      table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
      table.risk-table, table.audit-table, table.operation-data-table,
      table.operation-sync-log-table, table.procurement-archive-table,
      table.dealer-material-list-table, table.design-material-table,
      table.procurement-material-table, table.order-line-table, table.design-material-editor)
  tbody tr:hover td {
  background: #fbfcfd !important;
}

/* Product workbenches: status is already consolidated into one progress column;
 * direct editing/material actions remain visible in their own columns. */
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="standard-9"] {
  width: 100% !important;
  min-width: 1282px !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] {
  width: 100% !important;
  min-width: 1578px !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] {
  width: 100% !important;
  min-width: 1702px !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="standard-9"] > * > tr > :nth-child(1) { width: 86px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="standard-9"] > * > tr > :nth-child(2) { width: 66px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="standard-9"] > * > tr > :nth-child(3) { width: 176px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="standard-9"] > * > tr > :nth-child(4) { width: 138px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="standard-9"] > * > tr > :nth-child(5) { width: 192px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="standard-9"] > * > tr > :nth-child(6) { width: 162px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="standard-9"] > * > tr > :nth-child(7) { width: 154px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="standard-9"] > * > tr > :nth-child(8) { width: 132px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="standard-9"] > * > tr > :nth-child(9) { width: 176px !important; }

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(1) { width: 86px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(2) { width: 66px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(3) { width: 176px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(4) { width: 138px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(5) { width: 192px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(6),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(7) { width: 154px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(8) { width: 156px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(9) { width: 154px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(10) { width: 132px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="design-11"] > * > tr > :nth-child(11) { width: 176px !important; }

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(1) { width: 86px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(2) { width: 66px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(3) { width: 176px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(4) { width: 138px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(5) { width: 192px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(6) { width: 184px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(7) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(8) { width: 122px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(9) { width: 154px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(10) { width: 132px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(11) { width: 126px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.product-workbench-table[data-column-contract="pattern-12"] > * > tr > :nth-child(12) { width: 176px !important; }

/* Procurement keeps its twelve operational facts and exposes direct handling
 * at the edge of the scroll surface so the final column remains reachable. */
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table {
  width: 100% !important;
  min-width: 1740px !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(1) { width: 132px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(2) { width: 136px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(3) { width: 112px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(4) { width: 176px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(5) { width: 132px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(6) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(7) { width: 154px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(8) { width: 148px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(9) { width: 160px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(10) { width: 112px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(11) { width: 136px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-workbench-table > * > tr > :nth-child(12) { width: 182px !important; }

/* Other workbenches use the same rule: compact, readable columns with no
 * 1fr expansion. The widths are intentionally modest and remain scrollable. */
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table { width: 100% !important; min-width: 2180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(1) { width: 86px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(2) { width: 66px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(3) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(4) { width: 124px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(5) { width: 160px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(6) { width: 128px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(7) { width: 104px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(8) { width: 176px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(9) { width: 132px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(10) { width: 156px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(11),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(12) { width: 130px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(13) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(14) { width: 156px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(15) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(16) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table > * > tr > :nth-child(17) { width: 1px !important; }

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.finance-invoice-table { width: 100% !important; min-width: 900px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.finance-invoice-table > * > tr > :nth-child(1) { width: 154px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.finance-invoice-table > * > tr > :nth-child(2) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.finance-invoice-table > * > tr > :nth-child(3) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.finance-invoice-table > * > tr > :nth-child(4) { width: 110px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.finance-invoice-table > * > tr > :nth-child(5) { width: 100px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.finance-invoice-table > * > tr > :nth-child(6) { width: 210px !important; }

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.hr-table { width: 100% !important; min-width: 1080px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.hr-table > * > tr > :is(:first-child, :last-child) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.hr-table > * > tr > :not(:first-child):not(:last-child) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.org-members-table { width: 100% !important; min-width: 880px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.org-members-table > * > tr > :nth-child(1) { width: 190px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.org-members-table > * > tr > :nth-child(2),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.org-members-table > * > tr > :nth-child(3) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.org-members-table > * > tr > :nth-child(4),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.org-members-table > * > tr > :nth-child(5) { width: 170px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.org-members-table > * > tr > :nth-child(6) { width: 132px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.account-table { width: 100% !important; min-width: 820px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.account-table > * > tr > :nth-child(1) { width: 200px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.account-table > * > tr > :nth-child(2) { width: 160px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.account-table > * > tr > :nth-child(3) { width: 170px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.account-table > * > tr > :nth-child(4) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.account-table > * > tr > :nth-child(5) { width: 150px !important; }

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table { width: 100% !important; min-width: 1500px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table > * > tr > :nth-child(1) { width: 120px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table > * > tr > :nth-child(2) { width: 190px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table > * > tr > :nth-child(3) { width: 96px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table > * > tr > :nth-child(4) { width: 148px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table > * > tr > :nth-child(5) { width: 160px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table > * > tr > :nth-child(6) { width: 116px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table > * > tr > :nth-child(7) { width: 128px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table > * > tr > :nth-child(8),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table > * > tr > :nth-child(9) { width: 90px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.supplier-table > * > tr > :nth-child(10) { width: 110px !important; }

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.tenant-table { width: 100% !important; min-width: 930px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.tenant-table > * > tr > :nth-child(1) { width: 210px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.tenant-table > * > tr > :nth-child(2) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.tenant-table > * > tr > :nth-child(3) { width: 190px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.tenant-table > * > tr > :nth-child(4) { width: 160px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.tenant-table > * > tr > :nth-child(5) { width: 130px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.inbound-table { width: 100% !important; min-width: 960px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.inbound-table > * > tr > :nth-child(1) { width: 152px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.inbound-table > * > tr > :nth-child(2) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.inbound-table > * > tr > :nth-child(3) { width: 170px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.inbound-table > * > tr > :nth-child(4) { width: 160px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.inbound-table > * > tr > :nth-child(5) { width: 132px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.inbound-table > * > tr > :nth-child(6) { width: 150px !important; }

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table { width: 100% !important; min-width: 1400px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table > * > tr > :nth-child(1) { width: 90px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table > * > tr > :nth-child(2) { width: 110px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table > * > tr > :nth-child(3) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table > * > tr > :nth-child(4) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table > * > tr > :nth-child(5) { width: 170px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table > * > tr > :nth-child(6) { width: 160px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table > * > tr > :nth-child(7) { width: 120px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table > * > tr > :nth-child(8) { width: 130px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table > * > tr > :nth-child(9) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.contract-table > * > tr > :nth-child(10) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.risk-table { width: 100% !important; min-width: 1260px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.risk-table > * > tr > :nth-child(1) { width: 80px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.risk-table > * > tr > :nth-child(2) { width: 110px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.risk-table > * > tr > :nth-child(3) { width: 100px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.risk-table > * > tr > :nth-child(4) { width: 160px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.risk-table > * > tr > :nth-child(5) { width: 300px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.risk-table > * > tr > :nth-child(6) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.risk-table > * > tr > :nth-child(7) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.risk-table > * > tr > :nth-child(8) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.audit-table { width: 100% !important; min-width: 1060px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.audit-table > * > tr > :nth-child(1) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.audit-table > * > tr > :nth-child(2) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.audit-table > * > tr > :nth-child(3) { width: 130px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.audit-table > * > tr > :nth-child(4) { width: 120px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.audit-table > * > tr > :nth-child(5) { width: 170px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.audit-table > * > tr > :nth-child(6) { width: 150px !important; }

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-data-table { width: 100% !important; min-width: 1080px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-data-table > * > tr > :nth-child(1),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-data-table > * > tr > :nth-child(2) { width: 130px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-data-table > * > tr > :nth-child(3),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-data-table > * > tr > :nth-child(4),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-data-table > * > tr > :nth-child(6),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-data-table > * > tr > :nth-child(7) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-data-table > * > tr > :nth-child(5) { width: 130px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-data-table > * > tr > :nth-child(8) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-sync-log-table { width: 100% !important; min-width: 900px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-sync-log-table > * > tr > :nth-child(1) { width: 160px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-sync-log-table > * > tr > :nth-child(2) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-sync-log-table > * > tr > :nth-child(3) { width: 120px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-sync-log-table > * > tr > :nth-child(4) { width: 360px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.operation-sync-log-table > * > tr > :nth-child(5) { width: 150px !important; }

html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-archive-table { width: 100% !important; min-width: 950px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-archive-table > * > tr > :nth-child(1) { width: 220px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-archive-table > * > tr > :nth-child(2) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-archive-table > * > tr > :nth-child(3) { width: 170px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-archive-table > * > tr > :nth-child(4) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-archive-table > * > tr > :nth-child(5) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-archive-table > * > tr > :nth-child(6) { width: 130px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.dealer-material-list-table { width: 100% !important; min-width: 900px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.dealer-material-list-table > * > tr > :nth-child(1) { width: 220px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.dealer-material-list-table > * > tr > :nth-child(2) { width: 160px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.dealer-material-list-table > * > tr > :nth-child(3) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.dealer-material-list-table > * > tr > :nth-child(4) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.dealer-material-list-table > * > tr > :nth-child(5) { width: 220px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-table { width: 100% !important; min-width: 1020px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-table > * > tr > :nth-child(1) { width: 240px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-table > * > tr > :nth-child(2) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-table > * > tr > :nth-child(3) { width: 130px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-table > * > tr > :nth-child(4) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-table > * > tr > :nth-child(5) { width: 110px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-table > * > tr > :nth-child(6) { width: 220px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table { width: 100% !important; min-width: 1500px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table > * > tr > :nth-child(1) { width: 220px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table > * > tr > :nth-child(2) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table > * > tr > :nth-child(3),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table > * > tr > :nth-child(4) { width: 170px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table > * > tr > :nth-child(5) { width: 150px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table > * > tr > :nth-child(6) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table > * > tr > :nth-child(7) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table > * > tr > :nth-child(8) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table > * > tr > :nth-child(9) { width: 210px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.procurement-material-table > * > tr > :nth-child(10) { width: 170px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-line-table { width: 100% !important; min-width: 640px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-line-table > * > tr > :nth-child(1) { width: 170px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-line-table > * > tr > :nth-child(2) { width: 110px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-line-table > * > tr > :nth-child(3) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-line-table > * > tr > :nth-child(4) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-editor { width: 100% !important; min-width: 1100px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-editor > * > tr > :nth-child(1) { width: 240px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-editor > * > tr > :nth-child(2) { width: 180px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-editor > * > tr > :nth-child(3) { width: 130px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-editor > * > tr > :nth-child(4) { width: 140px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-editor > * > tr > :nth-child(5) { width: 110px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-editor > * > tr > :nth-child(6) { width: 220px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.design-material-editor > * > tr > :nth-child(7) { width: 80px !important; }

/* Keep action columns present and clickable while the user scrolls. */
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.supplier-table,
      table.inbound-table, table.contract-table, table.risk-table, table.org-members-table,
      table.account-table) tbody td:last-child,
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table tbody td:nth-child(16) {
  pointer-events: auto !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.supplier-table,
      table.inbound-table, table.contract-table, table.risk-table, table.org-members-table,
      table.account-table) :is(th:last-child, td:last-child),
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table :is(th:nth-child(16), td:nth-child(16)) {
  position: sticky !important;
  right: 0 !important;
  z-index: 2 !important;
  background: #fff !important;
  box-shadow: -6px 0 10px rgba(30, 48, 68, .06) !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.supplier-table,
      table.inbound-table, table.contract-table, table.risk-table, table.org-members-table,
      table.account-table) thead th:last-child,
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table thead th:nth-child(16) {
  background: var(--workbench-table-head) !important;
  z-index: 3 !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page table.order-table tbody td.order-record-more-cell {
  display: none !important;
}

/* Orders are record rows, but the facts share one measured rhythm instead of
 * expanding into a row of widely separated cards. */
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0 !important;
  padding: 0 !important;
  background: #fff !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row {
  display: grid !important;
  grid-template-columns: minmax(360px, 1.2fr) minmax(220px, .9fr) minmax(360px, 1fr) 196px !important;
  grid-template-areas: "main lines facts actions" !important;
  column-gap: 14px !important;
  row-gap: 8px !important;
  align-items: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--workbench-table-line) !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-main { grid-area: main !important; min-width: 0 !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-lines-cell { grid-area: lines !important; min-width: 0 !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-facts { grid-area: facts !important; min-width: 0 !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 6px 12px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-actions { grid-area: actions !important; min-width: 0 !important; display: flex !important; flex-wrap: wrap !important; justify-content: flex-end !important; gap: 6px !important; pointer-events: auto !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-image { width: 56px !important; height: 72px !important; flex: 0 0 56px !important; object-fit: cover !important; object-position: center !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-copy,
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-lines-cell,
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-fact { min-width: 0 !important; overflow-wrap: anywhere !important; word-break: break-word !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-fact > span { white-space: normal !important; }

@media (max-width: 1180px) {
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row {
    grid-template-columns: minmax(300px, 1.15fr) minmax(190px, .9fr) minmax(290px, 1fr) 170px !important;
    column-gap: 12px !important;
    padding: 11px 12px !important;
  }
}

@media (max-width: 760px) {
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
    :is(.table-wrap, .procurement-table-wrap, .procurement-material-scroll, .design-material-editor-wrap) {
    padding-bottom: 6px !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
    :is(table.product-workbench-table, table.procurement-workbench-table, table.order-table,
        table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
        table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
        table.risk-table, table.audit-table, table.operation-data-table,
        table.operation-sync-log-table, table.procurement-archive-table,
        table.dealer-material-list-table, table.design-material-table,
        table.procurement-material-table, table.order-line-table, table.design-material-editor)
    :is(thead th, tbody td) {
    padding: 8px 9px !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas: "main actions" "lines lines" "facts facts" !important;
    column-gap: 10px !important;
    row-gap: 9px !important;
    padding: 11px 12px !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-actions { justify-content: flex-end !important; }
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .operation-order-row .operation-order-facts { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* Empty-state tables should use the viewport width; there is nothing to scan. */
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  .table-wrap:has(> table > tbody > tr > td > .empty-state) > table {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Density terminal: wide screens must not redistribute unused viewport space
 * into every column. The table can grow when content requires it, while the
 * wrapper remains the only horizontal-scroll surface. */
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.order-table,
      table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
      table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
      table.risk-table, table.audit-table, table.operation-data-table,
      table.operation-sync-log-table, table.procurement-archive-table,
      table.dealer-material-list-table, table.design-material-table,
      table.procurement-material-table, table.order-line-table, table.design-material-editor) {
  width: max-content !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  .table-wrap:has(> table > tbody > tr > td > .empty-state) > table {
  width: 100% !important;
}

/* 商品中心是商品资料总览，不重复渲染各环节流程状态。 */
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.product-workbench-table[data-column-contract="catalog-9"] {
  width: max-content !important;
  min-width: 1320px !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.product-workbench-table[data-column-contract="catalog-9"] > * > tr > :nth-child(1) { width: 86px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.product-workbench-table[data-column-contract="catalog-9"] > * > tr > :nth-child(2) { width: 66px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.product-workbench-table[data-column-contract="catalog-9"] > * > tr > :nth-child(3) { width: 210px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.product-workbench-table[data-column-contract="catalog-9"] > * > tr > :nth-child(4) { width: 176px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.product-workbench-table[data-column-contract="catalog-9"] > * > tr > :nth-child(5) { width: 138px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.product-workbench-table[data-column-contract="catalog-9"] > * > tr > :nth-child(6) { width: 162px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.product-workbench-table[data-column-contract="catalog-9"] > * > tr > :nth-child(7) { width: 174px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.product-workbench-table[data-column-contract="catalog-9"] > * > tr > :nth-child(8) { width: 132px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.product-workbench-table[data-column-contract="catalog-9"] > * > tr > :nth-child(9) { width: 176px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  .table-wrap:has(> table.product-workbench-table[data-column-contract="catalog-9"] > tbody > tr > td > .empty-state) > table {
  width: 100% !important;
  min-width: 0 !important;
}

/* END frontend/assets/workbench-spacing-final.css */

/* BEGIN frontend/assets/legal-footer-single-row.css */
/* legal-footer-single-row=20260904-r1
 * Keep the legal footer as one centered information row. On narrow viewports,
 * the footer itself becomes the scroll boundary so labels never overlap or
 * force the workspace page wider than the viewport.
 */
body:has(.app-shell.auth-mode) .workspace-legal-footer,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer {
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  flex-wrap:nowrap !important;
  gap:24px !important;
  min-height:0 !important;
  width:100% !important;
  box-sizing:border-box !important;
  padding:14px 24px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  white-space:nowrap !important;
  text-align:center !important;
  overscroll-behavior-inline:contain !important;
  scrollbar-width:thin;
}

body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-copy,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-copy,
body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-meta,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-meta {
  display:flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  justify-content:center !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  width:auto !important;
  min-width:max-content !important;
  padding-top:0 !important;
  border-top:0 !important;
  gap:5px 14px !important;
}

body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-trust,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-trust,
body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-links,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-links {
  display:flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  justify-content:center !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  width:auto !important;
  min-width:max-content !important;
  gap:8px 16px !important;
}

body:has(.app-shell.auth-mode) .workspace-legal-footer .platform-legal-links,
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer .platform-legal-links {
  padding-left:18px !important;
  border-left:1px solid var(--ui-line, var(--ledger-line)) !important;
}

body:has(.app-shell.auth-mode) .workspace-legal-footer :is(.platform-legal-copy strong,.platform-legal-copy span,.platform-trust-item,.platform-legal-meta a),
body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer :is(.platform-legal-copy strong,.platform-legal-copy span,.platform-trust-item,.platform-legal-meta a) {
  white-space:nowrap !important;
}

@media (max-width:720px) {
  body:has(.app-shell.auth-mode) .workspace-legal-footer,
  body:has(.app-shell:not(.auth-mode):not(.is-booting)) .workspace-legal-footer {
    justify-content:flex-start !important;
    gap:18px !important;
    padding-inline:16px !important;
  }
}

/* END frontend/assets/legal-footer-single-row.css */

/* BEGIN frontend/assets/table-scroll-no-sticky-action.css */
/* table-scroll-no-sticky-action=20260904-r1
 * Action columns belong to the same horizontal ledger as the business fields.
 * Keep them clickable, but let them scroll with the table instead of covering
 * the final visible fields as a frozen right rail.
 */
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.supplier-table,
      table.inbound-table, table.contract-table, table.risk-table, table.org-members-table,
      table.account-table, table.product-table) :is(th:last-child, td:last-child),
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-table, table.data-table) :is(th[data-label="操作"], td[data-label="操作"], th.action-cell, td.action-cell,
      th.product-actions-cell, td.product-actions-cell, th:has(.row-actions), td:has(.row-actions)),
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-table :is(th:nth-child(16), td:nth-child(16)),
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.procurement-workbench-table :is(th:nth-child(8), td:nth-child(8)),
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.procurement-workbench-table :is(th:nth-child(12), td:nth-child(12)) {
  position:static !important;
  inset-inline-end:auto !important;
  right:auto !important;
  z-index:auto !important;
  box-shadow:none !important;
  border-left:0 !important;
}

html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.supplier-table,
      table.inbound-table, table.contract-table, table.risk-table, table.org-members-table,
      table.account-table, table.product-table) thead th:last-child,
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-table, table.data-table) thead :is(th[data-label="操作"], th.action-cell, th.product-actions-cell,
      th:has(.row-actions)),
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.order-table thead th:nth-child(16),
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.procurement-workbench-table thead :is(th:nth-child(8), th:nth-child(12)) {
  z-index:auto !important;
  box-shadow:none !important;
  border-left:0 !important;
}

@media (max-width:760px) {
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    :is(table.product-workbench-table, table.procurement-workbench-table, table.supplier-table,
        table.inbound-table, table.contract-table, table.risk-table, table.org-members-table,
        table.account-table, table.product-table) :is(th:last-child, td:last-child),
    html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
      :is(table.product-table, table.data-table) :is(th[data-label="操作"], td[data-label="操作"], th.action-cell, td.action-cell,
          th.product-actions-cell, td.product-actions-cell, th:has(.row-actions), td:has(.row-actions)),
    html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
      table.order-table :is(th:nth-child(16), td:nth-child(16)),
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.procurement-workbench-table :is(th:nth-child(8), td:nth-child(8)),
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.procurement-workbench-table :is(th:nth-child(12), td:nth-child(12)) {
    position:static !important;
    inset-inline-end:auto !important;
    right:auto !important;
    z-index:auto !important;
    box-shadow:none !important;
    border-left:0 !important;
  }
}

/* END frontend/assets/table-scroll-no-sticky-action.css */
}

@layer ui-current {
/* BEGIN frontend/assets/ui-current.css */
/*
 * 唯一可编辑的主界面样式源。
 *
 * 现有历史样式已冻结到 ui-legacy 级联层。新界面需求只能写在本文件，
 * 每条规则必须限定组件或页面作用域，并在迁移期使用 !important。
 * 构建后的 ui-current 层在重要声明级联中高于整个历史层，因此旧选择器
 * 无论加载顺序或权重多高，都不能再次覆盖这里的明确需求。
 *
 * 规则迁移完成后，按组件删除历史实现，再把该组件切回普通声明。
 */

/* shell-scroll-containment=20260904-r1
 * The document owns vertical scrolling. A historical overflow-x rule turned
 * the shell/workspace into nested scroll containers, so the sticky rail moved
 * away from the viewport and exposed the light page surface beside it. Keep
 * horizontal scrolling local to table wrappers instead. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) {
  position: relative !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
  isolation: isolate !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar {
  position: fixed !important;
  inset: 0 auto 0 0 !important;
  align-self: stretch !important;
  z-index: 40 !important;
  display: flex !important;
  flex-direction: column !important;
  width: var(--shell-sidebar-width, 220px) !important;
  min-width: var(--shell-sidebar-width, 220px) !important;
  height: 100vh !important;
  min-height: 100vh !important;
  max-height: 100vh !important;
  overflow: hidden !important;
  opacity: 1 !important;
  background: #e9eaf5 !important;
  isolation: isolate !important;
  box-shadow: 8px 0 20px rgba(15, 23, 42, .08) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  scrollbar-color: #b7bbd0 #e9eaf5 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav::-webkit-scrollbar {
  width: 6px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav::-webkit-scrollbar-track {
  background: #e9eaf5 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav::-webkit-scrollbar-thumb {
  border: 1px solid #e9eaf5 !important;
  border-radius: 5px !important;
  background: #b7bbd0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace {
  grid-column: 2 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.topbar, .workbench-switcher, .workspace-tabs, #page, .page, #platformLegalFooter) {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) {
    display: block !important;
    width: 100% !important;
    min-height: 100vh !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar {
    position: fixed !important;
    inset: auto 0 0 !important;
    width: 100vw !important;
    min-width: 0 !important;
    max-width: 100vw !important;
    height: calc(60px + env(safe-area-inset-bottom)) !important;
    min-height: calc(60px + env(safe-area-inset-bottom)) !important;
    max-height: calc(60px + env(safe-area-inset-bottom)) !important;
    padding-bottom: env(safe-area-inset-bottom) !important;
    border-right: 0 !important;
    border-top: 1px solid #d9dcea !important;
    box-shadow: 0 -8px 22px rgba(15, 23, 42, .12) !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav {
    flex: 1 1 auto !important;
    width: 100% !important;
    height: 60px !important;
    padding: 4px 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .nav::-webkit-scrollbar {
    display: none !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace {
    grid-column: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    padding-bottom: calc(60px + env(safe-area-inset-bottom)) !important;
  }
}

/* Warehouse domains: dense operational surfaces with contained tables. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse {
  display: grid !important;
  min-width: 0 !important;
  gap: 14px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-header > div {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-header h2 {
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1.25 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-tabs {
  display: flex !important;
  gap: 4px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  padding-bottom: 2px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-tabs button {
  flex: 0 0 auto !important;
  min-height: 34px !important;
  padding: 6px 10px !important;
  border-color: transparent !important;
  background: transparent !important;
  color: #5d6975 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-tabs button[aria-current="page"] {
  border-color: #bcc8d4 !important;
  background: #f3f6f8 !important;
  color: #18222c !important;
  font-weight: 700 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-summary {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  border: 1px solid #d9e0e6 !important;
  border-radius: 6px !important;
  background: #fff !important;
  overflow: hidden !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-summary > div {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
  padding: 12px 14px !important;
  border-right: 1px solid #e4e9ed !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-summary > div:last-child {
  border-right: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-summary span {
  color: #6f7b86 !important;
  font-size: 12px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-summary strong {
  color: #17212b !important;
  font-size: 22px !important;
  font-variant-numeric: tabular-nums !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-search {
  display: grid !important;
  grid-template-columns: auto minmax(220px, 420px) !important;
  align-items: center !important;
  justify-content: end !important;
  gap: 8px !important;
  color: #68747f !important;
  font-size: 12px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-table-scroll {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: auto !important;
  border: 1px solid #d9e0e6 !important;
  border-radius: 6px !important;
  background: #fff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-table {
  width: 100% !important;
  min-width: 820px !important;
  border-collapse: collapse !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-table :is(th, td) {
  padding: 10px 12px !important;
  border-bottom: 1px solid #e5e9ed !important;
  vertical-align: top !important;
  text-align: left !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-table th {
  background: #f6f8fa !important;
  color: #53606c !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-table td {
  color: #26323d !important;
  font-size: 13px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-table td :is(strong, small) {
  display: block !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-table td small {
  margin-top: 3px !important;
  color: #788590 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-status {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  padding: 2px 7px !important;
  border: 1px solid #ccd5dd !important;
  border-radius: 999px !important;
  background: #f6f8fa !important;
  color: #53606c !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-status.green {
  border-color: #b8d8c5 !important;
  background: #eef8f1 !important;
  color: #2c6a43 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-status.orange {
  border-color: #e5d0a7 !important;
  background: #fff8e8 !important;
  color: #825b17 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-status.blue {
  border-color: #b8cfdf !important;
  background: #eef6fb !important;
  color: #2b617f !important;
}
html body.workspace-mode .sample-warehouse-dialog {
  width: min(680px, calc(100vw - 24px)) !important;
  max-height: calc(100dvh - 24px) !important;
  padding: 0 !important;
  border: 1px solid #cfd8df !important;
  border-radius: 6px !important;
}
html body.workspace-mode .sample-warehouse-dialog form {
  display: grid !important;
  gap: 14px !important;
  padding: 18px !important;
}
html body.workspace-mode .sample-warehouse-dialog header,
html body.workspace-mode .sample-warehouse-dialog footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}
html body.workspace-mode .sample-warehouse-dialog [data-sw-fields] {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  min-width: 0 !important;
}
html body.workspace-mode .sample-warehouse-dialog [data-sw-fields] label {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
  color: #596672 !important;
  font-size: 12px !important;
}
html body.workspace-mode .sample-warehouse-dialog :is(input, select, textarea) {
  width: 100% !important;
  min-width: 0 !important;
}
@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-header {
    align-items: stretch !important;
    flex-direction: column !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-summary > div {
    border-bottom: 1px solid #e4e9ed !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .sample-warehouse-search {
    grid-template-columns: 1fr !important;
    justify-content: stretch !important;
  }
  html body.workspace-mode .sample-warehouse-dialog [data-sw-fields] {
    grid-template-columns: 1fr !important;
  }
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain {
  display: grid !important;
  min-width: 0 !important;
  gap: 14px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-header > div {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-header h2 {
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1.25 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-tabs {
  display: flex !important;
  gap: 4px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  padding-bottom: 2px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-tabs button {
  flex: 0 0 auto !important;
  min-height: 34px !important;
  padding: 6px 10px !important;
  border-color: transparent !important;
  background: transparent !important;
  color: #5d6975 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-tabs button[aria-current="page"] {
  border-color: #bcc8d4 !important;
  background: #f3f6f8 !important;
  color: #18222c !important;
  font-weight: 700 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-summary {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  overflow: hidden !important;
  border: 1px solid #d9e0e6 !important;
  border-radius: 6px !important;
  background: #fff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-summary > div {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
  padding: 12px 14px !important;
  border-right: 1px solid #e4e9ed !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-summary > div:last-child {
  border-right: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-summary span {
  color: #6f7b86 !important;
  font-size: 12px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-summary strong {
  color: #17212b !important;
  font-size: 22px !important;
  font-variant-numeric: tabular-nums !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-search {
  display: grid !important;
  grid-template-columns: auto minmax(220px, 420px) !important;
  align-items: center !important;
  justify-content: end !important;
  gap: 8px !important;
  color: #68747f !important;
  font-size: 12px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-table-scroll {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: auto !important;
  border: 1px solid #d9e0e6 !important;
  border-radius: 6px !important;
  background: #fff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-table-scroll table {
  width: 100% !important;
  min-width: 820px !important;
  border-collapse: collapse !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-table-scroll :is(th, td) {
  padding: 10px 12px !important;
  border-bottom: 1px solid #e5e9ed !important;
  vertical-align: top !important;
  text-align: left !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-table-scroll th {
  background: #f6f8fa !important;
  color: #53606c !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-table-scroll td {
  color: #26323d !important;
  font-size: 13px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-table-scroll td :is(strong, small) {
  display: block !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-table-scroll td small {
  margin-top: 3px !important;
  color: #788590 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-status {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  padding: 2px 7px !important;
  border: 1px solid #ccd5dd !important;
  border-radius: 999px !important;
  background: #f6f8fa !important;
  color: #53606c !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}
html body.workspace-mode .warehouse-domain-dialog {
  width: min(720px, calc(100vw - 24px)) !important;
  max-height: calc(100dvh - 24px) !important;
  padding: 0 !important;
  overflow: auto !important;
  border: 1px solid #cfd8df !important;
  border-radius: 6px !important;
}
html body.workspace-mode .warehouse-domain-dialog form {
  display: grid !important;
  gap: 14px !important;
  padding: 18px !important;
}
html body.workspace-mode .warehouse-domain-dialog :is(header, footer) {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}
html body.workspace-mode .warehouse-domain-fields {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  min-width: 0 !important;
}
html body.workspace-mode .warehouse-domain-fields label {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
  color: #596672 !important;
  font-size: 12px !important;
}
html body.workspace-mode .warehouse-domain-fields :is(input, select, textarea) {
  width: 100% !important;
  min-width: 0 !important;
}
html body.workspace-mode .warehouse-domain-fields textarea {
  min-height: 92px !important;
  resize: vertical !important;
}
@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-header {
    align-items: stretch !important;
    flex-direction: column !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-summary > div {
    border-bottom: 1px solid #e4e9ed !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .warehouse-domain-search {
    grid-template-columns: 1fr !important;
    justify-content: stretch !important;
  }
  html body.workspace-mode .warehouse-domain-fields {
    grid-template-columns: 1fr !important;
  }
}

/* Standard technical package: one product fact set, versioned and locked for traceability. */
body.workspace-mode .standard-package-center .toolbar {
  display: grid !important;
  grid-template-columns: minmax(240px, 1fr) 180px auto auto !important;
  gap: 10px !important;
}
body.workspace-mode .standard-package-table { min-width: 1120px !important; }
body.workspace-mode .standard-package-table td > small,
body.workspace-mode .standard-package-table td > strong { display: block !important; }
body.workspace-mode .standard-package-table td > small { margin-top: 4px !important; color: var(--muted) !important; }
body.workspace-mode .standard-package-style { display: flex !important; align-items: center !important; gap: 10px !important; min-width: 190px !important; }
body.workspace-mode .standard-package-style img { width: 46px !important; height: 58px !important; flex: 0 0 auto !important; object-fit: cover !important; border: 1px solid var(--line) !important; border-radius: 4px !important; background: #f5f7fa !important; }
body.workspace-mode .standard-package-style span { display: grid !important; min-width: 0 !important; gap: 3px !important; }
#createDialog:has(> .standard-package-dialog) {
  width: min(1680px, calc(100vw - 24px)) !important;
  max-height: calc(100dvh - 24px) !important;
  padding: 0 !important;
  overflow: hidden !important;
}
#createDialog > .standard-package-dialog {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  width: 100% !important;
  height: min(900px, calc(100dvh - 26px)) !important;
  max-width: none !important;
  min-width: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
body.workspace-mode .standard-package-dialog-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid var(--line) !important;
  background: #fff !important;
}
body.workspace-mode .standard-package-identity { display: flex !important; align-items: center !important; gap: 12px !important; min-width: 0 !important; }
body.workspace-mode .standard-package-identity h2 { margin: 1px 0 0 !important; font-size: 20px !important; letter-spacing: 0 !important; }
body.workspace-mode .standard-package-identity h2 span { color: var(--muted) !important; font-size: 13px !important; font-weight: 600 !important; }
body.workspace-mode .standard-package-identity small { color: var(--muted) !important; }
body.workspace-mode .standard-package-head-actions { display: flex !important; align-items: center !important; gap: 8px !important; flex: 0 0 auto !important; }
body.workspace-mode .standard-package-head-actions .close { position: static !important; }
body.workspace-mode .standard-package-workspace {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 320px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}
body.workspace-mode .standard-package-document {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
body.workspace-mode .standard-package-tabs {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  border-bottom: 1px solid var(--line) !important;
  background: #f8fafc !important;
}
body.workspace-mode .standard-package-tabs button {
  display: inline-flex !important;
  flex: 1 0 94px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 94px !important;
  min-height: 46px !important;
  padding: 9px 8px !important;
  border: 0 !important;
  border-right: 1px solid var(--line) !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--muted) !important;
  white-space: nowrap !important;
}
body.workspace-mode .standard-package-tabs button[aria-selected="true"] { border-bottom-color: #1769aa !important; background: #fff !important; color: #11466f !important; font-weight: 800 !important; }
body.workspace-mode .standard-package-tabs button svg { width: 14px !important; height: 14px !important; }
body.workspace-mode .standard-package-tabs button b { display: inline-grid !important; place-items: center !important; width: 16px !important; height: 16px !important; border-radius: 50% !important; background: #fff0d6 !important; color: #9b5b00 !important; font-size: 10px !important; }
body.workspace-mode .standard-package-panels { min-width: 0 !important; min-height: 0 !important; padding: 16px 18px !important; overflow: auto !important; background: #fff !important; }
body.workspace-mode .standard-package-panels > section { min-width: 0 !important; }
body.workspace-mode .standard-package-rail {
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: auto !important;
  border-left: 1px solid var(--line) !important;
  background: #f8fafc !important;
}
body.workspace-mode .standard-package-rail-visual {
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 16px !important;
  border-bottom: 1px solid var(--line) !important;
  background: #fff !important;
}
body.workspace-mode .standard-package-rail-visual > img {
  width: 112px !important;
  height: 140px !important;
  object-fit: contain !important;
  border: 1px solid var(--line) !important;
  border-radius: 4px !important;
  background: #f5f7fa !important;
}
body.workspace-mode .standard-package-rail-visual > div { display: grid !important; gap: 4px !important; min-width: 0 !important; }
body.workspace-mode .standard-package-rail-visual span,
body.workspace-mode .standard-package-rail-visual small { color: var(--muted) !important; font-size: 12px !important; }
body.workspace-mode .standard-package-rail-visual strong { overflow-wrap: anywhere !important; font-size: 18px !important; }
body.workspace-mode .standard-package-rail-section { padding: 14px 16px !important; border-bottom: 1px solid var(--line) !important; }
body.workspace-mode .standard-package-rail-section h3 { margin: 0 0 10px !important; font-size: 13px !important; }
body.workspace-mode .standard-package-rail-section dl { display: grid !important; gap: 0 !important; margin: 0 !important; }
body.workspace-mode .standard-package-rail-section dl > div {
  display: grid !important;
  grid-template-columns: 86px minmax(0, 1fr) !important;
  gap: 10px !important;
  padding: 7px 0 !important;
  border-bottom: 1px solid #e8edf2 !important;
}
body.workspace-mode .standard-package-rail-section dl > div:last-child { border-bottom: 0 !important; }
body.workspace-mode .standard-package-rail-section dt { color: var(--muted) !important; font-size: 12px !important; }
body.workspace-mode .standard-package-rail-section dd { min-width: 0 !important; margin: 0 !important; overflow-wrap: anywhere !important; font-size: 12px !important; font-weight: 650 !important; }
body.workspace-mode .standard-package-rail-section dd small { display: block !important; margin-top: 3px !important; color: var(--muted) !important; font-weight: 400 !important; }
body.workspace-mode .standard-package-rail-title { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; }
body.workspace-mode .standard-package-rail-title h3 { margin-bottom: 0 !important; }
body.workspace-mode .standard-package-rail-title strong { color: #1769aa !important; font-size: 14px !important; }
body.workspace-mode .standard-package-checklist { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px 10px !important; margin-top: 11px !important; }
body.workspace-mode .standard-package-checklist span { display: flex !important; align-items: center !important; gap: 6px !important; min-width: 0 !important; color: var(--muted) !important; font-size: 11px !important; }
body.workspace-mode .standard-package-checklist svg { width: 14px !important; height: 14px !important; flex: 0 0 auto !important; }
body.workspace-mode .standard-package-checklist .is-ready svg { color: #2f7d55 !important; }
body.workspace-mode .standard-package-checklist .is-missing { color: #8a5a11 !important; }
body.workspace-mode .standard-package-checklist .is-missing svg { color: #b57618 !important; }
body.workspace-mode .standard-package-wide { max-width: 100% !important; overflow: auto !important; }
body.workspace-mode .standard-package-wide table { min-width: 1040px !important; }
body.workspace-mode .standard-package-gallery { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important; gap: 12px !important; }
body.workspace-mode .standard-package-gallery > img { width: 100% !important; aspect-ratio: 4 / 5 !important; object-fit: cover !important; border: 1px solid var(--line) !important; border-radius: 6px !important; background: #f5f7fa !important; }
body.workspace-mode .standard-package-attachments { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: 14px !important; }
body.workspace-mode .standard-package-attachments span { display: inline-flex !important; align-items: center !important; gap: 6px !important; padding: 7px 9px !important; border: 1px solid var(--line) !important; border-radius: 4px !important; }
body.workspace-mode .standard-package-instruction-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; border: 1px solid var(--line) !important; }
body.workspace-mode .standard-package-instruction-grid > div { display: grid !important; gap: 5px !important; min-height: 78px !important; padding: 12px 14px !important; border-right: 1px solid var(--line) !important; border-bottom: 1px solid var(--line) !important; }
body.workspace-mode .standard-package-instruction-grid > div:nth-child(2n) { border-right: 0 !important; }
body.workspace-mode .standard-package-instruction-grid span { color: var(--muted) !important; font-size: 12px !important; }
body.workspace-mode .standard-package-instruction-grid strong { white-space: pre-wrap !important; overflow-wrap: anywhere !important; }
body.workspace-mode .standard-package-source-line { display: flex !important; align-items: center !important; gap: 12px !important; margin-bottom: 12px !important; }
body.workspace-mode .standard-package-inline-editor { display: grid !important; gap: 7px !important; margin-top: 14px !important; color: var(--muted) !important; font-size: 12px !important; }
body.workspace-mode .standard-package-inline-editor textarea { width: 100% !important; min-height: 116px !important; font: 13px/1.6 ui-monospace, SFMono-Regular, Menlo, monospace !important; }
body.workspace-mode .standard-package-price-summary { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; margin-bottom: 14px !important; border: 1px solid var(--line) !important; }
body.workspace-mode .standard-package-price-summary span { display: grid !important; gap: 6px !important; padding: 13px 15px !important; border-right: 1px solid var(--line) !important; color: var(--muted) !important; }
body.workspace-mode .standard-package-price-summary span:last-child { border-right: 0 !important; }
body.workspace-mode .standard-package-price-summary strong { color: var(--ink) !important; font-size: 18px !important; }
body.workspace-mode .standard-package-node-list { display: grid !important; gap: 0 !important; border: 1px solid var(--line) !important; }
body.workspace-mode .standard-package-node-list article { display: grid !important; grid-template-columns: 44px minmax(0, 1fr) auto !important; align-items: center !important; gap: 12px !important; min-height: 72px !important; padding: 10px 14px !important; border-bottom: 1px solid var(--line) !important; }
body.workspace-mode .standard-package-node-list article:last-child { border-bottom: 0 !important; }
body.workspace-mode .standard-package-node-list article > b { color: #1769aa !important; font-size: 18px !important; }
body.workspace-mode .standard-package-node-list article > div { display: grid !important; gap: 3px !important; }
body.workspace-mode .standard-package-node-list article span,
body.workspace-mode .standard-package-node-list article small { color: var(--muted) !important; }
body.workspace-mode .standard-package-history { display: grid !important; gap: 8px !important; max-width: 760px !important; margin: 0 auto !important; }
body.workspace-mode .standard-package-history button { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 20px !important; min-height: 52px !important; text-align: left !important; }
body.workspace-mode .standard-package-history button span { color: var(--muted) !important; font-size: 12px !important; }
body.workspace-mode .standard-package-footer { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(160px, 320px) auto !important; align-items: center !important; gap: 14px !important; padding: 12px 18px !important; border-top: 1px solid var(--line) !important; background: #f8fafc !important; }
body.workspace-mode .standard-package-footer > div { display: flex !important; flex-wrap: wrap !important; gap: 8px 18px !important; }
body.workspace-mode .standard-package-footer > div:first-child span { color: var(--muted) !important; font-size: 11px !important; }
body.workspace-mode .standard-package-footer > div:last-child { justify-content: flex-end !important; }
body.workspace-mode .standard-package-footer [data-package-feedback] { margin: 0 !important; min-height: 0 !important; text-align: center !important; }
@media (max-width: 900px) {
  body.workspace-mode .standard-package-workspace { display: flex !important; flex-direction: column !important; overflow: auto !important; }
  body.workspace-mode .standard-package-document { display: block !important; overflow: visible !important; }
  body.workspace-mode .standard-package-rail { order: -1 !important; display: grid !important; grid-template-columns: 84px minmax(0, 1fr) auto !important; align-items: stretch !important; overflow: visible !important; border-left: 0 !important; border-bottom: 1px solid var(--line) !important; }
  body.workspace-mode .standard-package-rail-visual { grid-template-columns: 72px !important; padding: 10px 12px !important; border-bottom: 0 !important; }
  body.workspace-mode .standard-package-rail-visual > img { width: 72px !important; height: 88px !important; }
  body.workspace-mode .standard-package-rail-visual > div { display: none !important; }
  body.workspace-mode .standard-package-rail-section { padding: 10px 12px !important; border-bottom: 0 !important; border-left: 1px solid var(--line) !important; }
  body.workspace-mode .standard-package-rail-section:first-of-type dl { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; column-gap: 14px !important; }
  body.workspace-mode .standard-package-rail-section:first-of-type dl > div { grid-template-columns: 68px minmax(0, 1fr) !important; padding: 4px 0 !important; }
  body.workspace-mode .standard-package-rail-section--completeness { min-width: 104px !important; }
  body.workspace-mode .standard-package-rail-section--completeness .standard-package-checklist,
  body.workspace-mode .standard-package-rail-section--source,
  body.workspace-mode .standard-package-rail-section--audit { display: none !important; }
  body.workspace-mode .standard-package-panels { overflow: visible !important; }
}
@media (max-width: 760px) {
  body.workspace-mode .standard-package-center .toolbar { grid-template-columns: 1fr !important; }
  #createDialog:has(> .standard-package-dialog) { width: calc(100vw - 12px) !important; max-height: calc(100dvh - 12px) !important; }
  #createDialog > .standard-package-dialog { height: calc(100dvh - 14px) !important; }
  body.workspace-mode .standard-package-dialog-head { align-items: flex-start !important; padding: 10px 12px !important; }
  body.workspace-mode .standard-package-identity h2 { font-size: 16px !important; }
  body.workspace-mode .standard-package-head-actions > .status-tag,
  body.workspace-mode .standard-package-head-actions > [data-package-history],
  body.workspace-mode .standard-package-head-actions > [data-package-new-version] { display: none !important; }
  body.workspace-mode .standard-package-tabs button { flex: 0 0 102px !important; min-width: 102px !important; min-height: 42px !important; padding: 8px 10px !important; }
  body.workspace-mode .standard-package-rail { grid-template-columns: 72px minmax(0, 1fr) !important; }
  body.workspace-mode .standard-package-rail-visual { grid-template-columns: 60px !important; padding: 8px 6px 8px 10px !important; }
  body.workspace-mode .standard-package-rail-visual > img { width: 60px !important; height: 74px !important; }
  body.workspace-mode .standard-package-rail-section { padding: 8px 10px !important; }
  body.workspace-mode .standard-package-rail-section:first-of-type dl { grid-template-columns: 1fr !important; }
  body.workspace-mode .standard-package-rail-section:first-of-type dl > div:nth-child(n+4) { display: none !important; }
  body.workspace-mode .standard-package-rail-section--completeness { display: none !important; }
  body.workspace-mode .standard-package-panels { padding: 12px !important; }
  body.workspace-mode .standard-package-instruction-grid { grid-template-columns: 1fr !important; }
  body.workspace-mode .standard-package-instruction-grid > div { border-right: 0 !important; }
  body.workspace-mode .standard-package-price-summary { grid-template-columns: 1fr !important; }
  body.workspace-mode .standard-package-price-summary span { border-right: 0 !important; border-bottom: 1px solid var(--line) !important; }
  body.workspace-mode .standard-package-price-summary span:last-child { border-bottom: 0 !important; }
  body.workspace-mode .standard-package-footer { grid-template-columns: 1fr !important; padding: 10px 12px !important; }
  body.workspace-mode .standard-package-footer > div:first-child { display: none !important; }
  body.workspace-mode .standard-package-footer > div:last-child { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 6px !important; }
  body.workspace-mode .standard-package-footer button { width: 100% !important; min-width: 0 !important; padding-inline: 6px !important; }
}

/* workbench-detail-mobile-image-seal=20260905-r1
 * The legacy mobile layer narrows the image block to the first grid track,
 * which makes its heading unreadable on narrow screens. Keep the image block
 * as a full-width sub-grid with a stable thumbnail and a readable text rail. */
@media (max-width: 760px) {
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: 96px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    column-gap: 10px !important;
    row-gap: 5px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    overflow: visible !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .image-block-head {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 6px !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    overflow: visible !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .detail-image-frame {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 96px !important;
    max-width: 96px !important;
    height: 122px !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .detail-image-frame > .detail-image {
    width: 94px !important;
    max-width: 94px !important;
    height: 120px !important;
    object-fit: cover !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .image-permission-note {
    grid-column: 2 !important;
    grid-row: 2 !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    overflow-wrap: anywhere !important;
    line-height: 1.35 !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .detail-image-drop {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: 96px minmax(0, 1fr) !important;
    column-gap: 10px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .detail-image-drop > .detail-image-frame {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .detail-image-drop > .image-drop-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .detail-image-drop > .image-drop-copy strong,
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .detail-image-drop > .image-drop-copy small {
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
}

@media (max-width: 420px) {
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block {
    grid-template-columns: 88px minmax(0, 1fr) !important;
    column-gap: 10px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .detail-image-frame {
    width: 88px !important;
    max-width: 88px !important;
    height: 112px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .detail-image-frame > .detail-image {
    width: 86px !important;
    max-width: 86px !important;
    height: 110px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .details > .detail-top > .image-block > .detail-image-drop {
    grid-template-columns: 88px minmax(0, 1fr) !important;
  }
}

/* workbench-detail-context=20260905-r1
 * A single cascade for the refreshed workbench surfaces. The dialog exposes
 * only the current scope from app.js; this layer gives every scope the same
 * paper, rhythm and density so the page reads as one workspace. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  > :is(.toolbar, .panel, .product-workbench-panel, .work-filter-bar, .dashboard-hero) {
  border: 1px solid #dbe3ea !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  box-shadow: 0 8px 24px rgba(35, 55, 74, .05) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  > :is(.toolbar, .work-filter-bar) {
  margin-bottom: 12px !important;
  padding: 16px 18px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  > :is(.panel, .product-workbench-panel) {
  margin-bottom: 12px !important;
  overflow: visible !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  > :is(.panel, .product-workbench-panel) > :is(.panel-head, .product-list-head) {
  min-height: 56px !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid #e5ebf0 !important;
  background: #fbfcfd !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  > :is(.panel, .product-workbench-panel) > :is(.panel-head, .product-list-head) h3 {
  margin: 0 !important;
  color: #1d2b38 !important;
  font-size: 16px !important;
  line-height: 1.35 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  > :is(.panel, .product-workbench-panel) > :is(.panel-head, .product-list-head) .subtle {
  display: block !important;
  margin-top: 3px !important;
  color: #637487 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  > :is(.panel, .product-workbench-panel) > .table-wrap {
  border: 0 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
}

body.workspace-mode dialog:has(> .dialog-inner.product-detail-shell) {
  width: min(1180px, calc(100vw - 32px)) !important;
  max-width: min(1180px, calc(100vw - 32px)) !important;
  max-height: calc(100vh - 28px) !important;
  padding: 0 !important;
  border: 1px solid #cfdbe5 !important;
  border-radius: 8px !important;
  background: #f6f9fb !important;
  box-shadow: 0 24px 70px rgba(24, 44, 61, .22) !important;
  overflow: hidden !important;
}
body.workspace-mode dialog:has(> .dialog-inner.product-detail-shell)::backdrop {
  background: rgba(28, 47, 64, .38) !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  background: #f6f9fb !important;
  color: #1f2e3a !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell > .dialog-head {
  position: sticky !important;
  top: 0 !important;
  z-index: 4 !important;
  min-height: 68px !important;
  padding: 14px 22px !important;
  border-bottom: 1px solid #dbe4eb !important;
  background: rgba(255, 255, 255, .97) !important;
  backdrop-filter: blur(8px) !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell > .dialog-head h2 {
  margin: 0 !important;
  color: #172532 !important;
  font-size: 22px !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell > .dialog-head .eyebrow {
  margin: 0 0 4px !important;
  color: #6a7d8f !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .details {
  display: block !important;
  padding: 0 !important;
  background: #f6f9fb !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-top {
  display: grid !important;
  grid-template-columns: 144px minmax(0, 1fr) minmax(190px, 250px) !important;
  gap: 18px !important;
  align-items: start !important;
  padding: 18px 22px !important;
  border-bottom: 1px solid #dfe7ed !important;
  background: #ffffff !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-image-frame {
  width: 128px !important;
  height: 160px !important;
  border: 1px solid #d2dee8 !important;
  border-radius: 5px !important;
  background: #eef3f7 !important;
  overflow: hidden !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-image-frame img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-title {
  margin: 2px 0 9px !important;
  color: #263949 !important;
  font-size: 19px !important;
  line-height: 1.3 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  margin: 0 0 10px !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-top .subtle {
  margin: 4px 0 0 !important;
  color: #647688 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding-top: 2px !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-nav {
  display: flex !important;
  gap: 6px !important;
  padding: 10px 22px !important;
  border-bottom: 1px solid #dfe7ed !important;
  background: #f0f4f7 !important;
  overflow-x: auto !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-nav-item {
  flex: 0 0 auto !important;
  min-height: 30px !important;
  padding: 5px 10px !important;
  border: 1px solid #cbd8e2 !important;
  border-radius: 4px !important;
  background: #ffffff !important;
  color: #52687a !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-nav-item.is-active {
  border-color: #2f6fa7 !important;
  background: #2f6fa7 !important;
  color: #ffffff !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module {
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #dfe7ed !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-head {
  display: flex !important;
  align-items: center !important;
  min-height: 54px !important;
  padding: 11px 22px !important;
  border-bottom: 1px solid #e4ebf0 !important;
  background: #f8fafb !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-index {
  display: none !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-head h3 {
  margin: 0 !important;
  color: #223544 !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-head p {
  margin: 3px 0 0 !important;
  color: #6a7d8f !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-content {
  display: block !important;
  padding: 0 22px !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-content > :is(section, .section-heading, .sku-grid, .detail-focus-section) {
  margin: 0 !important;
  padding: 16px 0 !important;
  border-bottom: 1px solid #edf1f4 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-content > :last-child {
  border-bottom: 0 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-current-context {
  margin: 0 !important;
  padding: 15px 22px !important;
  border-bottom: 1px solid #dfe7ed !important;
  background: #edf4f8 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-current-context .section-heading {
  margin: 0 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-current-context .workbench-lifecycle-inline {
  display: grid !important;
  grid-template-columns: minmax(120px, .5fr) minmax(0, 1fr) !important;
  gap: 3px 16px !important;
  padding: 10px 12px !important;
  border: 1px solid #cfdee8 !important;
  border-radius: 5px !important;
  background: #ffffff !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-current-context .workbench-lifecycle-inline-head {
  grid-column: 1 / -1 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-current-context .workbench-lifecycle-next {
  display: block !important;
  margin-top: 7px !important;
  color: #486274 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-fields-empty {
  padding: 12px 0 !important;
  color: #728394 !important;
  font-size: 12px !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-focus-section .fields {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px 12px !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-focus-section .field {
  min-width: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid #e0e8ee !important;
  border-radius: 4px !important;
  background: #ffffff !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-focus-section .field label {
  display: block !important;
  margin-bottom: 3px !important;
  color: #738596 !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-focus-section .field strong {
  display: block !important;
  color: #253847 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-more-fields {
  margin-top: 10px !important;
  border-top: 1px solid #e4ebf0 !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-more-fields summary {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 36px !important;
  color: #4f687a !important;
  font-size: 12px !important;
  cursor: pointer !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .sku-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
  gap: 7px !important;
}
body.workspace-mode dialog > .dialog-inner.product-detail-shell .sku-chip {
  min-height: 46px !important;
  padding: 7px 9px !important;
  border: 1px solid #dce5ec !important;
  border-radius: 4px !important;
  background: #ffffff !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-catalog :is(th, td) {
  padding: 8px 10px !important;
  vertical-align: middle !important;
  line-height: 1.35 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-catalog tbody tr {
  height: 76px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-catalog .product-image {
  width: 42px !important;
  height: 56px !important;
  border-radius: 3px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-catalog .stack {
  gap: 2px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-catalog .style-code-actions {
  gap: 4px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-catalog .style-code {
  font-size: 15px !important;
  font-weight: 700 !important;
}

@media (max-width: 760px) {
  body.workspace-mode dialog:has(> .dialog-inner.product-detail-shell) {
    width: calc(100vw - 12px) !important;
    max-width: calc(100vw - 12px) !important;
    max-height: calc(100vh - 12px) !important;
    border-radius: 6px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell > .dialog-head {
    min-height: 60px !important;
    padding: 11px 14px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell > .dialog-head h2 {
    font-size: 19px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-top {
    grid-template-columns: 86px minmax(0, 1fr) !important;
    gap: 9px !important;
    padding: 14px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-image-frame {
    width: 78px !important;
    height: 102px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-top .detail-actions {
    grid-column: 1 / -1 !important;
    justify-content: flex-start !important;
    padding-top: 2px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-nav,
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-head,
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-content {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-module-content > :is(section, .section-heading, .sku-grid, .detail-focus-section) {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-focus-section .fields {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-current-context {
    padding: 13px 14px !important;
  }
  body.workspace-mode dialog > .dialog-inner.product-detail-shell .detail-current-context .workbench-lifecycle-inline {
    grid-template-columns: 1fr !important;
    gap: 3px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-table-scroll-region:has(> table.product-workbench-table-catalog) {
    overflow-x: auto !important;
    padding-bottom: 7px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-catalog {
    display: table !important;
    width: 1060px !important;
    min-width: 1060px !important;
    table-layout: fixed !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-catalog > thead,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-catalog > tbody {
    display: table-row-group !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-catalog :is(thead tr, tbody tr) {
    display: table-row !important;
    height: 76px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-catalog :is(thead th, tbody td) {
    display: table-cell !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    padding: 8px 10px !important;
    border-bottom: 1px solid #e2e9ee !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-catalog .product-image {
    width: 40px !important;
    height: 54px !important;
  }
}

/* workbench-scroll-owner=20260905-r1
 * Wide workflow tables may keep their business column track, but the active
 * workbench grid must stay inside the viewport. Otherwise an implicit auto
 * track grows to the table's min-content width and the parent clips the very
 * action rail users need to operate the queue. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > :is(.work-cards, .work-filter-bar, .work-detail-anchor) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > .work-detail-anchor > .product-workbench-panel {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

/* model-reference-upload=20260904-r1
 * Keep the auxiliary image picker as one compact action row. The native file
 * input is only the label trigger; exposing it as a grid item creates the
 * stray square and pushes the QR action onto a second full-width row. */
html body.workspace-mode .model-reference-upload {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  min-height: 58px !important;
  padding: 10px 12px !important;
  border: 1px dashed #c4d2df !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  color: #34465b !important;
  cursor: pointer !important;
  transition: border-color .16s ease, background-color .16s ease !important;
}
html body.workspace-mode .model-reference-upload:hover,
html body.workspace-mode .model-reference-upload:focus-within {
  border-color: #4d8fe8 !important;
  background: #f2f7ff !important;
}
html body.workspace-mode .model-reference-upload.drag-over {
  border-color: #3b82f6 !important;
  background: #edf5ff !important;
  outline: 2px solid rgba(59, 130, 246, .18) !important;
  outline-offset: 2px !important;
}
html body.workspace-mode .model-reference-upload > input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}
html body.workspace-mode .model-reference-upload-copy {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}
html body.workspace-mode .model-reference-upload-copy strong {
  color: #263b53 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode .model-reference-upload-copy small {
  color: #6b7d91 !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  overflow-wrap: anywhere !important;
}
html body.workspace-mode .model-reference-upload > button {
  justify-self: end !important;
  width: auto !important;
  min-width: 132px !important;
  max-width: 100% !important;
  white-space: nowrap !important;
}
@media (max-width: 640px) {
  html body.workspace-mode .model-reference-upload {
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 8px !important;
  }
  html body.workspace-mode .model-reference-upload > button {
    justify-self: start !important;
  }
}

/* workbench-edit-surface=20260904-r1
 * Specialized editors (HR, finance, orders, schedules and contracts) keep
 * their domain-specific markup, but share the same usable surface: readable
 * labels, stable grids, compact spacing, and a footer that remains reachable. */
body.workspace-mode #createDialog
  > .dialog-inner:not(.tenant-registration-dialog) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

body.workspace-mode #createDialog
  > .dialog-inner:not(.tenant-registration-dialog) > .form {
  min-width: 0 !important;
  max-width: 100% !important;
  gap: 12px !important;
}

body.workspace-mode #createDialog
  > .dialog-inner:not(.tenant-registration-dialog) .form-grid {
  min-width: 0 !important;
  gap: 10px 12px !important;
}

body.workspace-mode #createDialog
  > .dialog-inner:not(.tenant-registration-dialog) .form > label,
body.workspace-mode #createDialog
  > .dialog-inner:not(.tenant-registration-dialog) .form-grid > label {
  min-width: 0 !important;
  max-width: 100% !important;
}

body.workspace-mode #createDialog
  > .dialog-inner:not(.tenant-registration-dialog) .form :is(input, select, textarea) {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.workspace-mode #createDialog
  > .dialog-inner:not(.tenant-registration-dialog) .form-footer {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 0 -2px -2px !important;
  padding: 10px 2px 2px !important;
  border-top: 1px solid #d9e2eb !important;
  background: #fff !important;
}

body.workspace-mode #createDialog
  > .dialog-inner:not(.tenant-registration-dialog) .dialog-help {
  max-width: 100% !important;
  margin: 0 0 2px !important;
  overflow-wrap: anywhere !important;
}

@media (max-width: 760px) {
body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #createDialog
    > .dialog-inner:not(.tenant-registration-dialog) .form-footer {
    align-items: stretch !important;
    flex-direction: column-reverse !important;
  }

body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #createDialog
    > .dialog-inner:not(.tenant-registration-dialog) .form-footer button {
    width: 100% !important;
  }
}


/* workbench-filter-views=20260904-r1
 * Lingmao's useful pattern here is a compact filter cockpit with obvious
 * quick views. Keep ours backed by the existing role/date/status facts and
 * let the document remain the only vertical scroll owner. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-quick {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-quick-button {
  min-height: 30px !important;
  padding: 0 11px !important;
  border: 1px solid #d5deea !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #53657b !important;
  font-size: 12px !important;
  line-height: 28px !important;
  cursor: pointer !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-quick-button:hover,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-quick-button:focus-visible {
  border-color: #8eb3f5 !important;
  color: #1748ae !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px #edf3ff !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-quick-button.active {
  border-color: #2f69c9 !important;
  background: #edf3ff !important;
  color: #1748ae !important;
  font-weight: 650 !important;
}

/* filter-layout-boundary=20260910
 * The entire bar owns rows. Controls wrap against their actual container,
 * never against the viewport minus an assumed sidebar/summary width.
 * Reset legacy explicit grid placement on EVERY direct child together. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-bar {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-bar > * {
  grid-area: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  position: static !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-title {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 4px 12px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-title span {
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-controls {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 12px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-field {
  flex: 1 1 150px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  grid-area: auto !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-keyword {
  flex-basis: 210px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-date {
  flex-basis: 330px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-field :is(input, select, .date-range) {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-reset {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 72px !important;
  min-height: 36px !important;
  white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-result {
  text-align: left !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  line-height: 1.6 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-active-label {
  color: #53657b !important;
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-quick {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    padding-bottom: 2px !important;
    scrollbar-width: none !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-quick::-webkit-scrollbar {
    display: none !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .work-filter-quick-button {
    flex: 0 0 auto !important;
  }
}

/* wide-table-fill=20260904-r2
 * Business tables fill spare workspace width. Their existing minimum column
 * contracts still trigger wrapper-owned horizontal scrolling when needed. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.table-wrap, .procurement-table-wrap, .procurement-material-scroll, .design-material-editor-wrap) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.procurement-workbench-table, table.order-table,
      table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
      table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
      table.risk-table, table.audit-table, table.operation-data-table,
      table.operation-sync-log-table, table.procurement-archive-table,
      table.dealer-material-list-table, table.design-material-table,
      table.procurement-material-table, table.order-line-table, table.design-material-editor) {
  width: 100% !important;
  max-width: none !important;
  table-layout: fixed !important;
  box-sizing: border-box !important;
}

/* material-image-intake=20260904-r1
 * dialog-media-scope=20260910-r1: dialogs are body siblings of app-shell.
 * Share the component contract across page and dialog roots. */
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .material-image-picker {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 8px !important;
  border: 1px solid #d8e2ee !important;
  border-radius: 7px !important;
  background: #fbfdff !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .material-image-picker.drag-over,
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .material-image-picker:focus-within {
  border-color: #6c9fe8 !important;
  background: #f2f7ff !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .material-image-list,
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .material-image-strip {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  align-items: center !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) table.procurement-material-wide-table {
  min-width: 1560px !important;
  table-layout: auto !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) table.procurement-material-wide-table th:nth-child(8),
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) table.procurement-material-wide-table td:nth-child(8) {
  min-width: 155px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) table.procurement-material-wide-table th:nth-child(11),
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) table.procurement-material-wide-table td:nth-child(11) {
  min-width: 150px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) table.procurement-archive-table {
  min-width: 1080px !important;
  table-layout: auto !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) table.dealer-material-list-table {
  min-width: 900px !important;
  table-layout: auto !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .material-image-thumb {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  flex: 0 0 46px !important;
  min-width: 46px !important;
  max-width: 46px !important;
  min-height: 46px !important;
  max-height: 46px !important;
  width: 46px !important;
  height: 46px !important;
  overflow: hidden !important;
  border: 1px solid #cbd8e7 !important;
  border-radius: 5px !important;
  background: #fff !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .material-image-thumb img,
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .material-image-preview {
  width: 46px !important;
  height: 46px !important;
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  flex: 0 0 auto !important;
  object-fit: cover !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .material-image-thumb button {
  position: absolute !important;
  top: 1px !important;
  right: 1px !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  line-height: 18px !important;
  display: grid !important;
  place-items: center !important;
  height: 18px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: #fff !important;
  background: rgba(25, 38, 58, .78) !important;
  cursor: pointer !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .material-image-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .account-avatar-editor {
  display: grid !important;
  grid-template-columns: 96px minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: center !important;
  margin-bottom: 16px !important;
  padding: 12px !important;
  border: 1px solid #d8e2ee !important;
  border-radius: 8px !important;
  background: #fbfdff !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .account-avatar-preview {
  display: grid !important;
  gap: 6px !important;
  justify-items: center !important;
  color: #65758b !important;
  font-size: 11px !important;
  text-align: center !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .account-avatar-preview img,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .user-menu-avatar {
  width: 52px !important;
  height: 52px !important;
  overflow: hidden !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .account-avatar-actions {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .user-menu {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .user-menu-avatar {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 32px !important;
  width: 32px !important;
  height: 32px !important;
  color: #1e5aa8 !important;
  background: #e7f0ff !important;
  font-weight: 750 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .user-menu-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
@media (max-width: 760px) {
  body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .account-avatar-editor { grid-template-columns: 1fr !important; justify-items: start !important; }
}

/* table-column-alignment=20260904-r1
 * Action labels share one visual rail: the header, cell and button group use
 * the same alignment so a right-anchored header cannot sit over a left-starting
 * row action. The rule is shared by every table whose final column is an action
 * column; non-action numeric/operator columns keep their own semantics. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.procurement-workbench-table,
      table.supplier-table, table.inbound-table, table.contract-table,
      table.risk-table, table.org-members-table, table.account-table,
      table.finance-invoice-table)
  :is(thead th:last-child, tbody td:last-child) {
  text-align: center !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.procurement-workbench-table,
      table.supplier-table, table.inbound-table, table.contract-table,
      table.risk-table, table.org-members-table, table.account-table,
      table.finance-invoice-table)
  tbody td:last-child :is(.row-actions, .product-row-actions, .procurement-direct-actions) {
  width: 100% !important;
  justify-content: center !important;
  align-items: center !important;
  margin-inline: auto !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.order-table :is(thead th:nth-child(16), tbody td:nth-child(16)) {
  text-align: center !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"] #page
  table.order-table tbody td:nth-child(16) :is(.row-actions, .product-row-actions) {
  width: 100% !important;
  justify-content: center !important;
  align-items: center !important;
  margin-inline: auto !important;
}

/* order-table-columns=20260904-r1
 * Orders are a business ledger, not a summary card. Keep every decision
 * field in the table, use one native table track for header and rows, and
 * let the table boundary—not the page or a record-card media query—carry the
 * horizontal scroll on narrow screens. */
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel > .table-wrap {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table {
  display: table !important;
  width: 2162px !important;
  min-width: 2162px !important;
  max-width: none !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: #fff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > thead {
  position: static !important;
  display: table-header-group !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > tbody {
  display: table-row-group !important;
  width: auto !important;
  min-width: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > :is(thead, tbody) > tr {
  display: table-row !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > :is(thead, tbody) > tr > :is(th, td) {
  display: table-cell !important;
  position: static !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
  padding: 10px 11px !important;
  border: 0 !important;
  border-bottom: 1px solid #e2e8f0 !important;
  vertical-align: middle !important;
  background: #fff !important;
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > thead > tr > th {
  position: static !important;
  color: #52677d !important;
  background: #f7f9fb !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  text-align: left !important;
  white-space: normal !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > tbody > tr:hover > td {
  background: #fbfdff !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(1) { width: 112px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(2) { width: 64px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(3) { width: 140px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(4) { width: 120px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(5) { width: 150px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(6) { width: 120px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(7) { width: 90px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(8) { width: 160px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(9) { width: 120px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(10) { width: 140px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :is(:nth-child(11), :nth-child(12)) { width: 112px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(13) { width: 132px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(14) { width: 140px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(15) { width: 130px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(16) { width: 170px !important; text-align: center !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table > * > tr > :nth-child(17) { width: 150px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table .order-record-more-cell {
  display: table-cell !important;
  width: 150px !important;
  min-width: 150px !important;
  padding: 10px 11px !important;
  border-bottom: 1px solid #e2e8f0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table .order-record-more {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table .order-record-more-grid {
  width: auto !important;
  min-width: 0 !important;
  grid-template-columns: minmax(0, 1fr) !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table .product-actions-cell,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table .product-row-actions {
  min-width: 0 !important;
  white-space: normal !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table .product-row-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 6px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table .style-code-actions,
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .order-panel .order-table .style-code {
  white-space: nowrap !important;
}

/* mobile-upload-top-layer=20260904-r2
 * The QR intake window is opened from an existing native dialog. Keep it a
 * native dialog too so it enters the browser top layer instead of rendering
 * behind the design/procurement editor. */
html body.workspace-mode dialog.mobile-upload-overlay {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  max-width: none !important;
  height: 100vh !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 20px !important;
  border: 0 !important;
  display: grid !important;
  place-items: center !important;
  background: transparent !important;
  color: #172033 !important;
  overflow: auto !important;
  pointer-events: auto !important;
  z-index: auto !important;
}
html body.workspace-mode dialog.mobile-upload-overlay::backdrop {
  background: rgba(15, 23, 42, .58) !important;
}
html body.workspace-mode dialog.mobile-upload-overlay > .mobile-upload-dialog {
  width: min(760px, calc(100vw - 32px)) !important;
  max-height: min(720px, calc(100vh - 40px)) !important;
  margin: auto !important;
  overflow: auto !important;
}

/* design-material-version=20260904-r1
 * Keep BOM version metadata readable without adding another panel/card. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-material-version-line {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 6px !important;
  min-width: 0 !important;
}

/* design-material-print-history=20260917-r1
 * Keep formal print audit records compact and readable below the BOM table. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-material-print-history {
  display: grid !important;
  gap: 6px !important;
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid #d8e1ec !important;
  color: #52647d !important;
  font-size: 12px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-material-print-history > strong {
  color: #24344d !important;
  font-size: 13px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-material-print-history > span {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  min-width: 0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-material-version {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  padding: 0 9px !important;
  border: 1px solid #c7d2e2 !important;
  border-radius: 12px !important;
  color: #52647d !important;
  background: #f5f7fa !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-material-version.frozen {
  border-color: #a9dfc7 !important;
  color: #126a4d !important;
  background: #e8f8f0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .design-material-version.draft {
  border-color: #efd39a !important;
  color: #8a5a18 !important;
  background: #fff7e7 !important;
}

/* style-number-copy=20260904-r1
 * Keep the copy affordance immediately after the style number. It is an
 * icon-only utility, so it does not compete with the primary row action. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code-actions,
body.workspace-mode dialog .style-code-actions {
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
  gap: 5px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code-actions > .style-code,
body.workspace-mode dialog .style-code-actions > .style-code {
  display: inline-block !important;
  width: auto !important;
  max-width: min(100%, 180px) !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code-copy,
body.workspace-mode dialog .style-code-copy {
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #cbd5df !important;
  border-radius: 5px !important;
  background: #f8fafc !important;
  color: #5c6b7b !important;
  box-shadow: none !important;
  cursor: pointer !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code-copy svg,
body.workspace-mode dialog .style-code-copy svg {
  width: 14px !important;
  height: 14px !important;
  stroke-width: 1.9 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code-copy:hover,
body.workspace-mode dialog .style-code-copy:hover {
  border-color: #9db6d0 !important;
  background: #f2f7fc !important;
  color: #175cd3 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code-copy:focus-visible,
body.workspace-mode dialog .style-code-copy:focus-visible {
  outline: 2px solid #8eb5e2 !important;
  outline-offset: 2px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code-copy.is-copied,
body.workspace-mode dialog .style-code-copy.is-copied {
  border-color: #a8d8c6 !important;
  background: #effaf5 !important;
  color: #087f5b !important;
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code-copy,
  body.workspace-mode dialog .style-code-copy {
    flex-basis: 22px !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
  }
}

/* tenant-registration-footer=20260904-r1
 * The registration dialog is shown before workspace-mode is enabled. Keep
 * its action rail on the same light paper surface instead of inheriting the
 * legacy dark modal footer. */
body.auth-mode #createDialog:has(> .dialog-inner.tenant-registration-dialog) {
  color: #20252a !important;
  background: #fff !important;
  border: 1px solid #dfe2e6 !important;
  border-radius: 6px !important;
  box-shadow: 0 24px 70px rgba(23, 25, 28, .2) !important;
}

body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog,
body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog > .dialog-head,
body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog > .dialog-help,
body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog > .form {
  color: #20252a !important;
  background: #fff !important;
  border-color: #dfe2e6 !important;
}

body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog > .dialog-head {
  border-bottom: 1px solid #e5e7eb !important;
}

body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog .form-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  margin: 0 -24px -24px !important;
  padding: 16px 24px !important;
  color: #4b535c !important;
  background: #f7f8fa !important;
  border-top: 1px solid #e1e5e9 !important;
  border-radius: 0 0 6px 6px !important;
}

body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog .form-footer .secondary {
  min-height: 38px !important;
  color: #3f464e !important;
  background: #fff !important;
  border: 1px solid #c8cdd3 !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog .form-footer .secondary:hover,
body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog .form-footer .secondary:focus-visible {
  color: #175cd3 !important;
  background: #f4f8fc !important;
  border-color: #9db7d4 !important;
}

body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog .form-footer .primary {
  min-height: 38px !important;
  color: #fff !important;
  background: #d92d20 !important;
  border: 1px solid #d92d20 !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog .form-footer .primary:hover,
body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog .form-footer .primary:focus-visible {
  color: #fff !important;
  background: #b42318 !important;
  border-color: #b42318 !important;
}

/* shell-header-integrity=20260904-r1
 * Keep the authenticated header as one compact navigation surface. The
 * sidebar toggle is icon-only and transparent, so an unhydrated Lucide node
 * cannot appear as a misleading empty card or push the title out of alignment.
 */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  min-height: 64px !important;
  height: 64px !important;
  padding: 0 clamp(16px, 2vw, 28px) !important;
  box-sizing: border-box !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar-heading {
  display: flex !important;
  align-items: center !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 44% !important;
  gap: 8px !important;
  padding: 0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .sidebar-toggle {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 30px !important;
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: #5e7082 !important;
  box-shadow: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .sidebar-toggle:hover,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .sidebar-toggle:focus-visible {
  background: #eef4f8 !important;
  color: #17324d !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .sidebar-toggle > :is(i[data-lucide], svg) {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar-title-group {
  display: grid !important;
  align-content: center !important;
  gap: 2px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar-kicker {
  max-width: 100% !important;
  color: #6e7f90 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar h1 {
  max-width: 100% !important;
  margin: 0 !important;
  color: #17324d !important;
  font-size: 20px !important;
  font-weight: 780 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  gap: 10px !important;
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar {
    align-items: flex-start !important;
    flex-wrap: wrap !important;
    row-gap: 6px !important;
    min-height: 56px !important;
    height: auto !important;
    padding-block: 8px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar-heading {
    width: 100% !important;
    max-width: none !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar .sidebar-toggle {
    display: none !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .top-actions {
    width: 100% !important;
    gap: 6px !important;
  }
}

@media (max-width: 760px) {
  body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog .form-footer {
    align-items: stretch !important;
    flex-direction: column-reverse !important;
  }

  body.auth-mode #createDialog > .dialog-inner.tenant-registration-dialog .form-footer button {
    width: 100% !important;
  }
}

/* activity-drawer-visibility=20260904-r1
 * A closed fixed drawer is intentionally off-canvas. Mark it hidden as well
 * so viewport checks do not treat the translated shell as visible content. */
body.workspace-mode #activityPanel.activity-panel:not(.open) {
  visibility: hidden !important;
  pointer-events: none !important;
}

body.workspace-mode #activityPanel.activity-panel.open {
  visibility: visible !important;
  pointer-events: auto !important;
}

/* legal-footer-mobile-fit=20260904-r1
 * The legacy single-row contract keeps max-content widths for desktop. On a
 * phone, switch the same information to bounded rows so the footer cannot
 * widen the document or push its children outside the viewport. */
@media (max-width: 760px) {
  body.auth-mode .app-shell.auth-mode .workspace-legal-footer,
  body.workspace-mode .app-shell:not(.auth-mode) .workspace-legal-footer {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    white-space: normal !important;
  }

  body.auth-mode .app-shell.auth-mode .workspace-legal-footer .platform-legal-copy,
  body.workspace-mode .app-shell:not(.auth-mode) .workspace-legal-footer .platform-legal-copy,
  body.auth-mode .app-shell.auth-mode .workspace-legal-footer .platform-legal-meta,
  body.workspace-mode .app-shell:not(.auth-mode) .workspace-legal-footer .platform-legal-meta {
    display: flex !important;
    flex: 0 1 auto !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
  }

  body.auth-mode .app-shell.auth-mode .workspace-legal-footer .platform-legal-trust,
  body.workspace-mode .app-shell:not(.auth-mode) .workspace-legal-footer .platform-legal-trust,
  body.auth-mode .app-shell.auth-mode .workspace-legal-footer .platform-legal-links,
  body.workspace-mode .app-shell:not(.auth-mode) .workspace-legal-footer .platform-legal-links {
    flex: 0 1 auto !important;
    flex-wrap: wrap !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
  }

  body.auth-mode .app-shell.auth-mode .workspace-legal-footer :is(.platform-legal-copy strong,.platform-legal-copy span,.platform-trust-item,.platform-legal-meta a),
  body.workspace-mode .app-shell:not(.auth-mode) .workspace-legal-footer :is(.platform-legal-copy strong,.platform-legal-copy span,.platform-trust-item,.platform-legal-meta a) {
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
}

/* workbench-edit-audit=20260904-r1
 * One editing grammar for every workbench: preserve each role's fields and
 * permissions, but make context, current-node input, and the save action easy
 * to scan. These rules are terminal and scoped to the current workspace. */
body.workspace-mode :is(#createDialog, #productDialog) {
  --editor-line: #d9e2eb !important;
  --editor-text: #17324d !important;
  --editor-muted: #69788b !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  > .dialog-inner.workbench-editor-dialog {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .workbench-editor-dialog .form {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .workbench-editor-dialog .role-banner {
  display: grid !important;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 8px 12px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid #cfe0ef !important;
  border-radius: 5px !important;
  background: #f3f8fd !important;
  color: var(--editor-text) !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .workbench-editor-dialog .role-banner strong {
  min-width: 0 !important;
  color: #244f7b !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .workbench-editor-dialog .role-banner span {
  min-width: 0 !important;
  color: var(--editor-muted) !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .editor-form-section {
  display: grid !important;
  gap: 9px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 12px !important;
  border: 1px solid var(--editor-line) !important;
  border-radius: 5px !important;
  background: #fff !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .editor-section-head {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
  padding-bottom: 7px !important;
  border-bottom: 1px solid #e7edf3 !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .editor-section-head h3 {
  margin: 0 !important;
  color: var(--editor-text) !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .editor-section-head p {
  margin: 0 !important;
  color: var(--editor-muted) !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .editor-form-section .form-grid {
  gap: 10px 12px !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .editor-form-section :is(label, .full-field, .conditional-fields, .order-material-card) {
  min-width: 0 !important;
  max-width: 100% !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .editor-form-section :is(input, select, textarea) {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.workspace-mode :is(#createDialog, #productDialog)
  .workbench-editor-dialog .form-footer {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  margin: 0 -2px -2px !important;
  padding: 10px 2px 2px !important;
  border-top: 1px solid var(--editor-line) !important;
  background: #fff !important;
}

/* material-editor-stable=20260912-r1: keep the Lingmao-style work area fixed;
 * long rows scroll inside the editor instead of resizing the dialog. */
body.workspace-mode dialog:has(> .dialog-inner.design-material-dialog),
body.workspace-mode dialog:has(> .dialog-inner.procurement-material-dialog) {
  width: min(1480px, calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  max-height: calc(100vh - 24px) !important;
  overflow: hidden !important;
}
body.workspace-mode dialog > .dialog-inner.design-material-dialog,
body.workspace-mode dialog > .dialog-inner.procurement-material-dialog {
  width: 100% !important;
  max-width: 100% !important;
  max-height: calc(100vh - 24px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}
body.workspace-mode .design-material-dialog > .design-material-context,
body.workspace-mode .design-material-dialog > .role-banner,
body.workspace-mode .procurement-material-dialog > .dialog-help { flex: 0 0 auto !important; }
body.workspace-mode .design-material-dialog > form,
body.workspace-mode .procurement-material-dialog > form {
  min-height: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}
body.workspace-mode .design-material-editor-wrap,
body.workspace-mode .procurement-material-dialog form > #procurementBulkRows {
  min-height: 0 !important;
  flex: 1 1 auto !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
}
body.workspace-mode table.design-material-editor { table-layout: fixed !important; min-width: 1120px !important; }
body.workspace-mode table.design-material-editor :is(input, select, textarea) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
body.workspace-mode table.design-material-editor textarea,
body.workspace-mode .procurement-material-dialog textarea {
  min-height: 72px !important;
  max-height: 160px !important;
  resize: vertical !important;
  overflow: auto !important;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode #productDialog .pattern-timeline {
  display: grid !important;
  gap: 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 12px 8px 4px 6px !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

body.workspace-mode #productDialog .pattern-timeline li {
  grid-template-columns: 30px minmax(0, 1fr) !important;
  gap: 10px !important;
  min-width: 0 !important;
  min-height: 54px !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

body.workspace-mode #productDialog .pattern-timeline :is(.pattern-timeline-station, .pattern-timeline-content) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

body.workspace-mode #productDialog .pattern-timeline-title strong,
body.workspace-mode #productDialog .pattern-timeline small {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode #productDialog .pattern-timeline small {
  display: block !important;
}

body.workspace-mode #productDialog .pattern-timeline-state-label {
  display: inline-flex !important;
  margin-right: 5px !important;
  color: #50667d !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

body.workspace-mode #productDialog .revision-opinions-section > .section-heading > .revision-opinion-summary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  min-height: 24px !important;
  padding: 3px 8px !important;
  border: 1px solid #c8d9ec !important;
  border-radius: 999px !important;
  color: #24415e !important;
  background: #edf4fb !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

body.workspace-mode #productDialog .revision-opinions-section .pending-opinion-badge {
  color: #8a5a18 !important;
  background: #fff4db !important;
  border-color: #efd39a !important;
}

body.workspace-mode #productDialog .revision-opinion-empty {
  display: grid !important;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 1px dashed #cfdbe6 !important;
  border-radius: 4px !important;
  background: #f8fafc !important;
}

body.workspace-mode #productDialog .revision-opinion-empty :is(strong, span) {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode #productDialog .detail-focus-section {
  min-width: 0 !important;
  padding: 12px 14px !important;
}

body.workspace-mode #productDialog .detail-more-fields {
  min-width: 0 !important;
  margin-top: 10px !important;
}

body.workspace-mode #productDialog .detail-more-fields summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  padding: 8px 10px !important;
  color: #24415e !important;
  background: #f8fafc !important;
}

body.workspace-mode #productDialog .detail-more-fields summary small {
  color: #7a8897 !important;
  font-size: 11px !important;
}

body.workspace-mode #productDialog .detail-more-fields summary b {
  color: #175cd3 !important;
  font-size: 11px !important;
}

body.workspace-mode #productDialog .detail-compact-edit {
  min-height: 32px !important;
  margin-top: 10px !important;
  padding: 0 12px !important;
}

body.workspace-mode #productDialog .label-section .label-preview-grid > div {
  min-width: 0 !important;
  min-height: 68px !important;
  padding: 10px 12px !important;
  box-sizing: border-box !important;
}

@media (max-width: 760px) {
body.workspace-mode :is(#createDialog, #productDialog)
    .workbench-editor-dialog .role-banner {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 3px !important;
  }

body.workspace-mode :is(#createDialog, #productDialog)
    .editor-form-section {
    padding: 10px !important;
  }

body.workspace-mode #productDialog .revision-opinion-empty {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 3px !important;
  }

body.workspace-mode #productDialog .detail-more-fields summary {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

body.workspace-mode #productDialog .detail-more-fields summary small {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
  }
}
/* order-change-approval=20260904-r1 */
body.workspace-mode #productDialog .order-change-request-section {
  display: grid !important;
  gap: 10px !important;
  margin: 12px 0 !important;
  padding: 14px !important;
  border: 1px solid #d8e2ec !important;
  border-radius: 6px !important;
  background: #fbfcfe !important;
}
body.workspace-mode #productDialog .order-change-request-item {
  display: flex !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 10px 12px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 5px !important;
  background: #fff !important;
}
body.workspace-mode #productDialog .order-change-request-item > div:first-child {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}
body.workspace-mode #productDialog .order-change-request-item strong { color: #255c87 !important; }
body.workspace-mode #productDialog .order-change-request-item span,
body.workspace-mode #productDialog .order-change-request-item small { color: #718096 !important; font-size: 12px !important; }
body.workspace-mode #productDialog .order-change-request-item p { margin: 2px 0 0 !important; color: #34445a !important; overflow-wrap: anywhere !important; }
body.workspace-mode #productDialog .order-change-review-actions { display: flex !important; align-items: center !important; gap: 8px !important; flex-wrap: wrap !important; }
body.workspace-mode #createDialog .order-change-pending { margin: 0 0 2px !important; }
@media (max-width: 760px) {
  body.workspace-mode #productDialog .order-change-request-item { flex-direction: column !important; }
  body.workspace-mode #productDialog .order-change-review-actions { width: 100% !important; }
  body.workspace-mode #productDialog .order-change-review-actions button { flex: 1 1 160px !important; }
}

/* business-identifier-full-display=20260904-r1
 * Business identifiers are lookup keys, not decorative copy. Never silently
 * ellipsize a style number; let its cell grow and keep overflow inside the
 * table wrapper when the workspace is narrower than the full ledger. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code-actions,
body.workspace-mode dialog .style-code-actions {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  min-width: max-content !important;
  max-width: none !important;
  overflow: visible !important;
  white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .style-code-actions > .style-code,
body.workspace-mode dialog .style-code-actions > .style-code {
  display: inline-block !important;
  width: max-content !important;
  min-width: max-content !important;
  max-width: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-table, table.data-table, table.order-line-table, table.risk-table,
      table.inbound-table, table.contract-table, table.procurement-workbench-table,
      table.product-workbench-table) td:has(.style-code-actions) {
  width: max-content !important;
  min-width: 132px !important;
  max-width: none !important;
  overflow: visible !important;
  white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table {
  width: max-content !important;
  min-width: 1380px !important;
  max-width: none !important;
  table-layout: auto !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table > :is(thead, tbody) > tr > :is(th, td) {
  box-sizing: border-box !important;
  vertical-align: middle !important;
  overflow: visible !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table > :is(thead, tbody) > tr > :nth-child(1) {
  width: 82px !important;
  min-width: 82px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table > :is(thead, tbody) > tr > :nth-child(2) {
  width: 142px !important;
  min-width: 142px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table > :is(thead, tbody) > tr > :nth-child(3) {
  width: 104px !important;
  min-width: 104px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table > :is(thead, tbody) > tr > :nth-child(4) {
  width: 266px !important;
  min-width: 266px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table > :is(thead, tbody) > tr > :nth-child(5) {
  width: 370px !important;
  min-width: 370px !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table > :is(thead, tbody) > tr > :nth-child(6) {
  width: 164px !important;
  min-width: 164px !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table > :is(thead, tbody) > tr > :nth-child(7) {
  width: 142px !important;
  min-width: 142px !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.risk-table > :is(thead, tbody) > tr > :nth-child(8) {
  width: 154px !important;
  min-width: 154px !important;
  white-space: nowrap !important;
}

/* pattern-progress-plain-surface=20260904-r1
 * Keep workflow progress readable without a large filled rectangle behind it. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress.is-overdue,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress.is-soon {
  background: transparent !important;
}

/* pattern-progress-status-markers=20260904-r1
 * Use small semantic markers so workflow stages remain scannable without
 * bringing back a filled card background. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress-stage {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  color: #2f4052 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress-stage::before {
  content: "" !important;
  display: inline-block !important;
  flex: 0 0 7px !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #94a3b8 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress-stage.is-gray::before {
  background: #94a3b8 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress-stage.is-orange::before {
  background: #d97706 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress-stage.is-blue::before {
  background: #2563eb !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress-stage.is-green::before {
  background: #16a34a !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress-stage.is-red::before {
  background: #dc2626 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .pattern-progress-stage.is-purple::before {
  background: #9333ea !important;
}

/* pattern-workbench-info-hierarchy=20260904-r1
 * Supporting requirements, material checks and technical notes remain
 * available in each row, but the default surface only exposes their action
 * state. This keeps the workbench scannable while preserving full facts. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details {
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details > summary {
  display: grid !important;
  grid-template-columns: max-content max-content minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 4px 7px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 32px !important;
  padding: 3px 0 !important;
  color: #536a80 !important;
  cursor: pointer !important;
  list-style: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details > summary::-webkit-details-marker {
  display: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details > summary::after {
  content: "›" !important;
  display: inline-block !important;
  margin-left: 2px !important;
  color: #7b8d9d !important;
  font-size: 18px !important;
  line-height: 1 !important;
  transform: rotate(0deg) !important;
  transition: transform 140ms ease !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details[open] > summary::after {
  transform: rotate(90deg) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details > summary:focus-visible {
  outline: 2px solid #8bb8e8 !important;
  outline-offset: 2px !important;
  border-radius: 3px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-details-summary-label {
  min-width: 0 !important;
  color: #536a80 !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details > summary strong {
  min-width: max-content !important;
  color: #2f5f89 !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details.needs-attention > summary strong {
  color: #9a6513 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details > summary small {
  min-width: 0 !important;
  max-width: 100% !important;
  color: #7a8997 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-tech-status-link {
  margin-left: auto !important;
  border: 0 !important;
  background: transparent !important;
  color: #2f6f9f !important;
  font: inherit !important;
  font-weight: 750 !important;
  cursor: pointer !important;
  padding: 2px 0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-tech-status-link:hover {
  text-decoration: underline !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-tech-fact-link {
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #2f6f9f !important;
  font: inherit !important;
  text-align: left !important;
  cursor: pointer !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-tech-fact-link:hover {
  text-decoration: underline !important;
}

body.workspace-mode dialog .technical-sheet-dialog textarea {
  min-height: 112px !important;
  resize: vertical !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details-body {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin-top: 3px !important;
  padding: 6px 0 2px !important;
  border-top: 1px solid #e3e9ef !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details-body .pattern-workbench-facts {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 3px !important;
  margin: 0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details-body .pattern-workbench-fact {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) !important;
  gap: 0 6px !important;
  min-width: 0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details-body :is(.pattern-workbench-fact span, .external-pattern-contact) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details > summary {
    grid-template-columns: max-content max-content minmax(0, 1fr) !important;
    gap: 3px 5px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-pattern .pattern-workbench-details > summary small {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
  }
}

/* table-image-column-alignment=20260904-r1
 * Image headers and thumbnails must share the same visual center. Historical
 * record-card rules centered the image but left the header text at the cell
 * edge, which made the column look shifted when the table was horizontally
 * scrolled. Keep image-bearing columns centered without changing data order. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.order-table)
  :is(thead th, tbody td):nth-child(2) {
  text-align: center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.order-table) thead th:nth-child(2) {
  justify-content: center !important;
  align-items: center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.order-table) tbody td:nth-child(2) {
  align-self: center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.order-table) tbody td:nth-child(2) > img {
  display: block !important;
  margin-inline: auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.contract-table
  :is(thead th, tbody td):nth-child(1) {
  text-align: center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.contract-table thead th:nth-child(1) {
  justify-content: center !important;
  align-items: center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.contract-table tbody td:nth-child(1) {
  align-self: center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page table.contract-table tbody td:nth-child(1) > img {
  display: block !important;
  margin-inline: auto !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(
    table.design-material-table :is(thead th, tbody td):nth-child(5),
    table.procurement-material-wide-table :is(thead th, tbody td):nth-child(8),
    table.procurement-archive-table :is(thead th, tbody td):nth-child(6),
    table.dealer-material-list-table :is(thead th, tbody td):nth-child(5)
  ) {
  text-align: center !important;
  vertical-align: middle !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(
    table.design-material-table thead th:nth-child(5),
    table.procurement-material-wide-table thead th:nth-child(8),
    table.procurement-archive-table thead th:nth-child(6),
    table.dealer-material-list-table thead th:nth-child(5)
  ) {
  justify-content: center !important;
  align-items: center !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(
    table.design-material-table tbody td:nth-child(5),
    table.procurement-material-wide-table tbody td:nth-child(8),
    table.procurement-archive-table tbody td:nth-child(6),
    table.dealer-material-list-table tbody td:nth-child(5)
  ) :is(.material-image-strip, .material-image-preview) {
  margin-inline: auto !important;
  justify-content: center !important;
}

/* workbench-information-architecture=20260904-r2
 * Keep the shared workbench readable at a glance while allowing the table
 * boundary, rather than the whole page, to carry the extra columns. Widths
 * are intentionally bounded by content so columns do not create artificial
 * gaps or crush long labels into neighboring cells. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.procurement-workbench-table) {
  width: max-content !important;
  min-width: 100% !important;
  table-layout: auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.procurement-workbench-table) :is(th, td) {
  min-width: 0 !important;
  max-width: none !important;
  padding: 10px 12px !important;
  vertical-align: middle !important;
  overflow-wrap: anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(1) { width: 132px !important; min-width: 132px !important; white-space: nowrap !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(2) { width: 76px !important; min-width: 76px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(3) { width: 168px !important; min-width: 168px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):nth-child(4) { width: 142px !important; min-width: 142px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.procurement-workbench-table) :is(th, td):last-child { width: 176px !important; min-width: 176px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.procurement-workbench-table) .product-image {
  display: block !important;
  width: 48px !important;
  height: 62px !important;
  margin-inline: auto !important;
  object-fit: cover !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-catalog :is(th, td):nth-child(3) { width: 186px !important; min-width: 186px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-design :is(th, td):is(:nth-child(6), :nth-child(7)) { width: 188px !important; min-width: 188px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern :is(th, td):is(:nth-child(6), :nth-child(7), :nth-child(8), :nth-child(9)) { width: 164px !important; min-width: 164px !important; }

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.design-material-table, table.design-material-editor) {
  width: max-content !important;
  min-width: 100% !important;
  table-layout: auto !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.design-material-table, table.design-material-editor) :is(th, td) {
  min-width: 0 !important;
  padding: 9px 10px !important;
  vertical-align: middle !important;
  overflow-wrap: anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.design-material-table :is(th, td):nth-child(1) { width: 220px !important; min-width: 220px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.design-material-table :is(th, td):nth-child(5) { width: 116px !important; min-width: 116px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.design-material-editor :is(th, td):nth-child(1) { width: 220px !important; min-width: 220px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.design-material-editor :is(th, td):nth-child(5) { width: 220px !important; min-width: 220px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.design-material-editor :is(th, td):nth-child(6) { width: 180px !important; min-width: 180px !important; }

/* styling-batch-workbench=20260904-r1 */
body.workspace-mode :is(#createDialog, #productDialog):has(> .dialog-inner.styling-batch-dialog) {
  width: min(1180px, calc(100vw - 32px)) !important;
  max-width: min(1180px, calc(100vw - 32px)) !important;
}
body.workspace-mode :is(#createDialog, #productDialog) > .dialog-inner.styling-batch-dialog {
  width: 100% !important;
  max-width: none !important;
  padding: 24px !important;
  background: #f7f9fb !important;
}
body.workspace-mode :is(#createDialog, #productDialog)
  > .dialog-inner.styling-batch-dialog > .form {
  padding-bottom: 84px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-dialog .dialog-head {
  margin-bottom: 16px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-dialog .dialog-head h2 {
  margin-bottom: 4px !important;
  letter-spacing: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-hero {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 14px 16px !important;
  border: 1px solid #d7e2e5 !important;
  border-radius: 8px !important;
  background: #eef7f6 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-base {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-base > img {
  width: 56px !important;
  height: 68px !important;
  flex: 0 0 56px !important;
  object-fit: cover !important;
  border: 1px solid #c7d8d9 !important;
  border-radius: 6px !important;
  background: #fff !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-base div {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-base span,
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline-head span {
  color: #387a75 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-base strong {
  color: #16383d !important;
  font-size: 20px !important;
  line-height: 1.1 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-base small {
  color: #5b6f76 !important;
  font-size: 12px !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-meta strong {
  color: #16383d !important;
  font-size: 13px !important;
  white-space: nowrap !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-pill {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 5px 9px !important;
  border: 1px solid #d7dfe4 !important;
  border-radius: 999px !important;
  color: #69767d !important;
  background: #fff !important;
  font-size: 11px !important;
  white-space: nowrap !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-pill.is-ready {
  color: #20635c !important;
  border-color: #a9d2ca !important;
  background: #e7f4f0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-stepper {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 14px 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-stepper span {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding: 8px 10px !important;
  border-bottom: 2px solid #dce5e6 !important;
  color: #7c898d !important;
  font-size: 12px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-stepper span.is-done {
  border-color: #3d8a80 !important;
  color: #276d66 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-stepper b {
  display: grid !important;
  place-items: center !important;
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
  border-radius: 50% !important;
  color: #fff !important;
  background: #9aa8aa !important;
  font-size: 11px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-stepper span.is-done b {
  background: #347d75 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-section {
  display: grid !important;
  gap: 12px !important;
  margin-top: 12px !important;
  padding: 12px !important;
  border: 1px solid #e0e6e8 !important;
  border-radius: 8px !important;
  background: #fff !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-section-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-section-head h3 {
  margin: 2px 0 4px !important;
  color: #22353a !important;
  font-size: 16px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-section-head p {
  margin: 0 !important;
  color: #758187 !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-head-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-head-actions > strong {
  color: #347d75 !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-cancel {
  color: #a64b45 !important;
  border-color: #e6c7c4 !important;
  background: #fffafa !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-cancel:hover:not(:disabled) {
  color: #8b332d !important;
  border-color: #d99b95 !important;
  background: #fff3f1 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-cancel:disabled {
  color: #aab4b8 !important;
  border-color: #e2e7e9 !important;
  background: #f6f8f8 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-card {
  display: grid !important;
  grid-template-rows: auto auto auto minmax(145px, 1fr) !important;
  gap: 9px !important;
  min-width: 0 !important;
  padding: 10px !important;
  border: 1px solid #dfe7e8 !important;
  border-radius: 7px !important;
  background: #fbfcfc !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-card:has(input:checked) {
  border-color: #7eb9af !important;
  box-shadow: 0 0 0 2px #e4f2ef !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-card.is-ready {
  border-color: #a9d2ca !important;
  background: #f5fbf9 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-card-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 6px !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-select {
  display: flex !important;
  align-items: flex-start !important;
  gap: 6px !important;
  min-width: 0 !important;
  color: #2d4447 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-select input {
  width: 15px !important;
  height: 15px !important;
  flex: 0 0 15px !important;
  margin: 1px 0 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-select span {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-status {
  flex: 0 0 auto !important;
  color: #758187 !important;
  font-size: 10px !important;
  white-space: nowrap !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-items {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-item {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 7px !important;
  align-items: center !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-item img {
  width: 34px !important;
  height: 42px !important;
  object-fit: cover !important;
  border: 1px solid #d9e2e3 !important;
  border-radius: 4px !important;
  background: #fff !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-item div {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-item strong,
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-numbers strong {
  color: #1e4e4e !important;
  font-size: 11px !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-item small {
  color: #7a878b !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-numbers {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
  padding-top: 8px !important;
  border-top: 1px solid #e5ebec !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-numbers span {
  color: #879397 !important;
  font-size: 10px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-effect {
  display: grid !important;
  place-items: center !important;
  min-width: 0 !important;
  min-height: 145px !important;
  overflow: hidden !important;
  border: 1px dashed #cbd9da !important;
  border-radius: 5px !important;
  background: #f6f8f8 !important;
  text-align: center !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-effect img {
  display: block !important;
  width: 100% !important;
  height: 145px !important;
  object-fit: cover !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-effect > div {
  display: grid !important;
  gap: 4px !important;
  padding: 10px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-effect strong {
  color: #50656a !important;
  font-size: 11px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-effect small {
  color: #8a979a !important;
  font-size: 10px !important;
  line-height: 1.4 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-effect > span {
  align-self: end !important;
  margin-top: -24px !important;
  padding: 4px 6px !important;
  color: #fff !important;
  background: rgba(25, 61, 62, .72) !important;
  font-size: 10px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-number-cloud {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-number-cloud span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 4px 8px !important;
  border: 1px solid #cae0dd !important;
  border-radius: 4px !important;
  color: #215e59 !important;
  background: #f0f8f6 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-size: 12px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-notify-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
  padding-top: 4px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-notify-row .subtle {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-prompt {
  display: grid !important;
  gap: 6px !important;
  margin-top: 12px !important;
  color: #50656a !important;
  font-size: 12px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-prompt textarea {
  min-height: 76px !important;
  resize: vertical !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline {
  display: grid !important;
  gap: 8px !important;
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid #e4eaeb !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline-head strong {
  color: #28484b !important;
  font-size: 13px !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 8px !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline-card {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
  padding: 8px !important;
  border: 1px solid #e2e8e9 !important;
  border-radius: 5px !important;
  background: #fbfcfc !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline-card > div {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 5px !important;
  min-width: 0 !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline-card > div strong {
  color: #2f494c !important;
  font-size: 11px !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline-status {
  color: #6d7b7e !important;
  font-size: 10px !important;
  white-space: nowrap !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline-card p {
  margin: 0 !important;
  color: #4f7070 !important;
  font-size: 10px !important;
  line-height: 1.4 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(#page, #createDialog, #productDialog)
  .styling-batch-inline-card img {
  width: 100% !important;
  height: 100px !important;
  object-fit: cover !important;
  border-radius: 4px !important;
}
@media (max-width: 1024px) {
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-grid,
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-inline-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 760px) {
  body.workspace-mode :is(#createDialog, #productDialog):has(> .dialog-inner.styling-batch-dialog) {
    width: calc(100vw - 18px) !important;
    max-width: calc(100vw - 18px) !important;
  }
  body.workspace-mode :is(#createDialog, #productDialog) > .dialog-inner.styling-batch-dialog {
    width: 100% !important;
    max-width: none !important;
    padding: 16px !important;
  }
  body.workspace-mode :is(#createDialog, #productDialog)
    > .dialog-inner.styling-batch-dialog > .form {
    padding-bottom: 132px !important;
  }
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-hero,
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-section-head,
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-notify-row {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-meta {
    justify-content: flex-start !important;
  }
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-stepper {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-grid,
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-inline-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 460px) {
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-grid,
  body.workspace-mode :is(#page, #createDialog, #productDialog) .styling-batch-inline-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* whole-page-card-surface=20260904-r1
 * The authenticated product is read as a set of operational surfaces, not a
 * full-bleed sheet. Give every module the same calm canvas, responsive gutter,
 * and card boundary while leaving dense tables responsible for their own
 * horizontal scrolling. */
body.workspace-mode {
  --page-card-gutter: clamp(14px, 2.4vw, 40px) !important;
  --page-card-gap: clamp(12px, 1.3vw, 20px) !important;
  --page-card-radius: 8px !important;
  --page-card-canvas: #edf2f6 !important;
  --page-card-surface: #ffffff !important;
  --page-card-border: #d7e1ea !important;
  --page-card-shadow: 0 2px 8px rgba(25, 49, 75, .06), 0 12px 28px rgba(25, 49, 75, .05) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace {
  background: var(--page-card-canvas) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar {
  padding-inline: var(--page-card-gutter) !important;
  background: var(--page-card-surface) !important;
  border-bottom: 1px solid var(--page-card-border) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.workbench-switcher, .workspace-tabs) {
  padding-inline: var(--page-card-gutter) !important;
  background: var(--page-card-canvas) !important;
  border-bottom: 0 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .page {
  width: calc(100% - (var(--page-card-gutter) * 2)) !important;
  max-width: 2240px !important;
  margin-inline: auto !important;
  padding: 22px 0 56px !important;
  background: transparent !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .page > .view-panel {
  display: grid !important;
  gap: var(--page-card-gap) !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Navigation keeps one panel active at a time. The hidden attribute must win
 * over the layout layer above, otherwise every previously opened module stays
 * visible and the workspace reads like one concatenated page. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel[hidden],
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .page > .view-panel[hidden] {
  display: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > :is(.toolbar, .panel, .product-workbench-panel, .dashboard-hero, .work-filter-bar),
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .page > .view-panel
  > :is(.toolbar, .panel, .product-workbench-panel, .dashboard-hero, .work-filter-bar) {
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  border: 1px solid var(--page-card-border) !important;
  border-radius: var(--page-card-radius) !important;
  background: var(--page-card-surface) !important;
  box-shadow: var(--page-card-shadow) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > :is(.toolbar, .panel, .product-workbench-panel, .dashboard-hero, .work-filter-bar) {
  overflow: visible !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > .toolbar {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding: 18px 20px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > .toolbar > :first-child {
  min-width: 0 !important;
  max-width: 78ch !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > .toolbar :is(h2, p, .toolbar-note) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > :is(.panel, .product-workbench-panel) > .panel-head,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > :is(.panel, .product-workbench-panel) > .product-list-head {
  min-width: 0 !important;
  padding: 15px 18px !important;
  border-bottom: 1px solid #e3eaf1 !important;
  border-radius: var(--page-card-radius) var(--page-card-radius) 0 0 !important;
  background: #f8fafc !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > :is(.panel, .product-workbench-panel) > :is(.panel-head, .product-list-head) > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > :is(.panel, .product-workbench-panel) > .table-wrap {
  width: calc(100% - 28px) !important;
  max-width: calc(100% - 28px) !important;
  margin: 0 14px 14px !important;
  border: 1px solid #e1e8ef !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > :is(.panel, .product-workbench-panel) > .table-wrap > table {
  border: 0 !important;
  border-radius: 6px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > :is(.metrics, .dashboard-kpi-grid, .dashboard-sales-grid, .dashboard-overview-grid, .dashboard-detail-grid, .schedule-kpis) {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  > :is(.metrics, .dashboard-kpi-grid, .dashboard-sales-grid, .dashboard-overview-grid, .dashboard-detail-grid, .schedule-kpis) {
  gap: var(--page-card-gap) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  :is(.metric, .metric-card, .dashboard-kpi-card, .dashboard-sales-card, .dashboard-module-card, .dashboard-intelligence-card, .work-card, .schedule-card, .schedule-product-card, .operation-connector-card, .risk-item, .attention-item) {
  min-width: 0 !important;
  border: 1px solid var(--page-card-border) !important;
  border-radius: var(--page-card-radius) !important;
  background: var(--page-card-surface) !important;
  box-shadow: var(--page-card-shadow) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  :is(.metric, .metric-card, .dashboard-kpi-card, .dashboard-sales-card, .dashboard-module-card, .dashboard-intelligence-card, .work-card, .schedule-card, .schedule-product-card, .operation-connector-card, .risk-item, .attention-item):hover {
  border-color: #b9cddd !important;
  box-shadow: 0 4px 12px rgba(25, 49, 75, .08), 0 16px 32px rgba(25, 49, 75, .06) !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  :is(.section-heading, .panel-head, .product-list-head, .toolbar, .form-grid, .panel-head-actions, .section-actions) {
  min-width: 0 !important;
  max-width: 100% !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  :is(.section-heading, .panel-head, .product-list-head) :is(h2, h3, h4, p, span, strong, small) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  :is(.panel, .product-workbench-panel) :is(input, select, textarea, button) {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  :is(.empty-state, .empty-state.compact) {
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 14px !important;
  border-radius: 6px !important;
  background: #f8fafc !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
  :is(.status-tag, .tag, .chip, .filter-chip, .effect-status) {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

@media (max-width: 1020px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .page {
    width: calc(100% - 28px) !important;
    padding-top: 18px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
    > .toolbar {
    gap: 12px !important;
    padding: 16px 17px !important;
  }
}

@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .topbar {
    padding-inline: 12px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.workbench-switcher, .workspace-tabs) {
    padding-inline: 12px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page,
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .page {
    width: calc(100% - 24px) !important;
    padding: 14px 0 40px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel {
    gap: 12px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
    > .toolbar {
    display: grid !important;
    gap: 10px !important;
    padding: 15px 14px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
    > .toolbar > :first-child {
    max-width: 100% !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > :is(.view-panel)
    > :is(.panel, .product-workbench-panel, .dashboard-hero, .work-filter-bar) {
    border-radius: 8px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
    > :is(.panel, .product-workbench-panel) > :is(.panel-head, .product-list-head) {
    display: flex !important;
    align-items: flex-start !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 13px 14px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
    > :is(.panel, .product-workbench-panel) > .table-wrap {
    width: calc(100% - 20px) !important;
    max-width: calc(100% - 20px) !important;
    margin: 0 10px 10px !important;
    border-radius: 6px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
    > :is(.metrics, .dashboard-kpi-grid, .dashboard-sales-grid, .dashboard-overview-grid, .dashboard-detail-grid, .schedule-kpis) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
    :is(.metric, .metric-card, .dashboard-kpi-card, .dashboard-sales-card) {
    min-height: 96px !important;
    padding: 13px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
    :is(.section-heading, .section-actions, .panel-head-actions) {
    align-items: flex-start !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
}
@media (max-width: 560px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
    > :is(.metrics, .dashboard-kpi-grid, .dashboard-sales-grid, .dashboard-overview-grid, .dashboard-detail-grid, .schedule-kpis) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel
    :is(.panel-head, .product-list-head) :is(.primary, .secondary, .action-link) {
    max-width: 100% !important;
  }
}

/* Material demand line-level purchasing workflow. */
body.workspace-mode .material-demand-center .panel-head {
  align-items: flex-start !important;
}
body.workspace-mode .material-demand-create-actions,
body.workspace-mode .material-row-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}
body.workspace-mode .material-status-strip {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(92px, 1fr)) !important;
  gap: 8px !important;
  margin: 14px 0 !important;
}
body.workspace-mode .material-status-strip > span {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 8px !important;
  min-height: 48px !important;
  padding: 10px 12px !important;
  border: 1px solid #d7e0e8 !important;
  border-radius: 6px !important;
  background: #f8fafb !important;
  color: #536474 !important;
}
body.workspace-mode .material-status-strip strong {
  color: #213445 !important;
  font-size: 20px !important;
}
body.workspace-mode .material-demand-table {
  min-width: 1180px !important;
}
body.workspace-mode .material-demand-table th:nth-child(3) {
  width: 300px !important;
}
body.workspace-mode .material-demand-table th:nth-child(4) {
  width: 390px !important;
}
body.workspace-mode .material-demand-table td > :is(strong, .subtle) {
  display: block !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .material-progress-list,
body.workspace-mode .material-purchase-list,
body.workspace-mode .material-purchase-lines {
  display: grid !important;
  gap: 8px !important;
}
body.workspace-mode .material-progress-line,
body.workspace-mode .material-purchase-item {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid #dce4ea !important;
  border-radius: 6px !important;
  background: #fbfcfd !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}
body.workspace-mode .material-progress-line span,
body.workspace-mode .material-purchase-meta,
body.workspace-mode .material-purchase-lines span {
  color: #607180 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}
body.workspace-mode .material-purchase-head,
body.workspace-mode .material-purchase-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px 10px !important;
}
body.workspace-mode .danger-text {
  color: #a53d3d !important;
}
body.workspace-mode dialog .material-dispatch-dialog {
  width: min(1080px, calc(100vw - 32px)) !important;
}
body.workspace-mode dialog .material-movement-dialog {
  width: min(560px, calc(100vw - 32px)) !important;
}
body.workspace-mode dialog .material-dispatch-table {
  min-width: 820px !important;
}
body.workspace-mode dialog .material-dispatch-table input[type="number"] {
  width: 120px !important;
  min-width: 100px !important;
}
@media (max-width: 900px) {
  body.workspace-mode .material-status-strip {
    grid-template-columns: repeat(3, minmax(92px, 1fr)) !important;
  }
}
@media (max-width: 560px) {
  body.workspace-mode .material-demand-center .panel-head,
  body.workspace-mode .material-demand-create-actions {
    display: grid !important;
    width: 100% !important;
    grid-template-columns: 1fr !important;
  }
  body.workspace-mode .material-status-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.workspace-mode dialog .material-movement-dialog {
    width: calc(100vw - 20px) !important;
  }
  body.workspace-mode .material-demand-table {
    width: 100% !important;
    min-width: 0 !important;
  }
  body.workspace-mode .material-demand-table :is(tbody, tr, td) {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  body.workspace-mode .material-purchase-head {
    justify-content: flex-start !important;
  }
  body.workspace-mode .material-purchase-item,
  body.workspace-mode .material-progress-line {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* pattern-sheet=20260904: compact, role-scoped release-sheet controls. */
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-section {
  border-top: 1px solid #d7e0ea !important;
  padding: 18px 0 4px !important;
  background: transparent !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-section .section-heading {
  align-items: flex-start !important;
  gap: 14px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-section .section-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-section .status-tag {
  white-space: nowrap !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-status-draft {
  color: #7a5b16 !important;
  background: #fff7df !important;
  border-color: #e9c979 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-status-printed {
  color: #176b52 !important;
  background: #e7f7ef !important;
  border-color: #91d4b6 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-summary {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 14px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-summary > div {
  min-width: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid #dfe6ee !important;
  background: transparent !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-summary span,
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-summary strong {
  display: block !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-summary span {
  color: #6c7d91 !important;
  font-size: 12px !important;
  margin-bottom: 4px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-summary-wide {
  grid-column: 1 / -1 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-audit {
  margin: 10px 0 0 !important;
}
body.workspace-mode dialog .pattern-sheet-dialog {
  max-width: 760px !important;
}
body.workspace-mode dialog .pattern-sheet-dialog .form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
@media (max-width: 700px) {
  body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 560px) {
  body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-section .section-heading {
    display: block !important;
  }
  body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog) .pattern-sheet-section .section-actions {
    justify-content: flex-start !important;
    margin-top: 10px !important;
  }
  body.workspace-mode dialog .pattern-sheet-dialog .form-grid {
    grid-template-columns: 1fr !important;
  }
}

/* 运营平台标签：避免全局状态胶囊样式与关闭按钮样式叠加 */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .tag-editor {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 12px 0 14px !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .tag-editor > .status-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 34px !important;
  padding: 0 5px 0 12px !important;
  border: 1px solid #d7e1ea !important;
  border-radius: 6px !important;
  background: #f7f9fb !important;
  color: #2f4258 !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  transform: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .tag-editor > .status-tag:hover {
  border-color: #bfd0df !important;
  background: #f2f6fa !important;
  box-shadow: none !important;
  transform: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .tag-editor > .status-tag > button {
  display: grid !important;
  place-items: center !important;
  width: 26px !important;
  min-width: 26px !important;
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: #7d8b99 !important;
  box-shadow: none !important;
  font-size: 16px !important;
  line-height: 1 !important;
  transform: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .tag-editor > .status-tag > button:hover {
  border: 0 !important;
  background: #fff0ef !important;
  color: #b23a32 !important;
  box-shadow: none !important;
  transform: none !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .tag-editor > .status-tag > button:focus-visible {
  outline: 2px solid #e1a29d !important;
  outline-offset: 2px !important;
}

@media (max-width: 560px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .tag-editor > .status-tag {
    min-height: 36px !important;
    padding-left: 11px !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .tag-editor > .status-tag > button {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
  }
}
/* model-image-preview-edge-to-edge=20260904-r1
 * Cover previews are supporting thumbnails, so the media should fill its
 * canvas instead of exposing letterbox gutters. The full image remains
 * available through the existing preview dialog. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .model-image-inline-source > img,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  #createDialog .model-image-source-preview {
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: transparent !important;
}

/* employee-status-neutral=20260904-r1
 * Directory facts should not look like progress badges. Enabled accounts and
 * phone login are normal operating conditions, so keep them quiet and compact;
 * paused/unbound states retain a restrained warning treatment. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .employee-account-status,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .account-login-status.is-phone,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .org-account-state.is-bound {
  display: inline-flex !important;
  align-items: center !important;
  width: max-content !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #607286 !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .employee-account-status.is-disabled,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .org-account-state.is-paused {
  color: #9a641d !important;
  background: transparent !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .account-login-status.is-account {
  color: #53677c !important;
  background: #eef3f7 !important;
  border-color: #d7e1e9 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .account-table .employee-account-status {
  justify-content: flex-start !important;
  white-space: nowrap !important;
}

/* account-table-optimization=20260916-r1
 * 账号列表视觉收口：列宽分配、状态标签样式、字段层级、响应式布局 */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table {
  table-layout: fixed !important;
}
/* 统一表头背景色 */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th {
  background: #f3f7fa !important;
}
/* 12列布局：姓名 工号 部门 职位 手机号 入职日期 登录手机号 登录方式 权限角色 账号状态 备注 操作 */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(1) { width: 7% !important; min-width: 70px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(2) { width: 6% !important; min-width: 60px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(3) { width: 8% !important; min-width: 80px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(4) { width: 8% !important; min-width: 80px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(5) { width: 9% !important; min-width: 90px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(6) { width: 8% !important; min-width: 80px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(7) { width: 9% !important; min-width: 90px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(8) { width: 8% !important; min-width: 80px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(9) { width: 12% !important; min-width: 110px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(10) { width: 8% !important; min-width: 80px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(11) { width: 10% !important; min-width: 100px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(12) { width: 7% !important; min-width: 70px !important; }

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .employee-account-status.is-enabled {
  display: inline-flex !important; align-items: center !important; padding: 4px 12px !important;
  border-radius: 12px !important; background: #e8f5e9 !important; color: #2e7d32 !important;
  font-size: 13px !important; font-weight: 500 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .employee-account-status.is-disabled {
  display: inline-flex !important; align-items: center !important; padding: 4px 12px !important;
  border-radius: 12px !important; background: #fafafa !important; color: #9a641d !important;
  font-size: 13px !important; font-weight: 500 !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table .row-actions {
  display: flex !important; gap: 8px !important; flex-wrap: nowrap !important; align-items: center !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table .row-actions button {
  flex-shrink: 0 !important; white-space: nowrap !important;
}

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-person strong {
  display: block !important; font-size: 14px !important; font-weight: 600 !important;
  color: #2c3e50 !important; margin-bottom: 4px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-binding-state {
  display: block !important; font-size: 12px !important; color: #607286 !important; margin-bottom: 2px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-person small {
  display: block !important; font-size: 12px !important; color: #95a5a6 !important;
}

@media (max-width: 1100px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(1) { width: 30% !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(2) { width: 25% !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(3) { width: 20% !important; }
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table thead th:nth-child(5) { width: auto !important; }
}
@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .account-table .row-actions { flex-wrap: wrap !important; }
}

/* inbound-page-layout=20260904-r1
 * Receiving work is a short operational loop: see the signal, create a
 * receipt, then review the ledger. Keep those stages compact and scannable. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-toolbar {
  display: flex !important;
  align-items: flex-end !important;
  min-height: 0 !important;
  margin: 0 0 12px !important;
  padding: 0 2px !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-toolbar h2 {
  margin: 0 !important;
  color: #1e3448 !important;
  font-size: 22px !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-toolbar p {
  max-width: 70ch !important;
  margin: 5px 0 0 !important;
  color: #6d7f91 !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary {
  gap: 1px !important;
  margin: 0 0 14px !important;
  overflow: hidden !important;
  border: 1px solid #dfe6ed !important;
  border-radius: 8px !important;
  background: #dfe6ed !important;
  box-shadow: none !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .metric {
  min-height: 82px !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-right: 1px solid #dfe6ed !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #fff !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .metric:last-child {
  border-right: 0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .metric-label {
  color: #65788b !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .metric-value {
  margin-top: 6px !important;
  color: #24384b !important;
  font-size: 27px !important;
  line-height: 1 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .metric-note {
  margin-top: 5px !important;
  color: #8a9aaa !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-panel,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-ledger-panel {
  overflow: hidden !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-panel .panel-head,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-ledger-panel .panel-head {
  min-height: 0 !important;
  padding: 13px 16px !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-panel .panel-head h3,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-ledger-panel .panel-head h3 {
  margin: 0 !important;
  color: #263d52 !important;
  font-size: 16px !important;
  line-height: 1.3 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-panel .panel-head .subtle,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-ledger-panel .panel-head .subtle {
  display: block !important;
  max-width: 70ch !important;
  margin-top: 4px !important;
  color: #7d8e9f !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-list {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 0 12px 12px !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-item {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 92px !important;
  padding: 12px 13px !important;
  border: 1px solid #dbe3eb !important;
  border-radius: 7px !important;
  background: #fff !important;
  box-shadow: none !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-code {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-code strong {
  color: #29445c !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-type {
  padding: 2px 6px !important;
  border-radius: 4px !important;
  color: #667b8f !important;
  background: #f0f4f8 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-name {
  display: block !important;
  overflow: visible !important;
  margin-top: 4px !important;
  color: #38536b !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-items: start !important;
  gap: 4px 10px !important;
  margin-top: 6px !important;
  color: #7a8c9d !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  white-space: normal !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-action {
  min-width: 96px !important;
  white-space: nowrap !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-ledger-panel .table-wrap {
  width: calc(100% - 24px) !important;
  margin: 0 12px 12px !important;
  border-radius: 6px !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-ledger-empty {
  min-height: 120px !important;
  margin: 0 12px 12px !important;
  border: 1px dashed #cfd9e3 !important;
  border-radius: 6px !important;
  background: #fbfcfe !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-row-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
}

@media (max-width: 900px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-list {
    grid-template-columns: 1fr !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .metric:nth-child(2) {
    border-right: 0 !important;
  }
}

@media (max-width: 560px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-toolbar {
    display: grid !important;
    gap: 0 !important;
    padding: 0 !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .metric {
    min-height: 74px !important;
    padding: 10px 11px !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .metric-value {
    margin-top: 4px !important;
    font-size: 23px !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-item {
    grid-template-columns: 1fr !important;
    align-items: start !important;
  }

  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-queue-action {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* inbound-workbench-filter=20260922-r1
 * Status cards and filter chips are the receiving workbench's navigation.
 * Keep the whole control surface keyboard-accessible and bounded on mobile. */
/* inventory-ledger=20260922-r1: warehouse balances and movements share the
 * receiving workbench's restrained table surface and narrow-screen contract. */
html body.workspace-mode #createDialog:has(.quality-review-dialog) {
  width: min(680px, calc(100vw - 32px)) !important;
  max-height: calc(100dvh - 32px) !important;
  background: #fff !important;
}
html body.workspace-mode #createDialog .quality-review-dialog {
  width: 100% !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}
html body.workspace-mode #createDialog .quality-review-context {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid #e0e5eb !important;
}
html body.workspace-mode #createDialog [data-quality-feedback] { color: #ad2638 !important; min-height: 20px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .inventory-summary {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .inventory-summary .metric {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  min-height: 100px !important;
  padding: 16px !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .inventory-summary .metric-value {
  font-size: 24px !important;
  overflow-wrap: anywhere !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page :is(.inventory-balance-panel, .inventory-ledger-panel) .table-wrap {
  overflow-x: auto !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page :is(.inventory-table, .inventory-ledger-table) {
  display: table !important;
  min-width: 760px !important;
  width: 100% !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page :is(.inventory-table, .inventory-ledger-table) thead { display: table-header-group !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page :is(.inventory-table, .inventory-ledger-table) tbody { display: table-row-group !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page :is(.inventory-table, .inventory-ledger-table) tr { display: table-row !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page :is(.inventory-table, .inventory-ledger-table) :is(th, td) { display: table-cell !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page :is(.inventory-table, .inventory-ledger-table) td::before { display: none !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .inventory-ledger-table td > .subtle { display: block !important; }
@media (max-width: 900px) {
  html body.workspace-mode .app-shell[data-ui-shell="r26"] #page .inventory-summary { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-toolbar,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-filter-row {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-toolbar-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-filter-panel {
  padding: 12px 16px !important;
  overflow: hidden !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-filter-row label {
  display: grid !important;
  gap: 5px !important;
  min-width: 180px !important;
  color: #65788b !important;
  font-size: 12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-filter-row .inventory-search-field {
  flex: 1 1 260px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-post-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 0 12px 12px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-post-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
  padding: 12px !important;
  border: 1px solid #dbe3eb !important;
  border-radius: 7px !important;
  background: #fff !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-post-item > div {
  display: grid !important;
  min-width: 0 !important;
  gap: 4px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-post-item .subtle {
  overflow-wrap: anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-dialog {
  width: min(720px, calc(100vw - 32px)) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-table,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-ledger-table {
  min-width: 760px !important;
}
@media (max-width: 900px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-post-list { grid-template-columns: 1fr !important; }
}
@media (max-width: 560px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-toolbar { align-items: stretch !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-toolbar-actions { width: 100% !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-toolbar-actions button { flex: 1 1 0 !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-post-item { align-items: stretch !important; flex-direction: column !important; }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) #page .inventory-post-item button { width: 100% !important; }
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .metric {
  min-width: 0 !important;
  padding: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .metric.is-selected {
  background: #f1f7fc !important;
  box-shadow: inset 0 -3px 0 #377aa5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .inbound-summary-filter {
  display: grid !important;
  width: 100% !important;
  min-height: 82px !important;
  grid-template-rows: auto auto 1fr !important;
  gap: 0 !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
  text-align: left !important;
  cursor: pointer !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .inbound-summary-filter:hover {
  background: #f7fbfe !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .inbound-summary-filter:focus-visible {
  outline: 2px solid #377aa5 !important;
  outline-offset: -3px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .inbound-summary-filter .metric-label,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .inbound-summary-filter .metric-value,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .inbound-summary-filter .metric-note {
  margin-left: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-panel {
  margin: 0 12px 12px !important;
  padding: 12px 14px !important;
  border: 1px solid #dfe6ed !important;
  border-radius: 6px !important;
  background: #fbfcfe !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-row {
  display: flex !important;
  align-items: flex-end !important;
  flex-wrap: wrap !important;
  gap: 12px 18px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-group {
  min-width: 0 !important;
  flex: 1 1 360px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-label {
  margin: 0 0 6px !important;
  color: #64798c !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  min-height: 28px !important;
  padding: 4px 8px !important;
  border: 1px solid #d7e0e8 !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #52677a !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-chip b {
  color: #8697a6 !important;
  font-size: 10px !important;
  font-variant-numeric: tabular-nums !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-chip.is-selected {
  border-color: #377aa5 !important;
  background: #edf6fb !important;
  color: #235d80 !important;
  box-shadow: inset 0 -2px 0 #377aa5 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-chip:focus-visible,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-reset:focus-visible {
  outline: 2px solid #377aa5 !important;
  outline-offset: 2px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-reset {
  flex: 0 0 auto !important;
  margin-bottom: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-summary {
  display: flex !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-top: 10px !important;
  padding-top: 9px !important;
  border-top: 1px solid #e4eaf0 !important;
  color: #74879a !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-summary strong {
  color: #3f566b !important;
  font-variant-numeric: tabular-nums !important;
}
@media (max-width: 900px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 560px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-summary .inbound-summary-filter {
    min-height: 74px !important;
    padding: 10px 11px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-row {
    display: grid !important;
    gap: 12px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-group {
    flex: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-reset {
    width: 100% !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .inbound-filter-summary {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
}

/* table-horizontal-scroll=20260904-r1
 * Populated business tables keep their intrinsic column track so the table
 * boundary can scroll to every field. Empty-state tables stay viewport-sized
 * and the document shell remains clipped horizontally. */
@media (min-width: 761px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    :is(.table-wrap, .procurement-table-wrap, .procurement-material-scroll, .design-material-editor-wrap):not(:has(> table > tbody > tr > td > .empty-state)) {
    overflow-x: auto !important;
    overflow-y: visible !important;
    overscroll-behavior-x: contain !important;
    scrollbar-gutter: stable !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    :is(.table-wrap, .procurement-table-wrap, .procurement-material-scroll, .design-material-editor-wrap):not(:has(> table > tbody > tr > td > .empty-state))
    > :is(table.product-table, table.data-table, table.wide-table, table.responsive-table,
      table.product-workbench-table, table.procurement-workbench-table, table.order-table,
      table.finance-invoice-table, table.hr-table, table.org-members-table, table.account-table,
      table.supplier-table, table.tenant-table, table.inbound-table, table.contract-table,
      table.risk-table, table.audit-table, table.operation-data-table,
      table.operation-sync-log-table, table.procurement-archive-table,
      table.dealer-material-list-table, table.design-material-table,
      table.procurement-material-table, table.procurement-material-wide-table,
      table.order-line-table, table.design-material-editor) {
    display: table !important;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;
    table-layout: fixed !important;
  }
}

/* table-horizontal-scroll=20260905-r2-final
 * Final cascade seal for generic workbench tables. The wrapper is the only
 * horizontal scroll owner; the table keeps its full business-column track. */
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region {
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
  touch-action: pan-x pan-y !important;
  scrollbar-width: auto !important;
  scrollbar-gutter: stable !important;
  padding-bottom: 8px !important;
  -webkit-overflow-scrolling: touch !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region:not(:has(> table > tbody > tr > td > .empty-state))
  > table.product-workbench-table {
  display: table !important;
  width: max-content !important;
  min-width: max-content !important;
  max-width: none !important;
  table-layout: auto !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region:not(:has(> table > tbody > tr > td > .empty-state))
  > table.product-workbench-table[data-column-contract="standard-9"] { min-width: 1364px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region:not(:has(> table > tbody > tr > td > .empty-state))
  > table.product-workbench-table[data-column-contract="design-11"] { min-width: 1640px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region:not(:has(> table > tbody > tr > td > .empty-state))
  > table.product-workbench-table[data-column-contract="pattern-12"] { min-width: 1777px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region:not(:has(> table > tbody > tr > td > .empty-state))
  > table.product-workbench-table[data-column-contract="catalog-9"] { min-width: 1320px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-controls {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-left: auto !important;
  flex: 0 0 auto !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  border: 1px solid #c8d6e4 !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: #365675 !important;
  cursor: pointer !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-button:hover:not(:disabled) {
  border-color: #6d9fd3 !important;
  background: #edf5fc !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-button:disabled {
  opacity: .38 !important;
  cursor: default !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region::-webkit-scrollbar {
  height: 12px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region::-webkit-scrollbar-track {
  background: #e7edf3 !important;
  border-radius: 8px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region::-webkit-scrollbar-thumb {
  background: #9aaec2 !important;
  border: 2px solid #e7edf3 !important;
  border-radius: 8px !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region:focus-visible {
  outline: 2px solid #5c94d6 !important;
  outline-offset: 2px !important;
}
@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-region {
    padding-bottom: 10px !important;
  }
  body.workspace-mode .app-shell[data-ui-shell="r26"] #page .product-table-scroll-controls {
    width: 100% !important;
    justify-content: flex-end !important;
    margin-left: 0 !important;
  }
}

/* pattern-assignment-state=20260905-r1
 * The responsibility column is informational now; the action rail owns the
 * actual dispatch buttons. Keep the state marker compact and legible so users
 * can distinguish an available action from an already assigned role. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-state {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 22px !important;
  padding: 2px 7px !important;
  border: 1px solid #dce5ec !important;
  border-radius: 999px !important;
  background: #f7f9fb !important;
  color: #7b8b99 !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-state.is-pending {
  border-color: #f1d6a7 !important;
  background: #fff9ed !important;
  color: #9a6513 !important;
  font-weight: 700 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern .pattern-assignment-action-state.is-done {
  border-color: #b9dfcf !important;
  background: #f0faf5 !important;
  color: #287556 !important;
}

/* first-level-workbench-actions=20260905-r2
 * Design and pattern makers need to make the next decision from the queue,
 * not hunt through a detail dialog first. Keep the action rail wide enough
 * for the legal row actions, and let the workbench boundary—not the document
 * shell—own the extra width. */
@media (min-width: 1181px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-table-scroll-region
    > table.product-workbench-table.product-workbench-table-design {
    width: max-content !important;
    min-width: 2240px !important;
    max-width: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-table-scroll-region
    > table.product-workbench-table.product-workbench-table-pattern {
    width: max-content !important;
    min-width: 2440px !important;
    max-width: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:is(.product-workbench-table-design, .product-workbench-table-pattern)
    :is(thead th:last-child, tbody td.product-actions-cell) {
    width: 430px !important;
    min-width: 430px !important;
    max-width: 430px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:is(.product-workbench-table-design, .product-workbench-table-pattern)
    tbody td.product-actions-cell {
    vertical-align: top !important;
    text-align: left !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:is(.product-workbench-table-design, .product-workbench-table-pattern)
    .workbench-direct-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    align-content: flex-start !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:is(.product-workbench-table-design, .product-workbench-table-pattern)
    .workbench-direct-actions > :is(.action-button, .workbench-row-idle, .pattern-row-idle) {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    max-width: none !important;
    white-space: nowrap !important;
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-table-scroll-region
    > table.product-workbench-table.product-workbench-table-design {
    width: max-content !important;
    min-width: 2100px !important;
    max-width: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-table-scroll-region
    > table.product-workbench-table.product-workbench-table-pattern {
    width: max-content !important;
    min-width: 2260px !important;
    max-width: none !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:is(.product-workbench-table-design, .product-workbench-table-pattern)
    :is(thead th:last-child, tbody td.product-actions-cell) {
    width: 390px !important;
    min-width: 390px !important;
    max-width: 390px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:is(.product-workbench-table-design, .product-workbench-table-pattern)
    .workbench-direct-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:is(.product-workbench-table-design, .product-workbench-table-pattern)
    .workbench-direct-actions > :is(.action-button, .workbench-row-idle, .pattern-row-idle) {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    max-width: none !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:is(.product-workbench-table-design, .product-workbench-table-pattern)
    .workbench-direct-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table:is(.product-workbench-table-design, .product-workbench-table-pattern)
    .workbench-direct-actions > .action-button {
    flex: 0 1 auto !important;
    display: inline-flex !important;
    max-width: 100% !important;
    white-space: normal !important;
  }
}

/* workbench-scope-density=20260905-r1
 * Scope-sensitive fields disappear at the terminal presentation layer while
 * the semantic table contract remains intact for alignment and accessibility.
 * Shared workbench rhythm is compact enough for scanning without collapsing
 * long business values or the action rail. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table
  :is(.workbench-matching-column.is-scope-hidden, .workbench-matching-cell.is-scope-hidden) {
  display: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.product-workbench-panel, .order-panel, .procurement-workbench-panel) > .panel-head,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.product-workbench-panel, .order-panel, .procurement-workbench-panel) .panel-head {
  gap: 8px 12px !important;
  padding-block: 10px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.product-workbench-panel, .order-panel, .procurement-workbench-panel) .panel-head h3 {
  font-size: 16px !important;
  line-height: 1.3 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.order-table, table.procurement-workbench-table)
  :is(th, td) {
  padding-block: 8px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.order-table, table.procurement-workbench-table) tbody tr {
  min-height: 0 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(table.product-workbench-table, table.order-table, table.procurement-workbench-table)
  :is(.product-row-actions, .procurement-direct-actions, .workbench-direct-actions) {
  gap: 6px !important;
}
@media (min-width: 1181px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-table-scroll-region
    > table.product-workbench-table.product-workbench-table-pattern {
    min-width: 2200px !important;
  }
}
@media (min-width: 761px) and (max-width: 1180px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .product-table-scroll-region
    > table.product-workbench-table.product-workbench-table-pattern {
    min-width: 2080px !important;
  }
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    :is(.product-workbench-panel, .order-panel, .procurement-workbench-panel) > .panel-head {
    padding-block: 8px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    :is(table.product-workbench-table, table.order-table, table.procurement-workbench-table)
    :is(th, td) {
    padding: 7px 9px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    table.product-workbench-table.product-workbench-table-pattern
    tbody td.workbench-matching-cell.is-scope-hidden::before {
    content: none !important;
  }
}

/* pagination-boundary=20260905-r1
 * Pagination is part of the list output boundary, not an accidental child of
 * the wide table track. Keep it inside the panel viewport, expose both controls
 * and allow the summary/actions to wrap without creating page overflow. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel > .pagination {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 10px 14px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 46px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 9px 12px !important;
  overflow: visible !important;
  border-top: 1px solid #dfe7ee !important;
  background: #fff !important;
  color: #65788c !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel > .pagination
  > .pagination-summary {
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel > .pagination
  > .pagination-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex: 0 0 auto !important;
  gap: 8px !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
  max-width: 100% !important;
  visibility: visible !important;
  opacity: 1 !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel > .pagination
  > .pagination-actions > button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 72px !important;
  min-height: 32px !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 10px !important;
  border: 1px solid #c8d6e4 !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #35608a !important;
  visibility: visible !important;
  opacity: 1 !important;
  white-space: nowrap !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel > .pagination
  > .pagination-actions > button:hover:not(:disabled),
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel > .pagination
  > .pagination-actions > button:focus-visible {
  border-color: #79a4c9 !important;
  background: #f2f7fc !important;
  color: #1f4f7d !important;
  outline: 2px solid #b9d5ec !important;
  outline-offset: 1px !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel > .pagination
  > .pagination-actions > button:disabled {
  cursor: not-allowed !important;
  opacity: .48 !important;
}
@media (max-width: 760px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .panel > .pagination {
    align-items: flex-start !important;
    padding-inline: 10px !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .panel > .pagination
    > .pagination-actions {
    width: 100% !important;
    justify-content: flex-end !important;
  }
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
    .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
    .panel > .pagination
    > .pagination-actions > button {
    min-width: 84px !important;
  }
}

/* styling-scope-boundary=20260905-r1
 * 搭配款号只在运营搭配详情中呈现。一级工作台继续保留旧表格占位列以
 * 兼容历史列契约，但不能再显示列内容或遗留的移动端伪标题。 */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table
  :is(.workbench-matching-column, .workbench-matching-cell) {
  display: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(9)::before {
  content: "颜色 / 尺码 / SKU" !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-design tbody td:nth-child(10)::before,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table.product-workbench-table-pattern tbody td:nth-child(10)::before,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.product-workbench-table-design):not(.product-workbench-table-pattern) tbody td:nth-child(8)::before,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  table.product-workbench-table:not(.product-workbench-table-design):not(.product-workbench-table-pattern) tbody td:nth-child(9)::before {
  content: none !important;
}

/* workbench-visibility-scroll=20260905-r3-terminal
 * Keep the final cascade after all compatibility selectors. The panel grows
 * naturally while each table wrapper exposes the complete business width. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  > .view-panel[hidden] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  > .view-panel > :is(.panel, .product-workbench-panel, .order-panel) {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.table-wrap, .product-table-scroll-region, .procurement-table-wrap,
    .procurement-material-scroll, .design-material-editor-wrap) {
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  overscroll-behavior-x: contain !important;
  scrollbar-width: auto !important;
  scrollbar-gutter: stable !important;
  -webkit-overflow-scrolling: touch !important;
}
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  :is(.table-wrap, .product-table-scroll-region, .procurement-table-wrap,
    .procurement-material-scroll, .design-material-editor-wrap)
  > table {
  width: max-content !important;
  min-width: max-content !important;
  max-width: none !important;
}

/* schedule-product-picker-contrast=20260909-r1
 * The schedule dialog is mounted beside the shell. Keep selectable products
 * on the authenticated light surface so legacy dark rules cannot hide text. */
body.workspace-mode .dialog .schedule-product-picker,
body.workspace-mode .dialog .schedule-product-option,
body.workspace-mode .dialog .schedule-selected-chip {
  color: #24364a !important;
  border-color: #cbd5df !important;
  background: #fff !important;
  color-scheme: light !important;
  box-shadow: none !important;
}
body.workspace-mode .dialog .schedule-product-option:hover,
body.workspace-mode .dialog .schedule-product-option:focus-within,
body.workspace-mode .dialog .schedule-product-option.selected {
  color: #24364a !important;
  border-color: #a9bfd4 !important;
  background: #f4f7fa !important;
}
body.workspace-mode .dialog .schedule-product-option strong {
  color: #20364e !important;
}

/* design-material-context=20260909-r1: keep the current style identity visible
 * while editing a multi-row material list, including after returning from a
 * temporary interruption. */
body.workspace-mode .dialog .design-material-context {
  display: grid !important;
  grid-template-columns: 64px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  margin: 0 0 14px !important;
  padding: 10px 12px !important;
  border: 1px solid #cbdbea !important;
  background: #f3f8fc !important;
  color: #24364a !important;
}
body.workspace-mode .dialog .design-material-context-image {
  width: 64px !important;
  height: 82px !important;
  max-width: 64px !important;
  max-height: 82px !important;
  object-fit: cover !important;
  border-radius: 4px !important;
  background: #e7edf3 !important;
  display: block !important;
  overflow: hidden !important;
}
body.workspace-mode .dialog .design-material-context strong,
body.workspace-mode .dialog .design-material-context span,
body.workspace-mode .dialog .design-material-context small {
  display: block !important;
}
body.workspace-mode .dialog .design-material-context strong {
  color: #1f4f7c !important;
  font-size: 17px !important;
}
body.workspace-mode .dialog .design-material-context span {
  margin-top: 2px !important;
  color: #3e5871 !important;
}
body.workspace-mode .dialog .design-material-context small {
  margin-top: 5px !important;
  color: #6b7f93 !important;
}
body.workspace-mode .dialog .schedule-product-option small {
  color: #69788b !important;
}
body.workspace-mode .dialog .schedule-selected-chip {
  color: #9c3028 !important;
  border-color: #efc0ba !important;
  background: #fff5f4 !important;
}
body.workspace-mode .dialog .schedule-selected-chip button {
  color: #69788b !important;
  background: #fff !important;
}

/* product-record-cards=20260910-r2
 * Actual component boundary owns sizing, replacing inherited wide-table and
 * fixed-row constraints. Keep semantic columns, permissions and event handlers. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel {
  min-width:0 !important;
  max-width:100% !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel > .product-table-scroll-region {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  margin:0 !important;
  padding:14px !important;
  box-sizing:border-box !important;
  overflow:visible !important;
  scrollbar-gutter:auto !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout {
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  table-layout:auto !important;
  border-spacing:0 !important;
  border:0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > thead {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  margin:-1px !important;
  padding:0 !important;
  overflow:hidden !important;
  clip-path:inset(50%) !important;
  white-space:nowrap !important;
  border:0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:14px !important;
  align-items:stretch !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  padding:0 !important;
  margin:0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row {
  display:grid !important;
  grid-template-columns:96px minmax(0,1fr) !important;
  grid-auto-rows:max-content !important;
  grid-template-rows:none !important;
  align-self:stretch !important;
  align-content:start !important;
  align-items:start !important;
  gap:8px 12px !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  padding:14px 14px 0 !important;
  margin:0 !important;
  box-sizing:border-box !important;
  border:1px solid #d2dce6 !important;
  border-radius:5px !important;
  background:#fff !important;
  box-shadow:none !important;
  overflow:visible !important;
  transform:none !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row:hover,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row:focus-within {
  border-color:#8faabd !important;
  box-shadow:none !important;
  transform:none !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row > td {
  display:block !important;
  position:static !important;
  inset:auto !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  justify-self:stretch !important;
  align-self:start !important;
  box-sizing:border-box !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  background:transparent !important;
  color:#28405a !important;
  line-height:1.45 !important;
  white-space:normal !important;
  overflow:visible !important;
  overflow-wrap:anywhere !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row > td::before {
  content:none !important;
  display:none !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row > td:nth-child(1) {
  grid-area:style !important;
  padding-bottom:8px !important;
  border-bottom:1px solid #e0e7ed !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row > td:nth-child(2) {
  grid-area:image !important;
  align-self:start !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row .style-code-actions {
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:6px !important;
  min-width:0 !important;
  max-width:100% !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row .style-code {
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  color:#173957 !important;
  font-size:16px !important;
  line-height:1.4 !important;
  font-weight:700 !important;
  white-space:normal !important;
  overflow:visible !important;
  overflow-wrap:anywhere !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row > td:nth-child(2) > :is(.product-image,.product-thumbnail-frame) {
  display:block !important;
  width:96px !important;
  height:128px !important;
  min-width:0 !important;
  max-width:96px !important;
  max-height:128px !important;
  object-fit:cover !important;
  border-radius:4px !important;
  background:#f1f4f6 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row > td.workbench-matching-cell {
  display:none !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row > td.product-actions-cell {
  grid-area:actions !important;
  justify-self:stretch !important;
  align-self:end !important;
  width:auto !important;
  max-width:none !important;
  margin:8px -14px 0 !important;
  padding:10px 14px !important;
  border-top:1px solid #e0e7ed !important;
  border-radius:0 0 5px 5px !important;
  background:#f8fafb !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row :is(.product-row-actions,.workbench-direct-actions) {
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:6px !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  margin:0 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row :is(.product-row-actions,.workbench-direct-actions) > :is(button,.action-button) {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 1 auto !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  height:auto !important;
  min-height:32px !important;
  padding:6px 9px !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  line-height:1.4 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row :is(.stack,.pattern-workbench-details,.pattern-assignment-list,.owner-role-list,.workbench-lifecycle-inline,.workbench-lifecycle-inline-main,.workbench-progress-summary) {
  min-width:0 !important;
  max-width:100% !important;
  width:auto !important;
  white-space:normal !important;
  overflow:visible !important;
  overflow-wrap:anywhere !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row :is(.stack,.pattern-assignment-list,.owner-role-list) {
  gap:4px !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row :is(.stack strong,.stack span,.owner-role-line strong,.pattern-workbench-value) {
  min-width:0 !important;
  max-width:100% !important;
  white-space:normal !important;
  overflow:visible !important;
  overflow-wrap:anywhere !important;
  text-overflow:clip !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row .subtle {
  color:#596f82 !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row .owner-role-line {
  grid-template-columns:48px minmax(0,1fr) !important;
  gap:6px !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-catalog > tbody > tr.product-row {
  grid-template-rows:repeat(5,max-content) minmax(max-content,1fr) max-content !important;
  grid-template-areas:"image style" "image name" "image identity" "image category" "image owner" "meta meta" "actions actions" !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-catalog > tbody > tr.product-row > td:nth-child(3) {
  grid-area:name !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-catalog > tbody > tr.product-row > td:nth-child(4) {
  grid-area:identity !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-catalog > tbody > tr.product-row > td:nth-child(5) {
  grid-area:category !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-catalog > tbody > tr.product-row > td:nth-child(6) {
  grid-area:owner !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-catalog > tbody > tr.product-row > td:nth-child(7) {
  grid-area:meta !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-catalog > tbody > tr.product-row > td:nth-child(7) {
  padding-top:8px !important;
  border-top:1px solid #e0e7ed !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-design > tbody > tr.product-row {
  grid-template-rows:repeat(7,max-content) minmax(max-content,1fr) max-content !important;
  grid-template-areas:"style style" "image identity" "image category" "image flow" "owner owner" "details details" "materials materials" "meta meta" "actions actions" !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-design > tbody > tr.product-row > td:nth-child(3) {
  grid-area:identity !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-design > tbody > tr.product-row > td:nth-child(4) {
  grid-area:category !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-design > tbody > tr.product-row > td:nth-child(5) {
  grid-area:flow !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-design > tbody > tr.product-row > td:nth-child(6) {
  grid-area:details !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-design > tbody > tr.product-row > td:nth-child(7) {
  grid-area:materials !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-design > tbody > tr.product-row > td:nth-child(8) {
  grid-area:owner !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-design > tbody > tr.product-row > td:nth-child(9) {
  grid-area:meta !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-design > tbody > tr.product-row > td:nth-child(9) {
  padding-top:8px !important;
  border-top:1px solid #e0e7ed !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-pattern > tbody > tr.product-row {
  grid-template-rows:repeat(7,max-content) minmax(max-content,1fr) max-content !important;
  grid-template-areas:"style style" "image identity" "image category" "image flow" "owner owner" "details details" "meta meta" "plan plan" "actions actions" !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-pattern > tbody > tr.product-row > td:nth-child(3) {
  grid-area:identity !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-pattern > tbody > tr.product-row > td:nth-child(4) {
  grid-area:category !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-pattern > tbody > tr.product-row > td:nth-child(5) {
  grid-area:flow !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-pattern > tbody > tr.product-row > td:nth-child(6) {
  grid-area:details !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-pattern > tbody > tr.product-row > td:nth-child(7) {
  grid-area:owner !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-pattern > tbody > tr.product-row > td:nth-child(8) {
  grid-area:assignment !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-pattern > tbody > tr.product-row > td:nth-child(9) {
  grid-area:meta !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-pattern > tbody > tr.product-row > td:nth-child(11) {
  grid-area:plan !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-pattern > tbody > tr.product-row > td:nth-child(9) {
  padding-top:8px !important;
  border-top:1px solid #e0e7ed !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.product-workbench-table-catalog .product-style-name-cell .subtle {
  display:none !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.is-empty > tbody {
  display:block !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.is-empty > tbody > tr,
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.is-empty > tbody > tr > td {
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  height:auto !important;
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout.is-empty .empty-state {
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}

@media (max-width:760px) {
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel > .product-table-scroll-region { padding:10px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row { grid-template-columns:84px minmax(0,1fr) !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody > tr.product-row > td:nth-child(2) > :is(.product-image,.product-thumbnail-frame) { width:84px !important; height:112px !important; max-width:84px !important; max-height:112px !important; }
}

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout .pattern-assignment-cell.is-scope-hidden { display:none !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout .pattern-card-assignments { display:grid !important; grid-template-rows:none !important; grid-auto-rows:max-content !important; gap:6px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout .pattern-card-assignments .pattern-assignment-line { display:flex !important; align-items:start !important; gap:8px !important; min-height:0 !important; height:auto !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout .pattern-card-assignments .pattern-assignment-person { min-width:0 !important; grid-template-columns:60px minmax(0,1fr) !important; gap:2px 6px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout .pattern-card-assignments .pattern-assignment-person :is(strong,small) { overflow-wrap:anywhere !important; white-space:normal !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode))
  .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout .pattern-card-assignments .pattern-assignment-action-state { flex:0 0 auto !important; }

/* Business submission feedback: visible above native dialogs, no layout shift. */
body.workspace-mode .mutation-notice,
body.auth-mode .mutation-notice {
  position: fixed !important; inset: 20px 16px auto auto !important; margin: 0 !important;
  width: max-content !important; max-width: min(520px, calc(100vw - 32px)) !important;
  padding: 14px 16px !important; border: 1px solid #aacdbb !important; border-radius: 6px !important;
  background: #edf8f1 !important; color: #145b38 !important; z-index: 2147483647 !important;
  font-size: 14px !important; line-height: 1.6 !important; box-shadow: 0 6px 20px #17324d20 !important;
}
body.workspace-mode .mutation-notice[hidden],
body.auth-mode .mutation-notice[hidden] { display: none !important; }
body.workspace-mode .mutation-notice[data-kind="pending"],
body.auth-mode .mutation-notice[data-kind="pending"] { background: #eff6ff !important; color: #17477e !important; border-color: #b4cbe5 !important; }
body.workspace-mode .mutation-notice[data-kind="error"],
body.auth-mode .mutation-notice[data-kind="error"] { background: #fff1f0 !important; color: #9c2424 !important; border-color: #e7b5b0 !important; }
body.workspace-mode .mutation-notice[data-kind="warning"],
body.auth-mode .mutation-notice[data-kind="warning"] { background: #fff8e8 !important; color: #79510b !important; border-color: #dfc78e !important; }
body.workspace-mode .mutation-notice button,
body.auth-mode .mutation-notice button { color: inherit !important; background: transparent !important; border: 0 !important; text-decoration: underline !important; margin-left: 14px !important; padding: 4px !important; cursor: pointer !important; }
body.workspace-mode .mutation-form-status,
body.auth-mode .mutation-form-status { color: #17477e !important; margin: 8px 0 !important; width: 100% !important; overflow-wrap: anywhere !important; }
body.workspace-mode .mutation-form-status[data-kind="success"],
body.auth-mode .mutation-form-status[data-kind="success"] { color: #145b38 !important; }
body.workspace-mode .mutation-form-status[data-kind="error"],
body.auth-mode .mutation-form-status[data-kind="error"] { color: #9c2424 !important; }
body.workspace-mode button[data-mutation-pending="true"],
body.auth-mode button[data-mutation-pending="true"] { cursor: wait !important; opacity: .75 !important; }

/* Shared pagination jump: visible labels, inline validation and touch-sized controls. */
body.workspace-mode #page .pagination .pagination-jump {
  display:flex !important; flex-wrap:wrap !important; align-items:center !important;
  gap:8px !important; margin:0 !important; padding:0 !important; min-width:0 !important;
}
body.workspace-mode #page .pagination .pagination-jump label {
  display:flex !important; align-items:center !important; gap:6px !important;
  width:auto !important; margin:0 !important; white-space:nowrap !important;
  font-size:13px !important; font-weight:400 !important; color:#52677c !important;
}
body.workspace-mode #page .pagination .pagination-jump input {
  width:64px !important; min-width:0 !important; height:36px !important;
  padding:4px 6px !important; margin:0 !important; box-sizing:border-box !important;
  border:1px solid #b5c6d7 !important; border-radius:4px !important;
  text-align:center !important; font-size:14px !important; color:#243e58 !important; background:#fff !important;
}
body.workspace-mode #page .pagination .pagination-jump button {
  width:auto !important; min-width:60px !important; height:36px !important;
  padding:0 12px !important; margin:0 !important; border:1px solid #b5c6d7 !important;
  border-radius:4px !important; color:#24517c !important; background:#f4f8fc !important;
}
body.workspace-mode #page .pagination .pagination-jump :is(input,button):focus-visible {
  outline:2px solid #79a4c9 !important; outline-offset:2px !important;
}
body.workspace-mode #page .pagination .pagination-jump input[aria-invalid="true"] { border-color:#b83d38 !important; }
body.workspace-mode #page .pagination .pagination-error {
  flex-basis:100% !important; color:#a32929 !important; font-size:13px !important; white-space:normal !important;
}
body.workspace-mode #page .pagination .pagination-error:empty { display:none !important; }
@media (max-width:1199px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:900px) {
  html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .product-card-panel table.product-workbench-table.product-card-layout > tbody { grid-template-columns:minmax(0,1fr) !important; }
}
@media (max-width:760px) {
  body.workspace-mode #page .pagination .pagination-jump { flex-basis:100% !important; justify-content:flex-end !important; }
  body.workspace-mode #page .pagination .pagination-jump :is(input,button) { height:40px !important; }
}

/* Design flow: the exception detail may overlap the main lifecycle. */
body.workspace-mode #page :is([data-view="design"],[data-view="pattern"]) .failed-fitting-detail {
  display:flex !important; flex-direction:column !important; gap:5px !important; margin-top:10px !important;
  padding:9px 10px !important; border-left:3px solid #bb6251 !important; background:#fff7f4 !important;
  color:#754739 !important; font-size:12px !important; line-height:1.5 !important; overflow-wrap:anywhere !important;
}
body.workspace-mode #page :is([data-view="design"],[data-view="pattern"]) .failed-fitting-detail :is(strong,span) {
  color:inherit !important; white-space:normal !important; overflow-wrap:anywhere !important;
}
body.workspace-mode #page :is([data-view="design"],[data-view="pattern"]) .failed-fitting-hint {
  margin:0 0 12px !important; padding:10px 12px !important; font-size:13px !important;
  line-height:1.6 !important; color:#754739 !important; background:#fff7f4 !important; border-radius:4px !important;
}

/* Product thumbnails share a clipped display frame; original media stays intact. */
body.workspace-mode #page .product-thumbnail-frame {
  display:inline-block !important; position:relative !important; vertical-align:middle !important;
  flex-shrink:0 !important; overflow:hidden !important; box-sizing:border-box !important;
  width:var(--thumbnail-width,64px) !important; height:var(--thumbnail-height,84px) !important;
  border:1px solid #dbe4ed !important; border-radius:4px !important; background:#f1f4f6 !important;
}
body.workspace-mode #page .product-thumbnail-frame:focus-within { outline:2px solid #79a4c9 !important; outline-offset:2px !important; }

/* direct-development-completion=20260910 */
body.workspace-mode #page .development-completion-tag {display:inline-flex!important;align-items:center!important;width:fit-content!important;max-width:100%!important;padding:3px 7px!important;border:1px solid #b8dccc!important;border-radius:4px!important;background:#f0f8f4!important;color:#255e48!important;font-size:12px!important;line-height:1.5!important;overflow-wrap:anywhere!important;}

/* audit-event-clarity=20260910: identity/time/action precede technical diffs. */
body.workspace-mode :is(#page,#productDialog) .history-feed .audit-event-head {
  display:flex !important; flex-wrap:wrap !important; align-items:baseline !important;
  gap:6px 20px !important; color:#20384e !important; font-size:14px !important; line-height:1.6 !important;
}
body.workspace-mode :is(#page,#productDialog) .history-feed .audit-event-head :is(strong,time) {
  color:inherit !important; white-space:normal !important; overflow-wrap:anywhere !important;
}
body.workspace-mode :is(#page,#productDialog) .history-feed .audit-event-action {
  margin:6px 0 !important; color:#20384e !important; font-size:15px !important;
  font-weight:600 !important; line-height:1.6 !important; overflow-wrap:anywhere !important;
}
body.workspace-mode :is(#page,#productDialog) .history-feed .feed-item > div {
  min-width:0 !important; max-width:100% !important;
}
body.workspace-mode :is(#page,#productDialog) .history-feed .history-change {
  display:grid !important; grid-template-columns:minmax(100px,.7fr) minmax(0,1fr) 18px minmax(0,1fr) !important;
  align-items:start !important; gap:8px !important;
}
body.workspace-mode :is(#page,#productDialog) .history-feed .history-change > * {
  min-width:0 !important; max-width:100% !important; white-space:normal !important;
  overflow-wrap:anywhere !important; height:auto !important;
}
body.workspace-mode #productDialog .history-head-actions {
  display:flex !important; flex-wrap:wrap !important; gap:8px !important; flex-shrink:0 !important;
}
@media (max-width:760px) {
  body.workspace-mode :is(#page,#productDialog) .history-feed .history-change {
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  }
  body.workspace-mode :is(#page,#productDialog) .history-feed .history-change > span:first-child {
    grid-column:1 / -1 !important;
  }
  body.workspace-mode :is(#page,#productDialog) .history-feed .history-change > del { grid-column:1 !important; }
  body.workspace-mode :is(#page,#productDialog) .history-feed .history-change > b { display:none !important; }
  body.workspace-mode :is(#page,#productDialog) .history-feed .history-change > ins { grid-column:2 !important; }
  body.workspace-mode #productDialog .history-head {
    flex-wrap:wrap !important; gap:10px !important;
  }
}

/* account-protection-note=20260911: informational text, not a disabled action/pill. */
body.workspace-mode .app-shell #page .account-protection-note {
  display:grid !important; gap:4px !important; width:fit-content !important;
  max-width:100% !important; min-width:0 !important; padding:2px 0 !important;
  border:0 !important; border-radius:0 !important; background:transparent !important;
  text-align:left !important; line-height:1.5 !important; white-space:normal !important;
}
body.workspace-mode .app-shell #page .account-protection-note strong {
  display:block !important; margin:0 !important; color:#20384e !important;
  font-size:13px !important; font-weight:600 !important; line-height:1.5 !important;
}
body.workspace-mode .app-shell #page .account-protection-note > small {
  display:block !important; margin:0 !important; color:#52677d !important;
  font-size:12px !important; font-weight:400 !important; line-height:1.5 !important;
  white-space:normal !important; overflow-wrap:anywhere !important;
}
body.workspace-mode .app-shell #page .account-protection-heading {
  display:flex !important; flex-wrap:wrap !important; align-items:baseline !important; gap:4px 8px !important;
}
body.workspace-mode .app-shell #page .account-protection-heading > span {
  color:#52677d !important; font-size:11px !important; font-weight:400 !important; line-height:1.5 !important;
}

/* Business report contract: content-sized filters, scoped scrolling, real units. */
body.workspace-mode .business-reports { display: grid !important; gap: 14px !important; min-width: 0 !important; color: var(--ink, #233a4d) !important; }
body.workspace-mode .business-reports :is(h2,h3,p) { margin: 0 !important; }
body.workspace-mode .business-reports h2 { font-size: 24px !important; line-height: 1.4 !important; }
body.workspace-mode .business-reports h3 { font-size: 16px !important; line-height: 1.6 !important; }
body.workspace-mode .business-reports small { font-size: 12px !important; font-weight: 400 !important; color: #677c91 !important; }
body.workspace-mode .br-header, body.workspace-mode .br-detail-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; flex-wrap: wrap !important; }
body.workspace-mode .br-header p, body.workspace-mode .br-detail-head p { font-size: 13px !important; color: #63788d !important; line-height: 1.7 !important; }
body.workspace-mode .business-reports button { min-height: 38px !important; white-space: nowrap !important; flex-shrink: 0 !important; font-size: 13px !important; }
body.workspace-mode .br-directory { padding: 16px 20px !important; border: 1px solid #d9e3ec !important; border-radius: 8px !important; background: #fff !important; min-width: 0 !important; }
body.workspace-mode .br-directory summary { cursor: pointer !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.8 !important; }
body.workspace-mode .br-directory summary span { font-size: 12px !important; font-weight: 400 !important; color: #526b81 !important; margin-left: 12px !important; }
body.workspace-mode .br-directory > label { display: grid !important; gap: 6px !important; max-width: 360px !important; margin-block: 16px !important; font-size: 13px !important; }
body.workspace-mode .br-directory input { width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; height: 40px !important; }
body.workspace-mode .br-directory nav { display: grid !important; gap: 18px !important; }
body.workspace-mode .br-directory section { display: grid !important; grid-template-columns: 120px minmax(0,1fr) !important; gap: 12px !important; align-items: baseline !important; }
body.workspace-mode .br-directory section > div { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; }
body.workspace-mode .br-directory button { white-space: normal !important; text-align: left !important; background: transparent !important; border: 1px solid transparent !important; color: #304c64 !important; padding: 6px 10px !important; }
body.workspace-mode .br-directory button:is(:hover,[aria-current="page"]) { background: #eaf2fb !important; border-color: #bfd0e1 !important; color: #244f7a !important; }
body.workspace-mode .br-directory [hidden] { display: none !important; }
body.workspace-mode .br-directory :is(button,summary,input):focus-visible { outline: 2px solid #315f90 !important; outline-offset: 2px !important; }
@media (max-width: 600px) { body.workspace-mode .br-directory section { grid-template-columns: minmax(0,1fr) !important; gap: 5px !important; } }
body.workspace-mode .br-filters { display: grid !important; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)) !important; gap: 14px !important; padding: 20px !important; background: #fff !important; border: 1px solid #d9e3ec !important; border-radius: 10px !important; min-width: 0 !important; }
body.workspace-mode .br-filters label { display: grid !important; gap: 6px !important; min-width: 0 !important; font-size: 12px !important; color: #5b7085 !important; }
body.workspace-mode .br-filters :is(input,select) { width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: 40px !important; font-size: 13px !important; box-sizing: border-box !important; }
body.workspace-mode .br-filter-actions { display: flex !important; align-items: end !important; gap: 8px !important; flex-wrap: wrap !important; }
body.workspace-mode .br-context { display: flex !important; gap: 8px 18px !important; flex-wrap: wrap !important; align-items: baseline !important; font-size: 12px !important; line-height: 1.7 !important; color: #63788d !important; }
body.workspace-mode .br-context strong { font-size: 18px !important; color: #22394e !important; }
body.workspace-mode .br-summary { display: flex !important; flex-wrap: wrap !important; background: #fff !important; border-block: 1px solid #d9e3ec !important; }
body.workspace-mode .br-summary > div { display: grid !important; align-content: start !important; gap: 8px !important; padding: 20px 24px !important; flex: 1 1 170px !important; min-width: 0 !important; }
body.workspace-mode .br-summary span { font-size: 12px !important; color: #63788d !important; }
body.workspace-mode .br-summary strong { font-size: 28px !important; font-weight: 650 !important; font-variant-numeric: tabular-nums !important; overflow-wrap: anywhere !important; }
body.workspace-mode .br-summary strong small { margin-left: 6px !important; }
body.workspace-mode .br-explanation { font-size: 12px !important; line-height: 1.8 !important; color: #63788d !important; }
body.workspace-mode .br-analysis { display: grid !important; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) !important; gap: 24px !important; padding: 20px !important; background: #fff !important; border: 1px solid #d9e3ec !important; border-radius: 10px !important; }
body.workspace-mode .br-analysis section { min-width: 0 !important; }
body.workspace-mode .br-analysis h3 small { display: block !important; }
body.workspace-mode .br-bars { display: grid !important; gap: 6px !important; margin-top: 12px !important; max-height: 340px !important; overflow: auto !important; }
body.workspace-mode .br-bars button { display: grid !important; grid-template-columns: minmax(100px,1fr) minmax(30px,2fr) 64px !important; align-items: center !important; gap: 12px !important; border: 0 !important; border-radius: 4px !important; background: transparent !important; padding: 8px !important; text-align: left !important; min-width: 0 !important; }
body.workspace-mode .br-bars button:hover { background: #eef5fa !important; }
body.workspace-mode .br-bars button span { white-space: normal !important; overflow-wrap: anywhere !important; }
body.workspace-mode .br-bars i { height: 9px !important; width: 100% !important; background: linear-gradient(to right,#368b92 var(--bar),#edf2f5 var(--bar)) !important; border-radius: 2px !important; }
body.workspace-mode .br-bars strong, body.workspace-mode .br-months strong { text-align: right !important; font-variant-numeric: tabular-nums !important; }
body.workspace-mode .br-bars .br-completed-count { display: block !important; white-space: normal !important; line-height: 1.6 !important; margin-left: 0 !important; }
body.workspace-mode .br-bars small, body.workspace-mode .br-months small { margin-left: 5px !important; }
body.workspace-mode .br-months { display: grid !important; align-content: start !important; gap: 6px !important; max-height: 340px !important; overflow: auto !important; margin-top: 12px !important; }
body.workspace-mode .br-months button { display: flex !important; justify-content: space-between !important; gap: 16px !important; border: 0 !important; border-bottom: 1px solid #edf2f5 !important; border-radius: 0 !important; background: transparent !important; padding: 8px !important; }
body.workspace-mode .br-table-scroll { width: 100% !important; min-width: 0 !important; overflow: auto !important; border: 1px solid #d9e3ec !important; border-radius: 8px !important; background: #fff !important; }
body.workspace-mode .br-table { border-collapse: collapse !important; min-width: 1100px !important; width: 100% !important; table-layout: auto !important; font-size: 13px !important; }
body.workspace-mode .br-table :is(th,td) { padding: 13px 16px !important; border-bottom: 1px solid #e5ebf1 !important; text-align: left !important; line-height: 1.6 !important; vertical-align: top !important; min-width: 90px !important; max-width: 280px !important; white-space: normal !important; overflow-wrap: anywhere !important; }
body.workspace-mode .br-table thead th { background: #f3f7fa !important; font-size: 12px !important; color: #61778b !important; font-weight: 600 !important; }
body.workspace-mode .br-table tbody th { min-width: 170px !important; }
body.workspace-mode .br-table tbody small { display: block !important; font-weight: 400 !important; }
body.workspace-mode .br-table .br-number { text-align: right !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; }
body.workspace-mode .br-table .br-note { min-width: 160px !important; }
body.workspace-mode .br-pagination { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-end !important; gap: 10px !important; font-size: 13px !important; }
body.workspace-mode .br-pagination > span { margin-right: auto !important; }
body.workspace-mode .br-pagination label { display: flex !important; align-items: center !important; gap: 8px !important; white-space: nowrap !important; }
body.workspace-mode .br-pagination input { width: 70px !important; height: 38px !important; min-width: 0 !important; }
body.workspace-mode .br-message { padding: 48px 24px !important; text-align: center !important; background: #fff !important; border: 1px solid #d9e3ec !important; border-radius: 10px !important; }
body.workspace-mode .br-message p { margin: 10px 0 18px !important; line-height: 1.8 !important; color: #63788d !important; }
body.workspace-mode .br-notice { font-size: 13px !important; line-height: 1.6 !important; color: #315e72 !important; }
body.workspace-mode .br-notice:empty { display: none !important; }
@media (max-width: 768px) {
  body.workspace-mode .br-analysis { grid-template-columns: minmax(0,1fr) !important; padding: 16px !important; }
  body.workspace-mode .br-filters { padding: 16px !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  body.workspace-mode .br-report-choice, body.workspace-mode .br-keyword { grid-column: 1 / -1 !important; }
  body.workspace-mode .br-summary > div { padding: 16px !important; flex-basis: 140px !important; }
  body.workspace-mode .br-summary strong { font-size: 24px !important; }
  body.workspace-mode .br-pagination > span { flex-basis: 100% !important; }
}

/* Workbench summary: zero is neutral; semantic lanes have stable distinct colors. */
body.workspace-mode #page .work-card[data-work-tone] { --queue-ink: #56616c !important; --queue-bg: #ffffff !important; --queue-line: #d6dce2 !important; background: var(--queue-bg) !important; border: 1px solid var(--queue-line) !important; box-shadow: none !important; }
body.workspace-mode #page .work-card[data-work-tone="amber"]:not([data-work-count="0"]) { --queue-ink: #926000 !important; --queue-bg: #fffaf0 !important; --queue-line: #e6d2a5 !important; }
body.workspace-mode #page .work-card[data-work-tone="blue"]:not([data-work-count="0"]) { --queue-ink: #285eac !important; --queue-bg: #f5f8fe !important; --queue-line: #bed1ec !important; }
body.workspace-mode #page .work-card[data-work-tone="teal"]:not([data-work-count="0"]) { --queue-ink: #167879 !important; --queue-bg: #f2faf9 !important; --queue-line: #b2d9d5 !important; }
body.workspace-mode #page .work-card[data-work-tone="purple"]:not([data-work-count="0"]) { --queue-ink: #7152a3 !important; --queue-bg: #faf6fe !important; --queue-line: #d5c4e9 !important; }
body.workspace-mode #page .work-card[data-work-tone="green"]:not([data-work-count="0"]) { --queue-ink: #277346 !important; --queue-bg: #f3faf5 !important; --queue-line: #b7d9c1 !important; }
body.workspace-mode #page .work-card[data-work-tone="red"]:not([data-work-count="0"]) { --queue-ink: #b13b35 !important; --queue-bg: #fff6f5 !important; --queue-line: #edc2bd !important; }
body.workspace-mode #page .work-card[data-work-tone="brown"]:not([data-work-count="0"]) { --queue-ink: #82562e !important; --queue-bg: #fbf7f2 !important; --queue-line: #dbc9b7 !important; }
body.workspace-mode #page .work-card[data-work-tone] :is(.number,.work-card-number,.work-card-number span,.work-flow-step) { color: var(--queue-ink) !important; }
body.workspace-mode #page .work-card[data-work-tone]::before, body.workspace-mode #page .work-card[data-work-tone]::after { background: var(--queue-ink) !important; }
body.workspace-mode #page .work-card[data-work-count="0"]::before, body.workspace-mode #page .work-card[data-work-count="0"]::after { background: #d6dce2 !important; }
body.workspace-mode #page .work-card[data-work-tone].is-drilldown { outline: 2px solid var(--queue-ink) !important; outline-offset: -2px !important; box-shadow: none !important; }
body.workspace-mode #page .work-card[data-work-tone] .work-card-number:focus-visible { outline: 2px solid var(--queue-ink) !important; outline-offset: 3px !important; box-shadow: none !important; }
body.workspace-mode #page .technical-order-hint { padding: 12px 16px !important; margin: 0 0 14px !important; background: #fffaf0 !important; border: 1px solid #e6d2a5 !important; border-radius: 6px !important; color: #765000 !important; font-size: 13px !important; line-height: 1.7 !important; }

/* design-summary-layout=20260911: one status grid; product cards retain their own layout. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page [data-view="design"] .design-summary-grid {
  display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  grid-auto-rows:1fr !important; align-items:stretch !important; gap:8px !important;
  padding:0 !important; margin:0 0 16px !important; border:0 !important; background:transparent !important;
}
body.workspace-mode #page [data-view="design"] .design-summary-grid > .work-card {
  display:flex !important; flex-direction:column !important; align-items:stretch !important;
  gap:8px !important; min-width:0 !important; min-height:136px !important; height:auto !important;
  padding:16px !important; box-sizing:border-box !important; border-radius:8px !important;
}
body.workspace-mode #page [data-view="design"] .design-summary-grid > .work-card > :is(h3,p,.number) {
  position:static !important; float:none !important; grid-area:auto !important;
  width:auto !important; max-width:100% !important; min-width:0 !important;
  transform:none !important; margin:0 !important; white-space:normal !important;
}
body.workspace-mode #page [data-view="design"] .design-summary-grid > .work-card > h3 {
  font-size:14px !important; line-height:1.5 !important;
}
body.workspace-mode #page [data-view="design"] .design-summary-grid > .work-card > p {
  font-size:12px !important; line-height:1.6 !important; min-height:0 !important; flex:1 !important;
}
body.workspace-mode #page [data-view="design"] .design-summary-grid > .work-card > .number {
  display:flex !important; align-items:baseline !important; justify-content:space-between !important;
  gap:8px !important; padding:0 !important; min-height:36px !important;
  font-size:28px !important; line-height:1.3 !important; font-variant-numeric:tabular-nums !important;
}
body.workspace-mode #page [data-view="design"] .design-summary-grid .work-card-number > span {
  font-size:12px !important; line-height:1.5 !important; white-space:nowrap !important; margin:0 !important;
}
@media (max-width:1199px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page [data-view="design"] .design-summary-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width:900px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page [data-view="design"] .design-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:480px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page [data-view="design"] .design-summary-grid { grid-template-columns:minmax(0,1fr) !important; }
}

/* reference-navigation=20260911: one rail, scoped flyout and real personal shortcuts. */

body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) { --shell-sidebar-width: 88px !important; grid-template-columns: 88px minmax(0, 1fr) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar { padding: 8px 0 !important; border: 0 !important; box-shadow: none !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .reference-rail { display:flex !important; flex-direction:column !important; gap:4px !important; margin:0 !important; padding:4px 8px !important; align-items:stretch !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar-footer { display:none !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-rail-item { display:flex !important; flex:0 0 auto !important; flex-direction:column !important; justify-content:center !important; align-items:center !important; gap:5px !important; width:100% !important; min-width:0 !important; min-height:76px !important; padding:10px 3px !important; margin:0 !important; border:0 !important; border-radius:24px !important; color:#5f698d !important; background:transparent !important; box-shadow:none !important; font-size:15px !important; font-weight:500 !important; line-height:1.35 !important; white-space:nowrap !important; cursor:pointer !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-rail-item svg { width:29px !important; height:29px !important; stroke-width:1.8 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-rail-item.active, body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-rail-item[aria-expanded="true"] { background:#d9dcef !important; color:#545e8c !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-rail-item:hover { color:#545e8c !important; background:#e0e2f0 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.reference-rail-item,.reference-menu button,.mine-entry button):focus-visible { outline:2px solid #5269af !important; outline-offset:-2px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-rail-item[hidden], body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu[hidden] { display:none !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu { position:fixed !important; z-index:90 !important; top:16px !important; left:100px !important; display:block !important; width: min(610px, calc(100vw - 120px)) !important; max-height:calc(100dvh - 32px) !important; padding:24px !important; margin:0 !important; box-sizing:border-box !important; overflow:auto !important; overscroll-behavior:contain !important; background:#fff !important; border:1px solid #e1e4ef !important; border-radius:18px !important; box-shadow:0 16px 48px #29345426 !important; color:#28334d !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu header, body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-mine header, body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-section header { display:flex !important; align-items:center !important; justify-content:space-between !important; flex-wrap:wrap !important; gap:12px !important; margin:0 0 20px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu h2 { margin:0 !important; font-size:20px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu header button { padding:10px !important; min-width:44px !important; min-height:44px !important; border:0 !important; background:#f3f4f8 !important; color:#65708e !important; border-radius:10px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu header svg { width:20px !important; height:20px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu-entries { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px 20px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu-row { display:flex !important; min-width:0 !important; border-radius:8px !important; background:#f8f9fc !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu .nav-item { display:flex !important; align-items:center !important; flex:1 1 auto !important; min-width:0 !important; width:auto !important; min-height:48px !important; margin:0 !important; padding:12px !important; color:#34425d !important; background:transparent !important; border:0 !important; border-radius:8px !important; font-size:14px !important; text-align:left !important; white-space:normal !important; box-shadow:none !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu .nav-item span { color:inherit !important; text-align:left !important; position:static !important; width:auto !important; height:auto !important; margin:0 !important; overflow:visible !important; white-space:normal !important; clip:auto !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu .nav-item[aria-current="page"], body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu .nav-item:hover { background:#e9ecf8 !important; color:#455a9b !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu .reference-favorite, body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry > button[data-reference-favorite] { display:flex !important; flex:0 0 44px !important; align-items:center !important; justify-content:center !important; width:44px !important; min-height:44px !important; padding:10px !important; border:0 !important; background:transparent !important; color:#7b849c !important; border-radius:8px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-favorite svg, body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry > button[data-reference-favorite] svg { width:18px !important; height:18px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.reference-favorite,.mine-entry > button)[aria-pressed="true"] { color:#72622b !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.reference-favorite,.mine-entry > button)[aria-pressed="true"] svg { fill:#f1dea1 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-gateway { padding:14px 12px !important; color:#455a9b !important; font-size:14px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-pending { margin-top:24px !important; padding-top:16px !important; border-top:1px solid #eceef5 !important; color:#6b7488 !important; font-size:13px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-pending summary { cursor:pointer !important; padding:6px 0 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-pending p { line-height:1.6 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-pending > div { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-mine { padding:24px !important; min-width:0 !important; background:#fff !important; border:1px solid #e4e7f0 !important; border-radius:16px !important; color:#28334d !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-mine h2 { margin:0 0 8px !important; font-size:24px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-mine p { color:#626e85 !important; line-height:1.6 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-mine button { cursor:pointer !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-mine header > button { min-height:40px !important; padding:9px 14px !important; background:#f3f5fb !important; border:1px solid #dfe4f0 !important; border-radius:8px !important; color:#455a9b !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-section { margin:28px 0 0 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-section h3 { margin:0 0 14px !important; font-size:16px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-section header { margin-bottom:12px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-section header h3 { margin:0 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry-grid { display:grid !important; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)) !important; gap:12px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry { display:flex !important; min-width:0 !important; align-items:stretch !important; border:1px solid #e6e9f2 !important; border-radius:10px !important; background:#fafbfe !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry > button:first-child { display:flex !important; flex:1 1 auto !important; min-width:0 !important; align-items:center !important; gap:12px !important; min-height:78px !important; padding:14px !important; border:0 !important; border-radius:10px !important; text-align:left !important; background:transparent !important; color:#34425d !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry > button:first-child:hover { background:#edf0f9 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry > button:first-child > svg { width:24px !important; height:24px !important; flex:0 0 24px !important; color:#7b84ac !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry span { min-width:0 !important; overflow-wrap:anywhere !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry strong, body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry small { display:block !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry strong { font-size:15px !important; line-height:1.5 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-entry small { margin-top:5px !important; color:#626e85 !important; font-size:12px !important; line-height:1.5 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-empty { padding:24px 16px !important; background:#f7f8fc !important; border-radius:8px !important; color:#626e85 !important; font-size:14px !important; line-height:1.6 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .mine-storage-note { font-size:12px !important; margin-top:20px !important; }
@media (min-width:761px) {
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode)[data-sidebar-collapsed="true"] { --shell-sidebar-width:72px !important; grid-template-columns:72px minmax(0,1fr) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode)[data-sidebar-collapsed="true"] .sidebar { width:72px !important; min-width:72px !important; max-width:72px !important; transform:none !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode)[data-sidebar-collapsed="true"] .reference-rail-item { min-height:66px !important; font-size:13px !important; border-radius:18px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode)[data-sidebar-collapsed="true"] .reference-menu { left:84px !important; }
}
@media (max-width:760px) {
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar { padding:0 0 env(safe-area-inset-bottom) !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .sidebar .reference-rail { touch-action:pan-x !important; overscroll-behavior-x:contain !important; flex-direction:row !important; align-items:center !important; gap:4px !important; padding:4px 8px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-rail-item { width:64px !important; min-width:64px !important; min-height:52px !important; height:52px !important; gap:2px !important; padding:4px !important; font-size:12px !important; border-radius:16px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-rail-item svg { width:23px !important; height:23px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu { top:auto !important; bottom:calc(72px + env(safe-area-inset-bottom)) !important; left:12px !important; right:12px !important; width:auto !important; max-height:calc(100dvh - 96px - env(safe-area-inset-bottom)) !important; padding:18px !important; border-radius:14px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-menu-entries { grid-template-columns:1fr !important; gap:6px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-mine { padding:18px !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .reference-mine h2 { font-size:22px !important; }
}

/* shared-image-gallery=20260911: shared original-media viewer, isolated from workbench thumbnails. */
#imagePreviewDialog.image-preview-dialog {
  position:fixed !important; inset:0 !important; width:100vw !important; max-width:none !important; height:100dvh !important; max-height:none !important; margin:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:#111827 !important; color:#f1f4fb !important; overflow:hidden !important;
}
#imagePreviewDialog.image-preview-dialog[open] { display:grid !important; grid-template-rows:auto minmax(0,1fr) auto auto !important; place-items:stretch !important; gap:0 !important; }
#imagePreviewDialog .image-gallery-head { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:16px !important; padding:16px 24px !important; min-width:0 !important; border-bottom:1px solid #34415a !important; }
#imagePreviewDialog .image-gallery-head div { min-width:0 !important; }
#imagePreviewDialog h2 { font-size:18px !important; font-weight:600 !important; line-height:1.4 !important; margin:0 !important; color:#f1f4fb !important; overflow-wrap:anywhere !important; max-height:76px !important; overflow:auto !important; }
#imagePreviewDialog #imageGalleryPosition { margin:4px 0 0 !important; color:#c5cede !important; font-size:13px !important; font-variant-numeric:tabular-nums !important; }
#imagePreviewDialog button, #imagePreviewDialog #imageGalleryOriginal { display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:6px !important; min-width:40px !important; min-height:40px !important; padding:8px !important; border:1px solid #53627b !important; border-radius:6px !important; background:#202c40 !important; color:#f1f4fb !important; font-size:13px !important; line-height:1.3 !important; white-space:nowrap !important; flex-shrink:0 !important; box-shadow:none !important; cursor:pointer !important; }
#imagePreviewDialog button:hover:not(:disabled), #imagePreviewDialog #imageGalleryOriginal:hover { background:#344560 !important; border-color:#b7c7e4 !important; }
#imagePreviewDialog button:focus-visible, #imagePreviewDialog a:focus-visible { outline:2px solid #c1d4ff !important; outline-offset:3px !important; }
#imagePreviewDialog button[aria-pressed="true"] { background:#455b85 !important; border-color:#c1d4ff !important; }
#imagePreviewDialog button:disabled { opacity:.4 !important; cursor:default !important; }
#imagePreviewDialog svg { width:20px !important; height:20px !important; stroke-width:1.75 !important; }
#imagePreviewDialog .image-preview-stage { position:relative !important; display:flex !important; align-items:center !important; justify-content:center !important; width:100% !important; height:100% !important; min-height:0 !important; max-height:none !important; max-width:none !important; padding:28px 24px 40px !important; overflow:hidden !important; pointer-events:auto !important; touch-action:none !important; }
#imagePreviewDialog #imagePreviewMedia { display:block !important; width:auto !important; height:auto !important; max-width:100% !important; max-height:100% !important; object-fit:contain !important; object-position:center !important; background:transparent !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; flex-shrink:1 !important; cursor:grab !important; user-select:none !important; transform:translate(var(--gallery-pan-x,0px),var(--gallery-pan-y,0px)) rotate(var(--gallery-angle,0deg)) scale(calc(var(--gallery-zoom,1) * var(--gallery-flip-x,1)),calc(var(--gallery-zoom,1) * var(--gallery-flip-y,1))) !important; }
#imagePreviewDialog #imagePreviewMedia:active { cursor:grabbing !important; }
#imagePreviewDialog #imageGalleryStatus { position:absolute !important; bottom:8px !important; left:12px !important; right:12px !important; width:auto !important; margin:0 !important; padding:4px 8px !important; color:#d5deed !important; background:#111827 !important; text-align:center !important; font-size:13px !important; pointer-events:none !important; }
#imagePreviewDialog [data-gallery-action="retry"] { position:absolute !important; }
#imagePreviewDialog .image-gallery-controls { display:flex !important; align-items:center !important; justify-content:center !important; flex-wrap:wrap !important; gap:8px !important; padding:12px 24px !important; border-top:1px solid #34415a !important; border-bottom:1px solid #34415a !important; }
#imagePreviewDialog #imageGalleryZoom { display:block !important; min-width:44px !important; color:#d5deed !important; text-align:center !important; font-size:13px !important; font-variant-numeric:tabular-nums !important; }
#imagePreviewDialog .image-gallery-thumbs { display:flex !important; align-items:center !important; justify-content:flex-start !important; gap:8px !important; overflow-x:auto !important; overflow-y:hidden !important; padding:12px 24px !important; min-width:0 !important; height:100px !important; touch-action:pan-x !important; overscroll-behavior-x:contain !important; scrollbar-color:#65728e #111827 !important; }
#imagePreviewDialog .image-gallery-thumbs button { position:relative !important; width:64px !important; height:72px !important; padding:3px !important; }
#imagePreviewDialog .image-gallery-thumbs img { width:100% !important; height:100% !important; object-fit:contain !important; background:transparent !important; border-radius:0 !important; }
#imagePreviewDialog .image-gallery-thumbs span { position:absolute !important; bottom:2px !important; right:2px !important; padding:1px 4px !important; background:#111827 !important; color:#fff !important; font-size:11px !important; }
#imagePreviewDialog [hidden] { display:none !important; }
@media(max-width:760px) {
  #imagePreviewDialog .image-gallery-head { padding:12px !important; }
  #imagePreviewDialog h2 { font-size:16px !important; }
  #imagePreviewDialog .image-preview-stage { padding:16px 12px 42px !important; }
  #imagePreviewDialog .image-gallery-controls { gap:6px !important; padding:8px 12px !important; }
  #imagePreviewDialog button, #imagePreviewDialog #imageGalleryOriginal { min-width:44px !important; min-height:44px !important; }
  #imagePreviewDialog .image-gallery-thumbs { height:88px !important; padding:8px 12px !important; }
  #imagePreviewDialog .image-gallery-thumbs button { width:56px !important; height:64px !important; }
}

/* personal-products=20260911: My object records inherit the existing workspace. */
body.workspace-mode .reference-mine .personal-products { margin:16px 0 28px !important; min-width:0 !important; }
body.workspace-mode .reference-mine .personal-feedback { color:#9c3f34 !important; display:flex !important; align-items:center !important; gap:12px !important; flex-wrap:wrap !important; }
body.workspace-mode .reference-mine .personal-feedback:empty { display:none !important; }
body.workspace-mode .reference-mine .personal-section { margin:16px 0 24px !important; min-width:0 !important; }
body.workspace-mode .reference-mine .personal-section header { display:flex !important; justify-content:space-between !important; align-items:center !important; flex-wrap:wrap !important; gap:12px !important; margin-bottom:12px !important; }
body.workspace-mode .reference-mine .personal-section h3, body.workspace-mode .reference-mine .personal-shortcuts-title { margin:0 !important; font-size:16px !important; font-weight:600 !important; color:#26344d !important; }
body.workspace-mode .reference-mine .personal-shortcuts-title { margin-bottom:16px !important; }
body.workspace-mode .reference-mine .personal-empty { padding:24px 0 !important; color:#53627a !important; border-bottom:1px solid #e0e4ee !important; }
body.workspace-mode .reference-mine .personal-table-wrap { width:100% !important; min-width:0 !important; overflow-x:auto !important; }
body.workspace-mode .reference-mine .personal-table { width:100% !important; border-collapse:collapse !important; table-layout:fixed !important; }
body.workspace-mode .reference-mine .personal-table th { background:#f3f4f9 !important; color:#53627a !important; font-size:13px !important; text-align:left !important; font-weight:500 !important; }
body.workspace-mode .reference-mine .personal-table th, body.workspace-mode .reference-mine .personal-table td { padding:12px 14px !important; border-bottom:1px solid #e0e4ee !important; overflow-wrap:anywhere !important; vertical-align:middle !important; }
body.workspace-mode .reference-mine .personal-table th:first-child { width:28% !important; }
body.workspace-mode .reference-mine .personal-table th:nth-child(4) { width:23% !important; }
body.workspace-mode .reference-mine .personal-table td { color:#26344d !important; font-size:14px !important; }
body.workspace-mode .reference-mine .personal-table td:first-child > span { display:block !important; color:#53627a !important; font-size:13px !important; margin-top:2px !important; }
body.workspace-mode .reference-mine .personal-table button { min-height:36px !important; text-align:left !important; padding:4px 0 !important; border:0 !important; background:transparent !important; color:#414d85 !important; white-space:normal !important; }
body.workspace-mode .reference-mine .personal-table [data-personal-open] { font-weight:600 !important; }
body.workspace-mode .reference-mine .personal-table button:hover { text-decoration:underline !important; }
body.workspace-mode .reference-mine .personal-table time { font-size:13px !important; font-variant-numeric:tabular-nums !important; }
body.workspace-mode .reference-mine .personal-products button:focus-visible { outline:2px solid #5264ab !important; outline-offset:3px !important; }
body.workspace-mode .reference-mine .personal-products button:disabled { opacity:.55 !important; cursor:wait !important; }
body.workspace-mode .product-detail-shell .personal-detail-status { padding:8px 24px !important; color:#9c3f34 !important; display:flex !important; flex-wrap:wrap !important; gap:12px !important; align-items:center !important; }
body.workspace-mode .product-detail-shell .personal-detail-status[hidden] { display:none !important; }
body.workspace-mode .product-detail-shell [data-personal-favorite][aria-pressed="true"] { color:#414d85 !important; background:#eef0fa !important; }
@media(max-width:760px) {
 body.workspace-mode .reference-mine .personal-table { min-width:0 !important; display:block !important; }
 body.workspace-mode .reference-mine .personal-table thead { display:none !important; }
 body.workspace-mode .reference-mine .personal-table tbody { display:block !important; }
 body.workspace-mode .reference-mine .personal-table tr { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px 16px !important; padding:12px 0 !important; border-bottom:1px solid #e0e4ee !important; }
 body.workspace-mode .reference-mine .personal-table td { display:block !important; padding:0 !important; border:0 !important; min-width:0 !important; }
 body.workspace-mode .reference-mine .personal-table td:first-child, body.workspace-mode .reference-mine .personal-table td:nth-child(4) { grid-column:1/-1 !important; }
 body.workspace-mode .reference-mine .personal-table td[data-label]::before { content:attr(data-label) !important; display:block !important; color:#53627a !important; font-size:12px !important; margin-bottom:4px !important; }
 body.workspace-mode .reference-mine .personal-table button { min-height:44px !important; }
 body.workspace-mode .product-detail-shell .dialog-head-actions { flex-wrap:wrap !important; }
 body.workspace-mode .product-detail-shell .personal-detail-status { padding:8px 14px !important; }
}
/* A wrapped topbar must reserve its natural height; a fixed 64px height let
   tablet controls paint over workspace tabs. All modules share this boundary. */
@media(max-width:1000px) {
 body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace > .topbar { height:auto !important; flex:0 0 auto !important; position:relative !important; }
 body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #workspaceTabs { position:relative !important; top:auto !important; }
}

/* The mobile image spans both grid tracks; its following summary must also
   span them, otherwise the title/owners collapse into the 86px image track. */
@media(max-width:760px) {
 body.workspace-mode #productDialog .detail-top > .detail-summary { grid-column:1 / -1 !important; width:100% !important; min-width:0 !important; }
}

/* sample-archives=20260911: shared archive cards, protected forms and complete fields. */
body.workspace-mode .sample-archives { background:#fff !important; padding:24px !important; border-radius:12px !important; min-width:0 !important; }
body.workspace-mode .sample-toolbar, body.workspace-mode .sample-toolbar > div, body.workspace-mode .sample-selection, body.workspace-mode .sample-filter-actions, body.workspace-mode .sample-pagination, body.workspace-mode .sample-modes, body.workspace-mode .sample-editor footer { display:flex !important; align-items:center !important; gap:12px !important; flex-wrap:wrap !important; }
body.workspace-mode .sample-toolbar { justify-content:space-between !important; margin-bottom:24px !important; }
body.workspace-mode .sample-archives h2 { margin:0 !important; font-size:24px !important; }
body.workspace-mode .sample-filter-grid, body.workspace-mode .sample-form-grid { display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:16px !important; }
body.workspace-mode .sample-filters label, body.workspace-mode .sample-editor label { display:flex !important; flex-direction:column !important; gap:8px !important; min-width:0 !important; color:#45506a !important; }
body.workspace-mode .sample-filters input, body.workspace-mode .sample-filters select, body.workspace-mode .sample-editor input, body.workspace-mode .sample-editor select, body.workspace-mode .sample-editor textarea { width:100% !important; min-width:0 !important; max-width:100% !important; box-sizing:border-box !important; padding:10px 12px !important; border:1px solid #b8bfd1 !important; border-radius:6px !important; background:#fff !important; color:#263147 !important; font:inherit !important; }
body.workspace-mode .sample-modes { margin-bottom:20px !important; }
body.workspace-mode .sample-modes button[aria-pressed="true"] { background:#ecebf8 !important; border-color:#716b9c !important; color:#443d71 !important; }
body.workspace-mode .sample-filter-actions { margin:20px 0 !important; }
body.workspace-mode .sample-feedback { color:#a3392d !important; overflow-wrap:anywhere !important; }
body.workspace-mode .sample-feedback:not(:empty) { padding:12px 0 !important; }
body.workspace-mode .sample-selection { border-top:1px solid #e1e4ed !important; padding:20px 0 !important; color:#5b657a !important; }
body.workspace-mode .sample-selection label { display:flex !important; align-items:center !important; gap:8px !important; }
body.workspace-mode .sample-card-grid { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:16px !important; align-items:stretch !important; }
body.workspace-mode .sample-card { display:grid !important; grid-template-columns:minmax(100px,.8fr) minmax(0,1.2fr) !important; padding:16px !important; gap:16px !important; background:#f7f8fc !important; border:1px solid #e2e5ef !important; min-width:0 !important; }
body.workspace-mode .sample-card-media { position:relative !important; min-width:0 !important; align-self:start !important; aspect-ratio:3/4 !important; background:#edeef5 !important; display:grid !important; place-items:center !important; }
body.workspace-mode .sample-card-media > label { position:absolute !important; top:8px !important; left:8px !important; z-index:1 !important; background:white !important; padding:4px !important; border-radius:4px !important; }
body.workspace-mode .sample-card input[type="checkbox"], body.workspace-mode .sample-selection input { width:18px !important; height:18px !important; accent-color:#655c99 !important; }
body.workspace-mode .sample-card-media img { width:100% !important; height:100% !important; object-fit:cover !important; min-width:0 !important; cursor:zoom-in !important; }
body.workspace-mode .sample-card-body { display:flex !important; flex-direction:column !important; gap:12px !important; min-width:0 !important; }
body.workspace-mode .sample-card-body header { display:flex !important; justify-content:space-between !important; flex-wrap:wrap !important; gap:8px !important; }
body.workspace-mode .sample-card h3 { font-size:18px !important; line-height:1.5 !important; margin:0 !important; overflow-wrap:anywhere !important; }
body.workspace-mode .sample-status { color:#637086 !important; white-space:nowrap !important; }
body.workspace-mode .sample-status.is-enabled { color:#257750 !important; }
body.workspace-mode .sample-code { display:flex !important; align-items:flex-start !important; gap:6px !important; }
body.workspace-mode .sample-code button { color:#626d83 !important; background:transparent !important; border:0 !important; padding:0 !important; min-width:0 !important; overflow-wrap:anywhere !important; text-align:left !important; }
body.workspace-mode .sample-code svg { width:16px !important; height:16px !important; }
body.workspace-mode .sample-tag-button { text-align:left !important; align-self:start !important; color:#4e42a5 !important; background:none !important; border:0 !important; padding:4px 0 !important; overflow-wrap:anywhere !important; white-space:normal !important; }
body.workspace-mode .sample-card dl { margin:0 !important; font-size:14px !important; line-height:1.6 !important; }
body.workspace-mode .sample-card dl > div, body.workspace-mode .sample-detail-fields > div { display:grid !important; grid-template-columns:5.5em minmax(0,1fr) !important; gap:8px !important; padding:3px 0 !important; }
body.workspace-mode .sample-card dt, body.workspace-mode .sample-detail-fields dt { color:#626c82 !important; }
body.workspace-mode .sample-card dd, body.workspace-mode .sample-detail-fields dd { margin:0 !important; color:#263147 !important; overflow-wrap:anywhere !important; }
body.workspace-mode .sample-card footer { display:flex !important; flex-wrap:wrap !important; gap:12px !important; margin-top:auto !important; padding-top:12px !important; border-top:1px solid #e1e4ed !important; }
body.workspace-mode .sample-card footer button { color:#4d4490 !important; background:none !important; border:0 !important; padding:4px 0 !important; white-space:normal !important; }
body.workspace-mode .sample-pagination { justify-content:flex-end !important; margin-top:24px !important; }
body.workspace-mode .sample-pagination label { display:flex !important; align-items:center !important; gap:8px !important; }
body.workspace-mode .sample-pagination input { width:72px !important; min-width:0 !important; padding:8px !important; }
body.workspace-mode .sample-editor { width:min(920px,calc(100vw - 32px)) !important; max-width:100% !important; box-sizing:border-box !important; }
body.workspace-mode .sample-editor .sample-form-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
body.workspace-mode .sample-editor .sample-wide { grid-column:1/-1 !important; }
body.workspace-mode .sample-editor .sample-editor-preview { width:120px !important; height:160px !important; object-fit:cover !important; }
body.workspace-mode .sample-editor p { overflow-wrap:anywhere !important; line-height:1.65 !important; }
body.workspace-mode .sample-editor [role="status"] { color:#a3392d !important; min-height:24px !important; }
body.workspace-mode .sample-editor footer { justify-content:flex-end !important; margin-top:24px !important; }
body.workspace-mode .sample-detail-fields { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px 24px !important; }
body.workspace-mode .sample-history { list-style:none !important; padding:0 !important; }
body.workspace-mode .sample-history li { border-top:1px solid #d8dce7 !important; padding:16px 0 !important; overflow-wrap:anywhere !important; }
body.workspace-mode .sample-history li p { color:#626c82 !important; }
@media(max-width:1199px) {
 body.workspace-mode .sample-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
 body.workspace-mode .sample-filter-grid, body.workspace-mode .sample-editor .sample-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media(max-width:767px) {
 body.workspace-mode .sample-archives { padding:16px !important; }
 body.workspace-mode .sample-card-grid, body.workspace-mode .sample-filter-grid, body.workspace-mode .sample-editor .sample-form-grid, body.workspace-mode .sample-detail-fields { grid-template-columns:minmax(0,1fr) !important; }
 body.workspace-mode .sample-card { grid-template-columns:minmax(88px,.65fr) minmax(0,1fr) !important; padding:12px !important; gap:12px !important; }
 body.workspace-mode .sample-pagination { justify-content:flex-start !important; }
}
body.workspace-mode .sample-archives .primary, body.workspace-mode .sample-editor .primary { background:#65598f !important; border-color:#65598f !important; color:#fff !important; }
body.workspace-mode .sample-archives .primary:hover, body.workspace-mode .sample-editor .primary:hover { background:#514674 !important; }
body.workspace-mode .sample-archives button:focus-visible, body.workspace-mode .sample-editor button:focus-visible { outline:2px solid #65598f !important; outline-offset:3px !important; }
body.workspace-mode .sample-filters > .sample-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
body.workspace-mode .sample-advanced { margin-top:16px !important; }
body.workspace-mode .sample-advanced summary { cursor:pointer !important; color:#514674 !important; padding:8px 0 !important; }
body.workspace-mode .sample-advanced[open] > div { margin-top:12px !important; }
body.workspace-mode #createDialog:has(.sample-editor) { width:min(968px,calc(100vw - 24px)) !important; padding:0 !important; background:#fff !important; }
body.workspace-mode .sample-editor { width:100% !important; padding:24px !important; background:#fff !important; }
@media(max-width:767px) {
 body.workspace-mode .sample-filters > .sample-filter-grid { grid-template-columns:minmax(0,1fr) !important; }
 body.workspace-mode .sample-editor { padding:16px !important; }
}
body.workspace-mode .sample-upload { display:flex !important; flex-direction:column !important; align-items:flex-start !important; gap:12px !important; padding:16px !important; margin:8px 0 !important; border:1px dashed #8b80b1 !important; background:#f7f6fc !important; cursor:pointer !important; overflow-wrap:anywhere !important; }
body.workspace-mode .sample-upload:focus-visible { outline:2px solid #65598f !important; outline-offset:3px !important; }
body.workspace-mode .sample-upload-caption { color:#626c82 !important; }
body.workspace-mode .sample-editor input[type="file"][hidden], body.workspace-mode .sample-editor-preview[hidden] { display:none !important; }

/* proofing-demands=20260911: scoped ledger and quantity grid */
body.workspace-mode .proofing-workspace { background:#fff!important; padding:24px!important; border-radius:14px!important; min-width:0!important; }
body.workspace-mode .proofing-workspace .sample-toolbar { display:flex!important; flex-wrap:wrap!important; justify-content:space-between!important; gap:16px!important; align-items:center!important; }
body.workspace-mode .proofing-workspace .sample-toolbar p { color:#596579!important; margin:8px 0 0!important; }
body.workspace-mode .proofing-filters { display:flex!important; flex-wrap:wrap!important; gap:16px!important; align-items:end!important; margin:24px 0!important; }
body.workspace-mode .proofing-filters label { display:grid!important; gap:8px!important; min-width:0!important; flex:1 1 220px!important; }
body.workspace-mode .proofing-table-scroll { max-width:100%!important; overflow:auto!important; overscroll-behavior-inline:contain!important; scrollbar-color:#8982b2 #f0eef8!important; }
body.workspace-mode .proofing-table { width:100%!important; min-width:1180px!important; border-collapse:collapse!important; table-layout:fixed!important; }
body.workspace-mode .proofing-table th, body.workspace-mode .proofing-table td, body.workspace-mode .proofing-matrix th, body.workspace-mode .proofing-matrix td { text-align:left!important; padding:14px 12px!important; border-bottom:1px solid #dce2ec!important; overflow-wrap:anywhere!important; vertical-align:top!important; }
body.workspace-mode .proofing-table th, body.workspace-mode .proofing-matrix th { background:#f7f7fc!important; color:#4f5a73!important; font-weight:600!important; }
body.workspace-mode .proofing-table th:first-child { width:205px!important; }
body.workspace-mode .proofing-table th:last-child { width:210px!important; }
body.workspace-mode .proofing-table td > span { display:block!important; margin-top:6px!important; }
body.workspace-mode .proofing-table td, body.workspace-mode .proofing-matrix td { font-variant-numeric:tabular-nums!important; }
body.workspace-mode .proofing-actions { display:flex!important; flex-wrap:wrap!important; gap:8px!important; }
body.workspace-mode .proofing-actions button { padding:6px 8px!important; white-space:nowrap!important; }
body.workspace-mode .proofing-state { color:#344158!important; font-weight:600!important; }
body.workspace-mode .proofing-state[data-state="已完成"] { color:#237448!important; }
body.workspace-mode .proofing-state[data-state="待返修"] { color:#ad3737!important; }
body.workspace-mode .proofing-editor .proofing-matrix { border-collapse:collapse!important; min-width:420px!important; width:100%!important; }
body.workspace-mode .proofing-editor .proofing-matrix input { width:90px!important; min-width:70px!important; }
body.workspace-mode .proofing-editor h3 { margin:28px 0 12px!important; }
body.workspace-mode .proofing-editor .proofing-form > footer { display:flex!important; justify-content:flex-end!important; gap:12px!important; padding-top:24px!important; }
body.workspace-mode .proofing-editor .proofing-node-tabs { display:flex!important; gap:12px!important; flex-wrap:wrap!important; margin:20px 0!important; }
body.workspace-mode .proofing-editor .proofing-node-tabs [aria-pressed="true"] { color:#4e447d!important; background:#eeebf8!important; border-color:#6a5d99!important; }
body.workspace-mode .proofing-editor .sample-history { overflow-wrap:anywhere!important; }
body.workspace-mode .proofing-total { font-weight:600!important; color:#344158!important; }
body.workspace-mode .proofing-workspace :focus-visible, body.workspace-mode .proofing-editor :focus-visible { outline:2px solid #6a5d99!important; outline-offset:3px!important; }
@media (max-width:767px) { body.workspace-mode .proofing-workspace { padding:16px!important; } body.workspace-mode .proofing-filters label { flex-basis:100%!important; } }
body.workspace-mode .proofing-filters input, body.workspace-mode .proofing-filters select { min-height:42px!important; width:100%!important; }
body.workspace-mode .proofing-workspace .primary, body.workspace-mode .proofing-editor .primary { background:#62558b!important; border-color:#62558b!important; color:#fff!important; }
body.workspace-mode .proofing-table { min-width:1540px!important; }
body.workspace-mode .proofing-table th:nth-child(2), body.workspace-mode .proofing-table th:nth-child(3) { width:90px!important; }
body.workspace-mode .proofing-table th:nth-child(4) { width:130px!important; }
body.workspace-mode .proofing-table th:nth-child(5) { width:76px!important; }
body.workspace-mode .proofing-table th:nth-child(6) { width:100px!important; }
body.workspace-mode .proofing-table th:nth-child(7) { width:120px!important; }
body.workspace-mode .proofing-table th:nth-child(8) { width:112px!important; }
body.workspace-mode .proofing-table th:nth-child(9) { width:155px!important; }
body.workspace-mode .proofing-table tbody tr { background:#fff!important; }
body.workspace-mode .proofing-table tbody tr:hover { background:#f8f8fc!important; }

/* proofing-evidence=20260911: bounded node evidence, shared dialog scroll contract */
body.workspace-mode .proofing-upload { padding-block:16px !important; border-block:1px solid #dce2ec !important; min-width:0 !important; }
body.workspace-mode .proofing-upload input[type="file"] { width:100% !important; max-width:100% !important; white-space:normal !important; }
body.workspace-mode .proofing-upload p { font-size:13px !important; line-height:1.6 !important; color:#596579 !important; }
body.workspace-mode .proofing-upload [role="alert"] { color:#ad3737 !important; }
body.workspace-mode .proofing-upload ul, body.workspace-mode .proofing-file-archive { list-style:none !important; padding:0 !important; margin:12px 0 !important; }
body.workspace-mode .proofing-upload li, body.workspace-mode .proofing-file-archive li { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:12px !important; padding-block:10px !important; border-bottom:1px solid #dce2ec !important; overflow-wrap:anywhere !important; }
body.workspace-mode .proofing-file-archive li div, body.workspace-mode .proofing-upload li span { min-width:0 !important; flex:1 !important; }
body.workspace-mode .proofing-file-archive span { display:block !important; font-size:13px !important; line-height:1.6 !important; color:#596579 !important; }
body.workspace-mode .proofing-file-archive a { color:#514276 !important; text-underline-offset:3px !important; }
body.workspace-mode .proofing-upload li button, body.workspace-mode .proofing-file-archive li > a { flex-shrink:0 !important; }
body.workspace-mode .proofing-editor [data-proof-finished] { min-width:0 !important; }
body.workspace-mode .proofing-editor [data-proof-finished][hidden] { display:none !important; }
body.workspace-mode .proofing-editor input[type="datetime-local"] { min-width:0 !important; width:100% !important; max-width:100% !important; }
body.workspace-mode .proofing-upload [data-proof-files][hidden] { display:none !important; }

/* proofing-template=20260911: saved defaults are separate from actual progress. */
body.workspace-mode .proofing-editor .proofing-template-apply { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 12px !important; padding-block: 12px !important; border-block: 1px solid #dce2ec !important; min-width: 0 !important; }
body.workspace-mode .proofing-editor .proofing-template-apply > span { flex: 1 1 180px !important; min-width: 0 !important; overflow-wrap: anywhere !important; }
body.workspace-mode .proofing-editor .proofing-template-apply > p { flex-basis: 100% !important; margin: 0 !important; overflow-wrap: anywhere !important; }
body.workspace-mode .proofing-editor .proofing-template-apply > p:empty { display: none !important; }
body.workspace-mode .proofing-editor [data-template-feedback] { color: #45506a !important; }
body.workspace-mode .proofing-editor [data-template-feedback][data-error="true"] { color: #ad3737 !important; }

/* Catalog ordering reuses the established form and table contracts. */
body.workspace-mode .view-panel[data-view="products"] .catalog-order-select,
body.workspace-mode .catalog-order-dialog .catalog-order-confirm { display:flex !important; align-items:center !important; gap:8px !important; font-size:14px !important; }
body.workspace-mode .view-panel[data-view="products"] .catalog-order-select input,
body.workspace-mode .catalog-order-dialog .catalog-order-confirm input { width:18px !important; height:18px !important; flex:0 0 18px !important; }
body.workspace-mode .catalog-order-dialog { min-width:0 !important; }
body.workspace-mode .catalog-order-dialog .catalog-order-item { padding-block:20px !important; border-top:1px solid var(--line,#d7e1eb) !important; min-width:0 !important; }
body.workspace-mode .catalog-order-dialog .catalog-order-common { display:flex !important; align-items:end !important; flex-wrap:wrap !important; gap:12px !important; }
body.workspace-mode .catalog-order-dialog .catalog-order-common label { flex:1 1 220px !important; min-width:0 !important; }
body.workspace-mode .catalog-order-dialog .catalog-existing-order { color:#725015 !important; margin-block:8px !important; }
body.workspace-mode .catalog-order-dialog .catalog-order-confirm[hidden] { display:none !important; }
body.workspace-mode .catalog-order-dialog .order-line-table { table-layout:fixed !important; width:100% !important; }
body.workspace-mode .catalog-order-dialog .order-line-table :is(th,td):nth-child(1) { width:18% !important; }
body.workspace-mode .catalog-order-dialog .order-line-table :is(th,td):nth-child(2) { width:14% !important; }
body.workspace-mode .catalog-order-dialog .order-line-table :is(th,td):nth-child(3) { width:32% !important; }
body.workspace-mode .catalog-order-dialog .order-line-table :is(th,td):nth-child(4) { width:36% !important; }
body.workspace-mode .catalog-order-dialog .order-line-table input { width:100% !important; min-width:0 !important; }
body.workspace-mode .catalog-order-dialog .catalog-order-feedback { padding:12px !important; background:#fff7ec !important; color:#724914 !important; overflow-wrap:anywhere !important; }
body.workspace-mode .catalog-order-dialog .catalog-order-feedback[hidden] { display:none !important; }
body.workspace-mode .view-panel[data-view="products"] .product-center-head-actions>label { display:flex !important; align-items:center !important; flex-wrap:wrap !important; gap:8px !important; min-width:0 !important; }
body.workspace-mode .view-panel[data-view="products"] .product-center-head-actions>label select { width:auto !important; }
body.workspace-mode .order-record-number { display:block !important; overflow-wrap:anywhere !important; }
body.workspace-mode #createDialog:has(.catalog-order-dialog) { width:min(920px,calc(100vw - 24px)) !important; }

/* personal-home=20260911 — reference: authenticated Lingmao 我的/首页, 2026-09-11.
   The overview + 3-column main area + right service rail belong to this homepage only. */
body.workspace-mode .personal-home { color:#293249 !important; background:#f5f6fb !important; padding:4px !important; font-size:14px !important; }
body.workspace-mode .personal-home *, body.workspace-mode .home-dialog * { box-sizing:border-box !important; min-width:0 !important; }
body.workspace-mode .personal-home h3 { font-size:15px !important; line-height:1.4 !important; color:#293249 !important; font-weight:650 !important; margin:0 !important; }
body.workspace-mode .personal-home button { border:0 !important; box-shadow:none !important; background:transparent !important; color:inherit !important; min-height:36px !important; padding:4px 8px !important; font-size:13px !important; font-weight:500 !important; white-space:normal !important; }
body.workspace-mode .personal-home button:hover:not(:disabled) { color:#344fab !important; background:#f0f2fb !important; }
body.workspace-mode .personal-home button:disabled { opacity:1 !important; color:#697184 !important; cursor:not-allowed !important; }
body.workspace-mode .personal-home :is(button,a):focus-visible, body.workspace-mode .home-dialog :is(button,input):focus-visible { outline:2px solid #4f63b4 !important; outline-offset:2px !important; }
body.workspace-mode .personal-home ::selection, body.workspace-mode .home-dialog ::selection { background:#dce2ff !important; color:#263b81 !important; }
body.workspace-mode .personal-home svg { width:20px !important; height:20px !important; flex-shrink:0 !important; }
body.workspace-mode .home-welcome { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:12px !important; padding:8px 16px !important; border-radius:14px !important; background:white !important; min-height:48px !important; }
body.workspace-mode .home-welcome>span { display:flex !important; align-items:center !important; flex-wrap:wrap !important; gap:8px !important; font-size:13px !important; }
body.workspace-mode .home-welcome>span:last-child { color:#626b80 !important; }
body.workspace-mode .home-welcome button { display:inline-flex !important; align-items:center !important; gap:6px !important; }
body.workspace-mode .home-refresh-status { margin:0 !important; color:#a53731 !important; }
body.workspace-mode .home-refresh-status:not(:empty) { padding:10px 16px !important; }
body.workspace-mode .home-layout { display:grid !important; grid-template-columns:minmax(0,3.15fr) minmax(240px,1fr) !important; gap:12px !important; margin-top:12px !important; align-items:start !important; }
body.workspace-mode .home-main { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:12px !important; }
body.workspace-mode .home-aside { display:grid !important; gap:12px !important; }
body.workspace-mode .home-panel { padding:16px !important; background:#fff !important; border:0 !important; border-radius:16px !important; box-shadow:none !important; overflow:hidden !important; }
body.workspace-mode .home-panel>header { display:flex !important; align-items:center !important; flex-wrap:wrap !important; justify-content:space-between !important; gap:4px 10px !important; margin-bottom:12px !important; padding:0 !important; border:0 !important; background:transparent !important; }
body.workspace-mode .home-panel>header h3:empty { display:none !important; }
body.workspace-mode .home-overview, body.workspace-mode .home-more { grid-column:1/-1 !important; }
body.workspace-mode .home-shortcuts-panel, body.workspace-mode .home-academy { grid-column:span 2 !important; }
body.workspace-mode .home-metrics { display:flex !important; gap:8px !important; overflow-x:auto !important; padding-bottom:6px !important; scrollbar-color:#c8cee5 #f6f7fb !important; scrollbar-width:thin !important; }
body.workspace-mode .home-metrics .home-metric { display:flex !important; flex:1 0 116px !important; flex-direction:column !important; gap:8px !important; min-height:98px !important; padding:14px 8px !important; align-items:center !important; justify-content:center !important; border-radius:14px !important; }
body.workspace-mode .home-metric strong { font-size:25px !important; line-height:1.15 !important; color:#283149 !important; font-weight:700 !important; font-variant-numeric:tabular-nums !important; }
body.workspace-mode .home-metric span { font-size:12px !important; color:#566078 !important; }
body.workspace-mode .home-metrics .home-tone-0 { background:#eef1ff !important; }
body.workspace-mode .home-metrics .home-tone-1 { background:#eff8fc !important; }
body.workspace-mode .home-metrics .home-tone-2 { background:#fff6ed !important; }
body.workspace-mode .home-metrics .home-tone-3 { background:#f2f9ee !important; }
body.workspace-mode .home-shortcuts { display:grid !important; grid-template-columns:repeat(6,minmax(0,1fr)) !important; gap:8px !important; }
body.workspace-mode .home-shortcuts .home-shortcut { display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:flex-start !important; gap:7px !important; padding:3px 0 !important; min-height:68px !important; }
body.workspace-mode .home-shortcut>span { display:grid !important; place-items:center !important; width:44px !important; height:44px !important; border-radius:14px !important; background:#edf1ff !important; color:#4666c0 !important; }
body.workspace-mode .home-shortcut:nth-child(3n+2)>span { background:#ecf8fd !important; color:#227fb1 !important; }
body.workspace-mode .home-shortcut:nth-child(3n)>span { background:#edf9ed !important; color:#388947 !important; }
body.workspace-mode .home-shortcut strong { font-size:12px !important; line-height:1.4 !important; font-weight:500 !important; }
body.workspace-mode .home-shortcut small { font-size:11px !important; line-height:1.2 !important; color:#697184 !important; }
body.workspace-mode .home-tabs { display:flex !important; flex-wrap:wrap !important; gap:3px !important; }
body.workspace-mode .home-tabs button { padding:5px !important; font-size:12px !important; border-radius:0 !important; border-bottom:2px solid transparent !important; }
body.workspace-mode .home-tabs button[aria-pressed="true"] { color:#3655b1 !important; border-bottom-color:#526ac3 !important; }
body.workspace-mode .home-data, body.workspace-mode .home-approval, body.workspace-mode .home-usage-panel { min-height:278px !important; }
body.workspace-mode .home-empty { display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; gap:12px !important; min-height:136px !important; padding:18px 6px !important; color:#626d83 !important; font-size:13px !important; text-align:center !important; }
body.workspace-mode .home-empty svg { width:40px !important; height:40px !important; stroke:#7a87b0 !important; stroke-width:1.2 !important; }
body.workspace-mode .home-donut { width:150px !important; height:150px !important; border-radius:50% !important; background:var(--home-ring) !important; display:grid !important; place-items:center !important; margin:12px auto !important; }
body.workspace-mode .home-donut strong { display:grid !important; place-items:center !important; width:106px !important; height:106px !important; border-radius:50% !important; background:#fff !important; font-size:17px !important; font-weight:600 !important; font-variant-numeric:tabular-nums !important; }
body.workspace-mode .home-legend { display:flex !important; justify-content:center !important; flex-wrap:wrap !important; gap:6px 10px !important; font-size:12px !important; }
body.workspace-mode .home-legend>span { display:flex !important; align-items:center !important; gap:4px !important; overflow-wrap:anywhere !important; }
body.workspace-mode .home-legend i { width:12px !important; height:9px !important; flex-shrink:0 !important; border-radius:2px !important; }
body.workspace-mode .home-legend b { font-weight:500 !important; }
body.workspace-mode .home-legend-controls { display:flex !important; align-items:center !important; justify-content:center !important; color:#626d83 !important; font-size:12px !important; }
body.workspace-mode .home-legend-controls button { padding:2px !important; min-width:32px !important; }
body.workspace-mode .home-usage>div { display:flex !important; gap:10px !important; margin:18px 0 !important; align-items:flex-start !important; }
body.workspace-mode .home-usage>div>svg { color:#4765ba !important; width:28px !important; height:28px !important; }
body.workspace-mode .home-usage>div:nth-child(2)>svg { color:#23885f !important; }
body.workspace-mode .home-usage>div:nth-child(3)>svg { color:#b13989 !important; }
body.workspace-mode .home-usage span { display:flex !important; flex-direction:column !important; gap:5px !important; }
body.workspace-mode .home-usage strong { font-size:13px !important; font-weight:600 !important; }
body.workspace-mode .home-usage small, body.workspace-mode .home-note { font-size:12px !important; line-height:1.5 !important; color:#626d83 !important; }
body.workspace-mode .home-note { margin:10px 0 0 !important; }
body.workspace-mode .home-guides { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:4px 16px !important; list-style:disc !important; padding-left:16px !important; margin:0 !important; }
body.workspace-mode .home-guides button { text-align:left !important; padding:2px !important; line-height:1.5 !important; }
body.workspace-mode .home-promo { background:#edf1ff !important; }
body.workspace-mode .home-banner { padding:6px 0 !important; }
body.workspace-mode .home-banner>svg { width:36px !important; height:36px !important; color:#5068be !important; }
body.workspace-mode .home-banner h4 { font-size:18px !important; line-height:1.4 !important; margin:10px 0 !important; }
body.workspace-mode .home-banner p { font-size:13px !important; line-height:1.5 !important; margin:0 0 8px !important; color:#53628f !important; }
body.workspace-mode .home-more .home-empty { min-height:75px !important; }
body.workspace-mode .home-updates { min-height:173px !important; background:#f0f3ff !important; }
body.workspace-mode .home-news-list { display:grid !important; gap:3px !important; }
body.workspace-mode .home-news-list button { display:flex !important; align-items:baseline !important; justify-content:space-between !important; gap:12px !important; text-align:left !important; padding:5px 0 !important; line-height:1.5 !important; }
body.workspace-mode .home-news-list span { overflow-wrap:anywhere !important; }
body.workspace-mode .home-news-list time { flex-shrink:0 !important; font-size:12px !important; color:#626d83 !important; }
body.workspace-mode .home-notifications { min-height:330px !important; }
body.workspace-mode .home-notices { display:grid !important; }
body.workspace-mode .home-notices button { display:flex !important; text-align:left !important; align-items:flex-start !important; gap:8px !important; padding:12px 0 !important; border-bottom:1px solid #edf0f6 !important; border-radius:0 !important; }
body.workspace-mode .home-notices button>span:last-child { display:flex !important; flex-direction:column !important; gap:6px !important; }
body.workspace-mode .home-notices strong { font-size:13px !important; font-weight:500 !important; line-height:1.5 !important; overflow-wrap:anywhere !important; }
body.workspace-mode .home-notices time { font-size:12px !important; color:#626d83 !important; }
body.workspace-mode .home-notice-tag { background:#eaf7ee !important; color:#32754e !important; padding:2px 5px !important; border-radius:5px !important; flex-shrink:0 !important; font-size:11px !important; }
body.workspace-mode .home-support { display:flex !important; align-items:center !important; gap:12px !important; padding:12px 0 !important; }
body.workspace-mode .home-support svg { width:30px !important; height:30px !important; color:#488d71 !important; }
body.workspace-mode .home-support strong { font-size:13px !important; }
body.workspace-mode .home-support p { font-size:12px !important; color:#626d83 !important; line-height:1.5 !important; margin:6px 0 !important; }
body.workspace-mode .home-site-link { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:8px !important; min-height:44px !important; font-size:13px !important; color:#405ca4 !important; text-decoration:underline !important; text-underline-offset:3px !important; }
body.workspace-mode .home-rank { margin:8px 0 !important; padding-left:20px !important; }
body.workspace-mode .home-rank li { padding:8px 0 !important; font-size:13px !important; }
body.workspace-mode .home-rank strong { float:right !important; font-size:12px !important; }
body.workspace-mode #createDialog:has(.home-dialog) { width:min(900px,calc(100vw - 32px)) !important; max-width:calc(100vw - 32px) !important; padding:0 !important; }
body.workspace-mode .home-dialog { width:100% !important; max-width:100% !important; padding:24px !important; color:#293249 !important; }
body.workspace-mode .home-dialog .dialog-head { padding:0 0 16px !important; margin:0 !important; align-items:flex-start !important; }
body.workspace-mode .home-dialog h2 { font-size:20px !important; line-height:1.4 !important; }
body.workspace-mode .home-dialog h3 { font-size:15px !important; margin:20px 0 10px !important; }
body.workspace-mode .home-dialog p { font-size:14px !important; line-height:1.7 !important; overflow-wrap:anywhere !important; }
body.workspace-mode .home-config-list { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px !important; }
body.workspace-mode .home-config-list>div { display:flex !important; align-items:center !important; gap:8px !important; background:#f4f5fa !important; padding:8px !important; border-radius:8px !important; }
body.workspace-mode .home-config-list span { flex:1 !important; font-size:13px !important; }
body.workspace-mode .home-config-list button, body.workspace-mode .home-config-available button { min-height:36px !important; padding:6px 8px !important; font-size:12px !important; }
body.workspace-mode .home-config-available { display:flex !important; flex-wrap:wrap !important; gap:8px !important; }
body.workspace-mode .home-detail-list { max-height:60vh !important; overflow:auto !important; scrollbar-color:#c8cee5 #f6f7fb !important; }
body.workspace-mode .home-detail-list>button { display:flex !important; gap:12px !important; justify-content:space-between !important; width:100% !important; text-align:left !important; min-height:44px !important; padding:12px 4px !important; border:0 !important; border-bottom:1px solid #e4e7ef !important; border-radius:0 !important; background:transparent !important; }
body.workspace-mode .home-detail-list>button span { overflow-wrap:anywhere !important; }
body.workspace-mode [data-home-config-error] { color:#a53731 !important; }
@media (max-width:1200px) {
 body.workspace-mode .home-layout { grid-template-columns:minmax(0,1fr) 240px !important; }
 body.workspace-mode .home-main { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
 body.workspace-mode .home-shortcuts-panel { grid-column:span 2 !important; }
 body.workspace-mode .home-news { grid-column:span 2 !important; }
 body.workspace-mode .home-usage-panel { grid-column:span 2 !important; }
 body.workspace-mode .home-usage { display:flex !important; flex-wrap:wrap !important; gap:12px !important; justify-content:space-between !important; }
 body.workspace-mode .home-promo { grid-column:span 2 !important; }
}
@media (max-width:900px) {
 body.workspace-mode .home-layout { grid-template-columns:minmax(0,1fr) !important; }
 body.workspace-mode .home-aside { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
 body.workspace-mode .home-notifications { grid-row:span 2 !important; }
}
@media (max-width:600px) {
 body.workspace-mode .home-welcome { flex-direction:column !important; align-items:flex-start !important; }
 body.workspace-mode .home-main, body.workspace-mode .home-aside { grid-template-columns:minmax(0,1fr) !important; }
 body.workspace-mode .home-panel { grid-column:1 !important; padding:16px !important; border-radius:12px !important; }
 body.workspace-mode .home-notifications { grid-row:auto !important; }
 body.workspace-mode .home-shortcuts { grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:10px 4px !important; }
 body.workspace-mode .home-guides { grid-template-columns:minmax(0,1fr) !important; }
 body.workspace-mode .home-usage { display:block !important; }
 body.workspace-mode .personal-home button { min-height:44px !important; }
 body.workspace-mode .home-dialog { width:100% !important; padding:16px !important; }
 body.workspace-mode .home-config-list { grid-template-columns:minmax(0,1fr) !important; }
 body.workspace-mode .home-detail-list>button { flex-wrap:wrap !important; }
}

/* Designer gallery: draft edits commit together; no image mutations in read-only workbenches. */
body.workspace-mode .image-manage-entry { width:100%!important; white-space:normal!important; margin-top:10px!important; }
body.workspace-mode .product-image-manager-dialog { width:min(960px,calc(100vw - 24px))!important; }
body.workspace-mode .product-image-manager>p { margin:18px 24px!important; }
body.workspace-mode .product-image-manager form { padding:0 24px 20px!important; }
body.workspace-mode .product-image-manager { min-width:0!important; color:#263247!important; }
body.workspace-mode .product-image-manager h2 { font-size:21px!important; }
body.workspace-mode .gallery-upload { display:flex!important; flex-direction:column!important; align-items:center!important; gap:8px!important; border:1px dashed #8d98b7!important; background:#f7f8fc!important; padding:22px 14px!important; cursor:pointer!important; text-align:center!important; border-radius:8px!important; }
body.workspace-mode .gallery-upload span,body.workspace-mode .gallery-upload small { color:#53627a!important; }
body.workspace-mode .gallery-upload.is-over,body.workspace-mode .gallery-upload:focus-visible { outline:2px solid #5368b8!important; outline-offset:3px!important; }
body.workspace-mode .product-gallery-draft { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:16px!important; padding:20px 0!important; }
body.workspace-mode .product-gallery-draft figure { margin:0!important; min-width:0!important; }
body.workspace-mode .product-gallery-draft img { display:block!important; width:100%!important; height:160px!important; object-fit:cover!important; background:#f1f3f7!important; border-radius:6px!important; }
body.workspace-mode .product-gallery-draft figcaption { display:flex!important; justify-content:space-between!important; gap:6px!important; margin:8px 0!important; font-size:13px!important; }
body.workspace-mode .product-gallery-draft figcaption span { color:#617087!important; }
body.workspace-mode .product-gallery-draft figure>div { display:flex!important; flex-wrap:wrap!important; gap:6px!important; }
body.workspace-mode .product-gallery-draft button { padding:5px 9px!important; font-size:13px!important; min-height:32px!important; }
body.workspace-mode .product-image-manager footer { display:flex!important; flex-wrap:wrap!important; align-items:center!important; justify-content:flex-end!important; gap:12px!important; padding-top:16px!important; border-top:1px solid #e0e5ef!important; }
body.workspace-mode .product-image-manager footer span { margin-right:auto!important; }
body.workspace-mode .product-image-manager .gallery-feedback { margin:0!important; overflow-wrap:anywhere!important; }
body.workspace-mode .gallery-feedback[role=alert] { color:#a32f30!important; padding:12px!important; background:#fff1ef!important; }
@media(max-width:600px) { body.workspace-mode .product-gallery-draft { grid-template-columns:repeat(2,minmax(0,1fr))!important; } body.workspace-mode .product-gallery-draft img { height:150px!important; } body.workspace-mode .product-image-manager form { padding:0 14px 16px!important; } body.workspace-mode .product-image-manager>p { margin:14px!important; } body.workspace-mode .product-gallery-draft button { min-height:40px!important; } }

/* Keep editable design images in document flow, including the 768px legacy breakpoint. */
body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed {
  display:flex!important; flex-direction:column!important; gap:8px!important; align-items:stretch!important;
  position:static!important; width:132px!important; max-width:100%!important; min-width:0!important; height:auto!important; overflow:visible!important;
}
body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed > * {
  position:static!important; transform:none!important; margin:0!important; min-width:0!important;
}
body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed > .image-block-head {
  display:flex!important; flex-wrap:wrap!important; gap:6px!important; height:auto!important; width:100%!important;
}
body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed > .detail-image-frame {
  display:block!important; width:128px!important; max-width:100%!important; height:160px!important; flex:none!important;
}
body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed > .detail-image-frame > img {
  position:static!important; transform:none!important; width:100%!important; height:100%!important; max-width:100%!important; object-fit:cover!important;
}
body.workspace-mode dialog[data-view="design"] .image-block-managed .image-permission-badge.image-permission-ready {
  color:#16634e!important; background:#edf8f2!important; border-color:#a6d8c0!important;
}
body.workspace-mode dialog[data-view="design"] .image-block-managed .image-manage-entry { min-height:40px!important; }
@media(max-width:760px){
  body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed {
    display:grid!important; grid-template-columns:88px minmax(0,1fr)!important; grid-template-rows:auto auto auto!important; width:100%!important;
  }
  body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed > .detail-image-frame { grid-column:1!important; grid-row:1 / 4!important; width:88px!important; height:112px!important; }
  body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed > .image-block-head { grid-column:2!important; grid-row:1!important; }
  body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed > .image-manage-entry { grid-column:2!important; grid-row:2!important; width:auto!important; justify-self:start!important; }
  body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed > .image-permission-note { grid-column:2!important; grid-row:3!important; }
  body.workspace-mode dialog[data-view="design"] > .dialog-inner.product-detail-shell .details > .detail-top > .image-block-managed > .design-image-strip { grid-column:1 / -1!important; grid-row:4!important; }
}
/* Order documents: one ledger, independent document views and local table scrolling. */
body.workspace-mode .order-documents { min-width:0!important; padding:24px!important; background:#fff!important; border-radius:12px!important; color:#263247!important; }
body.workspace-mode .order-documents header { display:flex!important; flex-wrap:wrap!important; align-items:center!important; justify-content:space-between!important; gap:12px!important; margin-bottom:18px!important; }
body.workspace-mode .order-documents h2 { margin:0!important; font-size:22px!important; }
body.workspace-mode .order-document-links, body.workspace-mode .order-document-toolbar { display:flex!important; flex-wrap:wrap!important; gap:8px!important; padding:12px 0!important; border-bottom:1px solid #e2e5ef!important; }
body.workspace-mode .order-document-links [aria-current] { color:#374acd!important; border-color:#7784d5!important; background:#f1f2ff!important; }
body.workspace-mode .order-document-filters { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:14px!important; padding:20px 0!important; align-items:end!important; }
body.workspace-mode .order-document-filters label, body.workspace-mode .order-document-confirm label { display:grid!important; gap:6px!important; min-width:0!important; font-size:13px!important; }
body.workspace-mode .order-document-filters input, body.workspace-mode .order-document-filters select { width:100%!important; min-width:0!important; box-sizing:border-box!important; min-height:38px!important; padding:8px 10px!important; }
body.workspace-mode .order-document-table { max-width:100%!important; min-width:0!important; overflow-x:auto!important; scrollbar-gutter:stable!important; }
body.workspace-mode .order-document-table table { width:max-content!important; min-width:100%!important; border-collapse:collapse!important; table-layout:auto!important; }
body.workspace-mode .order-document-table th, body.workspace-mode .order-document-table td { padding:13px 15px!important; min-width:110px!important; max-width:220px!important; border-bottom:1px solid #e7e9f1!important; text-align:left!important; white-space:normal!important; overflow-wrap:anywhere!important; font-size:13px!important; color:#344157!important; }
body.workspace-mode .order-document-table th { background:#f6f7fb!important; color:#606b80!important; font-weight:500!important; }
body.workspace-mode .order-document-table th:first-child, body.workspace-mode .order-document-table td:first-child { min-width:42px!important; width:42px!important; }
body.workspace-mode .order-document-table input[type=checkbox] { width:18px!important; height:18px!important; }
body.workspace-mode .order-document-table img { width:60px!important; height:76px!important; object-fit:cover!important; }
body.workspace-mode .order-document-actions { display:flex!important; flex-wrap:wrap!important; gap:8px!important; min-width:140px!important; }
body.workspace-mode .order-document-pagination { display:flex!important; flex-wrap:wrap!important; align-items:center!important; gap:10px!important; margin-top:20px!important; }
body.workspace-mode .order-document-pagination label { display:flex!important; align-items:center!important; gap:6px!important; }
body.workspace-mode .order-document-pagination input { width:65px!important; }
body.workspace-mode .order-document-detail dl { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:14px 24px!important; }
body.workspace-mode .order-document-detail dl div { min-width:0!important; }
body.workspace-mode .order-document-detail dt { color:#667087!important; font-size:12px!important; }
body.workspace-mode .order-document-detail dd { margin:4px 0 0!important; overflow-wrap:anywhere!important; }
body.workspace-mode .order-document-detail li { display:flex!important; flex-wrap:wrap!important; gap:12px!important; padding:8px!important; }
body.workspace-mode .procurement-submit-feedback[role=alert], body.workspace-mode .order-document-confirm [role=alert] { color:#a32d2d!important; background:#fff1ef!important; padding:12px!important; overflow-wrap:anywhere!important; }
body.workspace-mode .procurement-submit-feedback { scroll-margin:20px!important; }
@media(max-width:800px) { body.workspace-mode .order-document-filters { grid-template-columns:repeat(2,minmax(0,1fr))!important; } }
@media(max-width:480px) { body.workspace-mode .order-documents { padding:14px!important; } body.workspace-mode .order-document-filters,body.workspace-mode .order-document-detail dl { grid-template-columns:minmax(0,1fr)!important; } }

body.workspace-mode .order-document-confirm>p,body.workspace-mode .order-document-detail>dl,body.workspace-mode .order-document-detail>h3,body.workspace-mode .order-document-detail>ol,body.workspace-mode .order-document-detail>footer,body.workspace-mode .order-document-detail>.table-wrap { margin:18px 24px!important; }
body.workspace-mode .order-document-confirm>form { padding:0 24px 24px!important; display:grid!important; gap:16px!important; }
body.workspace-mode .order-document-confirm footer { display:flex!important; justify-content:flex-end!important; flex-wrap:wrap!important; gap:10px!important; }
body.workspace-mode .order-document-confirm textarea,body.workspace-mode .order-document-confirm input { width:100%!important; box-sizing:border-box!important; min-width:0!important; }
@media(max-width:600px){body.workspace-mode .order-document-confirm>form{padding:0 14px 18px!important;}body.workspace-mode .order-document-confirm>p,body.workspace-mode .order-document-detail>dl,body.workspace-mode .order-document-detail>h3,body.workspace-mode .order-document-detail>ol,body.workspace-mode .order-document-detail>footer,body.workspace-mode .order-document-detail>.table-wrap{margin:14px!important;}body.workspace-mode .order-documents button{min-height:40px!important;}}

body.workspace-mode .order-document-filter-actions { display:flex!important; gap:8px!important; align-items:center!important; flex-wrap:wrap!important; }
body.workspace-mode .order-document-filter-actions button { min-height:38px!important; padding:8px 18px!important; }
body.workspace-mode .order-document-scroll-hint { margin:0 0 8px!important; font-size:12px!important; color:#59667b!important; }
@media(min-width:900px){body.workspace-mode .order-document-table th:last-child,body.workspace-mode .order-document-table td:last-child{position:sticky!important;right:0!important;background:#fff!important;box-shadow:-5px 0 8px -8px #65758b!important;z-index:1!important;}body.workspace-mode .order-document-table th:last-child{background:#f6f7fb!important;}}

/* Lingmao-referenced login · 2026-09-11. Authentication surface only. */
body.auth-mode {
  background: #f3f5fb !important;
  color: #202a40 !important;
}
body.auth-mode .app-shell.auth-mode {
  display: block !important;
  min-height: 100dvh !important;
  background: #f3f5fb !important;
}
body.auth-mode .auth-workspace {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100dvh !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #f3f5fb !important;
}
body.auth-mode .auth-workspace::before,
body.auth-mode .auth-workspace::after { display: none !important; }
body.auth-mode .auth-workspace #page {
  display: grid !important;
  align-items: center !important;
  flex: 1 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 40px 48px 24px !important;
  background: transparent !important;
}
body.auth-mode .auth-reference-login {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 440px !important;
  align-items: center !important;
  gap: 64px !important;
  width: min(1120px, 100%) !important;
  max-width: 1120px !important;
  min-height: 620px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  animation: none !important;
}
body.auth-mode .auth-reference-login .auth-brand-panel {
  display: flex !important;
  flex-direction: column !important;
  align-self: stretch !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  color: #254776 !important;
  background: transparent !important;
  border: 0 !important;
}
body.auth-mode .auth-reference-login .auth-brand-panel::before,
body.auth-mode .auth-reference-login .auth-brand-panel::after { display: none !important; }
body.auth-mode .auth-reference-login .auth-wordmark {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  color: #2460c8 !important;
}
body.auth-mode .auth-reference-login .auth-brand-emblem { display: block !important; width: 48px !important; height: 48px !important; object-fit: contain !important; mix-blend-mode: multiply !important; }
body.auth-mode .auth-reference-login .auth-wordmark-caption {
  margin-left: 12px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #596a88 !important;
}
body.auth-mode .auth-reference-login .auth-brand-content { margin: auto 0 !important; padding: 28px 0 0 !important; }
body.auth-mode .auth-reference-login .auth-brand-panel h1 {
  max-width: 100% !important;
  margin: 0 !important;
  font-size: clamp(30px, 3vw, 40px) !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  letter-spacing: .02em !important;
  white-space: normal !important;
  color: #304c79 !important;
}
body.auth-mode .auth-reference-login .auth-brand-note {
  margin: 20px 0 0 !important;
  color: #62718b !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
}
/* Approved landscape artwork occupies x=20..980, y=250..890 in the
   1000px source canvas. Clip the canvas, not any illustration content.
   Keep this in the current source layer so rebuilding preserves the fix. */
body.auth-mode .auth-reference-login .auth-scene {
  display: block !important;
  width: 100% !important;
  max-width: 460px !important;
  aspect-ratio: 3 / 2 !important;
  margin: 28px auto 0 !important;
  background: transparent !important;
  mix-blend-mode: normal !important;
}
body.auth-mode .auth-reference-login .auth-scene-artwork {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: 3 / 2 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 4.166667% / 6.25% !important;
  background: transparent !important;
  padding: 0 !important;
}
body.auth-mode .auth-reference-login .auth-scene-artwork img {
  position: absolute !important;
  display: block !important;
  width: 104.166667% !important;
  max-width: none !important;
  height: 156.25% !important;
  left: -2.083333% !important;
  top: -39.0625% !important;
  object-fit: fill !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  /* The approved source contains a white matte around the illustration.
     Multiply it into the page surface so the artwork has no white card edge. */
  mix-blend-mode: multiply !important;
}
body.auth-mode .auth-reference-login .auth-scene-signals { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; overflow: visible !important; }
body.auth-mode .auth-reference-login .auth-signal { fill: none !important; stroke: #fff !important; stroke-width: 5 !important; stroke-linecap: round !important; stroke-dasharray: 18 122 !important; }
body.auth-mode .auth-reference-login .auth-panel {
  width: 100% !important;
  min-width: 0 !important;
  padding: 46px 44px 36px !important;
  border: 1px solid #e7ebf4 !important;
  border-radius: 20px !important;
  background: #fff !important;
  box-shadow: 0 16px 44px rgb(35 52 87 / 10%) !important;
  color: #202a40 !important;
}
body.auth-mode .auth-reference-login .auth-visible-title {
  margin: 0 !important;
  padding: 0 !important;
  color: #202a40 !important;
  font-size: 26px !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
}
body.auth-mode .auth-reference-login .auth-intro { margin: 8px 0 28px !important; color: #64718a !important; font-size: 14px !important; line-height: 1.6 !important; }
body.auth-mode .auth-reference-login .auth-method-tabs {
  display: flex !important;
  gap: 32px !important;
  margin: 0 0 26px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}
body.auth-mode .auth-reference-login .auth-method-tab {
  position: relative !important;
  flex: none !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #64718a !important;
  font-size: 15px !important;
  font-weight: 500 !important;
}
body.auth-mode .auth-reference-login .auth-method-tab.active { color: #155bdd !important; background: transparent !important; }
body.auth-mode .auth-reference-login .auth-method-tab.active::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: calc(50% - 10px) !important;
  width: 20px !important;
  height: 2px !important;
  background: #155bdd !important;
  border-radius: 1px !important;
}
body.auth-mode .auth-reference-login .auth-form { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 20px !important; margin: 0 !important; padding: 0 !important; }
body.auth-mode .auth-reference-login .auth-form label { display: grid !important; gap: 8px !important; margin: 0 !important; color: #43516a !important; font-size: 13px !important; font-weight: 500 !important; }
body.auth-mode .auth-reference-login .required-indicator { display: none !important; }
body.auth-mode .auth-reference-login .auth-form input {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  padding: 11px 12px !important;
  border: 1px solid #c8d1e3 !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #202a40 !important;
  font-size: 14px !important;
  line-height: 22px !important;
  caret-color: #155bdd !important;
}
body.auth-mode .auth-reference-login input::placeholder { color: #69758b !important; opacity: 1 !important; }
body.auth-mode .auth-reference-login .password-field { display: flex !important; position: relative !important; min-width: 0 !important; }
body.auth-mode .auth-reference-login .password-field input { padding-right: 60px !important; }
body.auth-mode .auth-reference-login .password-toggle { position: absolute !important; inset: 1px 1px 1px auto !important; min-width: 52px !important; padding: 0 10px !important; border: 0 !important; border-radius: 0 5px 5px 0 !important; background: transparent !important; color: #4a6187 !important; font-size: 13px !important; box-shadow: none !important; }
body.auth-mode .auth-reference-login .sms-code-field { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 8px !important; }
body.auth-mode .auth-reference-login .sms-code-button { min-width: 106px !important; min-height: 46px !important; padding: 8px 10px !important; border: 1px solid #c8d1e3 !important; border-radius: 6px !important; background: #f7f9fe !important; color: #155bdd !important; font-size: 13px !important; white-space: nowrap !important; box-shadow: none !important; }
body.auth-mode .auth-reference-login .auth-submit { width: 100% !important; min-height: 46px !important; margin: 4px 0 0 !important; padding: 11px 16px !important; border: 1px solid #155bdd !important; border-radius: 6px !important; background: #155bdd !important; color: #fff !important; font-size: 15px !important; font-weight: 600 !important; line-height: 22px !important; box-shadow: none !important; }
body.auth-mode .auth-reference-login .auth-submit:hover { background: #104abd !important; border-color: #104abd !important; transform: none !important; }
body.auth-mode .auth-reference-login .auth-submit::after { display: none !important; }
body.auth-mode .auth-reference-login :is(button, input):disabled { opacity: .65 !important; cursor: wait !important; }
body.auth-mode .auth-reference-login :is(button, input):focus-visible { outline: 2px solid #155bdd !important; outline-offset: 3px !important; }
body.auth-mode .auth-reference-login ::selection { background: #dce8ff !important; color: #153b80 !important; }
body.auth-mode .auth-reference-login .auth-form-hint { margin: -4px 0 0 !important; color: #64718a !important; font-size: 12px !important; line-height: 1.65 !important; }
body.auth-mode .auth-reference-login .auth-error { min-height: 0 !important; margin: 16px 0 0 !important; padding: 10px 12px !important; background: #fff1ef !important; border: 1px solid #f1c5bd !important; border-radius: 6px !important; color: #a33223 !important; font-size: 13px !important; line-height: 1.65 !important; overflow-wrap: anywhere !important; }
body.auth-mode .auth-reference-login .auth-error:empty { display: none !important; }
body.auth-mode .auth-reference-login .auth-error.auth-success { color: #166349 !important; background: #edf8f2 !important; border-color: #b8ddc9 !important; }
body.auth-mode .auth-reference-login .auth-error.auth-warning { color: #785014 !important; background: #fff8e8 !important; border-color: #e7d1a6 !important; }
body.auth-mode .auth-reference-login .auth-account-actions { display: flex !important; justify-content: flex-end !important; gap: 24px !important; flex-wrap: wrap !important; margin-top: 32px !important; }
body.auth-mode .auth-reference-login :is(.auth-register-link, .auth-forgot-button) { width: auto !important; min-height: 36px !important; margin: 0 !important; padding: 4px 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: #155bdd !important; font-size: 13px !important; font-weight: 400 !important; }
body.auth-mode .auth-reference-login :is(.auth-register-link, .auth-forgot-button):hover { color: #104abd !important; text-decoration: underline !important; text-underline-offset: 4px !important; }
body.auth-mode #platformLegalFooter { max-width: 100% !important; overflow-wrap: anywhere !important; white-space: normal !important; flex-wrap: wrap !important; position: static !important; flex: none !important; margin: 0 !important; padding: 18px 24px 22px !important; color: #63708a !important; background: transparent !important; border: 0 !important; font-size: 12px !important; }
@media (max-width: 1100px) {
  body.auth-mode .auth-reference-login { grid-template-columns: minmax(0, 1fr) 400px !important; gap: 32px !important; min-height: 600px !important; }
  body.auth-mode .auth-reference-login .auth-panel { padding: 38px 32px 28px !important; }
}
@media (max-width: 800px) {
  body.auth-mode .auth-workspace #page { padding: 28px 24px 16px !important; }
  body.auth-mode .auth-reference-login { grid-template-columns: minmax(0, 1fr) !important; gap: 28px !important; min-height: 0 !important; max-width: 440px !important; }
  body.auth-mode .auth-reference-login .auth-brand-content { display: none !important; }
  body.auth-mode .auth-reference-login .auth-wordmark { font-size: 22px !important; }
  body.auth-mode .auth-reference-login .auth-brand-wordmark { width: 150px !important; height: auto !important; }
  body.auth-mode .auth-reference-login .auth-panel { padding: 32px 28px 24px !important; }
}
@media (max-width: 440px) {
  body.auth-mode .auth-workspace #page { padding: 24px 16px 12px !important; }
  body.auth-mode .auth-reference-login .auth-panel { padding: 30px 24px 22px !important; border-radius: 16px !important; }
  body.auth-mode .auth-reference-login .auth-method-tabs { gap: 26px !important; }
  body.auth-mode .auth-reference-login .auth-wordmark-caption { margin-left: 8px !important; }
}

/* lingmao-scroll-cards=20260911: fixed image and identity; only facts scroll. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-card-grid { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:16px !important; min-width:0 !important; padding:8px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card { display:grid !important; grid-template-columns:minmax(100px,36%) minmax(0,1fr) !important; grid-template-rows:auto minmax(0,1fr) auto !important; gap:0 16px !important; height:auto !important; min-height:400px !important; min-width:0 !important; padding:16px 16px 0 !important; margin:0 !important; border:1px solid transparent !important; border-radius:12px !important; background:#f5f5fa !important; box-shadow:none !important; color:#26334b !important; box-sizing:border-box !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card { position:relative !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card:is(:hover,:focus-within) { border-color:#b6bbd1 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card:has(.catalog-order-select input:checked) { border-color:#3162c6 !important; background:#f0f4fe !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-image { grid-column:1 !important; grid-row:1 / 3 !important; min-height:0 !important; position:relative !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-image { overflow:hidden !important; isolation:isolate !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-image > :is(img,.product-thumbnail-frame) { display:block !important; width:100% !important; height:100% !important; max-width:none !important; max-height:none !important; min-height:0 !important; aspect-ratio:auto !important; border:0 !important; border-radius:9px !important; object-fit:cover !important; background:#fff !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-heading { grid-column:2 !important; grid-row:1 !important; min-width:0 !important; padding:0 0 10px !important; display:flex !important; flex-direction:column !important; justify-content:start !important; gap:6px !important; overflow:visible !important; position:relative !important; z-index:1 !important; background:#f5f5fa !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-name { font-size:16px !important; font-weight:600 !important; display:block !important; -webkit-line-clamp:unset !important; overflow:visible !important; line-height:1.5 !important; color:#1e293b !important; white-space:normal !important; overflow-wrap:anywhere !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-heading .style-code { flex:0 1 auto !important; font-size:14px !important; font-weight:500 !important; color:#65738b !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; min-width:0 !important; min-height:26px !important; max-width:100% !important; padding:0 !important; border:0 !important; background:transparent !important; text-align:left !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-heading .style-code-actions { width:100% !important; max-width:100% !important; display:flex !important; gap:4px !important; min-width:0 !important; align-items:start !important; }
/* Card headings must stay in their own grid track; long labels never sit on top of artwork. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-heading > * { flex:0 0 auto !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-heading .style-code-copy { flex:0 0 26px !important; width:26px !important; height:26px !important; min-width:26px !important; min-height:26px !important; padding:4px !important; border:0 !important; background:transparent !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-facts { grid-column:2 !important; grid-row:2 !important; min-height:0 !important; height:auto !important; max-height:180px !important; scrollbar-gutter:stable !important; min-width:0 !important; overflow-y:auto !important; overflow-x:hidden !important; padding:10px 6px 16px 0 !important; border-top:1px solid #e5e6ef !important; scrollbar-width:thin !important; scrollbar-color:#c4c8da transparent !important; overscroll-behavior-y:auto !important; scroll-behavior:auto !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-facts:focus-visible { outline:2px solid #3162c6 !important; outline-offset:2px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-field { display:block !important; min-width:0 !important; margin:0 0 12px !important; padding:0 !important; border:0 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-facts :is(p,span,strong,small,dd) { white-space:normal !important; overflow-wrap:anywhere !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-facts :is(.stack,.owner-role-list,.pattern-card-assignments) { display:grid !important; gap:5px !important; min-width:0 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-facts .subtle { color:#68758a !important; font-size:12px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-actions { width:auto !important; max-width:100% !important; grid-column:1 / -1 !important; grid-row:3 !important; min-width:0 !important; margin:12px 0 0 !important; padding:8px 0 !important; border-top:1px solid #e5e6ef !important; background:transparent !important; overflow:auto !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-actions :is(.row-action-list,.row-actions,.row-action-primary,.row-action-secondary) { display:flex !important; flex-wrap:wrap !important; gap:4px 10px !important; min-width:0 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-actions button { font-size:12px !important; white-space:normal !important; min-height:28px !important; padding:4px 6px !important; border:0 !important; border-radius:4px !important; background:transparent !important; }
/* Keep the order selector outside the heading's measured reading area. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card:has(> .record-card-selection) > .record-card-heading { margin-right:32px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-selection { position:absolute !important; top:8px !important; right:8px !important; left:auto !important; z-index:2 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-selection .catalog-order-select { display:flex !important; align-items:center !important; justify-content:center !important; width:32px !important; height:32px !important; min-width:0 !important; margin:0 !important; padding:6px !important; box-sizing:border-box !important; border-radius:5px !important; background:#fff !important; cursor:pointer !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-selection input[type="checkbox"] { appearance:auto !important; width:20px !important; height:20px !important; min-width:20px !important; margin:0 !important; padding:0 !important; accent-color:#2459a6 !important; cursor:pointer !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-selection .catalog-order-select:has(input:focus-visible) { outline:2px solid #2459a6 !important; outline-offset:2px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card:has([data-catalog-order-select]:checked) { border-color:#2459a6 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-card-grid.is-empty { grid-template-columns:minmax(0,1fr) !important; }
@media (max-width:1199px) { html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; } }
@media (max-width:900px) { html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-card-grid { grid-template-columns:minmax(0,1fr) !important; } }
@media (max-width:440px) { html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card { grid-template-columns:100px minmax(0,1fr) !important; gap:0 12px !important; padding:12px 12px 0 !important; } }

html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-facts .owner-role-line { display:grid !important; grid-template-columns:52px minmax(0,1fr) !important; gap:8px !important; min-width:0 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-facts .owner-role-line > span { color:#68758a !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-facts .owner-role-line > strong { min-width:0 !important; white-space:normal !important; overflow-wrap:anywhere !important; }
/* record-actions-text=20260912: shared list/card actions; excludes form submit toolbars. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.record-card-actions,.row-actions,.inbound-row-actions,.contract-row-actions,.order-document-actions,.operation-order-actions,.order-change-review-actions,.proofing-actions,.schedule-card-actions,.history-actions) button { background:transparent !important; background-image:none !important; border-color:transparent !important; box-shadow:none !important; color:#33465d !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-actions button.primary { padding:4px 6px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.record-card-actions,.row-actions,.inbound-row-actions,.contract-row-actions,.order-document-actions,.operation-order-actions,.order-change-review-actions,.proofing-actions,.schedule-card-actions,.history-actions) button:is(:hover,:active):not(:disabled):not([aria-disabled="true"]) { background:transparent !important; color:#2459a6 !important; text-decoration:underline !important; text-underline-offset:3px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.record-card-actions,.row-actions,.inbound-row-actions,.contract-row-actions,.order-document-actions,.operation-order-actions,.order-change-review-actions,.proofing-actions,.schedule-card-actions,.history-actions) button.danger { color:#a52626 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.record-card-actions,.row-actions,.inbound-row-actions,.contract-row-actions,.order-document-actions,.operation-order-actions,.order-change-review-actions,.proofing-actions,.schedule-card-actions,.history-actions) button:focus-visible { outline:2px solid #2459a6 !important; outline-offset:2px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(.record-card-actions,.row-actions,.inbound-row-actions,.contract-row-actions,.order-document-actions,.operation-order-actions,.order-change-review-actions,.proofing-actions,.schedule-card-actions,.history-actions) button:is(:disabled,[aria-disabled="true"]) { background:transparent !important; opacity:.5 !important; cursor:not-allowed !important; text-decoration:none !important; }

/* effect-status-text=20260912: body-mounted dialogs share the same readable status contract. */
html body.workspace-mode :is(#page,dialog) .effect-status { background:transparent !important; background-image:none !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; color:#52647a !important; padding:0 !important; min-width:0 !important; max-width:100% !important; white-space:normal !important; overflow-wrap:anywhere !important; line-height:1.6 !important; }
html body.workspace-mode :is(#page,dialog) .effect-status.ready { color:#256348 !important; }
html body.workspace-mode :is(#page,dialog) .effect-status.failed { color:#a52626 !important; }
html body.workspace-mode :is(#page,dialog) .effect-status.running { color:#2459a6 !important; }
html body.workspace-mode :is(#page,dialog) .effect-status.stale { color:#825500 !important; }

/* purchase-allocation=20260911: demand groups own quantity; each group is a separate PO. */
body.workspace-mode dialog:has(> .purchase-dispatch-dialog) { width:min(1180px,calc(100vw - 32px)) !important; max-width:calc(100vw - 32px) !important; }
body.workspace-mode .purchase-dispatch-dialog { min-width:0 !important; padding:24px !important; }
body.workspace-mode .purchase-dispatch-dialog .dialog-head p { margin:6px 0 0 !important; color:#52647a !important; }
body.workspace-mode .purchase-common, body.workspace-mode .purchase-group-fields { display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:16px !important; align-items:end !important; }
body.workspace-mode .purchase-common { grid-template-columns:repeat(2,minmax(0,1fr)) auto !important; padding-bottom:24px !important; border-bottom:1px solid #d7dfe8 !important; }
body.workspace-mode .purchase-dispatch-dialog label { display:grid !important; gap:6px !important; min-width:0 !important; font-size:14px !important; color:#33465d !important; }
body.workspace-mode .purchase-dispatch-dialog input, body.workspace-mode .purchase-dispatch-dialog select, body.workspace-mode .purchase-dispatch-dialog textarea { min-width:0 !important; width:100% !important; max-width:100% !important; box-sizing:border-box !important; min-height:38px !important; }
body.workspace-mode .purchase-demand { padding:24px 0 !important; border-bottom:1px solid #d7dfe8 !important; }
body.workspace-mode .purchase-demand h3 { font-size:17px !important; margin:0 0 6px !important; }
body.workspace-mode .purchase-demand header p { margin:0 0 16px !important; color:#52647a !important; font-size:13px !important; overflow-wrap:anywhere !important; }
body.workspace-mode .purchase-allocation-group { min-width:0 !important; border:1px solid #d7dfe8 !important; border-radius:4px !important; padding:18px !important; margin:0 0 16px !important; background:#fff !important; }
body.workspace-mode .purchase-allocation-group legend { padding:0 8px !important; font-size:14px !important; font-weight:600 !important; color:#263b54 !important; }
body.workspace-mode .purchase-dispatch-dialog .table-wrap { max-width:100% !important; overflow-x:auto !important; margin:16px 0 !important; }
body.workspace-mode .purchase-dispatch-dialog table { min-width:520px !important; width:100% !important; table-layout:fixed !important; }
body.workspace-mode .purchase-dispatch-dialog th, body.workspace-mode .purchase-dispatch-dialog td { padding:10px !important; height:auto !important; overflow-wrap:anywhere !important; }
body.workspace-mode .purchase-dispatch-dialog [data-purchase-qty] { min-height:38px !important; max-width:120px !important; font-variant-numeric:tabular-nums !important; }
body.workspace-mode .purchase-dispatch-dialog details { padding:4px 0 12px !important; }
body.workspace-mode .purchase-dispatch-dialog summary { color:#2459a6 !important; cursor:pointer !important; padding:8px 0 !important; }
body.workspace-mode .purchase-group-footer { display:flex !important; align-items:center !important; gap:12px !important; flex-wrap:wrap !important; margin-top:12px !important; }
body.workspace-mode .purchase-group-footer span { margin-right:auto !important; font-weight:600 !important; }
body.workspace-mode .purchase-delay { margin-top:12px !important; }
body.workspace-mode .purchase-delay[hidden] { display:none !important; }
body.workspace-mode .purchase-dispatch-dialog .form-footer { display:flex !important; flex-wrap:wrap !important; gap:12px !important; align-items:center !important; }
body.workspace-mode .purchase-dispatch-dialog .form-footer span { margin-right:auto !important; }
body.workspace-mode .purchase-dispatch-dialog [role=alert] { color:#a42f29 !important; }
body.workspace-mode .purchase-dispatch-dialog :focus-visible, body.supplier-portal :focus-visible { outline:2px solid #2459a6 !important; outline-offset:3px !important; }
body.supplier-portal { margin:0 !important; background:#f3f5f9 !important; color:#24374f !important; font:14px/1.5 Inter,"PingFang SC","Microsoft YaHei",sans-serif !important; }
body.supplier-portal main { max-width:920px !important; margin:auto !important; padding:32px 24px !important; }
body.supplier-portal header { padding:0 0 20px !important; }
body.supplier-portal h1 { font-size:26px !important; margin:10px 0 !important; }
body.supplier-portal h2 { font-size:20px !important; margin:0 0 16px !important; }
body.supplier-portal h3 { font-size:16px !important; margin:20px 0 8px !important; }
body.supplier-portal section { background:#fff !important; padding:24px !important; border:1px solid #d7dfe8 !important; margin-bottom:20px !important; min-width:0 !important; }
body.supplier-portal #supplierContent { background:transparent !important; border:0 !important; padding:0 !important; }
body.supplier-portal p, body.supplier-portal dd { overflow-wrap:anywhere !important; }
body.supplier-portal label { display:grid !important; gap:6px !important; margin:16px 0 !important; }
body.supplier-portal input, body.supplier-portal select, body.supplier-portal textarea { box-sizing:border-box !important; max-width:100% !important; width:100% !important; padding:10px 12px !important; border:1px solid #8798ad !important; border-radius:4px !important; background:white !important; color:#24374f !important; font:inherit !important; }
body.supplier-portal textarea { min-height:96px !important; }
body.supplier-portal button { background:#2459a6 !important; color:#fff !important; font:inherit !important; border:1px solid #2459a6 !important; padding:9px 18px !important; border-radius:4px !important; cursor:pointer !important; }
body.supplier-portal button[data-refresh] { background:#fff !important; color:#2459a6 !important; border-color:#8798ad !important; }
body.supplier-portal button[data-refresh]:hover:enabled { background:#eef3fa !important; }
body.supplier-portal button:disabled { opacity:.5 !important; cursor:wait !important; }
body.supplier-portal button:hover:enabled { background:#194780 !important; }
body.supplier-portal footer { display:flex !important; gap:12px !important; flex-wrap:wrap !important; }
body.supplier-portal dl { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px !important; }
body.supplier-portal dt { color:#52647a !important; }
body.supplier-portal dd { margin:0 !important; font-weight:600 !important; }
body.supplier-portal table { width:100% !important; border-collapse:collapse !important; }
body.supplier-portal th, body.supplier-portal td { color:#24374f !important; background:#fff !important; text-align:left !important; padding:10px !important; border-bottom:1px solid #d7dfe8 !important; }
body.supplier-portal ol { list-style:none !important; padding:0 !important; }
body.supplier-portal li { padding:14px 0 !important; border-bottom:1px solid #d7dfe8 !important; }
body.supplier-portal li span { display:block !important; color:#52647a !important; font-size:13px !important; }
body.supplier-portal [role=alert] { color:#a42f29 !important; }
body.supplier-portal [hidden] { display:none !important; }
@media(max-width:760px) {
 body.workspace-mode dialog:has(> .purchase-dispatch-dialog) { width:calc(100vw - 16px) !important; max-width:calc(100vw - 16px) !important; }
 body.workspace-mode .purchase-dispatch-dialog { padding:16px !important; }
 body.workspace-mode .purchase-group-fields, body.workspace-mode .purchase-common { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
 body.workspace-mode .purchase-allocation-group { padding:12px !important; }
 body.supplier-portal main { padding:20px 12px !important; }
 body.supplier-portal section { padding:18px !important; }
}
@media(max-width:480px) {
 body.workspace-mode .purchase-group-fields, body.workspace-mode .purchase-common, body.supplier-portal dl { grid-template-columns:minmax(0,1fr) !important; }
}
body.workspace-mode .purchase-quantity-hint { display:none !important; }
@media(max-width:760px) { body.workspace-mode .purchase-quantity-hint { display:block !important; color:#52647a !important; font-size:12px !important; margin:12px 0 0 !important; } }

body.workspace-mode .purchase-dispatch-dialog input::placeholder, body.workspace-mode .purchase-dispatch-dialog textarea::placeholder, body.supplier-portal input::placeholder, body.supplier-portal textarea::placeholder { color:#52647a !important; opacity:1 !important; }
/* catalog-settings-clean=20260912-r1: Lingmao-style grouped settings surface */
body.workspace-mode #page:has(.catalog-model-profiles) { max-width: 1320px !important; }
body.workspace-mode #page:has(.catalog-model-profiles) > .toolbar {
  position: sticky !important; top: 0 !important; z-index: 5 !important;
  margin: -8px 0 16px !important; padding: 14px 18px !important;
  background: rgba(248,250,252,.96) !important; border-bottom: 1px solid #dbe4ee !important;
  backdrop-filter: blur(8px) !important;
}
body.workspace-mode #page:has(.catalog-model-profiles) > .panel {
  margin: 0 0 16px !important; padding: 20px !important; border: 1px solid #d9e2ec !important;
  border-radius: 8px !important; background: #fff !important; box-shadow: 0 2px 8px rgba(26,55,84,.04) !important;
}
body.workspace-mode #page:has(.catalog-model-profiles) > .panel .panel-head {
  align-items: flex-start !important; gap: 12px !important; margin-bottom: 14px !important;
}
body.workspace-mode #page:has(.catalog-model-profiles) > .panel .panel-head h3 { margin: 0 !important; font-size: 17px !important; }
body.workspace-mode #page:has(.catalog-model-profiles) > .panel .panel-head p { margin: 4px 0 0 !important; max-width: 720px !important; line-height: 1.55 !important; }
body.workspace-mode #page:has(.catalog-model-profiles) > .panel .form-grid { gap: 14px 18px !important; }
body.workspace-mode #page:has(.catalog-model-profiles) > .panel .full-field { grid-column: 1 / -1 !important; }
body.workspace-mode #page:has(.catalog-model-profiles) #saveCatalog { min-width: 128px !important; }
body.workspace-mode #page:has(.catalog-model-profiles) #catalogMaterialPurchaseFormula { min-height: 72px !important; resize: vertical !important; }
@media (max-width: 760px) {
  body.workspace-mode #page:has(.catalog-model-profiles) > .toolbar { position: static !important; margin-top: 0 !important; }
  body.workspace-mode #page:has(.catalog-model-profiles) > .panel { padding: 14px !important; }
}
/* workspace-tabs-sticky=20260912-r1: keep the Lingmao-style workbench switcher
 * visible while the document scrolls. The page remains the sole vertical
 * scroll owner; tabs only pin to the top edge below the topbar. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
  position: sticky !important;
  top: 0 !important;
  align-self: start !important;
  /* Do not use CSS containment here: contain:layout makes sticky fail in
   * Chromium when the workspace itself is the document scroll owner. */
  z-index: 20 !important;
  min-height: 54px !important;
  box-shadow: 0 1px 0 rgba(35,58,82,.12), 0 4px 12px rgba(35,58,82,.06) !important;
}
/* account-directory-density=20260915: use the full panel width for the
 * consolidated employee/account table so the right side carries useful data. */
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table {
  width: 100% !important;
  table-layout: fixed !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table th:nth-child(1),
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table td:nth-child(1) { width: 28% !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table th:nth-child(2),
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table td:nth-child(2) { width: 24% !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table th:nth-child(3),
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table td:nth-child(3) { width: 20% !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table th:nth-child(4),
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table td:nth-child(4) { width: 12% !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table th:nth-child(5),
body.workspace-mode .app-shell[data-ui-shell="r26"] .account-table td:nth-child(5) { width: 16% !important; }
/* Catalog controls own a grid row instead of covering the title and selector. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card:has(> .record-card-management) { grid-template-rows:42px auto minmax(0,1fr) auto !important; min-height:442px !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card:has(> .record-card-management) > .record-card-image { grid-row:2 / 4 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card:has(> .record-card-management) > .record-card-heading { grid-row:2 !important; margin-right:0 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card:has(> .record-card-management) > .record-card-facts { grid-row:3 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card:has(> .record-card-management) > .record-card-actions { grid-row:4 !important; }
body.workspace-mode .record-card-management { position:relative !important; grid-column:1 / -1 !important; grid-row:1 !important; align-self:start !important; justify-self:end !important; z-index:5 !important; display:flex !important; align-items:center !important; gap:10px !important; padding:0 !important; background:transparent !important; }
body.workspace-mode .lingmao-record-card:has(> .record-card-selection) > .record-card-management { margin-right:42px !important; }
body.workspace-mode .record-card-menu { position:relative !important; }
body.workspace-mode .lingmao-record-card { position:relative !important; }
body.workspace-mode .record-card-menu summary { list-style:none !important; cursor:pointer !important; width:34px !important; height:34px !important; border-radius:50% !important; display:grid !important; place-items:center !important; background:#fff !important; box-shadow:0 2px 8px rgba(25,49,75,.12) !important; font-weight:800 !important; color:#73809a !important; }
body.workspace-mode .record-card-menu summary::-webkit-details-marker { display:none !important; }
body.workspace-mode .record-card-menu summary svg { width:24px !important; height:24px !important; fill:currentColor !important; }
body.workspace-mode .record-card-menu-panel { position:absolute !important; right:0 !important; top:40px !important; min-width:112px !important; padding:6px !important; border-radius:12px !important; background:#fff !important; box-shadow:0 10px 26px rgba(25,49,75,.18) !important; }
body.workspace-mode .record-card-menu-panel button { display:block !important; width:100% !important; border:0 !important; background:transparent !important; padding:9px 12px !important; text-align:left !important; cursor:pointer !important; border-radius:8px !important; }
body.workspace-mode .record-card-menu-panel button:hover:not(:disabled) { text-decoration:underline !important; }
body.workspace-mode .record-card-menu-panel button:disabled { opacity:.55 !important; cursor:not-allowed !important; }
body.workspace-mode .record-card-menu summary:focus-visible,
body.workspace-mode .record-card-menu-panel button:focus-visible { outline:2px solid #365da8 !important; outline-offset:2px !important; }
body.workspace-mode .record-card-availability { display:inline-flex !important; align-items:center !important; gap:5px !important; white-space:nowrap !important; font-size:13px !important; font-weight:500 !important; color:#263247 !important; }
body.workspace-mode .record-card-availability svg { width:20px !important; height:20px !important; flex:none !important; color:#139d77 !important; }
body.workspace-mode .record-card-availability.is-disabled { color:#697586 !important; }
body.workspace-mode .record-card-availability.is-disabled svg { color:#697586 !important; }
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace,
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page {
  overflow: visible !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs[hidden] {
  display: none !important;
}
/* schedule-image-dialog-fit=20260915-r1: generated outfit previews stay
 * inside the dialog viewport instead of expanding to their source dimensions. */
body.workspace-mode dialog:has(> .dialog-inner.schedule-image-dialog) {
  width: min(960px, calc(100vw - 32px)) !important;
  max-width: min(960px, calc(100vw - 32px)) !important;
  max-height: calc(100dvh - 32px) !important;
  overflow: auto !important;
}
body.workspace-mode .schedule-image-dialog { min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; }
body.workspace-mode .schedule-image-dialog .schedule-image-result { min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; }
body.workspace-mode .schedule-image-dialog .schedule-image-result img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: min(58dvh, 620px) !important;
  object-fit: contain !important;
  object-position: center !important;
  margin: 12px auto !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs .workspace-tab {
  flex: 0 0 auto !important;
}
/* workspace-tabs-sticky=20260915-r2: the topbar and workbench switcher are
 * stacked sticky regions. Keep the page tabs below both regions so scrolling
 * never hides the menu behind the header. On mobile the switcher is in flow,
 * so only reserve the compact topbar height. */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
  top: 0 !important;
  z-index: 26 !important;
  background: #eef3f7 !important;
  isolation: isolate !important;
}
@media (min-width: 761px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
    /* Keep the tabs in document flow so their sticky position never covers
     * card content while scrolling. */
    position: sticky !important;
    top: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}
@media (max-width: 760px) {
  body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .workspace-tabs {
    top: 0 !important;
  }
}
/* auth-language-menu=20260912-r1 */
body.auth-mode .auth-reference-login { position: relative !important; }
body.auth-mode .auth-language { position: absolute !important; top: 24px !important; right: 28px !important; z-index: 8 !important; }
body.auth-mode .auth-language-trigger { border: 0 !important; background: transparent !important; color: #6b7890 !important; font: inherit !important; padding: 8px 6px !important; cursor: pointer !important; }
body.auth-mode .auth-language-menu { position: absolute !important; right: 0 !important; top: 42px !important; min-width: 150px !important; padding: 8px !important; border: 1px solid #e1e6ee !important; border-radius: 12px !important; background: #fff !important; box-shadow: 0 10px 28px rgba(31,53,86,.16) !important; }
body.auth-mode .auth-language-menu[hidden] { display: none !important; }
body.auth-mode .auth-language-menu button { display: block !important; width: 100% !important; border: 0 !important; border-radius: 8px !important; padding: 10px 12px !important; text-align: left !important; background: transparent !important; color: #182238 !important; font: inherit !important; cursor: pointer !important; }
body.auth-mode .auth-language-menu button:hover, body.auth-mode .auth-language-menu button[aria-selected="true"] { background: #f1f4f9 !important; }

/* typography-system=20260912-r1
 * Keep the dense workbench on one readable sans family and a small, explicit
 * role scale.  Several late override sheets had introduced 10/11/17/19px
 * variants for the same labels, which made cards and dialogs visibly jump.
 */
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) {
  font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.topbar h1, #page > .page-head h1, #page > .panel > .panel-head h2, .dialog-head h2) {
  font-size: 20px !important;
  line-height: 1.3 !important;
  font-weight: 750 !important;
  letter-spacing: -.01em !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.panel h3, .section-title, .product-card-panel h3, .dialog-inner h3) {
  font-size: 16px !important;
  line-height: 1.4 !important;
  font-weight: 700 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.panel p, .subtle, .field-help, .role-banner span, .empty-state, .form label, .form input, .form select, .form textarea) {
  font-size: 14px !important;
  line-height: 1.5 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.eyebrow, .panel-head > span, .status-tag, .table-note, .metadata, .product-card-panel small) {
  font-size: 12px !important;
  line-height: 1.4 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(button, .button, .primary, .secondary, .action-link) {
  font-family: inherit !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  font-weight: 650 !important;
}
body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(table, th, td) {
  font-size: 13px !important;
  line-height: 1.45 !important;
}

/* catalog-settings-form=20260912: keep brand/compliance fields aligned and usable */
body.workspace-mode .catalog-brand-settings .catalog-brand-editor-row { padding: 20px 24px !important; border-top: 1px solid #e4e8f0 !important; }
body.workspace-mode .catalog-brand-settings .catalog-brand-editor-row .form-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px 24px !important; align-items: start !important; }
body.workspace-mode .catalog-brand-settings .catalog-brand-editor-row label { display: flex !important; flex-direction: column !important; gap: 6px !important; min-width: 0 !important; color: #30415b !important; }
body.workspace-mode .catalog-brand-settings .catalog-brand-editor-row label.full-field { grid-column: 1 / -1 !important; }
body.workspace-mode .catalog-brand-settings .catalog-brand-editor-row :is(input,select,textarea) { width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .lingmao-record-card .record-card-image > :is(img,.product-thumbnail-frame) { object-fit: contain !important; object-position: center center !important; background: #f5f5fa !important; }
@media (max-width: 760px) { body.workspace-mode .catalog-brand-settings .catalog-brand-editor-row .form-grid { grid-template-columns: minmax(0, 1fr) !important; } body.workspace-mode .catalog-brand-settings .catalog-brand-editor-row label.full-field { grid-column: auto !important; } }

/* garment-image-display: keep the complete source photo visible in cards and workbenches */
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(
  .product-workbench-table .product-image,
  .product-card-panel .product-image,
  .operation-order-row .operation-order-image,
  .product-detail-shell .detail-image-frame > .detail-image
) {
  object-fit: contain !important;
  object-position: center center !important;
  background: #f3f4fa !important;
}
/* catalog-card-summary=20260914: keep the compact status facts readable beside the artwork. */
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-summary { display:flex !important; flex-wrap:wrap !important; align-items:center !important; gap:4px 8px !important; min-width:0 !important; line-height:1.35 !important; }
html body.workspace-mode:has(.app-shell[data-ui-shell="r26"]:not(.auth-mode)) .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page .record-card-summary > * { min-width:0 !important; max-width:100% !important; overflow-wrap:anywhere !important; }

/* outfit-schedule=20260914: date, outfit and price are the working hierarchy. */
body.workspace-mode .app-shell:not(.auth-mode) .schedule-board {
  display: block !important;
}
body.workspace-mode .app-shell:not(.auth-mode) .schedule-card {
  margin-block: 0 20px !important;
  padding: 18px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line, #dde3eb) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.workspace-mode .app-shell:not(.auth-mode) .schedule-card-head h3 {
  margin: 0 !important;
  line-height: 1.5 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .app-shell:not(.auth-mode) .schedule-product-grid,
body.workspace-mode .product-schedule-outfits .schedule-product-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)) !important;
  align-items: start !important;
  gap: 16px !important;
}
body.workspace-mode .app-shell:not(.auth-mode) .schedule-product {
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-width: 0 !important;
}
body.workspace-mode .schedule-price,
body.workspace-mode .schedule-price-total {
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums !important;
}
body.workspace-mode .schedule-dialog .schedule-selected-products {
  display: grid !important;
  gap: 0 !important;
  padding: 0 !important;
}
body.workspace-mode .schedule-priced-item {
  display: grid !important;
  grid-template-columns: 56px minmax(0, 1fr) minmax(100px, 150px) auto !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--line, #dde3eb) !important;
}
body.workspace-mode .schedule-priced-item img { width: 56px !important; height: 72px !important; object-fit: cover !important; border-radius: 4px !important; }
body.workspace-mode .schedule-priced-item > div { display: grid !important; gap: 4px !important; min-width: 0 !important; overflow-wrap: anywhere !important; }
body.workspace-mode .schedule-priced-item label { min-width: 0 !important; }
body.workspace-mode .schedule-priced-item input { width: 100% !important; min-width: 0 !important; }
body.workspace-mode .schedule-choose-styles { padding-block: 12px !important; }
body.workspace-mode .schedule-choose-styles summary { cursor: pointer !important; font-weight: 600 !important; padding-block: 8px !important; }
body.workspace-mode .schedule-choose-styles > label { display: grid !important; gap: 6px !important; margin-block: 12px !important; }
body.workspace-mode .schedule-choose-styles .schedule-picker-list { max-height: 320px !important; overflow: auto !important; }
body.workspace-mode .schedule-choose-styles [hidden] { display: none !important; }
body.workspace-mode .product-schedule-outfits { margin-block: 20px !important; min-width: 0 !important; }
body.workspace-mode .product-schedule-outfit { padding-block: 16px !important; border-bottom: 1px solid var(--line, #dde3eb) !important; }
body.workspace-mode .product-schedule-outfit > header { display: flex !important; justify-content: space-between !important; gap: 12px !important; flex-wrap: wrap !important; margin-bottom: 12px !important; }
body.workspace-mode .product-schedule-outfits .schedule-product-head { display: flex !important; gap: 12px !important; }
body.workspace-mode .product-schedule-outfits .schedule-product-image { width: 72px !important; height: 96px !important; object-fit: cover !important; }
body.workspace-mode .product-schedule-outfits .schedule-product-copy { display: grid !important; gap: 4px !important; min-width: 0 !important; overflow-wrap: anywhere !important; }
body.workspace-mode input:is([type="date"], [type="month"], [type="datetime-local"]) {
  min-width: 0 !important;
  max-width: 100% !important;
  font-variant-numeric: tabular-nums !important;
  color-scheme: light !important;
}
body.workspace-mode input:is([type="date"], [type="month"], [type="datetime-local"])::-webkit-calendar-picker-indicator {
  cursor: pointer !important;
  opacity: 1 !important;
  width: 24px !important;
  height: 24px !important;
}

@media (max-width: 600px) {body.workspace-mode .schedule-priced-item { grid-template-columns: 48px minmax(0, 1fr) auto !important; gap: 10px !important; }
body.workspace-mode .schedule-priced-item img { width: 48px !important; height: 64px !important; }
body.workspace-mode .schedule-priced-item label { grid-column: 2 !important; grid-row: 2 !important; }
body.workspace-mode .schedule-priced-item > button { grid-column: 3 !important; grid-row: 1 / 3 !important; min-height: 44px !important; }
body.workspace-mode .schedule-toolbar { flex-wrap: wrap !important; }
body.workspace-mode .schedule-card-head { flex-wrap: wrap !important; gap: 12px !important; }

}

/* Outfit plans: date belongs to the plan; each card is one explicit combination. */
body.workspace-mode .outfit-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)) !important;
  gap: 20px !important;
  align-items: stretch !important;
  min-width: 0 !important;
}
body.workspace-mode .outfit-card {
  min-width: 0 !important;
  padding: 16px !important;
  border: 1px solid var(--line, #dde3eb) !important;
  border-radius: 12px !important;
  background: var(--surface, #fff) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode .outfit-combination { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; align-items: start !important; gap: 14px 12px !important; min-width: 0 !important; }
body.workspace-mode .outfit-garment { width: auto !important; min-width: 0 !important; display: grid !important; gap: 5px !important; }
body.workspace-mode .outfit-combination .outfit-join { display: none !important; }
body.workspace-mode .outfit-garment > img { width: 100% !important; height: auto !important; max-height: 170px !important; aspect-ratio: auto !important; object-fit: contain !important; object-position: center !important; background: transparent !important; border-radius: 6px !important; cursor: zoom-in !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .outfit-card .outfit-combination .outfit-garment > img { height: auto !important; min-height: 0 !important; max-height: 170px !important; aspect-ratio: auto !important; background: transparent !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .outfit-card .outfit-combination .outfit-garment > img { height: 150px !important; max-height: 150px !important; object-fit: cover !important; object-position: center !important; background: transparent !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .outfit-card .outfit-combination .outfit-garment > :is(strong, span, small) { min-height: 1.5em !important; line-height: 1.5 !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .outfit-card .outfit-combination .outfit-garment { overflow: hidden !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .outfit-card .outfit-combination .outfit-development-status { width: max-content !important; max-width: 100% !important; box-sizing: border-box !important; white-space: normal !important; overflow-wrap: anywhere !important; min-height: 30px !important; align-items: center !important; line-height: 1.25 !important; padding: 4px 7px !important; font-size: 11px !important; }
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .outfit-card .outfit-combination .outfit-development-status b { white-space: nowrap !important; font-size: 10px !important; }
@media (max-width: 600px) { body.workspace-mode .outfit-combination { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
body.workspace-mode .outfit-garment > :is(strong,span,small) { line-height: 1.5 !important; overflow-wrap: anywhere !important; }
body.workspace-mode .outfit-garment .outfit-development-status { display:inline-flex !important; align-items:center !important; gap:5px !important; width:max-content !important; max-width:100% !important; padding:2px 7px !important; border:1px solid currentColor !important; border-radius:999px !important; font-size:12px !important; font-weight:600 !important; }
body.workspace-mode .outfit-garment .outfit-development-status b { font-size:11px !important; font-weight:500 !important; }
body.workspace-mode .outfit-garment .outfit-development-status.is-ready { color:#23734d !important; background:#edf8f1 !important; }
body.workspace-mode .outfit-garment .outfit-development-status.is-active { color:#245c9d !important; background:#eef5ff !important; }
body.workspace-mode .outfit-garment .outfit-development-status.is-pending { color:#8a641d !important; background:#fff7e5 !important; }
body.workspace-mode .outfit-garment .outfit-development-status.is-danger { color:#a23a35 !important; background:#fff0ef !important; }
body.workspace-mode .outfit-join { width: 24px !important; text-align: center !important; font-size: 24px !important; padding-top: 48px !important; color: var(--muted, #56657b) !important; }
body.workspace-mode .outfit-equation { margin: 0 !important; font-weight: 650 !important; line-height: 1.6 !important; }
body.workspace-mode .outfit-totals { display: grid !important; gap: 6px !important; margin-top: auto !important; font-variant-numeric: tabular-nums !important; }
body.workspace-mode .outfit-actions { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; justify-content: space-between !important; align-items: center !important; padding-top: 12px !important; border-top: 1px solid var(--line, #dde3eb) !important; }
body.workspace-mode .outfit-add { min-height: 170px !important; border: 1px dashed #9aacc5 !important; border-radius: 12px !important; background: #f8faff !important; color: #314d72 !important; display: flex !important; flex-direction: column !important; gap: 8px !important; justify-content: center !important; align-items: center !important; cursor: pointer !important; }
body.workspace-mode .outfit-add > span { font-size: 36px !important; line-height: 1.3 !important; }
body.workspace-mode .outfit-add:hover { background: #edf3ff !important; border-color: #356adc !important; }
body.workspace-mode .outfit-add:focus-visible { outline: 3px solid #356adc !important; outline-offset: 3px !important; }
body.workspace-mode .schedule-dialog [hidden] { display: none !important; }
@media (max-width: 1100px) { body.workspace-mode .outfit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 600px) { body.workspace-mode .outfit-grid { grid-template-columns: minmax(0, 1fr) !important; } }

/* Workspace edge rhythm: every authenticated surface keeps a readable inset.
 * Components may own their internal density, but page-level content must never
 * touch the shell edge; this normalizes Mac/Windows font and viewport variance. */
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
  padding-inline: clamp(24px, 4vw, 56px) !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > :is(.toolbar, .panel, .schedule-hero, .schedule-board) {
  min-width: 0 !important;
}
@media (max-width: 600px) {
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page {
    padding-inline: 16px !important;
  }
}

/* page-edge-rhythm=20260915-r1: shared inset and flexible header tracks keep
 * long labels/actions inside the canvas on every card-based page. */
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel > :is(.panel, .toolbar, .schedule-hero, .schedule-board) {
  box-sizing: border-box !important;
  padding-inline: clamp(18px, 2.2vw, 32px) !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel > .schedule-board {
  padding-block: 18px !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .schedule-card-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  column-gap: 20px !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .schedule-card-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 8px 14px !important;
  max-width: 100% !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) :is(.panel, .toolbar) .form-grid > * {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}
@media (max-width: 760px) {
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page > .view-panel > :is(.panel, .toolbar, .schedule-hero, .schedule-board) {
    padding-inline: 14px !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .schedule-card-head {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .schedule-card-actions {
    justify-content: flex-start !important;
  }
}

/* schedule handoff rows */
/* image-completeness=20260915-r1: uploaded product artwork is evidence and
 * must remain fully visible. Shared display surfaces use contain; the neutral
 * background preserves a stable card without silently cropping the source. */
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page :is(
  .product-image, .record-card-image img, .schedule-product-image,
  .outfit-garment > img, .outfit-generated-preview, .sample-card-media img,
  .sample-editor-preview, .product-gallery-draft img, .order-document-table img,
  .material-image-preview, .contract-style-thumb
) {
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
}
html body.workspace-mode dialog :is(.model-image-source-preview, .model-image-inline-source img, .product-gallery-draft img, .material-image-preview) {
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
}
/* outfit-thumbnail-final=20260915-r2: this must follow the shared contain rule;
 * card thumbnails fill their fixed frame, while the gallery keeps originals. */
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) .outfit-card .outfit-combination .outfit-garment > img {
  width: 100% !important;
  height: 150px !important;
  max-height: 150px !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center !important;
  background: transparent !important;
}
html body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-unpaired-list{display:grid!important;gap:6px!important;margin:10px 0 4px!important}
html body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-unpaired-row{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;padding:8px 10px!important;border:1px solid #e1e6ee!important;border-radius:6px!important;background:#fff!important}
html body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-unpaired-style{display:grid!important;grid-template-columns:32px auto minmax(0,1fr)!important;align-items:center!important;gap:8px!important;min-width:0!important}
html body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-unpaired-style img{width:32px!important;height:40px!important;object-fit:cover!important;border-radius:3px!important;border:1px solid var(--line)!important}
html body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-unpaired-style strong{color:#263247!important;font-size:12px!important}
html body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-unpaired-style span{color:var(--muted)!important;font-size:11px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
@media(max-width:600px){html body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-unpaired-row{align-items:flex-start!important;flex-direction:column!important}html body.workspace-mode .app-shell[data-ui-shell="r26"] .schedule-unpaired-row button{align-self:flex-end!important}}
html body.workspace-mode .app-shell[data-ui-shell="r26"] .outfit-remove-items{display:flex!important;flex-wrap:wrap!important;gap:6px!important}
html body.workspace-mode .app-shell[data-ui-shell="r26"] .outfit-remove-items .action-link{font-size:11px!important}

body.workspace-mode .schedule-month-pagination { display:flex !important; align-items:center !important; flex-wrap:wrap !important; justify-content:center !important; gap:12px !important; padding:20px 0 !important; }
body.workspace-mode .schedule-month-pagination label { display:flex !important; align-items:center !important; gap:8px !important; }
body.workspace-mode .schedule-month-pagination input { width:150px !important; min-width:0 !important; }
body.workspace-mode .schedule-toolbar .icon-button { width:auto !important; padding-inline:10px !important; }
body.workspace-mode .outfit-garment .outfit-development-status { flex-wrap:wrap !important; }
body.workspace-mode .outfit-garment .outfit-development-status.is-fitting { color:#167879 !important; background:#f2faf9 !important; }
body.workspace-mode .outfit-garment .outfit-development-status.is-sample { color:#7152a3 !important; background:#faf6fe !important; }
body.workspace-mode .outfit-garment .outfit-development-status.is-exempt { color:#82562e !important; background:#fbf7f2 !important; }
body.workspace-mode .outfit-generated-preview { width:100% !important; max-height:180px !important; object-fit:cover !important; border-radius:8px !important; cursor:zoom-in !important; }
@media(max-width:600px){body.workspace-mode .schedule-month-pagination{gap:8px!important}body.workspace-mode .schedule-month-pagination input{width:135px!important}}
/* outfit-thumbnail-wrapper=20260915-r3: isolate card thumbnails from global
 * image rules; the wrapper owns dimensions and the image fills it. */
html body.workspace-mode .outfit-card .outfit-thumb { width:100% !important; height:150px !important; min-height:150px !important; overflow:hidden !important; background:#fff !important; border-radius:6px !important; }
html body.workspace-mode .outfit-card .outfit-thumb > img { display:block !important; width:100% !important; height:100% !important; min-height:0 !important; max-height:none !important; object-fit:cover !important; object-position:center !important; background:transparent !important; }

/* account-list-surface=20260918-r1: keep the three visible layers around
 * the account ledger on one white surface instead of exposing the page canvas
 * through the panel corners and table boundary. */
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel:has(> .table-wrap > table.account-table),
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel:has(> .table-wrap > table.account-table) > .panel-head,
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel:has(> .table-wrap > table.account-table) > .table-wrap,
html body.workspace-mode .app-shell[data-ui-shell="r26"]:not(.auth-mode) #page
  .panel:has(> .table-wrap > table.account-table) > .table-wrap > table.account-table {
  background: #fff !important;
}

/* shared-size-chart=20260918-r1: the technical size chart is deliberately
 * wider than a phone. Its scroll ownership stays on this wrapper so the
 * workbench itself never grows wider than the viewport. */
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  :is(.pattern-sheet-section, .pattern-sheet-dialog, .size-chart-block, .size-chart-editor) {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  :is(.size-chart-block, .size-chart-editor) {
  margin-top: 14px !important;
  padding: 14px !important;
  border: 1px solid #dfe6ee !important;
  border-radius: 6px !important;
  background: #fff !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
  margin-bottom: 10px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-head > div {
  min-width: 0 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-head h4 {
  margin: 0 !important;
  color: #263747 !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-head p {
  max-width: 720px !important;
  margin: 4px 0 0 !important;
  color: #6c7d91 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-state,
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .measurement-status {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  min-height: 26px !important;
  padding: 0 9px !important;
  border: 1px solid #e9c979 !important;
  border-radius: 999px !important;
  color: #7a5b16 !important;
  background: #fff7df !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  :is(.size-chart-state.is-maintained, .measurement-status.is-maintained) {
  border-color: #91d4b6 !important;
  color: #176b52 !important;
  background: #e7f7ef !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-scroll {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-x: contain !important;
  scrollbar-gutter: stable !important;
  -webkit-overflow-scrolling: touch !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table {
  width: max-content !important;
  min-width: 1040px !important;
  max-width: none !important;
  margin: 0 !important;
  table-layout: fixed !important;
  border-collapse: collapse !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table th,
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table td {
  min-width: 82px !important;
  padding: 8px 9px !important;
  border: 1px solid #d8e2ec !important;
  color: #263747 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
  text-align: left !important;
  vertical-align: top !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table th {
  background: #f5f8fb !important;
  color: #43566b !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table :is(th:first-child, td:first-child) {
  width: 142px !important;
  min-width: 142px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table :is(th:nth-last-child(3), td:nth-last-child(3)) {
  min-width: 130px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table :is(th:nth-last-child(2), td:nth-last-child(2)) {
  min-width: 150px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table :is(th:last-child, td:last-child) {
  min-width: 150px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table-editor input {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 32px !important;
  padding: 6px 7px !important;
  border: 1px solid #cbd8e5 !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #263747 !important;
  box-sizing: border-box !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table-editor input:focus {
  border-color: #5f92cc !important;
  outline: 2px solid rgba(95, 146, 204, .18) !important;
  outline-offset: 0 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-table-editor td:last-child {
  min-width: 74px !important;
  width: 74px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-editor > [data-size-chart-add] {
  margin-top: 10px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .size-chart-readonly-editor {
  margin-top: 0 !important;
  border-style: dashed !important;
  background: #fbfcfd !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .measurement-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

/* order-followup-workbench=20260922: make the follow-up queue scannable
   without changing the order state machine or action permissions. */
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .order-followup-subtitle {
  margin: 5px 0 0 !important;
  color: #6b7789 !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .order-followup-summary {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 0 18px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .order-followup-summary button {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
  min-height: 72px !important;
  padding: 12px 14px !important;
  border: 1px solid #e1e6ef !important;
  border-radius: 8px !important;
  background: #fbfcfe !important;
  color: #435169 !important;
  text-align: left !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .order-followup-summary button.is-selected {
  border-color: #7586cc !important;
  background: #f1f3ff !important;
  color: #3443a2 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .order-followup-summary strong {
  font-size: 22px !important;
  line-height: 1.1 !important;
  color: inherit !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .order-followup-summary span {
  color: #6c7788 !important;
  font-size: 12px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  table.order-document-table td:first-child .status-tag {
  white-space: nowrap !important;
}
@media (max-width: 760px) {
  body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
    .order-followup-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  .measurement-heading .section-title {
  margin-bottom: 8px !important;
}
@media (max-width: 560px) {
  body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
    .size-chart-head {
    display: block !important;
  }
  body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
    .size-chart-head :is(.size-chart-state, .measurement-status) {
    margin-top: 8px !important;
  }
}

/* production-followup-workbench=20260922-r1
 * Keep production follow-up facts inside the workflow-status cell. The row
 * remains horizontally scrollable, while the owner can scan factory, due date,
 * current phase and the next handoff without opening the detail dialog. */
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  table.product-workbench-table .production-followup-summary {
  display: grid !important;
  gap: 5px !important;
  min-width: 236px !important;
  max-width: 300px !important;
  margin-top: 7px !important;
  padding-top: 7px !important;
  border-top: 1px solid #e5eaf0 !important;
  color: #526275 !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  table.product-workbench-table .production-followup-facts {
  display: grid !important;
  gap: 3px !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  table.product-workbench-table .production-followup-facts span {
  display: flex !important;
  align-items: baseline !important;
  gap: 5px !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  table.product-workbench-table .production-followup-facts b {
  flex: 0 0 54px !important;
  color: #8491a0 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  table.product-workbench-table .production-followup-facts em {
  color: #43566a !important;
  font-style: normal !important;
  font-variant-numeric: tabular-nums !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  table.product-workbench-table :is(.production-followup-facts em.is-overdue, .production-followup-overdue) {
  color: #b44b3c !important;
  font-weight: 700 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  table.product-workbench-table .production-followup-context {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 3px 8px !important;
  color: #768495 !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  table.product-workbench-table .production-handoff-button {
  min-height: 30px !important;
  padding: 5px 9px !important;
  border-color: #c8d6e5 !important;
  background: #f7fbff !important;
  color: #276487 !important;
  white-space: nowrap !important;
}
body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
  table.product-workbench-table .production-handoff-button:hover {
  border-color: #82abc9 !important;
  background: #edf7ff !important;
}
@media (max-width: 760px) {
  body.workspace-mode :is(.app-shell[data-ui-shell="r26"]:not(.auth-mode) #page, dialog)
    table.product-workbench-table .production-followup-summary {
    min-width: 212px !important;
    max-width: 260px !important;
  }
}
html body.workspace-mode #createDialog:has(.quality-finished-dialog) {
  width: min(960px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
}
html body.workspace-mode .quality-source-facts {
  display: grid !important; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
  gap: 12px !important; padding: 16px 0 !important; border-block: 1px solid #e0e5e9 !important; margin: 12px 0 !important;
}
html body.workspace-mode .quality-source-facts div { min-width: 0 !important; display: grid !important; gap: 4px !important; }
html body.workspace-mode .quality-source-facts span { font-size: 12px !important; color: #667278 !important; }
html body.workspace-mode .quality-source-facts strong { font-size: 13px !important; overflow-wrap: anywhere !important; }
html body.workspace-mode .quality-inspection-mode { display: flex !important; gap: 24px !important; border: 0 !important; padding: 12px 0 !important; }
html body.workspace-mode .quality-inspection-mode label { display: flex !important; align-items: center !important; gap: 8px !important; }
html body.workspace-mode .quality-inspection-mode input { width: 16px !important; min-height: 16px !important; }
html body.workspace-mode .quality-finished-dialog .form-grid > label { min-width: 0 !important; }
html body.workspace-mode .quality-finished-dialog :is(input, select, textarea) { max-width: 100% !important; min-width: 0 !important; }
html body.workspace-mode .quality-finished-dialog output { display: block !important; padding: 9px 0 !important; font-variant-numeric: tabular-nums !important; }
html body.workspace-mode [data-finished-feedback] { color: #ac3636 !important; overflow-wrap: anywhere !important; }
@media (max-width: 600px) {
  html body.workspace-mode .quality-finished-dialog .form-grid { grid-template-columns: 1fr !important; }
  html body.workspace-mode .quality-finished-dialog .form-footer { flex-wrap: wrap !important; }
}
html body.workspace-mode .material-catalog-center .section-actions { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; }
html body.workspace-mode .material-master-table { min-width: 1050px !important; }
html body.workspace-mode .material-master-dialog { width: min(820px, calc(100vw - 40px)) !important; }
html body.workspace-mode .material-master-dialog fieldset { border: 0 !important; padding: 0 !important; min-width: 0 !important; }
html body.workspace-mode .material-master-dialog .material-enabled { display: flex !important; align-items: center !important; gap: 8px !important; }
html body.workspace-mode .material-enabled input { width: 18px !important; min-height: 18px !important; }
html body.workspace-mode .material-bom-fields { min-width: 180px !important; }
html body.workspace-mode .material-bom-fields label { display: grid !important; gap: 4px !important; margin: 8px 0 !important; font-size: 12px !important; }
html body.workspace-mode [data-material-error] { color: #b73535 !important; }
@media (max-width: 600px) {
  html body.workspace-mode .material-master-dialog .form-grid { grid-template-columns: 1fr !important; }
  html body.workspace-mode .material-catalog-center .section-heading { flex-wrap: wrap !important; gap: 12px !important; }
}

/* Frozen BOM downstream documents: order source, preview, and immutable history. */
#createDialog:has(> .bom-document-dialog) {
  width: min(1120px, calc(100vw - 28px)) !important;
  max-height: calc(100dvh - 28px) !important;
}
#createDialog > .bom-document-dialog {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}
#createDialog .bom-document-dialog > .form,
#createDialog .bom-document-dialog [data-bom-demand-preview],
#createDialog .bom-document-dialog [data-bom-price-preview],
#createDialog .bom-document-dialog .form-footer {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
#createDialog .bom-document-source {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 0 0 14px !important;
  border-bottom: 1px solid var(--line) !important;
}
#createDialog .bom-document-source label {
  display: grid !important;
  min-width: min(440px, 100%) !important;
  gap: 6px !important;
  color: var(--muted) !important;
  font-size: 12px !important;
}
#createDialog .bom-document-source select {
  width: 100% !important;
}
#createDialog .bom-document-source > span {
  color: var(--muted) !important;
  font-size: 12px !important;
  text-align: right !important;
}
#createDialog .bom-document-summary {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  margin: 14px 0 !important;
  border: 1px solid var(--line) !important;
  border-radius: 6px !important;
  background: #f8fafc !important;
}
#createDialog .bom-document-summary > span {
  display: grid !important;
  min-width: 0 !important;
  gap: 4px !important;
  padding: 12px 14px !important;
  border-right: 1px solid var(--line) !important;
}
#createDialog .bom-document-summary > span:last-child {
  border-right: 0 !important;
}
#createDialog .bom-document-summary small {
  color: var(--muted) !important;
  font-size: 11px !important;
}
#createDialog .bom-document-summary strong {
  overflow-wrap: anywhere !important;
  color: var(--ink) !important;
  font-size: 14px !important;
}
#createDialog .bom-document-preview-table {
  max-height: 430px !important;
  overflow: auto !important;
  border: 1px solid var(--line) !important;
  border-radius: 6px !important;
}
#createDialog .bom-document-preview-table table {
  min-width: 760px !important;
}
#createDialog .bom-price-total {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 16px !important;
  padding: 12px 2px 2px !important;
}
#createDialog .bom-price-total span {
  color: var(--muted) !important;
}
#createDialog .bom-price-total strong {
  color: var(--ink) !important;
  font-size: 18px !important;
}
#createDialog .bom-price-history {
  margin-top: 14px !important;
}
#createDialog .bom-price-history summary {
  cursor: pointer !important;
  color: var(--ink) !important;
  font-weight: 700 !important;
}
#createDialog .bom-price-history-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 10px !important;
}
#createDialog .bom-price-history-list button {
  display: grid !important;
  justify-items: start !important;
  min-width: 0 !important;
  height: auto !important;
  text-align: left !important;
}
#createDialog .bom-price-history-list button span,
#createDialog .bom-price-history-list button small {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}
@media (max-width: 760px) {
  #createDialog:has(> .bom-document-dialog) {
    width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
  }
  #createDialog .bom-document-source {
    align-items: stretch !important;
    flex-direction: column !important;
  }
  #createDialog .bom-document-source label {
    min-width: 0 !important;
  }
  #createDialog .bom-document-source > span {
    text-align: left !important;
  }
  #createDialog .bom-document-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #createDialog .bom-document-summary > span:nth-child(2) {
    border-right: 0 !important;
  }
  #createDialog .bom-document-summary > span:nth-child(-n+2) {
    border-bottom: 1px solid var(--line) !important;
  }
  #createDialog .bom-price-history-list {
    grid-template-columns: 1fr !important;
  }
  #createDialog .bom-document-dialog .form-footer {
    align-items: stretch !important;
    flex-direction: column !important;
  }
  #createDialog .bom-document-dialog .form-footer button {
    width: 100% !important;
  }
}

/* END frontend/assets/ui-current.css */
}