/* v0.16.6.42. Final presentation layer for the supplied Operations reference.
   Deliberately last: older module-specific styles remain for legacy workflows. */
:root{--ref-canvas:#f4f3ef;--ref-card:#fff;--ref-ink:#17181b;--ref-muted:#5b5f66;--ref-border:#e4e1da;--ref-border-soft:#efede7;--ref-red:#b3122b;--ref-red-soft:#fce8e6;--ref-green:#1b6b3d;--ref-green-soft:#e2f2e8;--ref-amber:#855000;--ref-amber-soft:#fbefd9;--ref-blue:#1b4fb0;--ref-blue-soft:#e7eefb;--ref-radius:12px;--ref-shadow:none;--ux-bg:#f4f3ef!important;--ux-ink:#17181b!important;--ux-muted:#5b5f66!important;--ux-line:#e4e1da!important;--ux-red:#b3122b!important}
html,body,#app{background:#f4f3ef!important;color:#17181b!important;-webkit-font-smoothing:antialiased}
/* Hidden application states must never become visible through component flex rules. */
html body [hidden],html body #app [hidden],html body #app #app-rail [hidden]{display:none!important}
#app main.app-view{padding:28px 28px 56px!important}
#app .view-head h1,#app .concept-head h1,#app .entity-title h1{font-size:28px!important;letter-spacing:-.025em!important;font-weight:600!important}
#app main.app-view>.view-head,#app .concept-head,#app .entity-head{align-items:center!important;gap:16px!important}
#app .view-tools,#app .concept-actions,#app .entity-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
#app .utilitybar{border-bottom-color:#e4e1da!important;box-shadow:none!important}
#app .global-search{border-color:#e4e1da!important;background:#faf9f6!important}
#app #app-rail.app-rail.topbar{background:#131417!important}
#app .app-rail nav a{font-size:13px!important;font-weight:500!important}
#app .app-rail nav a.active{background:#292b30!important}
#app .rail-section-label{font-size:10px!important;letter-spacing:.1em!important}
#app .primary{background:#b3122b!important;border-color:#b3122b!important;font-weight:500!important}
#app .primary:hover{background:#8e0e22!important;border-color:#8e0e22!important}
#app #global-create{background:#17181b!important;border-color:#17181b!important;color:#fff!important}
#app #global-create::before,#app #global-create::after{display:none!important;content:none!important}
#app .ghost,#app .button-link{border-color:#dad7cf!important;font-weight:500!important}
#app .ghost:hover,#app .button-link:hover{background:#faf9f6!important;border-color:#c8c4bc!important}
#app :is(button,a,input,select,textarea):focus-visible,.sales-workspace :is(button,a,input,select,textarea):focus-visible{outline:2px solid #1b4fb0!important;outline-offset:3px!important}
#app .board,#app .panel-block,#app .today-panel,#app .side-card,#app .readiness-card,#app .connector-card,#app .customers-list,#app .customers-preview,#app .concept-master,#app .concept-detail,#app .entity-body,#app .customer-record,#app .customer-work-card,#app .activity-card,#app .channel-card,#app .ux-report-card,#app .ux-admin-card{border-color:#e4e1da!important;border-radius:12px!important;box-shadow:none!important}
#app :is(.concept-metrics,.metric-row,.strip,.customers-stats,.customer-quick-stats,.ux-report-kpis){border-color:#e4e1da!important;border-radius:12px!important;box-shadow:none!important}
#app .concept-table th,#app table th{background:#faf9f6!important;color:#5b5f66!important;font-size:11px!important;font-weight:500!important;border-color:#e4e1da!important;letter-spacing:.04em!important}
#app .concept-table td,#app table td{border-bottom-color:#efede7!important}
#app .concept-table tbody tr.selected td,#app table tbody tr.selected td,#app .customers-row.selected td{background:#faf1f2!important}
#app :is(.concept-filterbar,.filters,.inv-filters,.customers-toolbar,.wl-bar){gap:8px!important;flex-wrap:wrap!important;border-color:#e4e1da!important}
#app :is(.concept-filterbar,.filters,.inv-filters,.customers-toolbar,.wl-bar) :is(input,select),#app .customer-record-form :is(input,select,textarea){border-color:#dad7cf!important;font-weight:400!important}
#app .status,#app .pill,#app .concept-chip,#app .tag,#app .customers-source,#app .wl-chip{border-color:transparent!important;font-weight:500!important}
#app .today-ref-card{border-color:#e4e1da!important;border-radius:12px!important;box-shadow:none!important}
#app .today-ref-module{border-color:#e4e1da!important;box-shadow:none!important}
#app .today-ref-action{border-color:#efede7!important}
#app .today-ref-btn{border-color:#dad7cf!important;font-weight:500!important}
#app .today-ref-hero h1{font-weight:600!important}
#app .today-ref-grid{gap:20px!important}
/* Full-screen quote / counter workspaces are outside #app. */
.sales-workspace{background:#f4f3ef!important;color:#17181b!important}
.sales-workspace .document-card,.sales-workspace .side-card,.sales-document .document-card{border:1px solid #e4e1da!important;border-radius:12px!important;box-shadow:none!important}
.sales-document-bar{border-bottom-color:#e4e1da!important;background:#fff!important;gap:16px;flex-wrap:wrap}
.sales-workspace :is(input,select,textarea){border-color:#dad7cf!important;border-radius:7px!important;font-size:14px!important}
.sales-workspace .primary{background:#b3122b!important;border-color:#b3122b!important;color:#fff!important}
.sales-workspace .ghost{background:#fff!important;border-color:#dad7cf!important}
.sales-document .document-heading h1{font-size:28px!important;letter-spacing:-.025em}
.sales-document .document-details{gap:16px!important}
.sales-document .line-editor-head{border-bottom-color:#efede7!important}
.sales-workspace .document-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sales-workspace .totals-card .grand-total{border-top-color:#e4e1da!important;font-size:20px!important}
.login-shell{background:#f4f3ef!important}.login-card{border-color:#e4e1da!important;box-shadow:none!important;border-radius:12px!important}.login-intro{background:#131417!important}
/* Workshop: four action lanes, separate waiting queues, optional quick view. */
.ref-workshop{--board-line:#e4e1da;font-size:13px}
.ref-board-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.ref-segment{display:inline-flex;gap:2px;background:#eae8e2;padding:3px;border-radius:8px}
#app .ref-segment button{border:0;background:transparent;color:#5b5f66;padding:8px 12px;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer}
#app .ref-segment button.active{background:#fff;color:#17181b;box-shadow:0 1px 3px #17181b12}
.ref-board-search{flex:1;min-width:190px;max-width:330px}
#app .ref-board-tools input,#app .ref-board-tools select{width:100%;height:36px;min-height:36px;border:1px solid #dad7cf;border-radius:8px;background:#fff;padding:0 11px;font-size:12px}
#app .ref-board-tools .ghost{min-height:36px!important;padding:8px 11px!important;font-size:12px!important}
#app .ref-board-tools .ghost.active{background:#fbefd9!important;color:#855000!important}
.ref-waiting{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:#eeece6;border:1px solid #e4e1da;border-radius:12px;padding:12px;margin-bottom:24px}
.ref-tray-label{font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:#5b5f66;margin:0 8px}
#app .ref-waiting button{display:flex;align-items:center;gap:14px;border:1px solid #dad7cf;border-radius:8px;background:#faf9f6;padding:9px 12px;color:#50535a;font-size:12px;cursor:pointer}
#app .ref-waiting button b{background:#e9e6df;border-radius:5px;min-width:22px;padding:2px 5px;text-align:center;color:#17181b}
#app .ref-waiting button.active{background:#17181b;color:#fff;border-color:#17181b}
.ref-board-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.ref-board-heading h2{font-size:12px!important;letter-spacing:.045em;text-transform:uppercase;font-weight:600;margin:0}
.ref-board-heading h2 span{font-weight:400;color:#5b5f66;letter-spacing:0;text-transform:none}
.ref-board-heading small{color:#5b5f66;font-size:11px}
.ref-board-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:start}
.ref-workshop.has-preview .ref-board-layout{grid-template-columns:minmax(0,1fr) 290px}
.ref-lanes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:start;min-width:0}
.ref-lanes.single-queue{grid-template-columns:minmax(0,1fr)}
.ref-lanes.single-queue .ref-lane{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}
.ref-lanes.single-queue .ref-lane>header{grid-column:1/-1}
.ref-lane{min-width:0}
.ref-lane>header{min-height:65px;padding:3px 2px 12px}
.ref-lane h3{font-size:13px;margin:0 0 6px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:600}
.ref-lane h3 span{background:#e9e6df;border-radius:5px;padding:2px 6px;font-size:11px;font-weight:500}
.ref-lane>header p{color:#5b5f66;font-size:11px;line-height:1.45;margin:0}
#app .ref-job-card{display:block;width:100%;padding:13px;margin:0 0 10px;background:#fff;border:1px solid #e4e1da;border-radius:10px;text-align:left;color:#17181b;cursor:pointer;box-shadow:0 1px 2px #17181b04;overflow-wrap:anywhere}
#app .ref-job-card:hover{border-color:#b9b4a9;box-shadow:0 2px 7px #17181b09}
#app .ref-job-card.selected{border-color:#b3122b;box-shadow:0 0 0 1px #b3122b}
.ref-card-top{display:flex;justify-content:space-between;gap:6px;font-size:9px;text-transform:uppercase;letter-spacing:.045em;color:#5b5f66;margin-bottom:9px}
.ref-card-top em{font-style:normal;white-space:nowrap;letter-spacing:0;background:#eeede8;border-radius:4px;padding:1px 4px}
.ref-job-card>strong{display:block;font-size:14px;font-weight:600;line-height:1.4;margin-bottom:3px}
.ref-job-card>small{display:block;font-size:11px;color:#5b5f66;line-height:1.5}
.ref-job-card>p{font-size:12px;margin:10px 0 2px;line-height:1.5}
.ref-card-ref{font-family:ui-monospace,monospace;font-size:10px;color:#72757a;display:block;margin-top:5px}
.ref-card-footer{display:flex;justify-content:space-between;gap:8px;border-top:1px solid #efede7;padding-top:10px;margin-top:12px;font-size:10px;color:#5b5f66}
.ref-card-footer>span:last-child{color:#b3122b}.ref-card-footer .ref-overdue{color:#855000!important;background:#fbefd9;border-radius:4px;padding:2px 4px}
#app .ref-show-more{width:100%;border:1px dashed #dad7cf;background:transparent;border-radius:8px;padding:10px;color:#5b5f66;font-size:12px;cursor:pointer}
.ref-empty{padding:28px 12px;border:1px dashed #dad7cf;border-radius:10px;color:#72757a;font-size:12px;text-align:center}
.ref-job-preview{background:#fff;border:1px solid #e4e1da;border-radius:12px;padding:18px;position:sticky;top:80px;overflow-wrap:anywhere}
.ref-job-preview>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.ref-preview-kicker{font-size:10px;color:#5b5f66;text-transform:uppercase;letter-spacing:.06em}
.ref-stage-pill{display:inline-flex;background:#e7eefb;color:#1b4fb0;font-size:11px;border-radius:999px;padding:4px 8px}
.ref-job-preview h2{font-size:20px;margin:12px 0 4px;line-height:1.3}
.ref-preview-ref{font-size:12px;color:#5b5f66;margin:0 0 18px}
.ref-job-preview dl{margin:0}.ref-job-preview dl>div{border-bottom:1px solid #efede7;padding:9px 0}.ref-job-preview dt{font-size:11px;color:#72757a}.ref-job-preview dd{font-size:13px;margin:4px 0 0}
.ref-job-preview section{padding:16px 0}.ref-job-preview h3{font-size:12px;margin:0 0 8px}.ref-job-preview section p{color:#5b5f66;font-size:13px;line-height:1.5;margin:0;white-space:pre-wrap}
.ref-open-job{width:100%;box-sizing:border-box}.ref-preview-note,.ref-board-footnote{font-size:11px;line-height:1.6;color:#72757a}.ref-preview-note{margin:12px 0 0}.ref-board-footnote{margin:18px 0}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(min-width:1600px){#app main.app-view{padding:32px 36px 64px!important}}
@media(max-width:1400px){.ref-workshop.has-preview .ref-lanes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1150px){.ref-lanes{grid-template-columns:repeat(2,minmax(0,1fr))}.ref-workshop.has-preview .ref-board-layout{grid-template-columns:minmax(0,1fr)}.ref-workshop.has-preview .ref-job-preview{position:static;grid-row:1}.ref-lanes.single-queue{grid-template-columns:minmax(0,1fr)}}
@media(max-width:820px){#app main.app-view{padding:22px 16px 40px!important}#app main.app-view>.view-head,#app .concept-head,#app .entity-head{flex-wrap:wrap!important}#app .view-head h1,#app .concept-head h1,#app .entity-title h1{font-size:25px!important}.ref-board-tools{gap:8px}.ref-board-search{max-width:none}.ref-board-heading{align-items:flex-start;flex-direction:column;gap:6px}.sales-workspace .document-details{grid-template-columns:1fr 1fr!important}.sales-workspace .document-actions{gap:6px}.sales-document-bar{padding:12px!important}}
@media(max-width:480px){.ref-lanes,.ref-workshop.has-preview .ref-lanes{grid-template-columns:minmax(0,1fr)}.ref-board-search{flex-basis:100%}.ref-waiting{padding:10px;gap:6px}.ref-waiting>button{flex:1 1 100%}.ref-lane>header{min-height:0;padding-top:12px}.sales-workspace .document-details{grid-template-columns:1fr!important}.sales-workspace .document-actions #sales-save-state{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* The desktop grid supplies the header row; stacked mobile views need their own offset. */
@media(max-width:820px){
  #app{padding-top:60px!important}
  #app #rail-open,#app #rail-close{display:inline-flex!important;align-items:center;justify-content:center;flex-shrink:0;width:32px;height:32px}
  #app .actor-copy{display:none!important}
  #app>.utilitybar{gap:8px!important}
  #app .utility-actions{gap:6px!important;flex-shrink:0}
  #app .utilitybar #global-create{padding:0 10px!important;font-size:12px!important}
  #app #global-search-form{min-width:0!important}
  #app #global-search{min-width:0!important}
}
@media(max-width:480px){
  #app #global-create span,#app #global-create .utility-chevron,#app .global-search kbd,#app .account-toggle .account-chevron{display:none!important}
  #app .utilitybar #global-create{width:34px!important;padding:0!important}
  #app .account-toggle{padding:0!important}
  #app .global-search{gap:6px!important;padding:0 8px!important}
  #app .global-search .search-glyph{flex-shrink:0}
}
