:root{ --ods-font-family:Arial,"Helvetica Neue",Helvetica,sans-serif; --ods-font-size-xs:11px; --ods-font-size-sm:12px; --ods-font-size-md:13px; --ods-font-size-lg:16px; --ods-font-size-xl:22px; --ods-line-height:1.42; --ods-color-workspace:#f2f4f5; --ods-color-sidebar:#303640; --ods-color-sidebar-deep:#282e37; --ods-color-surface:#fff; --ods-color-surface-soft:#f7f8f9; --ods-color-surface-hover:#fff8f4; --ods-color-text:#222831; --ods-color-text-soft:#56606a; --ods-color-muted:#69727d; --ods-color-border:#d9dee3; --ods-color-border-strong:#c7cdd3; --ods-color-accent:#ff5b22; --ods-color-accent-hover:#e84b15; --ods-color-success:#477052; --ods-color-warning:#8c661f; --ods-color-danger:#a94349; --ods-color-info:#466b8d; --ods-space-1:4px; --ods-space-2:8px; --ods-space-3:12px; --ods-space-4:16px; --ods-space-5:24px; --ods-space-6:32px; --ods-control-height:34px; --ods-row-height:42px; --ods-radius-sm:3px; --ods-radius-md:5px; --ods-radius-lg:8px; --ods-content-max:1760px; --ods-inspector-width:360px; --ods-shadow-surface:0 1px 2px rgba(34,40,49,.04); --odr-bg:var(--ods-color-workspace); --odr-surface:var(--ods-color-surface); --odr-soft:var(--ods-color-surface-soft); --odr-sidebar:var(--ods-color-sidebar); --odr-text:var(--ods-color-text); --odr-soft-text:var(--ods-color-text-soft); --odr-muted:var(--ods-color-muted); --odr-line:var(--ods-color-border); --odr-strong:var(--ods-color-border-strong); --odr-accent:var(--ods-color-accent); --odr-accent-hover:var(--ods-color-accent-hover); --odr-success:var(--ods-color-success); --odr-warning:var(--ods-color-warning); --odr-danger:var(--ods-color-danger); --odr-info:var(--ods-color-info); --odr-control-height:var(--ods-control-height); --odr-row-height:var(--ods-row-height); --odr-radius:var(--ods-radius-md); --odr-font:var(--ods-font-family) } body.omnidata-design-system-v1, body.omnidata-role-system{ margin:0!important; background:var(--ods-color-workspace)!important; color:var(--ods-color-text)!important; font:var(--ods-font-size-md)/var(--ods-line-height) var(--ods-font-family)!important; -webkit-font-smoothing:antialiased!important; text-rendering:optimizeLegibility!important } body.omnidata-design-system-v1 *, body.omnidata-design-system-v1 *::before, body.omnidata-design-system-v1 *::after, body.omnidata-role-system *, body.omnidata-role-system *::before, body.omnidata-role-system *::after{box-sizing:border-box!important} body.omnidata-design-system-v1 .main, body.omnidata-design-system-v1 .workspace, body.omnidata-design-system-v1 .workspace-content, body.omnidata-role-system .main, body.omnidata-role-system .workspace, body.omnidata-role-system .workspace-content{min-width:0!important;background:var(--ods-color-workspace)!important} body.omnidata-design-system-v1 .workspace-content, body.omnidata-role-system .workspace-content{width:100%!important;max-width:var(--ods-content-max)!important;margin:0 auto!important;padding:0 var(--ods-space-5) var(--ods-space-6)!important} body.omnidata-design-system-v1 .workspace-content>*, body.omnidata-role-system .workspace-content>*{min-width:0!important} body.omnidata-design-system-v1 h1, body.omnidata-role-system h1{margin:0!important;color:var(--ods-color-text)!important;font-size:var(--ods-font-size-xl)!important;font-weight:600!important;line-height:1.18!important;letter-spacing:-.015em!important} body.omnidata-design-system-v1 h2, body.omnidata-role-system h2{margin:0!important;color:var(--ods-color-text)!important;font-size:var(--ods-font-size-lg)!important;font-weight:600!important;line-height:1.25!important} body.omnidata-design-system-v1 h3, body.omnidata-role-system h3{margin:0!important;color:var(--ods-color-text)!important;font-size:var(--ods-font-size-md)!important;font-weight:700!important;line-height:1.3!important} body.omnidata-design-system-v1 h4, body.omnidata-role-system h4{margin:0!important;color:var(--ods-color-text-soft)!important;font-size:var(--ods-font-size-sm)!important;font-weight:700!important;line-height:1.3!important} body.omnidata-design-system-v1 p, body.omnidata-role-system p{margin:0!important;color:var(--ods-color-text-soft)!important} body.omnidata-design-system-v1 small, body.omnidata-role-system small{color:var(--ods-color-muted)!important;font-size:var(--ods-font-size-xs)!important} body.omnidata-design-system-v1 .muted, body.omnidata-role-system .muted{color:var(--ods-color-muted)!important} body.omnidata-design-system-v1 .sidebar, body.omnidata-role-system .sidebar{background:var(--ods-color-sidebar)!important;border:0!important;color:#e7e9ec!important;box-shadow:none!important} body.omnidata-design-system-v1 .brand, body.omnidata-role-system .brand{min-height:56px!important;padding:var(--ods-space-3) var(--ods-space-4)!important;border-bottom:1px solid rgba(255,255,255,.08)!important;background:var(--ods-color-sidebar-deep)!important} body.omnidata-design-system-v1 .brand-copy h1, body.omnidata-role-system .brand-copy h1{color:#fff!important;font-size:14px!important;letter-spacing:.07em!important} body.omnidata-design-system-v1 .nav-group-label, body.omnidata-role-system .nav-group-label{padding:var(--ods-space-4) 18px var(--ods-space-1)!important;color:#a2a8b1!important;font-size:11px!important;font-weight:700!important;letter-spacing:.08em!important;text-transform:uppercase!important} body.omnidata-design-system-v1 .topbar, body.omnidata-role-system .topbar{min-height:50px!important;padding:0 var(--ods-space-5)!important;border-bottom:1px solid var(--ods-color-border)!important;background:var(--ods-color-surface)!important;box-shadow:none!important} body.omnidata-design-system-v1 .topbar-organisation, body.omnidata-design-system-v1 .topbar-user, body.omnidata-role-system .topbar-organisation, body.omnidata-role-system .topbar-user{color:var(--ods-color-text-soft)!important;font-size:var(--ods-font-size-sm)!important} body.omnidata-design-system-v1 .od14-page-header, body.omnidata-role-system .od14-page-header, body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="page-header"],[data-od14-unified-part="page-header"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="page-header"],[data-od14-unified-part="page-header"]){display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:end!important;gap:var(--ods-space-4)!important;margin:0!important;padding:var(--ods-space-5) 0 var(--ods-space-4)!important;border:0!important;border-bottom:1px solid var(--ods-color-border)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important} body.omnidata-design-system-v1 .od14-page-section, body.omnidata-design-system-v1 .toolbar-kicker, body.omnidata-design-system-v1 .eyebrow, body.omnidata-role-system .od14-page-section, body.omnidata-role-system .toolbar-kicker, body.omnidata-role-system .eyebrow{color:var(--ods-color-muted)!important;font-size:11px!important;font-weight:700!important;letter-spacing:.08em!important;text-transform:uppercase!important} body.omnidata-design-system-v1 .od14-page-title, body.omnidata-role-system .od14-page-title{color:var(--ods-color-accent)!important} body.omnidata-design-system-v1 .od14-page-description, body.omnidata-role-system .od14-page-description{max-width:860px!important;color:var(--ods-color-text-soft)!important;font-size:var(--ods-font-size-sm)!important} body.omnidata-design-system-v1 .od14-page-actions, body.omnidata-role-system .od14-page-actions{display:flex!important;justify-content:flex-end!important;flex-wrap:wrap!important;gap:var(--ods-space-2)!important} body.omnidata-design-system-v1 .od14-source-toolbar, body.omnidata-role-system .od14-source-toolbar{display:none!important} body.omnidata-design-system-v1 :is([data-ods-role],[data-od14-unified-role]), body.omnidata-role-system :is([data-ods-role],[data-od14-unified-role]){font-family:var(--ods-font-family)!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]){min-width:0!important;color:var(--ods-color-text)!important;box-shadow:none!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="card"],[data-ods-part="surface"],[data-ods-part="form"],[data-ods-part="list-item"],[data-ods-part="definition-item"],[data-ods-part="metric"],[data-ods-part="empty"],[data-od14-unified-part="card"],[data-od14-unified-part="surface"],[data-od14-unified-part="form"],[data-od14-unified-part="list-item"],[data-od14-unified-part="definition-item"],[data-od14-unified-part="metric"],[data-od14-unified-part="empty"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="card"],[data-ods-part="surface"],[data-ods-part="form"],[data-ods-part="list-item"],[data-ods-part="definition-item"],[data-ods-part="metric"],[data-ods-part="empty"],[data-od14-unified-part="card"],[data-od14-unified-part="surface"],[data-od14-unified-part="form"],[data-od14-unified-part="list-item"],[data-od14-unified-part="definition-item"],[data-od14-unified-part="metric"],[data-od14-unified-part="empty"]){border:1px solid var(--ods-color-border)!important;border-radius:var(--ods-radius-md)!important;background:var(--ods-color-surface)!important;box-shadow:var(--ods-shadow-surface)!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="card"],[data-ods-part="surface"],[data-ods-part="form"],[data-ods-part="list-item"],[data-ods-part="definition-item"],[data-ods-part="empty"],[data-od14-unified-part="card"],[data-od14-unified-part="surface"],[data-od14-unified-part="form"],[data-od14-unified-part="list-item"],[data-od14-unified-part="definition-item"],[data-od14-unified-part="empty"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="card"],[data-ods-part="surface"],[data-ods-part="form"],[data-ods-part="list-item"],[data-ods-part="definition-item"],[data-ods-part="empty"],[data-od14-unified-part="card"],[data-od14-unified-part="surface"],[data-od14-unified-part="form"],[data-od14-unified-part="list-item"],[data-od14-unified-part="definition-item"],[data-od14-unified-part="empty"]){padding:var(--ods-space-4)!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metrics"],[data-od14-unified-part="metrics"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metrics"],[data-od14-unified-part="metrics"]){display:grid!important;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;gap:var(--ods-space-2)!important;margin:var(--ods-space-3) 0!important;padding:0!important;border:0!important;background:transparent!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"]){display:grid!important;align-content:start!important;gap:var(--ods-space-1)!important;min-height:82px!important;padding:var(--ods-space-3)!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"]) strong, body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"]) strong{color:var(--ods-color-text)!important;font-size:20px!important;font-weight:600!important;font-variant-numeric:tabular-nums!important;line-height:1.1!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="layout"],[data-od14-unified-part="layout"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="layout"],[data-od14-unified-part="layout"]){display:grid!important;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))!important;gap:var(--ods-space-3)!important;padding:0!important;border:0!important;background:transparent!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="master-detail"],[data-od14-unified-part="master-detail"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="master-detail"],[data-od14-unified-part="master-detail"]){display:grid!important;grid-template-columns:minmax(0,1fr) minmax(320px,var(--ods-inspector-width))!important;gap:var(--ods-space-3)!important;align-items:start!important;padding:0!important;border:0!important;background:transparent!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="list"],[data-od14-unified-part="list"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="list"],[data-od14-unified-part="list"]){display:grid!important;gap:var(--ods-space-2)!important;padding:0!important;border:0!important;background:transparent!important;list-style:none!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="list-item"],[data-od14-unified-part="list-item"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="list-item"],[data-od14-unified-part="list-item"]){transition:border-color .14s ease,background-color .14s ease!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="list-item"],[data-od14-unified-part="list-item"]):hover, body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="list-item"],[data-od14-unified-part="list-item"]):hover{border-color:#efb59d!important;background:var(--ods-color-surface-hover)!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="definition-grid"],[data-od14-unified-part="definition-grid"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="definition-grid"],[data-od14-unified-part="definition-grid"]){display:grid!important;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))!important;gap:var(--ods-space-2)!important;padding:0!important;border:0!important;background:transparent!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="definition-item"],[data-od14-unified-part="definition-item"]) dt, body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="definition-item"],[data-od14-unified-part="definition-item"]) dt{margin:0 0 var(--ods-space-1)!important;color:var(--ods-color-muted)!important;font-size:11px!important;font-weight:700!important;letter-spacing:.05em!important;text-transform:uppercase!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="definition-item"],[data-od14-unified-part="definition-item"]) dd, body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="definition-item"],[data-od14-unified-part="definition-item"]) dd{margin:0!important;color:var(--ods-color-text)!important;font-size:var(--ods-font-size-sm)!important;font-weight:600!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="timeline"],[data-od14-unified-part="timeline"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="timeline"],[data-od14-unified-part="timeline"]){display:grid!important;gap:0!important;padding:0!important;border:0!important;background:transparent!important;list-style:none!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="timeline-item"],[data-od14-unified-part="timeline-item"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="timeline-item"],[data-od14-unified-part="timeline-item"]){position:relative!important;min-height:52px!important;padding:var(--ods-space-2) var(--ods-space-2) var(--ods-space-2) 28px!important;border:0!important;border-bottom:1px solid var(--ods-color-border)!important;background:transparent!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="timeline-item"],[data-od14-unified-part="timeline-item"])::before, body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="timeline-item"],[data-od14-unified-part="timeline-item"])::before{content:""!important;position:absolute!important;top:17px!important;left:9px!important;width:8px!important;height:8px!important;border:2px solid var(--ods-color-accent)!important;border-radius:50%!important;background:var(--ods-color-surface)!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="progress"],[data-od14-unified-part="progress"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="progress"],[data-od14-unified-part="progress"]){display:grid!important;gap:var(--ods-space-1)!important;padding:0!important;border:0!important;background:transparent!important} body.omnidata-design-system-v1 :is([data-ods-part="progress-track"],[data-od14-unified-part="progress-track"]), body.omnidata-role-system :is([data-ods-part="progress-track"],[data-od14-unified-part="progress-track"]){height:6px!important;overflow:hidden!important;border-radius:999px!important;background:#e9edf0!important} body.omnidata-design-system-v1 :is([data-ods-part="progress-fill"],[data-od14-unified-part="progress-fill"]), body.omnidata-role-system :is([data-ods-part="progress-fill"],[data-od14-unified-part="progress-fill"]){height:100%!important;border-radius:inherit!important;background:var(--ods-color-accent)!important} body.omnidata-design-system-v1 :is([data-ods-part="empty"],[data-od14-unified-part="empty"]), body.omnidata-role-system :is([data-ods-part="empty"],[data-od14-unified-part="empty"]){display:grid!important;min-height:120px!important;place-items:center!important;color:var(--ods-color-muted)!important;text-align:center!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]){min-width:0!important;color:var(--ods-color-text)!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]){display:grid!important;grid-template-columns:minmax(220px,1.4fr) repeat(3,minmax(140px,.7fr)) auto!important;align-items:end!important;gap:var(--ods-space-2)!important;width:100%!important;margin:var(--ods-space-3) 0!important;padding:var(--ods-space-2)!important;border:1px solid var(--ods-color-border)!important;border-radius:var(--ods-radius-md)!important;background:var(--ods-color-surface)!important;box-shadow:var(--ods-shadow-surface)!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="toolbar"],[data-ods-part="header-toolbar"],[data-ods-part="section-head"],[data-od14-unified-part="toolbar"],[data-od14-unified-part="header-toolbar"],[data-od14-unified-part="section-head"]):not(.topbar-actions), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="toolbar"],[data-ods-part="header-toolbar"],[data-ods-part="section-head"],[data-od14-unified-part="toolbar"],[data-od14-unified-part="header-toolbar"],[data-od14-unified-part="section-head"]):not(.topbar-actions){display:flex!important;min-height:var(--ods-control-height)!important;align-items:center!important;justify-content:flex-end!important;flex-wrap:wrap!important;gap:var(--ods-space-2)!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="section-head"],[data-od14-unified-part="section-head"]), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="section-head"],[data-od14-unified-part="section-head"]){justify-content:space-between!important;padding-bottom:var(--ods-space-2)!important;border-bottom:1px solid var(--ods-color-border)!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="tabs"],[data-od14-unified-part="tabs"]), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="tabs"],[data-od14-unified-part="tabs"]){display:flex!important;min-height:40px!important;align-items:stretch!important;gap:var(--ods-space-5)!important;margin:0!important;padding:0 var(--ods-space-2)!important;border:0!important;border-bottom:1px solid var(--ods-color-border)!important;background:transparent!important;overflow-x:auto!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="pagination"],[data-ods-part="breadcrumb"],[data-od14-unified-part="pagination"],[data-od14-unified-part="breadcrumb"]), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="pagination"],[data-ods-part="breadcrumb"],[data-od14-unified-part="pagination"],[data-od14-unified-part="breadcrumb"]){display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:var(--ods-space-2)!important;margin:var(--ods-space-2) 0!important;padding:0!important;border:0!important;background:transparent!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="pagination"],[data-od14-unified-part="pagination"]), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="pagination"],[data-od14-unified-part="pagination"]){justify-content:flex-end!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]), body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]){display:inline-flex!important;min-width:0!important;min-height:var(--ods-control-height)!important;align-items:center!important;justify-content:center!important;gap:6px!important;margin:0!important;padding:0 var(--ods-space-3)!important;border:1px solid var(--ods-color-border-strong)!important;border-radius:var(--ods-radius-sm)!important;background:var(--ods-color-surface)!important;color:var(--ods-color-text-soft)!important;font:600 var(--ods-font-size-sm)/1 var(--ods-font-family)!important;text-decoration:none!important;text-transform:none!important;white-space:nowrap!important;box-shadow:none!important;cursor:pointer!important;transition:border-color .14s ease,background-color .14s ease,color .14s ease!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):hover, body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):hover{border-color:#ee9a79!important;background:var(--ods-color-surface-hover)!important;color:var(--ods-color-accent)!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):focus-visible, body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):focus-visible{outline:2px solid rgba(255,91,34,.22)!important;outline-offset:1px!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-variant="primary"],[data-od14-unified-variant="primary"]), body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-variant="primary"],[data-od14-unified-variant="primary"]){border-color:var(--ods-color-accent)!important;background:var(--ods-color-accent)!important;color:#fff!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-variant="primary"],[data-od14-unified-variant="primary"]):hover, body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-variant="primary"],[data-od14-unified-variant="primary"]):hover{border-color:var(--ods-color-accent-hover)!important;background:var(--ods-color-accent-hover)!important;color:#fff!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-variant="danger"],[data-od14-unified-variant="danger"]), body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-variant="danger"],[data-od14-unified-variant="danger"]){border-color:#e4bec1!important;background:#fff!important;color:var(--ods-color-danger)!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-variant="ghost"],[data-od14-unified-variant="ghost"]), body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-variant="ghost"],[data-od14-unified-variant="ghost"]){border-color:transparent!important;background:transparent!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="icon-button"],[data-od14-unified-part="icon-button"]), body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="icon-button"],[data-od14-unified-part="icon-button"]){width:var(--ods-control-height)!important;min-width:var(--ods-control-height)!important;padding:0!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="tab"],[data-od14-unified-part="tab"]), body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="tab"],[data-od14-unified-part="tab"]){min-height:39px!important;padding:0!important;border-width:0 0 2px!important;border-color:transparent!important;border-radius:0!important;background:transparent!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="tab"],[data-od14-unified-part="tab"]):is(.active,[aria-selected="true"]), body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="tab"],[data-od14-unified-part="tab"]):is(.active,[aria-selected="true"]){border-bottom-color:var(--ods-color-accent)!important;color:var(--ods-color-accent)!important} body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):disabled, body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):disabled{opacity:.45!important;cursor:not-allowed!important} body.omnidata-design-system-v1 :is([data-ods-role="field"],[data-od14-unified-role="field"]), body.omnidata-role-system :is([data-ods-role="field"],[data-od14-unified-role="field"]){min-width:0!important;color:var(--ods-color-text-soft)!important;font:600 var(--ods-font-size-xs)/1.35 var(--ods-font-family)!important} body.omnidata-design-system-v1 :is(input,select,textarea)[data-ods-role="field"], body.omnidata-design-system-v1 :is(input,select,textarea)[data-od14-unified-role="field"], body.omnidata-role-system :is(input,select,textarea)[data-ods-role="field"], body.omnidata-role-system :is(input,select,textarea)[data-od14-unified-role="field"]{width:100%!important;min-height:var(--ods-control-height)!important;margin:0!important;padding:0 10px!important;border:1px solid var(--ods-color-border-strong)!important;border-radius:var(--ods-radius-sm)!important;background:var(--ods-color-surface)!important;color:var(--ods-color-text)!important;font:500 var(--ods-font-size-sm)/1.25 var(--ods-font-family)!important;outline:0!important;box-shadow:none!important} body.omnidata-design-system-v1 textarea[data-ods-role="field"], body.omnidata-design-system-v1 textarea[data-od14-unified-role="field"], body.omnidata-role-system textarea[data-ods-role="field"], body.omnidata-role-system textarea[data-od14-unified-role="field"]{min-height:88px!important;padding:var(--ods-space-2) 10px!important;resize:vertical!important} body.omnidata-design-system-v1 :is(input,select,textarea)[data-ods-role="field"]:focus, body.omnidata-design-system-v1 :is(input,select,textarea)[data-od14-unified-role="field"]:focus, body.omnidata-role-system :is(input,select,textarea)[data-ods-role="field"]:focus, body.omnidata-role-system :is(input,select,textarea)[data-od14-unified-role="field"]:focus{border-color:var(--ods-color-accent)!important;box-shadow:0 0 0 2px rgba(255,91,34,.1)!important} body.omnidata-design-system-v1 :is(input[type="checkbox"],input[type="radio"]):is([data-ods-role="field"],[data-od14-unified-role="field"]), body.omnidata-role-system :is(input[type="checkbox"],input[type="radio"]):is([data-ods-role="field"],[data-od14-unified-role="field"]){width:15px!important;min-width:15px!important;height:15px!important;min-height:15px!important;padding:0!important;accent-color:var(--ods-color-accent)!important} body.omnidata-design-system-v1 :is([data-ods-role="field"],[data-od14-unified-role="field"]):is([data-ods-part="field-group"],[data-od14-unified-part="field-group"]), body.omnidata-role-system :is([data-ods-role="field"],[data-od14-unified-role="field"]):is([data-ods-part="field-group"],[data-od14-unified-part="field-group"]){display:grid!important;gap:var(--ods-space-1)!important;align-content:start!important} body.omnidata-design-system-v1 fieldset:is([data-ods-role="field"],[data-od14-unified-role="field"]), body.omnidata-role-system fieldset:is([data-ods-role="field"],[data-od14-unified-role="field"]){margin:0!important;padding:var(--ods-space-3)!important;border:1px solid var(--ods-color-border)!important;border-radius:var(--ods-radius-md)!important;background:var(--ods-color-surface)!important} body.omnidata-design-system-v1 :is([data-ods-role="table"],[data-od14-unified-role="table"]):is([data-ods-part="table-wrap"],[data-od14-unified-part="table-wrap"]), body.omnidata-role-system :is([data-ods-role="table"],[data-od14-unified-role="table"]):is([data-ods-part="table-wrap"],[data-od14-unified-part="table-wrap"]){min-width:0!important;max-width:100%!important;margin:var(--ods-space-3) 0!important;border:1px solid var(--ods-color-border)!important;border-radius:var(--ods-radius-md)!important;background:var(--ods-color-surface)!important;box-shadow:var(--ods-shadow-surface)!important;overflow:auto!important} body.omnidata-design-system-v1 table:is([data-ods-role="table"],[data-od14-unified-role="table"]), body.omnidata-role-system table:is([data-ods-role="table"],[data-od14-unified-role="table"]){width:100%!important;min-width:720px!important;margin:0!important;border:0!important;border-collapse:separate!important;border-spacing:0!important;background:var(--ods-color-surface)!important;color:var(--ods-color-text)!important;font-variant-numeric:tabular-nums!important;box-shadow:none!important} body.omnidata-design-system-v1 table:is([data-ods-role="table"],[data-od14-unified-role="table"]) th, body.omnidata-role-system table:is([data-ods-role="table"],[data-od14-unified-role="table"]) th{position:sticky!important;top:0!important;z-index:2!important;height:36px!important;padding:0 10px!important;border:0!important;border-bottom:1px solid var(--ods-color-border-strong)!important;background:#f4f6f7!important;color:var(--ods-color-muted)!important;font-size:11px!important;font-weight:700!important;letter-spacing:.045em!important;text-align:left!important;text-transform:uppercase!important;white-space:nowrap!important} body.omnidata-design-system-v1 table:is([data-ods-role="table"],[data-od14-unified-role="table"]) td, body.omnidata-role-system table:is([data-ods-role="table"],[data-od14-unified-role="table"]) td{height:var(--ods-row-height)!important;padding:var(--ods-space-2) 10px!important;border:0!important;border-bottom:1px solid #eaedef!important;background:var(--ods-color-surface)!important;color:#3f4851!important;font-size:var(--ods-font-size-sm)!important;vertical-align:middle!important} body.omnidata-design-system-v1 table:is([data-ods-role="table"],[data-od14-unified-role="table"]) tbody tr:last-child td, body.omnidata-role-system table:is([data-ods-role="table"],[data-od14-unified-role="table"]) tbody tr:last-child td{border-bottom:0!important} body.omnidata-design-system-v1 table:is([data-ods-role="table"],[data-od14-unified-role="table"]) tbody tr:hover td, body.omnidata-role-system table:is([data-ods-role="table"],[data-od14-unified-role="table"]) tbody tr:hover td{background:var(--ods-color-surface-hover)!important} body.omnidata-design-system-v1 table:is([data-ods-role="table"],[data-od14-unified-role="table"]) tbody tr:is(.selected,[aria-selected="true"]) td, body.omnidata-role-system table:is([data-ods-role="table"],[data-od14-unified-role="table"]) tbody tr:is(.selected,[aria-selected="true"]) td{background:#fff0ea!important} body.omnidata-design-system-v1 :is([data-ods-role="status"],[data-od14-unified-role="status"]), body.omnidata-role-system :is([data-ods-role="status"],[data-od14-unified-role="status"]){display:inline-flex!important;min-height:22px!important;align-items:center!important;justify-content:center!important;padding:2px 8px!important;border:1px solid #dde1e4!important;border-radius:999px!important;background:#f4f6f7!important;color:var(--ods-color-text-soft)!important;font:600 var(--ods-font-size-xs)/1.2 var(--ods-font-family)!important;white-space:nowrap!important;box-shadow:none!important} body.omnidata-design-system-v1 :is([data-ods-role="status"],[data-od14-unified-role="status"]):is([data-ods-part="alert"],[data-ods-part="toast"],[data-od14-unified-part="alert"],[data-od14-unified-part="toast"]), body.omnidata-role-system :is([data-ods-role="status"],[data-od14-unified-role="status"]):is([data-ods-part="alert"],[data-ods-part="toast"],[data-od14-unified-part="alert"],[data-od14-unified-part="toast"]){display:flex!important;width:100%!important;min-height:40px!important;justify-content:flex-start!important;margin:var(--ods-space-2) 0!important;padding:var(--ods-space-2) var(--ods-space-3)!important;border-radius:var(--ods-radius-sm)!important;font-size:var(--ods-font-size-sm)!important;white-space:normal!important} body.omnidata-design-system-v1 :is([data-ods-role="status"],[data-od14-unified-role="status"]):is([data-ods-tone="success"],[data-od14-unified-tone="success"]), body.omnidata-role-system :is([data-ods-role="status"],[data-od14-unified-role="status"]):is([data-ods-tone="success"],[data-od14-unified-tone="success"]){border-color:#c9dbce!important;background:#f0f7f2!important;color:var(--ods-color-success)!important} body.omnidata-design-system-v1 :is([data-ods-role="status"],[data-od14-unified-role="status"]):is([data-ods-tone="warning"],[data-od14-unified-tone="warning"]), body.omnidata-role-system :is([data-ods-role="status"],[data-od14-unified-role="status"]):is([data-ods-tone="warning"],[data-od14-unified-tone="warning"]){border-color:#ead8ab!important;background:#fff8e8!important;color:var(--ods-color-warning)!important} body.omnidata-design-system-v1 :is([data-ods-role="status"],[data-od14-unified-role="status"]):is([data-ods-tone="danger"],[data-od14-unified-tone="danger"]), body.omnidata-role-system :is([data-ods-role="status"],[data-od14-unified-role="status"]):is([data-ods-tone="danger"],[data-od14-unified-tone="danger"]){border-color:#e5c3c6!important;background:#fff2f2!important;color:var(--ods-color-danger)!important} body.omnidata-design-system-v1 :is([data-ods-role="status"],[data-od14-unified-role="status"]):is([data-ods-tone="info"],[data-od14-unified-tone="info"]), body.omnidata-role-system :is([data-ods-role="status"],[data-od14-unified-role="status"]):is([data-ods-tone="info"],[data-od14-unified-tone="info"]){border-color:#c8d7e4!important;background:#f0f6fb!important;color:var(--ods-color-info)!important} body.omnidata-design-system-v1 :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"]), body.omnidata-role-system :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"]){position:sticky!important;top:62px!important;min-width:0!important;max-height:calc(100vh - 78px)!important;padding:var(--ods-space-4)!important;border:1px solid var(--ods-color-border)!important;border-radius:var(--ods-radius-md)!important;background:var(--ods-color-surface)!important;color:var(--ods-color-text)!important;box-shadow:var(--ods-shadow-surface)!important;overflow:auto!important} body.omnidata-design-system-v1 :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"])>*, body.omnidata-role-system :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"])>*{min-width:0!important} body.omnidata-design-system-v1 :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"]) dl, body.omnidata-role-system :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"]) dl{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:var(--ods-space-2)!important;margin:var(--ods-space-3) 0!important} body.omnidata-design-system-v1 :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"]) dl>div, body.omnidata-role-system :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"]) dl>div{padding:var(--ods-space-2)!important;border:1px solid #e8eaec!important;border-radius:var(--ods-radius-sm)!important;background:#fafbfb!important} /* The language audit is a development instrument, not a label for the client. It marks every node that holds a Latin word the interface dictionary does not know, and business data is full of them: SKU codes, style names, supplier names, order numbers, retail door codes. Painted unconditionally, it drew a red dotted underline under "SS27 Paris Showroom DEMO" and under the colourway code on the product card, and the product read as though it were full of spelling mistakes. The attribute still lands on the node and the counter still reaches body.dataset, so the audit keeps working for us; only the paint is now opt-in, through data-ods-language-audit-visible on the document element. */ html[data-ods-language-audit-visible="true"] body.omnidata-design-system-v1 [data-ods-language-mismatch], html[data-ods-language-audit-visible="true"] body.omnidata-role-system [data-ods-language-mismatch]{text-decoration:underline dotted var(--ods-color-danger)!important;text-underline-offset:3px!important} @media (max-width:1080px){ body.omnidata-design-system-v1 .workspace-content, body.omnidata-role-system .workspace-content{padding-inline:var(--ods-space-4)!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]){grid-template-columns:repeat(2,minmax(0,1fr))!important} } @media (max-width:920px){ body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="master-detail"],[data-od14-unified-part="master-detail"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="master-detail"],[data-od14-unified-part="master-detail"]){grid-template-columns:minmax(0,1fr)!important} body.omnidata-design-system-v1 :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"]), body.omnidata-role-system :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"]){position:static!important;max-height:none!important} } @media (max-width:620px){ body.omnidata-design-system-v1 .workspace-content, body.omnidata-role-system .workspace-content{padding-inline:var(--ods-space-3)!important} body.omnidata-design-system-v1 .od14-page-header, body.omnidata-role-system .od14-page-header, body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="page-header"],[data-od14-unified-part="page-header"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="page-header"],[data-od14-unified-part="page-header"]){grid-template-columns:minmax(0,1fr)!important;align-items:start!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]){grid-template-columns:minmax(0,1fr)!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metrics"],[data-od14-unified-part="metrics"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metrics"],[data-od14-unified-part="metrics"]){grid-template-columns:repeat(2,minmax(0,1fr))!important} body.omnidata-design-system-v1 :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"]) dl, body.omnidata-role-system :is([data-ods-role="inspector"],[data-od14-unified-role="inspector"]) dl{grid-template-columns:minmax(0,1fr)!important} } @media (prefers-reduced-motion:reduce){ body.omnidata-design-system-v1 *, body.omnidata-design-system-v1 *::before, body.omnidata-design-system-v1 *::after, body.omnidata-role-system *, body.omnidata-role-system *::before, body.omnidata-role-system *::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important} } /* Navigation items carry the button role for semantics and audit, but they are laid out by the navigation layer, not by the generic button chrome: they read as a left-aligned icon+label row inside the dark sidebar, never as a bordered control. Scoped to the navigation-item part, mirroring the icon-button and tab part overrides above. */ body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="navigation-item"],[data-od14-unified-part="navigation-item"]), body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="navigation-item"],[data-od14-unified-part="navigation-item"]){display:flex!important;justify-content:flex-start!important;border:0!important;font-family:inherit!important;line-height:1.25!important;text-align:left!important} body.omnidata-design-system-v1 .shell.sidebar-collapsed :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="navigation-item"],[data-od14-unified-part="navigation-item"]), body.omnidata-role-system .shell.sidebar-collapsed :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="navigation-item"],[data-od14-unified-part="navigation-item"]){justify-content:center!important} @media(max-width:820px){ body.omnidata-design-system-v1 :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="navigation-item"],[data-od14-unified-part="navigation-item"]), body.omnidata-role-system :is([data-ods-role="button"],[data-od14-unified-role="button"]):is([data-ods-part="navigation-item"],[data-od14-unified-part="navigation-item"]){justify-content:center!important} } /* A command-bar control — a search field, a filter — is a field-group whose label wraps the input, but it reads as one horizontal control: a caption or an icon and the input on a single baseline inside a single border, not the stacked label-above-input pair the generic field-group describes. Without this the grid stacks them, and the input overflows the 32px wrapper it is supposed to sit inside — which is the filter caption that appears detached from its own control, floating over the row below. */ body.omnidata-design-system-v1 :is([data-ods-role="field"],[data-od14-unified-role="field"]):is(.od-search,.od-filter,.global-search,.od14-compact-search), body.omnidata-role-system :is([data-ods-role="field"],[data-od14-unified-role="field"]):is(.od-search,.od-filter,.global-search,.od14-compact-search){display:flex!important;justify-content:flex-start!important;align-items:center!important;gap:7px!important;height:auto!important;min-height:var(--ods-control-height)!important} body.omnidata-design-system-v1 :is(.od-search,.od-filter,.global-search,.od14-compact-search) :is([data-ods-role="field"],[data-od14-unified-role="field"]), body.omnidata-role-system :is(.od-search,.od-filter,.global-search,.od14-compact-search) :is([data-ods-role="field"],[data-od14-unified-role="field"]){flex:1 1 auto!important;min-width:0!important;height:auto!important;min-height:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;outline:0!important} /* Three elements sit inside a component's markup without being a component of their own; the generic role chrome otherwise paints each of them as a visible empty control. */ /* A command-bar spacer is aria-hidden layout filler (flex:1). It must never paint. */ body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-commandbar-spacer, body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-commandbar-spacer{min-height:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important} /* A status dot encodes state in its border colour and is 9px across, not a pill. */ body.omnidata-design-system-v1 :is([data-ods-role="status"],[data-od14-unified-role="status"]).od-status-dot, body.omnidata-role-system :is([data-ods-role="status"],[data-od14-unified-role="status"]).od-status-dot{width:9px!important;height:9px!important;min-height:0!important;flex:0 0 9px!important;padding:0!important;border:2px solid #7655d3!important;border-radius:50%!important;background:#fff!important} body.omnidata-design-system-v1 .od-status-card.success :is([data-ods-role="status"],[data-od14-unified-role="status"]).od-status-dot, body.omnidata-role-system .od-status-card.success :is([data-ods-role="status"],[data-od14-unified-role="status"]).od-status-dot{border-color:#40a879!important} body.omnidata-design-system-v1 .od-status-card.warning :is([data-ods-role="status"],[data-od14-unified-role="status"]).od-status-dot, body.omnidata-role-system .od-status-card.warning :is([data-ods-role="status"],[data-od14-unified-role="status"]).od-status-dot{border-color:#d5a34e!important} body.omnidata-design-system-v1 .od-status-card.info :is([data-ods-role="status"],[data-od14-unified-role="status"]).od-status-dot, body.omnidata-role-system .od-status-card.info :is([data-ods-role="status"],[data-od14-unified-role="status"]).od-status-dot{border-color:#6e93df!important} /* The toast host is a fixed, permanently mounted positioning container; the .notice inside it carries the card. Chrome on the host draws an empty box in the corner whenever no message is showing, and doubles the border when one is. */ body.omnidata-design-system-v1 :is([data-ods-role="status"],[data-od14-unified-role="status"]).toast, body.omnidata-role-system :is([data-ods-role="status"],[data-od14-unified-role="status"]).toast{display:block!important;min-height:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important} /* The 720px floor on the table role is meant for the wide data grids. The dashboard mini-table carries two or three summary columns inside a half-width panel, so the floor only forced a horizontal scrollbar and clipped the last column; it fits its panel instead. */ body.omnidata-design-system-v1 table:is([data-ods-role="table"],[data-od14-unified-role="table"]).od-mini-table, body.omnidata-role-system table:is([data-ods-role="table"],[data-od14-unified-role="table"]).od-mini-table{min-width:0!important} /* A status chip is one pill: a dot, a label and a count inside a single border. Its label and count carry the status role because they sit inside a status card, so the pill chrome was drawn a second and third time, nested inside the chip they belong to. They are text. */ body.omnidata-design-system-v1 :is([data-ods-role="status"],[data-od14-unified-role="status"]):is(.od-status-label,.od-status-value), body.omnidata-role-system :is([data-ods-role="status"],[data-od14-unified-role="status"]):is(.od-status-label,.od-status-value){min-height:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important} body.omnidata-design-system-v1 :is([data-ods-role="status"],[data-od14-unified-role="status"]).od-status-value, body.omnidata-role-system :is([data-ods-role="status"],[data-od14-unified-role="status"]).od-status-value{margin-left:auto!important;font-weight:700!important} /* A section count is a soft pill beside the section title, not a nested card. */ body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]).section-count, body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]).section-count{display:inline-flex!important;min-width:22px!important;min-height:22px!important;height:22px!important;align-items:center!important;justify-content:center!important;padding:0 6px!important;border:0!important;border-radius:999px!important;background:#f0f1f2!important;color:#626871!important;font-size:11px!important} /* The help button is a topbar control, not a full-height topbar tab: the v7 layer sized it to the whole topbar, so it stood a head taller than the bell and the language switcher beside it. */ body.omnidata-design-system-v1 .topbar .od-v7-help-button, body.omnidata-role-system .topbar .od-v7-help-button{align-self:center!important;width:var(--ods-control-height)!important;min-width:var(--ods-control-height)!important;height:var(--ods-control-height)!important;min-height:var(--ods-control-height)!important;padding:0!important;border:1px solid var(--ods-color-border-strong)!important;border-radius:var(--ods-radius-sm)!important} /* The v12 rail tooltip repeats the label that is already visible beside it, and covers the item above. It is only useful when the labels are hidden. */ body.omnidata-design-system-v1 .nav-item[data-v12-label]:hover::after, body.omnidata-role-system .nav-item[data-v12-label]:hover::after{display:none!important} body.omnidata-design-system-v1 .shell.sidebar-collapsed .nav-item[data-v12-label]:hover::after, body.omnidata-role-system .shell.sidebar-collapsed .nav-item[data-v12-label]:hover::after{display:block!important} /* The breadcrumb sits in a fixed topbar column. Allowed to wrap it broke onto a second line and left a separator dangling at the end of the first, so it stays on one line and the current page ellipsizes instead. */ body.omnidata-design-system-v1 .topbar .breadcrumb, body.omnidata-role-system .topbar .breadcrumb{flex-wrap:nowrap!important;align-items:center!important;min-width:0!important;overflow:hidden!important} body.omnidata-design-system-v1 .topbar .breadcrumb > *, body.omnidata-role-system .topbar .breadcrumb > *{flex:0 0 auto!important} /* The page you are on is the one crumb that must survive. Let the group name give up its width first — it ellipsizes, and the sidebar still shows it in full — and keep a floor under the page name so it can never be squeezed to nothing. */ body.omnidata-design-system-v1 .topbar .breadcrumb > .breadcrumb-muted:not(:first-of-type), body.omnidata-role-system .topbar .breadcrumb > .breadcrumb-muted:not(:first-of-type){flex:0 1 auto!important;min-width:2.5rem!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} body.omnidata-design-system-v1 .topbar .breadcrumb > strong, body.omnidata-role-system .topbar .breadcrumb > strong{flex:1 1 auto!important;min-width:6rem!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} /* The breadcrumb column was starved to 212px inside a 1208px header because the trailing column was unbounded. Give the path room and bound the tail. */ body.omnidata-design-system-v1 .topbar, body.omnidata-role-system .topbar{grid-template-columns:minmax(160px,1fr) minmax(200px,300px) max-content!important} /* The tail column is `max-content` with no floor on the path column: with a long organisation name (buyer: «Nordhaus Retail», «Jonas Herrmann») the old 360px floor left the actions 70px short, and their overflow clip ate the «RU» button down to a sliver. The path column gives way, it ellipsises. */ /* Those three floors add up to 740px before gaps and padding, and this rule had no breakpoint, so below roughly 1100px it overrode the responsive ladder the earlier layers set and the header burst: the search box landed on top of the page content, the organisation and user chips were clipped to an empty white rectangle, and with them went the way out of the application. Step the floors down, then drop to two columns and give the search a row of its own. */ @media (max-width:1180px){ body.omnidata-design-system-v1 .topbar, body.omnidata-role-system .topbar{grid-template-columns:minmax(0,1fr) minmax(160px,300px) max-content!important;gap:var(--ods-space-2)!important;padding:0 var(--ods-space-3)!important} } @media (max-width:980px){ body.omnidata-design-system-v1 .topbar, body.omnidata-role-system .topbar{height:auto!important;min-height:0!important;grid-template-columns:minmax(0,1fr) max-content!important;align-items:center!important;row-gap:var(--ods-space-2)!important;padding:var(--ods-space-2) var(--ods-space-3)!important} body.omnidata-design-system-v1 .topbar .global-search, body.omnidata-role-system .topbar .global-search{grid-column:1/-1!important;grid-row:2!important;width:100%!important;max-width:none!important} } /* The v11 layer painted the system footer dark and set a translucent white text colour to match. A later layer repainted the ground almost white but left the colour alone, so "Время сервера" and the build id were white on white — a contrast ratio of 1.00:1, literally invisible. Restore a readable colour and a legible size on the ground the footer actually has now. */ body.omnidata-design-system-v1 .od-v7-system-footer, body.omnidata-role-system .od-v7-system-footer{color:var(--ods-color-text-soft,#56606a)!important;font-size:11px!important} body.omnidata-design-system-v1 .od-v7-system-footer :is(span,strong,small), body.omnidata-role-system .od-v7-system-footer :is(span,strong,small){color:inherit!important;font-size:11px!important} body.omnidata-design-system-v1 .od-v7-system-footer strong, body.omnidata-role-system .od-v7-system-footer strong{color:var(--ods-color-text,#1f242b)!important} /* A table cell must keep table layout. The empty-state message is a ; giving it display:grid voids the colspan, so "Поставщики не найдены." was squeezed into the first column of a seven-column table and wrapped inside its own box. */ body.omnidata-design-system-v1 :is(td,th):is([data-ods-part="empty"],[data-od14-unified-part="empty"]), body.omnidata-role-system :is(td,th):is([data-ods-part="empty"],[data-od14-unified-part="empty"]){display:table-cell!important;border:0!important;border-radius:0!important;background:transparent!important;text-align:center!important} /* A card is a block that holds content. An inline label or a table cell classified as one is a misclassification of the substring matcher, and painting it drew a second bordered box inside the tile or row it labels. */ body.omnidata-design-system-v1 :is(span,strong,em,b,i,small,label,td,th):is([data-ods-role="card"],[data-od14-unified-role="card"]), body.omnidata-role-system :is(span,strong,em,b,i,small,label,td,th):is([data-ods-role="card"],[data-od14-unified-role="card"]){border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;min-height:0!important} body.omnidata-design-system-v1 :is(span,strong,em,b,i,small,label):is([data-ods-role="card"],[data-od14-unified-role="card"]), body.omnidata-role-system :is(span,strong,em,b,i,small,label):is([data-ods-role="card"],[data-od14-unified-role="card"]){padding:0!important} /* A container with nothing in it is not a control. The linesheets header appends an actions slot whether or not there are actions, and the role chrome turned the empty slot into a 1160x16 hairline strip that reads as a broken toolbar. */ body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"],[data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):empty, body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"],[data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):empty{min-height:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important} /* Attribute filter panel. Registries carry more columns than a single status select can serve, so the Filters control opens a panel listing every filterable attribute with its values and how many rows carry each. Choices apply as they are made; the panel closes on Apply. */ body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-filter-panel, body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-filter-panel{position:absolute!important;top:0!important;left:0!important;z-index:40!important;display:flex!important;flex-direction:column!important;width:min(340px,86%)!important;max-height:100%!important;border:1px solid var(--ods-color-border)!important;border-radius:var(--ods-radius-sm)!important;background:var(--ods-color-surface)!important;box-shadow:0 10px 30px rgba(15,20,26,.14)!important;overflow:hidden!important} body.omnidata-design-system-v1 .od-master, body.omnidata-role-system .od-master{position:relative!important} body.omnidata-design-system-v1 .od-filter-panel-head, body.omnidata-role-system .od-filter-panel-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;padding:12px 14px!important;border-bottom:1px solid var(--ods-color-border)!important} body.omnidata-design-system-v1 .od-filter-panel-title, body.omnidata-role-system .od-filter-panel-title{margin:0!important;font-size:13px!important;font-weight:700!important} body.omnidata-design-system-v1 .od-filter-panel-close, body.omnidata-role-system .od-filter-panel-close{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:26px!important;height:26px!important;padding:0!important;border:0!important;border-radius:var(--ods-radius-sm)!important;background:transparent!important;cursor:pointer!important} body.omnidata-design-system-v1 .od-filter-panel-close:hover, body.omnidata-role-system .od-filter-panel-close:hover{background:var(--ods-color-surface-hover)!important} body.omnidata-design-system-v1 :is([data-ods-role="field"],[data-od14-unified-role="field"]).od-filter-panel-search, body.omnidata-role-system :is([data-ods-role="field"],[data-od14-unified-role="field"]).od-filter-panel-search{display:flex!important;align-items:center!important;gap:7px!important;margin:10px 14px!important;padding:0 10px!important;min-height:var(--ods-control-height)!important;border:1px solid var(--ods-color-border-strong)!important;border-radius:var(--ods-radius-sm)!important} body.omnidata-design-system-v1 .od-filter-panel-search input, body.omnidata-role-system .od-filter-panel-search input{flex:1 1 auto!important;min-width:0!important;border:0!important;background:transparent!important;outline:0!important;padding:0!important;font-size:12px!important} body.omnidata-design-system-v1 .od-filter-panel-body, body.omnidata-role-system .od-filter-panel-body{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;padding:0 14px 8px!important} body.omnidata-design-system-v1 .od-filter-group, body.omnidata-role-system .od-filter-group{padding:8px 0!important;border-bottom:1px solid var(--ods-color-border)!important} body.omnidata-design-system-v1 .od-filter-group:last-child, body.omnidata-role-system .od-filter-group:last-child{border-bottom:0!important} body.omnidata-design-system-v1 .od-filter-group-title, body.omnidata-role-system .od-filter-group-title{margin:0 0 6px!important;font-size:11px!important;font-weight:700!important;letter-spacing:.06em!important;text-transform:uppercase!important;color:var(--ods-color-text-soft)!important} body.omnidata-design-system-v1 :is([data-ods-role="field"],[data-od14-unified-role="field"]).od-filter-option, body.omnidata-role-system :is([data-ods-role="field"],[data-od14-unified-role="field"]).od-filter-option{display:flex!important;align-items:center!important;gap:8px!important;min-height:26px!important;padding:2px 0!important;font-size:12px!important;cursor:pointer!important} body.omnidata-design-system-v1 .od-filter-option-label, body.omnidata-role-system .od-filter-option-label{flex:1 1 auto!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} body.omnidata-design-system-v1 .od-filter-option-count, body.omnidata-role-system .od-filter-option-count{flex:0 0 auto!important;color:var(--ods-color-text-soft)!important;font-variant-numeric:tabular-nums!important;font-size:11px!important} body.omnidata-design-system-v1 .od-filter-panel-foot, body.omnidata-role-system .od-filter-panel-foot{display:flex!important;justify-content:flex-end!important;gap:8px!important;padding:10px 14px!important;border-top:1px solid var(--ods-color-border)!important} /* Applied filters stay visible above the table and each one can be taken off. */ body.omnidata-design-system-v1 .od-filter-chips, body.omnidata-role-system .od-filter-chips{display:flex!important;flex-wrap:wrap!important;gap:6px!important;margin:0 0 10px!important} body.omnidata-design-system-v1 .od-filter-chip, body.omnidata-role-system .od-filter-chip{display:inline-flex!important;align-items:center!important;gap:6px!important;min-height:24px!important;padding:0 8px!important;border:1px solid var(--ods-color-border-strong)!important;border-radius:999px!important;background:var(--ods-color-surface)!important;color:var(--ods-color-text-soft)!important;font-size:11px!important;cursor:pointer!important} body.omnidata-design-system-v1 .od-filter-chip:hover, body.omnidata-role-system .od-filter-chip:hover{border-color:var(--ods-color-accent)!important;color:var(--ods-color-accent)!important} body.omnidata-design-system-v1 .od-filter-chip-remove, body.omnidata-role-system .od-filter-chip-remove{font-size:13px!important;line-height:1!important} body.omnidata-design-system-v1 .od-filter-button-count, body.omnidata-role-system .od-filter-button-count{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:16px!important;height:16px!important;margin-left:6px!important;padding:0 4px!important;border-radius:999px!important;background:var(--ods-color-accent)!important;color:#fff!important;font-size:11px!important;font-weight:700!important} body.omnidata-design-system-v1 .od-filter-panel-close-mark, body.omnidata-role-system .od-filter-panel-close-mark{font-size:16px!important;line-height:1!important;color:var(--ods-color-text-soft)!important} /* The column chooser shares the filter panel's shell. */ body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-column-panel, body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-column-panel{width:min(280px,80%)!important} body.omnidata-design-system-v1 :is([data-ods-role="field"],[data-od14-unified-role="field"]).od-column-option, body.omnidata-role-system :is([data-ods-role="field"],[data-od14-unified-role="field"]).od-column-option{display:flex!important;align-items:center!important;gap:8px!important;min-height:28px!important;padding:2px 0!important;font-size:12px!important;cursor:pointer!important} body.omnidata-design-system-v1 .od-column-option input:disabled, body.omnidata-role-system .od-column-option input:disabled{opacity:.5!important;cursor:not-allowed!important} /* ------------------------------------------------------------------ A control bar holds as many controls as its screen has ------------------------------------------------------------------ The filter bar was a fixed five-track grid: one wide track for the search and three equal tracks after it. Every view puts a different number of controls in that bar, so on a view with four the last one dropped to a second row, and on a view with two buttons they sat marooned in the middle of 190px tracks with a hundred-pixel hole between them. Lay the bar out as a row that wraps: the search takes the slack, everything else is its own width, and the bar reads the same whether it carries two controls or six. */ /* The header's action cluster carries the filterbar role too, so it was being given a filter bar's border, padding and wrapping: at 1440 the user chip wrapped onto a second row inside a 50px header. The header is not a filter bar, and says so here. */ body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]):not(.topbar-actions), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]):not(.topbar-actions){display:flex!important;align-items:flex-end!important;flex-wrap:wrap!important;grid-template-columns:none!important;gap:var(--ods-space-2)!important;width:100%!important;min-width:0!important;margin:var(--ods-space-3) 0!important;padding:var(--ods-space-2)!important;border:1px solid var(--ods-color-border)!important;border-radius:var(--ods-radius-md)!important;background:var(--ods-color-surface)!important;box-shadow:var(--ods-shadow-surface)!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"])>*, body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]):not(.topbar-actions)>*{flex:0 0 auto!important;min-width:0!important;max-width:100%!important;margin:0!important} /* The search is the one control that should drink the leftover width. */ body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"])>:is(label,.od-search,.od-filter), body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]):not(.topbar-actions)>:is(label,.od-search,.od-filter){flex:1 1 220px!important;max-width:360px!important} /* The legacy flex spacer means nothing once the bar wraps; it used to hold open a whole empty track. */ body.omnidata-design-system-v1 .od-commandbar-spacer, body.omnidata-role-system .od-commandbar-spacer{display:none!important} /* And a bar that ended up carrying no control at all is not a bar. The workspace overview painted one as a bordered white rectangle 56px tall, directly under the page title, holding nothing. */ body.omnidata-design-system-v1 .od-commandbar.od14-empty-bar, body.omnidata-role-system .od-commandbar.od14-empty-bar{display:none!important} /* ------------------------------------------------------------------ A metric tile names the thing it measures ------------------------------------------------------------------ The tile was a two-column grid, "label value", with the label in a 1fr track and the value in an auto track. A numeric value left the label alone; a worded one — "Только чтение", "BER-MITTE", "Отправлена" — took the width it needed and squeezed the label out of existence, so the client read "Ре…", "R…" and a bare "П". Stack them instead: the label above, the value below, the way every other figure in the product is presented. Nothing competes, and a long value wraps rather than evicting its own caption. */ body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"]){display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-areas:"label" "value" "detail"!important;align-content:start!important;justify-items:start!important;gap:var(--ods-space-1)!important;min-height:82px!important;padding:var(--ods-space-3)!important;overflow:hidden!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"])>*, body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"])>*{max-width:100%!important;min-width:0!important;margin:0!important;justify-self:start!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"])>:is(span,.muted,[class*="label"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"])>:is(span,.muted,[class*="label"]){grid-area:label!important;color:var(--ods-color-text-soft)!important;font-size:var(--ods-font-size-xs)!important;line-height:1.3!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} /* A metric card has three slots: label, value, detail. The label rule above matches every direct span, so a hint span used to share the label cell and printed on top of it; hint/detail spans now take the detail row. */ body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"])>:is([class*="hint"],[class*="detail"]), body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"])>:is([class*="hint"],[class*="detail"]){grid-area:detail!important;color:var(--ods-color-muted)!important;font-size:var(--ods-font-size-xs)!important;line-height:1.3!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"]) strong, body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"]) strong{grid-area:value!important;color:var(--ods-color-text)!important;font-size:20px!important;font-weight:600!important;font-variant-numeric:tabular-nums!important;line-height:1.15!important;white-space:normal!important;overflow-wrap:anywhere!important} body.omnidata-design-system-v1 :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"]) small, body.omnidata-role-system :is([data-ods-role="card"],[data-od14-unified-role="card"]):is([data-ods-part="metric"],[data-od14-unified-part="metric"]) small{grid-area:detail!important;color:var(--ods-color-muted)!important;font-size:var(--ods-font-size-xs)!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} /* A container that ended up with nothing in it is not a panel. The Production Order inspector renders its action row unconditionally, so a confirmed order — which has no action left — showed a bordered 74px box under the status with nothing inside. The same shape appears wherever a toolbar or an action row is built before its contents are known. :empty is exact: it matches only a box with no child and no text, so nothing that carries anything can be caught by it. */ body.omnidata-design-system-v1 :is([data-ods-part="toolbar"],[data-od14-unified-part="toolbar"],[data-od14-component="toolbar"],[data-ods-part="header-toolbar"],[data-od14-unified-part="header-toolbar"],[data-ods-part="button-group"],[data-od14-unified-part="button-group"]):empty, body.omnidata-role-system :is([data-ods-part="toolbar"],[data-od14-unified-part="toolbar"],[data-od14-component="toolbar"],[data-ods-part="header-toolbar"],[data-od14-unified-part="header-toolbar"],[data-ods-part="button-group"],[data-od14-unified-part="button-group"]):empty{display:none!important} /* The showroom's looks are a rack of cards of one size, not a responsive layout. The role system classifies the container as a "layout" and lays it out with repeat(auto-fit, minmax(280px, 1fr)), which is right for panels and wrong for cards: with a single look in the showroom, auto-fit collapsed to one track and 1fr stretched that one card across the whole 807px row, so its 3/4 figure stood over a thousand pixels tall and the buyer's order grid was pushed off the page. auto-fill with a bounded track keeps a card the same size whether the showroom holds one look or twelve. */ body.omnidata-design-system-v1 .od-look-grid, body.omnidata-role-system .od-look-grid{grid-template-columns:repeat(auto-fill,minmax(240px,300px))!important;justify-content:start!important} /* The buyer's "from matrix to confirmed order" card. Its heading and its progress rows had been built with the toolbar class, which the shell right-aligns; the card read as a ragged column hugging its right edge with the whole left half empty. A step is a label and the state it is in, at opposite ends of one row. */ body.omnidata-design-system-v1 .od-handoff-head, body.omnidata-role-system .od-handoff-head{display:block!important;text-align:left!important} body.omnidata-design-system-v1 .od-handoff-step, body.omnidata-role-system .od-handoff-step{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:var(--ods-space-3)!important;min-height:32px!important;padding:var(--ods-space-2) 0!important;border-bottom:1px solid var(--ods-color-border)!important} body.omnidata-design-system-v1 .od-handoff-step:last-child, body.omnidata-role-system .od-handoff-step:last-child{border-bottom:0!important} /* One height for everything in the header's action cluster. The language toggle, the notification bell and the help button stood 34px tall while the organisation and user chips beside them stood 59px — taller than the 50px header itself, so they bled past its rule at the top and the bottom and the row read as two different toolbars pushed together. */ body.omnidata-design-system-v1 .topbar-actions, body.omnidata-role-system .topbar-actions{display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:var(--ods-space-2)!important} body.omnidata-design-system-v1 .topbar-actions > *, body.omnidata-role-system .topbar-actions > *{min-height:36px!important;height:36px!important;flex:0 0 auto!important;align-self:center!important} body.omnidata-design-system-v1 .topbar-actions > :is(button,a,.button), body.omnidata-role-system .topbar-actions > :is(button,a,.button){min-height:36px!important;height:36px!important} body.omnidata-design-system-v1 .topbar-actions > div > button, body.omnidata-role-system .topbar-actions > div > button{min-height:36px!important;height:36px!important} body.omnidata-design-system-v1 .topbar-actions :is(.topbar-organisation,.topbar-user), body.omnidata-role-system .topbar-actions :is(.topbar-organisation,.topbar-user){display:flex!important;align-items:center!important;gap:var(--ods-space-2)!important;padding:0 var(--ods-space-2)!important;overflow:hidden!important} /* The user chip carries a name over a role. At 36px the two lines have to be tight, and neither may push the chip open. */ body.omnidata-design-system-v1 .topbar-actions :is(.topbar-organisation,.topbar-user) .user-copy, body.omnidata-role-system .topbar-actions :is(.topbar-organisation,.topbar-user) .user-copy{display:grid!important;min-width:0!important;gap:0!important} body.omnidata-design-system-v1 .topbar-actions .user-copy strong, body.omnidata-role-system .topbar-actions .user-copy strong{font-size:11px!important;line-height:1.25!important} body.omnidata-design-system-v1 .topbar-actions .user-copy small, body.omnidata-role-system .topbar-actions .user-copy small{font-size:11px!important;line-height:1.25!important} /* ------------------------------------------------------------------ The shell below 700px ------------------------------------------------------------------ The base stylesheet turns the shell into a block and the sidebar into a horizontal scrolling strip at phone width. Nine later layers then pin the sidebar back to a vertical column with a fixed width, so what actually rendered was a 550px-tall rail sitting in a full-width block with an empty grey rectangle beside it, and the workspace pushed below all of it. The two-column rail already works between 700 and 980; it works at 360 too, and it is the layout this product is actually built for. */ @media (max-width:700px){ body.omnidata-design-system-v1 .shell, body.omnidata-role-system .shell, body.omnidata-design-system-v1 .shell.sidebar-collapsed, body.omnidata-role-system .shell.sidebar-collapsed{display:grid!important;grid-template-columns:60px minmax(0,1fr)!important;align-items:stretch!important} body.omnidata-v14.omnidata-design-system-v1 .sidebar, body.omnidata-design-system-v1 .sidebar, body.omnidata-role-system .sidebar{position:sticky!important;top:0!important;height:100vh!important;max-height:100vh!important;min-height:100vh!important;flex-direction:column!important;align-items:stretch!important;padding:0!important;border-right:1px solid rgba(0,0,0,.15)!important;border-bottom:0!important} body.omnidata-design-system-v1 .sidebar .nav, body.omnidata-role-system .sidebar .nav{flex:1 1 auto!important;flex-direction:column!important;overflow-x:hidden!important;overflow-y:auto!important} body.omnidata-design-system-v1 .sidebar .nav-item, body.omnidata-role-system .sidebar .nav-item{width:100%!important;flex:0 0 auto!important;justify-content:center!important;padding-inline:0!important} body.omnidata-design-system-v1 .sidebar-footer, body.omnidata-role-system .sidebar-footer{display:flex!important} /* The system footer is fixed, and in the block layout it sat on top of the page's last rows. */ /* The system footer is a child of the shell grid. Left static it dropped into the 60px rail column and squeezed its three fields into a stack of single letters; left fixed it sat on top of the page's last rows. It spans the grid instead. */ body.omnidata-v14.omnidata-design-system-v1 .od-v7-system-footer, body.omnidata-design-system-v1 .od-v7-system-footer, body.omnidata-role-system .od-v7-system-footer{position:static!important;left:auto!important;width:auto!important;grid-column:1/-1!important} /* At 390 the header could not hold the path and six controls on one row: the action cluster is sized to its content, so the breadcrumb's 1fr collapsed to nine pixels and the path rendered as an empty white sliver with its own text hidden outside the box. Below 700 each part gets a row of its own. */ body.omnidata-v14.omnidata-design-system-v1 .topbar, body.omnidata-design-system-v1 .topbar, body.omnidata-role-system .topbar{grid-template-columns:minmax(0,1fr)!important} body.omnidata-design-system-v1 .topbar .breadcrumb, body.omnidata-role-system .topbar .breadcrumb{grid-area:1/1!important;min-width:0!important} body.omnidata-design-system-v1 .topbar-actions, body.omnidata-role-system .topbar-actions{grid-area:2/1!important;justify-content:flex-start!important;overflow-x:auto!important} body.omnidata-design-system-v1 .topbar .global-search, body.omnidata-role-system .topbar .global-search{grid-area:3/1!important} } /* An icon must not be cropped to fit its rail. */ body.omnidata-design-system-v1 .sidebar .nav-item .icon, body.omnidata-role-system .sidebar .nav-item .icon{flex:0 0 18px!important;width:18px!important;height:18px!important;overflow:visible!important} body.omnidata-design-system-v1 .sidebar .nav-item .icon svg, body.omnidata-role-system .sidebar .nav-item .icon svg{width:18px!important;height:18px!important;display:block!important} /* Below 980 the header's action cluster keeps its controls but drops the two text blocks; their marks still say which organisation and who is signed in, and the breadcrumb gets the room it was being starved of. */ @media (max-width:1180px){ /* Below 1180 the path cannot hold three crumbs: it needed 270px and had 171, so the page name — the one crumb that must survive — was clipped away and the header ended on a dangling separator. The group name goes instead; the sidebar shows it in full, highlighted, at every width. */ body.omnidata-design-system-v1 .topbar .breadcrumb > .breadcrumb-muted:nth-of-type(2), body.omnidata-role-system .topbar .breadcrumb > .breadcrumb-muted:nth-of-type(2), body.omnidata-design-system-v1 .topbar .breadcrumb > .breadcrumb-muted:nth-of-type(3), body.omnidata-role-system .topbar .breadcrumb > .breadcrumb-muted:nth-of-type(3){display:none!important} /* With the group gone its separator is a dangling slash, and the root button keeps the mark that says what it does without the word beside it. */ body.omnidata-design-system-v1 .topbar .breadcrumb > .breadcrumb-muted + .breadcrumb-divider, body.omnidata-role-system .topbar .breadcrumb > .breadcrumb-muted + .breadcrumb-divider{display:none!important} body.omnidata-design-system-v1 .topbar .breadcrumb-root > :not(.icon), body.omnidata-role-system .topbar .breadcrumb-root > :not(.icon){display:none!important} body.omnidata-design-system-v1 .topbar .breadcrumb-root, body.omnidata-role-system .topbar .breadcrumb-root{padding:0 var(--ods-space-2)!important} body.omnidata-design-system-v1 .topbar .breadcrumb > strong, body.omnidata-role-system .topbar .breadcrumb > strong{min-width:5rem!important} body.omnidata-design-system-v1 .topbar-actions :is(.topbar-organisation,.topbar-user) :is(.user-copy,span:not(.icon):not([class*="avatar"])), body.omnidata-role-system .topbar-actions :is(.topbar-organisation,.topbar-user) :is(.user-copy,span:not(.icon):not([class*="avatar"])){display:none!important} } /* The look rack, again, and properly this time. The previous override lost on specificity to the role system's "layout" rule, so at 1920 a single look was still one 1640px card with a 600px picture and a thousand pixels of white paper beside it. Matching on the part as well as the class outranks it. */ body.omnidata-design-system-v1 :is([data-ods-part="layout"],[data-od14-unified-part="layout"]).od-look-grid, body.omnidata-role-system :is([data-ods-part="layout"],[data-od14-unified-part="layout"]).od-look-grid, body.omnidata-design-system-v1 .od-look-grid, body.omnidata-role-system .od-look-grid{grid-template-columns:repeat(auto-fill,minmax(240px,300px))!important;justify-content:start!important} /* The system footer is fixed, so the page's last rows ran underneath it. The workspace reserves its height instead of pretending it is not there. */ body.omnidata-design-system-v1 .workspace-content, body.omnidata-role-system .workspace-content{padding-bottom:48px!important} /* The brand block and the header are two halves of one band, so they are the same height. The block stood 58px against the header's 56, which put its dark ground two pixels below the header's rule — the notch that appears to cut the corner off the mark. */ body.omnidata-design-system-v1 .topbar, body.omnidata-role-system .topbar{min-height:56px!important} body.omnidata-design-system-v1 .sidebar .brand, body.omnidata-role-system .sidebar .brand{height:56px!important;min-height:56px!important;box-sizing:border-box!important} body.omnidata-v14.omnidata-design-system-v1 .sidebar .brand, body.omnidata-v14.omnidata-role-system .sidebar .brand{flex:0 0 56px!important;height:56px!important;min-height:56px!important} /* Freeze Line: видимость, порядок и закрепление колонок реестра. Закрепление — не украшение. Реестр моделей несёт двадцать колонок, и при горизонтальной прокрутке до «Технолога» первая колонка уезжает: значения видны, а чьи они — нет. Смещения перечислены здесь, а не считаются скриптом, потому что дизайн-система запрещает динамическую стилизацию из рантайма. Цена этого решения названа прямо: закреплённая колонка получает **предсказуемую ширину**, иначе смещение следующей нечем вычислить. Для колонок идентичности — номер, изображение, артикул — это скорее плюс: они перестают прыгать от длины содержимого. Закрепить можно не больше шести: дальше не остаётся места прокручиваемой части, и сам приём теряет смысл. */ body.omnidata-design-system-v1 .od-table th.od-frozen-column, body.omnidata-design-system-v1 .od-table td.od-frozen-column, body.omnidata-role-system .od-table th.od-frozen-column, body.omnidata-role-system .od-table td.od-frozen-column{position:sticky!important;z-index:2!important;background:var(--ods-color-surface,#fff)!important;width:150px!important;min-width:150px!important;max-width:150px!important} body.omnidata-design-system-v1 .od-table thead th.od-frozen-column, body.omnidata-role-system .od-table thead th.od-frozen-column{z-index:3!important} /* Номер строки дописывает слой достоверности, он всегда первый и узкий. Когда что-то закреплено, он закрепляется вместе с ними: уехавший номер делает закрепление бессмысленным. */ body.omnidata-design-system-v1 .od-table.od-table-frozen .od-number-cell, body.omnidata-role-system .od-table.od-table-frozen .od-number-cell{position:sticky!important;left:0!important;z-index:3!important;background:var(--ods-color-surface,#fff)!important;width:36px!important;min-width:36px!important;max-width:36px!important} /* Смещения: номер 36px, каждая следующая закреплённая — 150px. */ body.omnidata-design-system-v1 .od-table tr > .od-frozen-column:nth-child(2), body.omnidata-role-system .od-table tr > .od-frozen-column:nth-child(2){left:36px!important} body.omnidata-design-system-v1 .od-table tr > .od-frozen-column:nth-child(3), body.omnidata-role-system .od-table tr > .od-frozen-column:nth-child(3){left:186px!important} body.omnidata-design-system-v1 .od-table tr > .od-frozen-column:nth-child(4), body.omnidata-role-system .od-table tr > .od-frozen-column:nth-child(4){left:336px!important} body.omnidata-design-system-v1 .od-table tr > .od-frozen-column:nth-child(5), body.omnidata-role-system .od-table tr > .od-frozen-column:nth-child(5){left:486px!important} body.omnidata-design-system-v1 .od-table tr > .od-frozen-column:nth-child(6), body.omnidata-role-system .od-table tr > .od-frozen-column:nth-child(6){left:636px!important} body.omnidata-design-system-v1 .od-table tr > .od-frozen-column:nth-child(7), body.omnidata-role-system .od-table tr > .od-frozen-column:nth-child(7){left:786px!important} body.omnidata-design-system-v1 .od-table .od-frozen-edge, body.omnidata-role-system .od-table .od-frozen-edge{box-shadow:1px 0 0 0 var(--ods-color-border)!important} body.omnidata-design-system-v1 .od-table-row.selected td.od-frozen-column, body.omnidata-role-system .od-table-row.selected td.od-frozen-column{background:var(--ods-color-surface-selected,#fff4ee)!important} body.omnidata-design-system-v1 .od-column-row, body.omnidata-role-system .od-column-row{display:flex!important;align-items:center!important;gap:8px!important;min-height:28px!important;padding:2px 0!important;font-size:12px!important} body.omnidata-design-system-v1 .od-column-row .od-filter-option-label, body.omnidata-role-system .od-column-row .od-filter-option-label{flex:1 1 auto!important} body.omnidata-design-system-v1 .od-column-row.od-column-frozen .od-filter-option-label, body.omnidata-role-system .od-column-row.od-column-frozen .od-filter-option-label{font-weight:600!important} body.omnidata-design-system-v1 .od-column-move, body.omnidata-role-system .od-column-move{width:22px!important;height:22px!important;padding:0!important;border:1px solid var(--ods-color-border)!important;border-radius:4px!important;background:transparent!important;font-size:11px!important;line-height:1!important;cursor:pointer!important} body.omnidata-design-system-v1 .od-column-move:disabled, body.omnidata-role-system .od-column-move:disabled{opacity:.35!important;cursor:default!important} /* Сама линия. В покое это тонкая разделительная полоса с неброской подписью; активная — сплошная линия акцентом, потому что именно она отвечает на вопрос «докуда закреплено». */ body.omnidata-design-system-v1 .od-freeze-line, body.omnidata-role-system .od-freeze-line{display:flex!important;align-items:center!important;gap:8px!important;margin:1px 0!important} body.omnidata-design-system-v1 .od-freeze-line::after, body.omnidata-role-system .od-freeze-line::after{content:''!important;flex:1 1 auto!important;height:1px!important;background:var(--ods-color-border)!important} body.omnidata-design-system-v1 .od-freeze-line.active::after, body.omnidata-role-system .od-freeze-line.active::after{height:2px!important;background:var(--ods-color-accent,#ff5b22)!important} body.omnidata-design-system-v1 .od-freeze-line-handle, body.omnidata-role-system .od-freeze-line-handle{padding:0!important;border:0!important;background:transparent!important;color:var(--ods-color-text-muted,#656c79)!important;font-size:11px!important;text-transform:uppercase!important;letter-spacing:.04em!important;cursor:pointer!important;opacity:0!important} body.omnidata-design-system-v1 .od-freeze-line:hover .od-freeze-line-handle, body.omnidata-design-system-v1 .od-freeze-line-handle:focus-visible, body.omnidata-design-system-v1 .od-freeze-line.active .od-freeze-line-handle, body.omnidata-role-system .od-freeze-line:hover .od-freeze-line-handle, body.omnidata-role-system .od-freeze-line-handle:focus-visible, body.omnidata-role-system .od-freeze-line.active .od-freeze-line-handle{opacity:1!important} body.omnidata-design-system-v1 .od-freeze-line.active .od-freeze-line-handle, body.omnidata-role-system .od-freeze-line.active .od-freeze-line-handle{color:var(--ods-color-accent,#ff5b22)!important} /* Тело панели Freeze Line раскладывается сверху вниз. Панель несёт роль filterbar, чья раскладка — строка, и без этого двадцать колонок уходили за её правый край. */ /* Панель Freeze Line не переносит содержимое в соседнюю колонку. Общее правило filterbar (строка 549) задаёт перенос селекторами по атрибутам, и при равном !important побеждает специфичность — поэтому здесь те же атрибуты плюс класс панели. Высота ограничена окном, иначе телу нечего прокручивать и длинный список просто переносится. */ body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]).od-column-panel, body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]).od-column-panel{flex-wrap:nowrap!important;flex-direction:column!important;align-items:stretch!important;max-height:min(80vh,100%)!important} /* Тело прокручивается, а не переносится. Панель — колоночный флекс с переносом, и длинный список колонок не помещался по высоте: он переносился в соседнюю колонку и утаскивал за собой подвал, так что и список, и кнопки уезжали за правый край. */ body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-column-panel .od-filter-panel-body, body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-column-panel .od-filter-panel-body{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important} body.omnidata-design-system-v1 .od-column-panel .od-column-row, body.omnidata-role-system .od-column-panel .od-column-row{width:100%!important} /* Навигатор по иерархии раздела. Панель раскладывается так же, как Freeze Line: колонкой, с прокручиваемым телом — список веток длиннее списка колонок, и уехать он может ещё дальше. */ body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-hierarchy-panel, body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-hierarchy-panel{width:min(300px,86%)!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]).od-hierarchy-panel, body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]):is([data-ods-part="filterbar"],[data-od14-unified-part="filterbar"]).od-hierarchy-panel{flex-wrap:nowrap!important;flex-direction:column!important;align-items:stretch!important;max-height:min(80vh,100%)!important} body.omnidata-design-system-v1 :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-hierarchy-panel .od-filter-panel-body, body.omnidata-role-system :is([data-ods-role="filterbar"],[data-od14-unified-role="filterbar"]).od-hierarchy-panel .od-filter-panel-body{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important} body.omnidata-design-system-v1 .od-hierarchy-panel .od-column-row, body.omnidata-role-system .od-hierarchy-panel .od-column-row{width:100%!important} body.omnidata-design-system-v1 .od-hierarchy-panel .od-filter-group-title, body.omnidata-role-system .od-hierarchy-panel .od-filter-group-title{margin:10px 0 4px!important;font-size:11px!important;text-transform:uppercase!important;letter-spacing:.06em!important;color:var(--ods-color-text-muted,#656c79)!important} /* Порядковый номер уровня: иерархия — это последовательность, и её шаг виден числом, а не только положением строки, которое при прокрутке теряется. */ body.omnidata-design-system-v1 .od-hierarchy-level-mark, body.omnidata-role-system .od-hierarchy-level-mark{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:16px!important;height:16px!important;border-radius:999px!important;background:var(--ods-color-accent,#ff5b22)!important;color:#fff!important;font-size:11px!important;font-weight:700!important} /* Узел дерева. Отступ говорит про глубину, вес — про выбранную ветвь. */ body.omnidata-design-system-v1 .od-hierarchy-node, body.omnidata-role-system .od-hierarchy-node{display:flex!important;align-items:center!important;gap:8px!important;width:100%!important;min-height:26px!important;padding:2px 6px!important;border:0!important;border-radius:4px!important;background:transparent!important;color:inherit!important;font-size:12px!important;text-align:left!important;cursor:pointer!important} body.omnidata-design-system-v1 .od-hierarchy-node .od-filter-option-label, body.omnidata-role-system .od-hierarchy-node .od-filter-option-label{flex:1 1 auto!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} body.omnidata-design-system-v1 .od-hierarchy-node:hover, body.omnidata-role-system .od-hierarchy-node:hover{background:var(--ods-color-surface-muted,#f5f6f8)!important} body.omnidata-design-system-v1 .od-hierarchy-node.selected, body.omnidata-role-system .od-hierarchy-node.selected{background:var(--ods-color-surface-muted,#f5f6f8)!important;color:var(--ods-color-accent,#ff5b22)!important;font-weight:600!important} body.omnidata-design-system-v1 .od-hierarchy-depth-1, body.omnidata-role-system .od-hierarchy-depth-1{padding-left:18px!important} body.omnidata-design-system-v1 .od-hierarchy-depth-2, body.omnidata-role-system .od-hierarchy-depth-2{padding-left:30px!important} body.omnidata-design-system-v1 .od-hierarchy-depth-3, body.omnidata-role-system .od-hierarchy-depth-3{padding-left:42px!important} body.omnidata-design-system-v1 .od-hierarchy-depth-4, body.omnidata-role-system .od-hierarchy-depth-4{padding-left:54px!important} /* Счётчик: он меняется вместе с выбранной ветвью, поэтому стоит под деревом, а не в шапке. */ body.omnidata-design-system-v1 .od-hierarchy-total, body.omnidata-role-system .od-hierarchy-total{margin:10px 0 0!important;padding-top:8px!important;border-top:1px solid var(--ods-color-border)!important;font-size:11px!important;font-weight:600!important;color:var(--ods-color-text-muted,#656c79)!important} /* Кнопки порядка (↑ ↓ ×) в панелях Freeze Line и «Структура иерархии». Заявленные 22×22 не доезжали: ODS задаёт кнопке `min-height: var(--ods-control-height)` и `width:auto` селекторами по ролевым атрибутам, а они специфичнее одного класса — стрелка схлопывалась до семи пикселей ширины при высоте в тридцать четыре, а «×», опознанный как icon-button, оставался на полторы высоты выше соседей. Правило повторяет форму конкурирующего селектора, поэтому размер задан здесь, а не разнесён между двумя слоями. */ body.omnidata-v14 [data-od14-component="filterbar"] :is([data-od14-component="button"],[data-od14-component="icon-button"]).od-column-move, body.omnidata-role-system [data-ods-role="filterbar"] [data-ods-role="button"]:is([data-ods-part="button"],[data-ods-part="icon-button"]).od-column-move, body.omnidata-design-system-v1 [data-ods-role="filterbar"] [data-ods-role="button"]:is([data-ods-part="button"],[data-ods-part="icon-button"]).od-column-move{flex:0 0 22px!important;width:22px!important;min-width:22px!important;height:22px!important;min-height:22px!important;padding:0!important;line-height:1!important} /* Отказ по правам — состояние раздела, а не сбой. Красная плашка «не удалось загрузить» предлагает повторить, а повторять нечего: роль та же. Нейтральный тон и замок говорят, что раздел существует и закрыт, — это другая новость. */ body.omnidata-design-system-v1 .notice.denied, body.omnidata-role-system .notice.denied{display:flex!important;align-items:center!important;gap:8px!important;border:1px solid var(--ods-color-border)!important;border-left:3px solid var(--ods-color-text-muted,#656c79)!important;background:var(--ods-color-surface-muted,#f5f6f8)!important;color:var(--ods-color-text,#1f2430)!important} body.omnidata-design-system-v1 .notice.denied::before, body.omnidata-role-system .notice.denied::before{content:'\1F512'!important;font-size:13px!important;opacity:.7!important} /* «В разработке»: свёрнутая группа запланированных разделов внизу меню. Заголовок — кнопка, а не подпись, поэтому ему возвращают то, что браузер отнимает у кнопки: без рамки и фона, на всю ширину, с указателем, и стрелка показывает, раскрыта ли группа. */ body.omnidata-v13 .nav-group-toggle { display: flex !important; align-items: center; justify-content: space-between; width: calc(100% - 20px); background: none; border: 0; padding: 0; text-align: left; cursor: pointer; font-family: inherit; } .nav-group-toggle::after { content: '\25B8'; font-size:11px; } .nav-group-toggle[aria-expanded="true"]::after { content: '\25BE'; } .nav-group-toggle:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; } /* Заглушка вместо картинки, которую страница не вправе загружать (внешний адрес, CSP). */ .image-placeholder { display: inline-block; padding: 8px 10px; border: 1px dashed currentColor; border-radius: 6px; font-size: 12px; opacity: .7; } /* Подписи и вёрстка: структурные атрибуты, мини-таблицы, пустая панель команд. */ /* Структурное значение атрибута категории: строки «параметр — значение». */ body.omnidata-role-system .od-attribute-part{display:flex!important;flex-wrap:wrap!important;gap:2px 6px!important} body.omnidata-role-system .od-attribute-part-label{color:var(--ods-color-muted)!important} body.omnidata-role-system .od-attribute-part-label::after{content:":"} /* Слово в узкой колонке мини-таблицы не рвётся посреди: «опублико/вано». */ body.omnidata-role-system .workspace-content table.od-mini-table td{overflow-wrap:break-word!important} /* В узком инспекторе таблица не должна уезжать в горизонтальную прокрутку из-за полей ячеек. */ body.omnidata-role-system .workspace-content .od-inspector table.od-mini-table :is(th,td){padding-inline:6px!important} /* Пустая панель команд под KPI «Рабочего стола»: правило скрытия проигрывало по специфичности. */ body.omnidata-role-system .od-commandbar.od14-empty-bar[data-ods-role="filterbar"][data-ods-part="filterbar"]:not(.topbar-actions){display:none!important} /* Syntha monitor/tablet review modes — responsive-20261007-1 */ /* * Syntha monitor/tablet review modes. * Production remains responsive by viewport. ?viewport=monitor/tablet lets QA force the * corresponding layout on a MacBook without changing canonical application behavior. */ html[data-viewport-mode="monitor"] { --syntha-review-width: 100%; } html[data-viewport-mode="tablet"] { --syntha-review-width: min(1024px, 100vw); background: #e9ebef; } html[data-viewport-mode="tablet"] body { width: var(--syntha-review-width); min-width: 0; margin-inline: auto; box-shadow: 0 0 0 1px rgba(25, 32, 45, .08), 0 24px 70px rgba(25, 32, 45, .12); } /* Monitor: use the information density that a large display can actually support. */ html[data-viewport-mode="monitor"] body.omnidata-role-system .shell:not(.sidebar-collapsed) { grid-template-columns: 214px minmax(0, 1fr) !important; } html[data-viewport-mode="monitor"] body.omnidata-role-system .workspace-content { padding-inline: clamp(18px, 2.1vw, 32px) !important; } html[data-viewport-mode="monitor"] body.omnidata-role-system :is(.toolbar,.od-inline-actions,.entity-actions) > :is(.button,[data-ods-role="button"]) { width: auto !important; max-width: max-content !important; flex: 0 0 auto !important; } /* Tablet: keep navigation on the left, keep controls touchable, and avoid desktop-wide buttons. */ html[data-viewport-mode="tablet"] body.omnidata-role-system .shell:not(.sidebar-collapsed) { display: grid !important; grid-template-columns: 176px minmax(0, 1fr) !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system .shell.sidebar-collapsed { display: grid !important; grid-template-columns: 62px minmax(0, 1fr) !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system .sidebar { position: sticky !important; top: 0 !important; width: auto !important; height: 100vh !important; min-height: 100vh !important; flex-direction: column !important; align-items: stretch !important; border-right: 1px solid rgba(7,14,25,.35) !important; border-bottom: 0 !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system .nav { flex-direction: column !important; overflow-x: hidden !important; overflow-y: auto !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system .shell:not(.sidebar-collapsed) :is(.brand-copy,.nav-label,.sidebar .button-label) { display: initial !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system .shell.sidebar-collapsed :is(.brand-copy,.nav-group-label,.nav-label,.sidebar .button-label) { display: none !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system .topbar { grid-template-columns: minmax(0, 1fr) minmax(180px, 280px) max-content !important; gap: 8px !important; padding-inline: 12px !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system .topbar-organisation, html[data-viewport-mode="tablet"] body.omnidata-role-system .topbar-user .user-copy { display: none !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system .workspace-content { padding: 14px 14px 56px !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system :is(.kpis,[data-ods-part="metrics"],[data-od14-unified-part="metrics"]) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system :is(.two,.three,[data-ods-part="master-detail"],[data-od14-unified-part="master-detail"]) { grid-template-columns: minmax(0, 1fr) !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system :is(.toolbar,.od-inline-actions,.entity-actions) { align-items: center !important; justify-content: flex-start !important; flex-wrap: wrap !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system :is(.toolbar,.od-inline-actions,.entity-actions) > :is(.button,[data-ods-role="button"]) { width: auto !important; min-width: 44px !important; min-height: 38px !important; max-width: min(100%, 280px) !important; flex: 0 0 auto !important; } html[data-viewport-mode="tablet"] body.omnidata-role-system :is(.od-table-wrap,[data-ods-part="table-wrap"],[data-od14-unified-part="table-wrap"]) { max-width: 100% !important; overflow-x: auto !important; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; } html[data-viewport-mode="tablet"] body.omnidata-role-system dialog { width: min(720px, calc(100vw - 28px)) !important; } /* Real tablets get the same ergonomics even without a preview query parameter. */ @media (min-width: 701px) and (max-width: 1080px) { html:not([data-viewport-mode="monitor"]) body.omnidata-role-system :is(.toolbar,.od-inline-actions,.entity-actions) > :is(.button,[data-ods-role="button"]) { width: auto !important; min-width: 44px !important; min-height: 38px !important; max-width: min(100%, 280px) !important; flex: 0 0 auto !important; } html:not([data-viewport-mode="monitor"]) body.omnidata-role-system .workspace-content { padding-inline: 14px !important; } } /* Localhost sign-in convenience. Credentials are delivered only by the loopback-only helper. */ body.omnidata-role-system .local-demo-login, body.omnidata-design-system-v1 .local-demo-login{ display:grid!important; gap:10px!important; margin-top:14px!important; padding:12px!important; border:1px solid var(--ods-color-border)!important; border-radius:6px!important; background:var(--ods-color-surface-soft)!important; } body.omnidata-role-system .local-demo-title, body.omnidata-design-system-v1 .local-demo-title{ color:var(--ods-color-text)!important; font-size:12px!important; font-weight:700!important; } body.omnidata-role-system .local-demo-values, body.omnidata-design-system-v1 .local-demo-values{display:grid!important;gap:6px!important} body.omnidata-role-system .local-demo-row, body.omnidata-design-system-v1 .local-demo-row{ display:grid!important; grid-template-columns:72px minmax(0,1fr)!important; align-items:center!important; gap:8px!important; } body.omnidata-role-system .local-demo-label, body.omnidata-design-system-v1 .local-demo-label{font-size:11px!important;color:var(--ods-color-muted)!important} body.omnidata-role-system .local-demo-value, body.omnidata-design-system-v1 .local-demo-value{ display:block!important; overflow:hidden!important; text-overflow:ellipsis!important; white-space:nowrap!important; font-size:11px!important; } body.omnidata-role-system .local-demo-submit, body.omnidata-design-system-v1 .local-demo-submit{width:100%!important;min-height:40px!important} /* Explicit phone QA mode: one responsive product, phone geometry forced for review on desktop. */ html[data-viewport-mode="phone"]{ --syntha-review-width:min(430px,100vw); background:#e9ebef; } html[data-viewport-mode="phone"] body{ width:var(--syntha-review-width); min-width:0; margin-inline:auto; box-shadow:0 0 0 1px rgba(25,32,45,.08),0 24px 70px rgba(25,32,45,.12); } html[data-viewport-mode="phone"] body.omnidata-role-system .shell, html[data-viewport-mode="phone"] body.omnidata-role-system .shell.sidebar-collapsed{ display:block!important; } html[data-viewport-mode="phone"] body.omnidata-role-system .sidebar{ position:sticky!important; top:0!important; z-index:30!important; width:100%!important; min-height:0!important; height:auto!important; display:grid!important; grid-template-columns:auto minmax(0,1fr) auto!important; align-items:center!important; border-right:0!important; border-bottom:1px solid rgba(7,14,25,.35)!important; } html[data-viewport-mode="phone"] body.omnidata-role-system .sidebar>.brand{ min-height:48px!important; border-bottom:0!important; padding:8px 10px!important; } html[data-viewport-mode="phone"] body.omnidata-role-system .sidebar .brand-copy{display:none!important} html[data-viewport-mode="phone"] body.omnidata-role-system .nav{ display:flex!important; flex-direction:row!important; gap:4px!important; overflow-x:auto!important; overflow-y:hidden!important; padding:6px!important; scrollbar-width:none; } html[data-viewport-mode="phone"] body.omnidata-role-system .nav::-webkit-scrollbar{display:none} html[data-viewport-mode="phone"] body.omnidata-role-system .nav-group-label{display:none!important} html[data-viewport-mode="phone"] body.omnidata-role-system .nav-item{ flex:0 0 auto!important; min-width:44px!important; min-height:40px!important; padding:7px 9px!important; } html[data-viewport-mode="phone"] body.omnidata-role-system .nav-label{display:none!important} html[data-viewport-mode="phone"] body.omnidata-role-system .sidebar-footer{ display:flex!important; flex-direction:row!important; gap:4px!important; padding:6px!important; } html[data-viewport-mode="phone"] body.omnidata-role-system .sidebar-footer .button-label{display:none!important} html[data-viewport-mode="phone"] body.omnidata-role-system .sidebar-action{ width:40px!important; min-width:40px!important; height:40px!important; min-height:40px!important; padding:0!important; } html[data-viewport-mode="phone"] body.omnidata-role-system .topbar{ grid-template-columns:minmax(0,1fr) auto!important; min-height:48px!important; gap:6px!important; padding-inline:10px!important; } html[data-viewport-mode="phone"] body.omnidata-role-system .global-search, html[data-viewport-mode="phone"] body.omnidata-role-system .topbar-organisation, html[data-viewport-mode="phone"] body.omnidata-role-system .topbar-user .user-copy{display:none!important} html[data-viewport-mode="phone"] body.omnidata-role-system .page-header{padding:14px 10px 10px!important} html[data-viewport-mode="phone"] body.omnidata-role-system .workspace-content{padding:10px 10px 48px!important} html[data-viewport-mode="phone"] body.omnidata-role-system :is(.kpis,[data-ods-part="metrics"],[data-od14-unified-part="metrics"],.two,.three,[data-ods-part="master-detail"],[data-od14-unified-part="master-detail"]){ grid-template-columns:minmax(0,1fr)!important; } html[data-viewport-mode="phone"] body.omnidata-role-system :is(.toolbar,.od-inline-actions,.entity-actions){ display:flex!important; flex-wrap:wrap!important; gap:8px!important; } html[data-viewport-mode="phone"] body.omnidata-role-system :is(.toolbar,.od-inline-actions,.entity-actions) > :is(.button,[data-ods-role="button"]){ width:auto!important; min-width:44px!important; min-height:40px!important; max-width:100%!important; flex:0 0 auto!important; } html[data-viewport-mode="phone"] body.omnidata-role-system :is(.od-table-wrap,[data-ods-part="table-wrap"],[data-od14-unified-part="table-wrap"]){ max-width:100%!important; overflow-x:auto!important; -webkit-overflow-scrolling:touch; } html[data-viewport-mode="phone"] body.omnidata-role-system dialog{ width:calc(100vw - 20px)!important; max-width:410px!important; max-height:calc(100vh - 20px)!important; margin:auto!important; } /* Connected workspace hub — first-party ODS semantic components. */ /* Syntha connected workspace hub — ODS tokens only, no parallel design system. */ body.omnidata-v14 .syntha-hub{display:grid;gap:23px;min-width:0;padding-bottom:30px} body.omnidata-v14 .syntha-hub-hero{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.7fr);gap:24px;align-items:stretch;border:1px solid var(--ods-color-border,#d9dee3);border-radius:12px;background:var(--ods-color-surface,#fff);box-shadow:var(--ods-shadow-surface,0 1px 2px #22283108);overflow:hidden} body.omnidata-v14 .syntha-hub-hero-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:35px 36px 32px;gap:15px;background:linear-gradient(134deg,#fdfdfd 0%,#fff 62%,#f6f2ef 100%);position:relative} body.omnidata-v14 .syntha-hub-hero-copy::before{content:"";position:absolute;top:0;left:36px;width:62px;height:3px;background:var(--ods-color-accent,#ff5b22)} body.omnidata-v14 .syntha-hub-eyebrow,body.omnidata-v14 .syntha-hub-overline{font-size:11px!important;font-weight:800;letter-spacing:.13em;line-height:1.3;color:var(--ods-color-accent,#ff5b22)!important} body.omnidata-v14 .syntha-hub-headline{font-size:clamp(24px,2.8vw,37px)!important;line-height:1.13!important;max-width:600px;color:var(--ods-color-text,#222831)!important;letter-spacing:-.035em!important;font-weight:700!important} body.omnidata-v14 .syntha-hub-intro{max-width:590px!important;font-size:14px!important;line-height:1.64!important;color:var(--ods-color-text-soft,#56606a)!important} body.omnidata-v14 .syntha-hub-hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:5px} body.omnidata-v14 .syntha-hub-primary,body.omnidata-v14 .syntha-hub-secondary{min-height:42px!important;display:inline-flex;justify-content:center;align-items:center;padding:9px 16px!important;border-radius:7px!important;border:1px solid var(--ods-color-accent,#ff5b22)!important;font-size:12px!important;font-weight:700!important;line-height:1.3!important;white-space:normal} body.omnidata-v14 .syntha-hub-primary{background:var(--ods-color-accent,#ff5b22)!important;color:white!important} body.omnidata-v14 .syntha-hub-primary:hover{background:var(--ods-color-accent-hover,#e84b15)!important} body.omnidata-v14 .syntha-hub-secondary{background:#fff!important;color:var(--ods-color-accent,#ff5b22)!important} body.omnidata-v14 .syntha-hub-secondary:hover{background:var(--ods-color-surface-hover,#fff8f4)!important} body.omnidata-v14 .syntha-hub-metrics{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));padding:20px;background:var(--ods-color-surface-soft,#f7f8f9)} body.omnidata-v14 .syntha-hub-metric{display:flex;flex-direction:column;justify-content:center;gap:3px;min-width:0;padding:12px 14px;border-bottom:1px solid var(--ods-color-border,#d9dee3)} body.omnidata-v14 .syntha-hub-metric:last-child{border-bottom:0} body.omnidata-v14 .syntha-hub-metric-label{font-size:11px;color:var(--ods-color-text-soft,#56606a)} body.omnidata-v14 .syntha-hub-metric-value{font-size:27px;line-height:1.1;font-weight:700;color:var(--ods-color-text,#222831);font-variant-numeric:tabular-nums} body.omnidata-v14 .syntha-hub-metric-hint{font-size:11px;color:var(--ods-color-muted,#69727d)} body.omnidata-v14 .syntha-hub-journey{display:grid;gap:13px;border:1px solid var(--ods-color-border,#d9dee3);background:#fff;padding:22px 24px;border-radius:10px;min-width:0} body.omnidata-v14 .syntha-hub-subtitle{font-size:18px!important;font-weight:700!important;line-height:1.3!important;color:var(--ods-color-text,#222831)!important} body.omnidata-v14 .syntha-hub-journey-rail{display:flex;gap:10px;overflow-x:auto;min-width:0;padding:5px 1px 12px;scroll-snap-type:x proximity} body.omnidata-v14 .syntha-hub-journey-stop{flex:0 0 auto;display:flex;align-items:center;gap:10px;min-height:52px;max-width:210px;padding:10px 13px!important;border:1px solid var(--ods-color-border,#d9dee3)!important;border-radius:8px!important;background:var(--ods-color-surface,#fff)!important;text-align:left;color:var(--ods-color-text,#222831)!important;scroll-snap-align:start} body.omnidata-v14 .syntha-hub-journey-stop:hover{border-color:var(--ods-color-accent,#ff5b22)!important;background:var(--ods-color-surface-hover,#fff8f4)!important} body.omnidata-v14 .syntha-hub-journey-index{font-size:11px;font-weight:800;color:var(--ods-color-accent,#ff5b22);font-variant-numeric:tabular-nums} body.omnidata-v14 .syntha-hub-journey-label{font-weight:600;font-size:11px;line-height:1.35;white-space:normal} body.omnidata-v14 .syntha-hub-directory{display:grid;gap:17px} body.omnidata-v14 .syntha-hub-directory-top{display:flex;align-items:flex-end;justify-content:space-between;gap:20px} body.omnidata-v14 .syntha-hub-directory-top>div{display:grid;gap:5px} body.omnidata-v14 .syntha-hub-search{width:min(320px,100%);min-width:0;height:43px!important;border:1px solid var(--ods-color-border-strong,#c7cdd3)!important;border-radius:7px!important;padding:9px 14px!important;background:#fff!important;color:var(--ods-color-text,#222831)!important;font-size:12px!important} body.omnidata-v14 .syntha-hub-search:focus{outline:2px solid var(--ods-color-accent,#ff5b22)!important;outline-offset:2px} body.omnidata-v14 .syntha-hub-sections{display:grid;gap:22px} body.omnidata-v14 .syntha-hub-group{display:grid;gap:11px} body.omnidata-v14 .syntha-hub-group-heading{font-size:11px!important;font-weight:800!important;letter-spacing:.075em!important;text-transform:uppercase;color:var(--ods-color-text-soft,#56606a)!important} body.omnidata-v14 .syntha-hub-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;min-width:0} body.omnidata-v14 .syntha-hub-card{display:flex;flex-direction:column;align-items:stretch;gap:8px;min-width:0;min-height:151px;padding:16px 17px!important;border:1px solid var(--ods-color-border,#d9dee3)!important;border-radius:9px!important;background:#fff!important;box-shadow:var(--ods-shadow-surface,0 1px 2px #22283108)!important;text-align:left;color:var(--ods-color-text,#222831)!important;transition:border-color .15s,box-shadow .15s,transform .15s} body.omnidata-v14 .syntha-hub-card:hover{border-color:var(--ods-color-accent,#ff5b22)!important;box-shadow:0 9px 24px #22283112!important;transform:translateY(-2px)} body.omnidata-v14 .syntha-hub-card-lead{display:flex;align-items:center;justify-content:space-between;gap:10px} body.omnidata-v14 .syntha-hub-card-symbol{display:inline-flex;align-items:center;justify-content:center;width:31px;height:31px;flex:0 0 31px;border-radius:7px;background:var(--ods-color-surface-hover,#fff8f4);color:var(--ods-color-accent,#ff5b22)} body.omnidata-v14 .syntha-hub-card-symbol .icon{width:17px;height:17px} body.omnidata-v14 .syntha-hub-card-cue{color:var(--ods-color-muted,#69727d);font-size:11px} body.omnidata-v14 .syntha-hub-card-name{font-size:15px;font-weight:700;line-height:1.3;color:var(--ods-color-text,#222831)} body.omnidata-v14 .syntha-hub-card-description{font-size:11px;line-height:1.55;color:var(--ods-color-text-soft,#56606a)} body.omnidata-v14 .syntha-hub-card-tail{margin-top:auto;padding-top:7px;font-size:11px;font-weight:700;color:var(--ods-color-accent,#ff5b22)} body.omnidata-v14 .syntha-hub-no-matches{padding:25px!important;border:1px dashed var(--ods-color-border,#d9dee3);border-radius:8px;background:#fff} body.omnidata-v14 .syntha-hub-recent{display:grid;gap:15px;border-top:1px solid var(--ods-color-border,#d9dee3);padding-top:22px} body.omnidata-v14 .syntha-hub-recent>.syntha-hub-subtitle{margin:0!important} body.omnidata-v14 .syntha-hub button:focus-visible{outline:2px solid var(--ods-color-accent,#ff5b22)!important;outline-offset:2px!important} body.omnidata-v14 .syntha-hub [hidden]{display:none!important} @media(max-width:1200px){ body.omnidata-v14 .syntha-hub-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))} body.omnidata-v14 .syntha-hub-hero{grid-template-columns:minmax(0,1fr) 240px} } @media(max-width:800px){ body.omnidata-v14 .syntha-hub{gap:16px} body.omnidata-v14 .syntha-hub-hero{grid-template-columns:1fr} body.omnidata-v14 .syntha-hub-hero-copy{padding:26px 22px} body.omnidata-v14 .syntha-hub-hero-copy::before{left:22px} body.omnidata-v14 .syntha-hub-metrics{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:1fr;padding:12px} body.omnidata-v14 .syntha-hub-metric{border-bottom:0;border-right:1px solid var(--ods-color-border,#d9dee3);padding:7px 11px} body.omnidata-v14 .syntha-hub-metric:last-child{border-right:0} body.omnidata-v14 .syntha-hub-directory-top{align-items:stretch;flex-direction:column;gap:13px} body.omnidata-v14 .syntha-hub-search{width:100%} } @media(max-width:570px){ body.omnidata-v14 .syntha-hub-card-grid{grid-template-columns:1fr;gap:9px} body.omnidata-v14 .syntha-hub-card{min-height:126px} body.omnidata-v14 .syntha-hub-headline{font-size:27px!important} body.omnidata-v14 .syntha-hub-intro{font-size:12px!important} body.omnidata-v14 .syntha-hub-metric-value{font-size:21px} body.omnidata-v14 .syntha-hub-metric-label{font-size:11px} body.omnidata-v14 .syntha-hub-metric-hint{display:none} body.omnidata-v14 .syntha-hub-hero-actions>button{flex:1 1 140px} body.omnidata-v14 .syntha-hub-journey{padding:17px 13px} } @media(prefers-reduced-motion:reduce){body.omnidata-v14 .syntha-hub-card{transition:none!important}body.omnidata-v14 .syntha-hub-card:hover{transform:none}} /* ------------------------------------------------------------------ Sections drawer and loading grace (shell-responsive.js) ------------------------------------------------------------------ Up to 720px the sidebar stops being a 60px rail of unlabelled icons and becomes an off-canvas drawer: a button in the top bar opens it, the backdrop, Escape and choosing a section close it. Above 720px the button and the backdrop do not exist and the column or rail is untouched. The selectors carry three body classes so they outrank the rail rules of the 700px and 720px blocks above and in the module adapters without adding another !important arms race. */ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .nav-backdrop, body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .nav-toggle{display:none!important} /* A "Loading…" placeholder appears only if the answer takes longer than 250ms (shell-responsive.js marks it). It is in the DOM from the first frame, so assistive technology still sees it; only the paint is deferred. */ @keyframes od-loading-grace-in{from{opacity:0}to{opacity:1}} .loading-grace{opacity:0;animation:od-loading-grace-in .15s ease-out .25s forwards} @media (prefers-reduced-motion:reduce){.loading-grace{animation-duration:.01ms}} @media (max-width:720px){ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .shell, body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .shell.sidebar-collapsed{display:block!important;grid-template-columns:minmax(0,1fr)!important} html.nav-locked body{overflow:hidden} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar{position:fixed!important;top:0!important;bottom:0!important;left:0!important;z-index:1000!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;width:min(86vw,320px)!important;min-width:0!important;height:100vh!important;height:100dvh!important;min-height:0!important;max-height:none!important;padding:0!important;overflow:hidden!important;border-right:0!important;transform:translateX(-100%);visibility:hidden;transition:transform .2s ease-out,visibility 0s linear .2s} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .shell.nav-open .sidebar{transform:none;visibility:visible;box-shadow:8px 0 32px rgba(18,22,28,.35)!important;transition:transform .2s ease-out,visibility 0s} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .nav-backdrop{display:block!important;position:fixed;inset:0;z-index:999;background:rgba(18,22,28,.5);opacity:0;visibility:hidden;transition:opacity .2s ease-out,visibility 0s linear .2s} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .shell.nav-open .nav-backdrop{opacity:1;visibility:visible;transition:opacity .2s ease-out,visibility 0s} /* The drawer has room for words: labels come back, rows are 44px tall. */ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar :is(.brand-copy,.nav-label,.button-label){display:block!important;min-width:0} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .nav-group-label:not(.nav-group-toggle){display:block!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .nav-group-toggle{display:flex!important;width:100%!important;min-height:44px!important;overflow:visible!important;text-overflow:clip!important;white-space:normal!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .brand{justify-content:flex-start!important;padding-inline:16px!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .nav{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overscroll-behavior:contain} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .nav-item, body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .sidebar-action{justify-content:flex-start!important;gap:12px!important;min-height:44px!important;padding-inline:16px!important;text-align:left!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .nav-item .nav-label{white-space:normal!important;line-height:1.25!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .sidebar-footer{flex:0 0 auto!important;padding:8px 12px!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .sidebar-collapse{display:none!important} /* Top bar: menu button and path on the first row, controls on the second, search on the third. Controls wrap instead of scrolling sideways, so the profile button is never cut off. */ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar{display:grid!important;grid-template-columns:44px minmax(0,1fr)!important;gap:8px!important;align-items:center!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .nav-toggle{display:inline-flex!important;grid-area:1/1!important;align-items:center!important;justify-content:center!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;padding:0!important;border:1px solid var(--ods-color-border,#d9dee3)!important;border-radius:8px!important;background:var(--ods-color-surface,#fff)!important;color:var(--ods-color-text,#222831)!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .nav-toggle .icon{width:22px;height:22px} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .nav-toggle svg{width:22px;height:22px;display:block} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .breadcrumb{grid-area:1/2!important} /* At the workspace root the path's first step is a disabled button whose text the narrow layout hides: an empty box. */ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .breadcrumb-root[disabled], body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .breadcrumb-root[disabled]+.breadcrumb-divider{display:none!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .topbar-actions{grid-area:2/1/3/-1!important;flex-wrap:wrap!important;overflow:visible!important;gap:8px!important;justify-content:flex-start!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .global-search{grid-area:3/1/4/-1!important;min-height:44px!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar :is(.breadcrumb-root,.topbar-icon-button,.od-v7-help-button,.language-switcher button,.topbar-organisation,.topbar-user){min-width:44px!important;min-height:44px!important;box-sizing:border-box} } @media (max-width:720px) and (prefers-reduced-motion:reduce){ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar, body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .nav-backdrop{transition:none!important} } /* In a rail (the tablet column up to 820px, or a collapsed sidebar) the planned-sections toggle has no room for its label: it printed a cut-off fragment of it ("БОТ"). The text stays for assistive technology and the control shows a plain ellipsis mark instead. */ @media (min-width:721px) and (max-width:820px){ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .nav-group-toggle{font-size:0!important;justify-content:center!important;width:100%!important;min-height:44px!important;padding:0!important;background:transparent!important;border:0!important;color:#e7e9ec!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .sidebar .nav-group-toggle::after{content:"\22EF";font-size:20px;line-height:1} } body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .shell.sidebar-collapsed .sidebar .nav-group-toggle{font-size:0!important;justify-content:center!important;width:100%!important;min-height:44px!important;padding:0!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .shell.sidebar-collapsed .sidebar .nav-group-toggle::after{content:"\22EF";font-size:20px;line-height:1} @media (max-width:720px){ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .shell.sidebar-collapsed .sidebar .nav-group-toggle{font-size:inherit!important;justify-content:flex-start!important;padding-inline:16px!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .shell.sidebar-collapsed .sidebar .nav-group-toggle::after{content:none} } /* Up to 1180px the header hides the first path step's text; at the workspace root that step is disabled, so it was an empty box. */ @media (max-width:1180px){ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .breadcrumb-root[disabled], body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar .breadcrumb-root[disabled]+.breadcrumb-divider{display:none!important} } /* ------------------------------------------------------------------ UI follow-ups: page header gap, wrapping step titles, scroll hints, compact phone top bar, narrow toolbar selects ------------------------------------------------------------------ */ /* The role-system rule above sets display:flex!important on the header's action row and so beat the ":empty { display:none }" rule of the v14 sheet: an empty row still took its 34px minimum height plus a grid gap, an 80px hole under the title of "Обзор" and "Ждёт вас". */ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .od14-page-actions:empty{display:none!important} /* A step title of the order-economics dialog is a sentence, not a code: it wraps instead of ending in an ellipsis. */ body.omnidata-v14.omnidata-design-system-v1 .order-economics-step :is(.entity-title-block,.entity-title){overflow:visible!important;text-overflow:clip!important;white-space:normal!important;overflow-wrap:anywhere} body.omnidata-v14.omnidata-design-system-v1 .order-economics-step .entity-title{line-height:1.35!important} /* A region that scrolls sideways fades out at the edge that still has content (shell-responsive.js sets data-scroll). */ [data-scroll="start"]{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 36px),transparent)} [data-scroll="middle"]{-webkit-mask-image:linear-gradient(to right,transparent,#000 36px,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(to right,transparent,#000 36px,#000 calc(100% - 36px),transparent)} [data-scroll="end"]{-webkit-mask-image:linear-gradient(to right,transparent,#000 36px);mask-image:linear-gradient(to right,transparent,#000 36px)} .scroll-region:focus-visible{outline:2px solid var(--ods-color-accent,#ff5a1f)!important;outline-offset:-2px!important} /* Phones: only the first row of the top bar (menu button, path) stays pinned (about 60px); the controls and the search scroll away with the page. The bar stops being one box: its children join the page flow and the first row is the sticky one. Wider layouts keep the wrapper as display:contents, i.e. as if it were absent. */ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar-nav{display:contents} @media (max-width:720px){ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar{display:contents!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar-nav{display:flex!important;position:sticky;top:0;z-index:24;align-items:center;gap:8px;min-height:60px;padding:8px 12px;box-sizing:border-box;background:var(--ods-color-surface,#fff);border-bottom:1px solid var(--ods-color-border,#d9dee3)} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar-nav .nav-toggle{flex:0 0 44px} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar-nav .breadcrumb{flex:1 1 auto;min-width:0} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar > .topbar-actions{margin:8px 12px 0!important;padding:0!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .topbar > .global-search{margin:8px 12px 0!important;box-sizing:border-box} } /* ------------------------------------------------------------------ Touch targets, readable text, accessible accent, visible focus ------------------------------------------------------------------ Colour: the brand orange (--ods-color-accent, #ff5b22) is 3.1:1 against white, which is enough for fills and rules but not for text, and not for white text on an orange fill. Anything that is read as text, or carries text on an orange fill, uses --ods-color-accent-text instead: the nearest darker orange that reaches 4.5:1 on white (5.2:1). The brand orange itself is not changed. */ :root{ --ods-color-accent-text:#c43a00; --ods-color-accent-text-hover:#b83800; --ods-color-accent-on-dark:#ffb48f; --ods-color-badge:#c4283b; } /* Keyboard focus: a 2px ring in the accessible orange, set off by 2px and lifted from busy surfaces by a white halo; on the dark sidebar the ring is the light orange. Before this the ring was the brand orange at 22% opacity. */ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system :is(a[href],button,input,select,textarea,summary,[role="tab"],[role="button"],[role="menuitem"],[tabindex]:not([tabindex="-1"])):focus-visible{ outline:2px solid var(--ods-color-accent-text)!important;outline-offset:2px!important;box-shadow:0 0 0 4px rgba(255,255,255,.9)!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system :is(input,select,textarea):focus-visible{outline-offset:0!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system :is(.sidebar,.nav-drawer) :is(a[href],button,input,select,textarea,summary,[role="tab"],[role="button"],[tabindex]:not([tabindex="-1"])):focus-visible{ outline-color:var(--ods-color-accent-on-dark)!important;box-shadow:none!important} /* Orange text and orange fills that carry text. */ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system :is(.od14-page-title,.syntha-hub-overline,.syntha-hub-journey-index,.syntha-hub-card-tail,.syntha-hub-secondary,.syntha-hub-eyebrow,.od-tab.active,.od-tab[aria-selected="true"],[role="tab"][aria-selected="true"],.od-inspector-kicker,[data-od14-component="tab"].active,[data-od14-component="tab"][data-od14-active="true"]){color:var(--ods-color-accent-text)!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system :is(.syntha-hub-primary,.language-option.active,.button.primary,button.primary,[data-ods-variant="primary"],[data-od14-unified-variant="primary"],[data-od14-component="button"][data-od14-variant="primary"],.od14-page-actions button.primary){background:var(--ods-color-accent-text)!important;border-color:var(--ods-color-accent-text)!important;color:#fff!important} body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system :is(.syntha-hub-primary,.button.primary,button.primary,[data-ods-variant="primary"],[data-od14-unified-variant="primary"],[data-od14-component="button"][data-od14-variant="primary"],.od14-page-actions button.primary):hover:not(:disabled){background:var(--ods-color-accent-text-hover)!important;border-color:var(--ods-color-accent-text-hover)!important} /* Counters: readable (11px) on a red that holds white text at 4.5:1 or better. */ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .notification-count{min-width:18px!important;height:18px!important;padding:0 5px!important;box-sizing:border-box!important;font-size:11px!important;line-height:18px!important;background:var(--ods-color-badge)!important;color:#fff!important;top:4px!important;right:2px!important} /* The ⌘K hint is for a physical keyboard: not shown on touch screens or phones. */ @media (pointer:coarse),(hover:none),(max-width:720px){ body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .global-search kbd{display:none!important} } /* Touch screens (phones, tablets, and anything up to 1180px): every control is at least 44 by 44. */ @media (max-width:1180px),(pointer:coarse){ :root body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system :is(button,summary,select,[role="tab"],[role="button"],.button,.od-tab,.nav-item,.nav-group-toggle,.language-option,.breadcrumb-root,.topbar-icon-button,.od-v7-help-button,.topbar-organisation,.topbar-user,.sidebar-action){min-height:44px!important;min-width:44px!important;box-sizing:border-box!important} :root body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]),textarea){min-height:44px!important;box-sizing:border-box!important} } /* Layout on tablets and phones. (1) A master list in a stacked master/detail layout kept the 590px minimum meant for the side-by-side desktop layout, so two rows of a table sat above 400px of empty white. The list is as tall as its rows. (2) The "one process" rail wraps on tablets instead of cutting its last stops off at the card edge; on phones it still scrolls sideways (with the edge fade). (3) The header of a page on a phone does not add a second 16px of padding under the description. */ @media (max-width:1180px){ :root body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .od-master{min-height:0!important} } @media (min-width:721px) and (max-width:1180px){ :root body.omnidata-v14 .syntha-hub-journey-rail{flex-wrap:wrap;overflow:visible} :root body.omnidata-v14 .syntha-hub-journey-stop{flex:1 1 220px;max-width:none} } @media (max-width:720px){ :root body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .od14-page-header{padding-bottom:6px!important} :root body.omnidata-v14.omnidata-design-system-v1.omnidata-role-system .od14-page-header .od14-page-description{margin-bottom:0!important} }