/* Compact workspace spacing; screen only, with full-sized mobile touch targets. */
@media screen {
 #product-shell[data-top-module="crm"] #main-content:not(.pipeline-active):not(.projects-active){padding:14px 18px!important;gap:8px}
 #product-shell #main-content>.crm-actions{gap:6px;margin:0}
 #product-shell #main-content>.crm-actions>button{min-height:32px;padding-top:6px;padding-bottom:6px}
 #product-shell #controls-bar{padding:8px;gap:8px;border-radius:10px;flex-shrink:0}
 #product-shell #controls-bar :is(input,select){padding-top:6px;padding-bottom:6px;min-height:34px}
 #product-shell #controls-bar>.flex{gap:6px}
 #product-shell .saved-view-row{padding:0;margin:0;gap:6px;min-height:32px;flex-shrink:0}
 #product-shell .saved-view-row :is(select,button){padding:5px 8px;min-height:30px;line-height:1.4}
 #product-shell #view-contacts>:first-child{padding:10px 14px;gap:8px;border-radius:10px}
 #product-shell #view-contacts>:first-child h2{font-size:14px;line-height:1.35}
 #product-shell #view-contacts>:first-child p{margin-top:2px;line-height:1.4}
 #product-shell #view-contacts>:not([hidden])~:not([hidden]){margin-top:8px}
 #product-shell #view-leads{gap:12px}
 #product-shell #view-leads>section:first-child{gap:8px}
 #product-shell #lead-list-container>:not([hidden])~:not([hidden]){margin-top:8px}
 #product-shell #detail-content>:not([hidden])~:not([hidden]){margin-top:12px}
 #product-shell #detail-content>:first-child{padding-bottom:10px}
 #product-shell #main-content:has(>#view-leadmaster:not(.hidden))>#controls-bar{display:none!important}
 #product-shell #view-leadmaster{padding-top:0!important}
 #product-shell #view-leadmaster>.lm-card{padding:12px 14px!important;border-radius:12px}
 #product-shell #view-leadmaster>:not([hidden])~:not([hidden]){margin-top:10px}
 #product-shell #view-leadmaster :is(.lm-input,.lm-query-input,.lm-target-select){min-height:36px;height:auto;padding-top:7px;padding-bottom:7px}
 /* Pipeline: tighter title, configuration, search and stage rows. */
 #product-shell #view-pipeline{padding:14px 18px}
 #product-shell #view-pipeline .pipeline-header{margin-bottom:8px;gap:12px}
 #product-shell #view-pipeline .pipeline-header h1{font-size:24px!important;line-height:1.25!important}
 #product-shell #view-pipeline .pipeline-header-actions{gap:8px}
 #product-shell #view-pipeline .pipeline-view-toggle{padding:3px;border-radius:10px}
 #product-shell #view-pipeline .pipeline-view-toggle button{padding:6px 12px;min-height:32px;font-size:12px}
 #product-shell #view-pipeline .pipeline-new{min-height:36px;padding:7px 14px;font-size:12px}
 #product-shell #view-pipeline :is(.pipeline-context,.pipeline-followup-filters){margin-bottom:8px;gap:8px}
 #product-shell #view-pipeline .pipeline-context label{gap:2px;font-size:11px}
 #product-shell #view-pipeline :is(.pipeline-context button,.pipeline-context select,.pipeline-followup-filters select){min-height:34px;padding:6px 10px;font-size:12px}
 #product-shell #view-pipeline .pipeline-filters{margin-bottom:8px;gap:8px}
 #product-shell #view-pipeline .pipeline-filters :is(input,select){min-height:38px;padding:7px 12px;font-size:13px;border-radius:9px}
 #product-shell #view-pipeline .pipeline-stage-filters{gap:6px;margin-bottom:6px}
 #product-shell #view-pipeline .pipeline-stage-filters button{min-height:32px;padding:5px 12px;font-size:12px}
 #product-shell #view-pipeline .pipeline-drag-help{margin:2px 0 8px;font-size:11px;line-height:1.4}
 #product-shell #view-pipeline .pipeline-board{gap:12px;padding-bottom:12px}
 #product-shell #view-pipeline .pipeline-lane{padding:12px;border-radius:14px}
 #product-shell #view-pipeline .pipeline-lane h2{margin-bottom:10px;font-size:14px}
 #product-shell #view-pipeline .pipeline-card{margin:8px 0;padding:12px}
 /* Projects: bring the header, filters and property list closer together. */
 #product-shell #view-projects{padding:14px 18px}
 #product-shell #view-projects .projects-header{margin-bottom:10px;gap:12px}
 #product-shell #view-projects .projects-header h1{font-size:24px!important;line-height:1.25!important;margin:2px 0 4px}
 #product-shell #view-projects .projects-header p{font-size:12px;line-height:1.4}
 #product-shell #view-projects .projects-toolbar{gap:10px}
 #product-shell #view-projects .projects-toolbar label{font-size:12px}
 #product-shell #view-projects .projects-toolbar :is(input[type=search],select){margin-top:3px;min-height:36px;padding:7px 10px;border-radius:8px}
 #product-shell #view-projects .projects-archive-toggle{min-height:36px}
 #product-shell #view-projects .projects-sync{margin:6px 0 10px;font-size:11px;line-height:1.4}
 #product-shell #view-projects .projects-layout{gap:12px}
 #product-shell #view-projects .project-list{gap:8px}
 #product-shell #view-projects .project-card{padding:12px!important}
 #product-shell #view-projects .project-properties{padding:14px}
 #product-shell #view-projects .project-properties h2{margin-bottom:4px;font-size:18px}
 #product-shell #view-projects .properties-table-scroll{margin-top:12px}
 #product-shell #view-projects .projects-empty{padding:14px;margin:6px 0}
 #product-shell #view-projects button{min-height:36px;padding:7px 11px;font-size:12px}
}
@media screen and (min-width:1024px) {
 #product-shell #view-leads>#detail-panel{padding:18px 18px 24px}
}
@media screen and (max-width:767px) {
 #product-shell[data-top-module="crm"] #main-content:not(.pipeline-active):not(.projects-active){padding:10px 12px!important;gap:8px}
 #product-shell #controls-bar>.flex{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
 #product-shell #controls-bar>.flex>*{min-width:0;width:100%}
 #product-shell #main-content>.crm-actions>button,#product-shell #controls-bar :is(input,select,button){min-height:44px}
 #product-shell .saved-view-row{display:flex;flex-wrap:wrap;align-items:center;gap:4px}
 #product-shell .saved-view-row label{width:auto;flex:0 0 auto}
 #product-shell .saved-view-row select{width:auto;min-width:130px;flex:1 1 130px}
 #product-shell .saved-view-row button{width:auto;flex:0 1 auto}
 #product-shell .saved-view-row :is(select,button){min-height:44px}
 #product-shell :is(#view-pipeline,#view-projects){padding:10px 12px}
 #product-shell #view-pipeline .pipeline-header{margin-bottom:8px;gap:8px}
 #product-shell #view-pipeline .pipeline-header h1{font-size:22px!important}
 #product-shell #view-pipeline .pipeline-header-actions{gap:6px}
 #product-shell #view-pipeline .pipeline-stage-filters{padding:2px 0 4px}
 #product-shell #view-pipeline :is(.pipeline-new,.pipeline-view-toggle button,.pipeline-context button,.pipeline-context select,.pipeline-filters input,.pipeline-filters select,.pipeline-stage-filters button,.pipeline-followup-filters select){min-height:44px}
 #product-shell #view-projects .projects-header{gap:8px}
 #product-shell #view-projects .projects-toolbar{gap:8px}
 #product-shell #view-projects :is(button,.projects-toolbar input[type=search],.projects-toolbar select){min-height:44px}
}

/* Shared application pages and utility modules. */
@media screen {
 #product-shell:is([data-top-module="settings"],[data-top-module="whatsapp"],[data-top-module="billing"]) #main-content{padding:14px 18px!important;gap:8px}
 #product-shell :is(#workspace-overview,#office-page){padding:20px 24px}
 #product-shell .page-intro{margin-bottom:14px;gap:12px}
 #product-shell .page-intro h1{font-size:28px;margin:4px 0 6px}
 #product-shell .overview-banner{padding:16px 20px;margin-bottom:14px}
 #product-shell .suite-grid{gap:12px}
 #product-shell .suite-card{padding:16px}
 #product-shell .card-icon{margin-bottom:14px}
 #product-shell .card-foot{padding-top:10px;margin-top:12px}
 #product-shell .office-grid{gap:10px}
 #product-shell .office-grid :is(button,a){padding:12px 16px!important;min-height:52px}
 .es-settings-intro{padding:16px 18px;margin-bottom:12px;gap:12px}
 .es-settings-intro h2{font-size:25px;margin:4px 0}
 .es-settings-links{gap:6px;margin-bottom:12px}
 .es-settings-grid{gap:12px}
 .es-settings-card{padding:16px}
 .es-settings-card h3{margin-bottom:5px}
 .es-settings-card header{margin-bottom:10px}
 .es-settings-card label{margin-bottom:8px}
 .es-settings-actions{gap:6px}
 .estate-calendar{padding:18px}
 .cal-header h1{font-size:25px;margin:3px 0 10px}
 .cal-tabs{padding:4px 0 8px}
 .cal-toolbar{margin:10px 0}
 .cal-storage{margin:7px 0}
 .cal-event{padding:12px;gap:10px;margin:7px 0}
 .cal-day-detail{margin-top:14px}
 .office-studio #office-body{padding:18px}
 .office-header{gap:12px}
 .office-header h1{font-size:26px;margin:2px 0 4px}
 .office-tool-strip{padding:10px 14px;margin-top:10px;gap:10px}
 .office-tabs button{padding:9px;gap:6px}
 .office-grid,.office-files{gap:10px}
 .office-card{padding:14px}
 .folder-manager .fm-header{padding-top:14px;padding-bottom:14px;gap:10px}
 .folder-manager :is(.fm-toolbar,.fm-filters){gap:8px;margin-bottom:10px}
 #product-shell :is(#view-billing,#view-ads-campaigns,[id^="view-wa-"])>:not([hidden])~:not([hidden]){margin-top:10px}
 #product-shell :is(#view-billing,#view-ads-campaigns,[id^="view-wa-"])>:is(.p-4,.p-5,.p-6){padding:12px 14px}
}

/* Independent module UI; paper sheets, document editors and print targets are excluded. */
@media screen {
 html.es-module .module-context{padding:12px 18px 6px!important;gap:8px}
 html.es-module .module-context .workspace{gap:8px}
 html.es-module .module-context .workspace select{margin-top:3px}
 html.es-module .module-context button{padding:6px 10px!important;min-height:34px!important}
 html.es-module-accounting main,html.es-module-site main,html.es-module-legal .view,html.es-module-bank main{padding:14px 18px!important}
 html.es-module-accounting .view-panel h2,html.es-module-site .heading h1,html.es-module-legal .pagehead h1{font-size:24px!important;line-height:1.25!important;margin-bottom:6px}
 html.es-module-site .heading{margin-bottom:10px;gap:10px}
 html.es-module-site .stats,html.es-module-accounting .gw-metrics{gap:10px!important;margin-bottom:12px}
 html.es-module-site .stat,html.es-module-accounting .gw-metric{padding:12px 14px!important}
 html.es-module-site .stat strong,html.es-module-accounting .gw-metric strong{font-size:25px!important}
 html.es-module-accounting .gw-columns,html.es-module-site .two-col,html.es-module-site .form-grid{gap:12px!important}
 html.es-module-accounting :is(.gw-panel,.gw-card){padding:14px!important}
 html.es-module-accounting .gw-banner{padding:12px 16px!important;margin-bottom:12px}
 html.es-module-site .project-context{padding:12px 16px}
 html.es-module-site :is(.project-tabs,.project-subtabs){padding-inline:10px!important}
 html.es-module-site :is(.project-tabs,.project-subtabs) button{min-height:36px!important;padding-top:6px;padding-bottom:6px}
 html.es-module-site .form-grid :is(input,select,textarea){margin-top:4px}
 html.es-module-legal .top{padding:12px 18px 0!important;gap:8px}
 html.es-module-legal .sec{margin-bottom:12px!important}
 html.es-module-legal .sec>header{padding:10px 14px!important}
 html.es-module-legal .sec>.body{padding:14px!important}
 html.es-module-legal :is(.g2,.g3,.g4){gap:12px!important}
 html.es-module-legal .help{padding:12px 14px!important;margin-bottom:12px}
 html.es-module-legal .stepper{padding:9px}
 html.es-module-legal .disc{padding:10px 18px!important}
 html.es-module-patra .module-context,html.es-module-docvault .module-context{padding-bottom:8px!important}
 html.es-module-patra :is(#tabFormContent,#tabLetterheadContent,#tabRefineContent){padding:14px!important}
 html.es-module-patra main>aside :is(.space-y-5,.space-y-6)>:not([hidden])~:not([hidden]){margin-top:12px}
 html.es-module-docvault :is(#view-dashboard,#view-movement,#view-notify){padding:14px 18px!important}
 html.es-module-docvault #view-dashboard h2{font-size:24px!important}
 html.es-module-docvault #view-dashboard .grid{gap:10px!important}
 html.es-module-docvault #dropZoneContainer{padding:14px!important}
 html.es-module-bond .sidebar-header{padding:12px 16px 8px}
 html.es-module-bond .form-container{padding:12px 16px}
 html.es-module-bond :is(.form-group,.form-row>.form-group){margin-bottom:10px}
 html.es-module-bond .form-group label{margin-bottom:3px}
 html.es-module-bond .bond-sample-note{margin-bottom:10px;padding:7px 9px}
 html.es-module-bond .actions{padding:8px 16px;gap:6px}
}
@media screen and (max-width:767px) {
 #product-shell:is([data-top-module="settings"],[data-top-module="whatsapp"],[data-top-module="billing"]) #main-content{padding:10px 12px!important;gap:8px}
 #product-shell :is(#workspace-overview,#office-page){padding:14px}
 .es-settings-intro{padding:14px}
 .es-settings-card{padding:14px}
 .estate-calendar{padding:12px}
 .office-studio #office-body{padding:14px}
 html.es-module .module-context{padding:10px 12px 6px!important;gap:8px}
 html.es-module .module-context button{min-height:44px!important}
 html.es-module-accounting main,html.es-module-site main,html.es-module-legal .view,html.es-module-bank main{padding:10px 12px!important}
 html.es-module-site :is(.project-tabs,.project-subtabs) button{min-height:44px!important}
 html.es-module-docvault :is(#view-dashboard,#view-movement,#view-notify){padding:10px 12px!important}
 html.es-module-legal .top{padding:10px 12px 0!important}
}

@media screen and (min-width:768px){
html.es-module :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=hidden]),select):not(:where(.es-preserve-document,.es-preserve-document *,#paperSheet,#paperSheet *,#printRoot,#printRoot *,#printArea,#printArea *,#sheet,#sheet *,#bankPreprinted,#bankPreprinted *,#printableReportArea,#printableReportArea *,#printableVoucherArea,#printableVoucherArea *,.a4,.a4 *,.page-sheet,.page-sheet *,.paper-sheet,.paper-sheet *,.document-page,.document-page *,.office-document,.office-document *,[contenteditable="true"],[contenteditable="true"] *)){min-height:34px!important;padding-top:6px!important;padding-bottom:6px!important}
html.es-module :is(thead th,tbody td):not(:where(.es-preserve-document,.es-preserve-document *,#paperSheet,#paperSheet *,#printRoot,#printRoot *,#printArea,#printArea *,#sheet,#sheet *,#bankPreprinted,#bankPreprinted *,#printableReportArea,#printableReportArea *,#printableVoucherArea,#printableVoucherArea *,.a4,.a4 *,.page-sheet,.page-sheet *,.paper-sheet,.paper-sheet *,.document-page,.document-page *,.office-document,.office-document *,[contenteditable="true"],[contenteditable="true"] *)){padding:8px 10px!important}
}

@media screen{
html.es-module :is(.mb-6,.mb-8):not(:where(.es-preserve-document,.es-preserve-document *,#paperSheet,#paperSheet *,#printRoot,#printRoot *,#printArea,#printArea *,#sheet,#sheet *,#bankPreprinted,#bankPreprinted *,#printableReportArea,#printableReportArea *,#printableVoucherArea,#printableVoucherArea *,.a4,.a4 *,.page-sheet,.page-sheet *,.paper-sheet,.paper-sheet *,.document-page,.document-page *,.office-document,.office-document *,[contenteditable="true"],[contenteditable="true"] *)){margin-bottom:12px!important}
html.es-module :is(.mt-6,.mt-8):not(:where(.es-preserve-document,.es-preserve-document *,#paperSheet,#paperSheet *,#printRoot,#printRoot *,#printArea,#printArea *,#sheet,#sheet *,#bankPreprinted,#bankPreprinted *,#printableReportArea,#printableReportArea *,#printableVoucherArea,#printableVoucherArea *,.a4,.a4 *,.page-sheet,.page-sheet *,.paper-sheet,.paper-sheet *,.document-page,.document-page *,.office-document,.office-document *,[contenteditable="true"],[contenteditable="true"] *)){margin-top:12px!important}
html.es-module :is(.gap-4,.gap-5,.gap-6):not(:where(.es-preserve-document,.es-preserve-document *,#paperSheet,#paperSheet *,#printRoot,#printRoot *,#printArea,#printArea *,#sheet,#sheet *,#bankPreprinted,#bankPreprinted *,#printableReportArea,#printableReportArea *,#printableVoucherArea,#printableVoucherArea *,.a4,.a4 *,.page-sheet,.page-sheet *,.paper-sheet,.paper-sheet *,.document-page,.document-page *,.office-document,.office-document *,[contenteditable="true"],[contenteditable="true"] *)){gap:12px!important}
html.es-module :is(.p-5,.p-6):not(:where(.es-preserve-document,.es-preserve-document *,#paperSheet,#paperSheet *,#printRoot,#printRoot *,#printArea,#printArea *,#sheet,#sheet *,#bankPreprinted,#bankPreprinted *,#printableReportArea,#printableReportArea *,#printableVoucherArea,#printableVoucherArea *,.a4,.a4 *,.page-sheet,.page-sheet *,.paper-sheet,.paper-sheet *,.document-page,.document-page *,.office-document,.office-document *,[contenteditable="true"],[contenteditable="true"] *)){padding:14px!important}
html.es-module :is(.space-y-4,.space-y-5,.space-y-6)>:not([hidden])~:not([hidden]):not(:where(.es-preserve-document,.es-preserve-document *,#paperSheet,#paperSheet *,#printRoot,#printRoot *,#printArea,#printArea *,#sheet,#sheet *,#bankPreprinted,#bankPreprinted *,#printableReportArea,#printableReportArea *,#printableVoucherArea,#printableVoucherArea *,.a4,.a4 *,.page-sheet,.page-sheet *,.paper-sheet,.paper-sheet *,.document-page,.document-page *,.office-document,.office-document *,[contenteditable="true"],[contenteditable="true"] *)){margin-top:10px!important}
}

/* The CRM submodule strip already supplies these page names. Keep headings for assistive technology. */
@media screen {
 #product-shell #view-pipeline .pipeline-header h1,
 #product-shell #view-projects .projects-header h1,
 #product-shell #view-projects .projects-eyebrow,
 #product-shell #view-contacts>:first-child h2,
 #product-shell #view-leadmaster>.lm-card:first-child h2 {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important
 }
 #product-shell #view-pipeline .pipeline-header{justify-content:flex-end}
 #product-shell #view-projects .projects-header{align-items:center}
}

@media screen{html.es-module .es-repeat-title{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}}

/* Pipeline actions and admin scope filters share one compact horizontal row. */
@media screen{
 #product-shell #view-pipeline .pipeline-header{display:flex;flex-wrap:nowrap;align-items:flex-end;gap:12px;overflow-x:auto;padding-bottom:3px}
 #product-shell #view-pipeline .pipeline-header>.pipeline-context{flex:0 0 auto;flex-wrap:nowrap;align-items:flex-end;margin:0 auto 0 0!important;gap:8px}
 #product-shell #view-pipeline .pipeline-header>.pipeline-context label{flex:0 0 auto;min-width:155px}
 #product-shell #view-pipeline .pipeline-header-actions{flex:0 0 auto;width:auto;flex-wrap:nowrap;align-items:center;margin-left:auto}
 #product-shell #view-pipeline .pipeline-header-actions>*{flex-shrink:0;white-space:nowrap}
}
@media screen and (max-width:767px){
 #product-shell #view-pipeline .pipeline-header{flex-wrap:nowrap;gap:8px}
 #product-shell #view-pipeline .pipeline-header>.pipeline-context label{min-width:145px}
 #product-shell #view-pipeline .pipeline-header-actions{width:auto}
}

/* Match the two Projects empty-state panels in one horizontal row. */
@media screen{
 #product-shell #view-projects .projects-layout:has(>.project-list>.projects-empty){grid-template-columns:repeat(2,minmax(220px,1fr));align-items:stretch;gap:12px;overflow-x:auto;padding-bottom:2px}
 #product-shell #view-projects .projects-layout:has(>.project-list>.projects-empty)>:is(.project-list,.project-properties){align-self:stretch;display:block;margin:0;padding:12px!important;min-width:0;box-sizing:border-box;border:1px solid var(--es-border,#dae3ee);border-radius:12px;background:var(--es-surface,#fff)}
 #product-shell #view-projects .projects-layout:has(>.project-list>.projects-empty)>:is(.project-list,.project-properties)>.projects-empty{display:flex;align-items:center;min-height:52px;box-sizing:border-box;padding:12px!important;margin:0!important;border:1px dashed var(--es-border,#dae3ee);border-radius:8px;font-size:13px;line-height:1.4}
}

/* Scope, search, date/priority and actions stay together in one compact row. */
@media screen{
 #product-shell #view-pipeline .pipeline-header{align-items:flex-end;gap:8px}
 #product-shell #view-pipeline .pipeline-header>.pipeline-context{margin:0!important;gap:8px}
 #product-shell #view-pipeline .pipeline-header>.pipeline-context label{min-width:0;width:145px}
 #product-shell #view-pipeline .pipeline-header>.pipeline-context label:last-child{width:170px}
 #product-shell #view-pipeline .pipeline-header :is(.pipeline-filters,.pipeline-followup-filters){display:contents}
 #product-shell #view-pipeline .pipeline-header .pipeline-filters label,#product-shell #view-pipeline .pipeline-header .pipeline-followup-filters label{display:grid;gap:2px;align-content:end;font-size:11px;flex:0 0 auto;width:125px}
 #product-shell #view-pipeline .pipeline-header .pipeline-filters .pipeline-search{flex:1 0 175px;width:200px;max-width:250px}
 #product-shell #view-pipeline .pipeline-header .pipeline-followup-filters label{width:110px}
 #product-shell #view-pipeline .pipeline-header :is(input,select){width:100%;min-width:0!important;min-height:34px;height:34px;box-sizing:border-box;padding:6px 9px!important;font-size:12px}
 #product-shell #view-pipeline .pipeline-header .pipeline-header-actions{margin-left:auto}
 #product-shell #view-pipeline .pipeline-followup-summary{font-size:11px;color:var(--es-text-muted);margin:2px 0 8px}
}
@media screen and (max-width:767px){
 #product-shell #view-pipeline .pipeline-header :is(input,select){height:44px;min-height:44px}
 #product-shell #view-pipeline .pipeline-header .pipeline-search{flex:0 0 180px}
}

/* Single CRM action/search/filter row with accessible icon-only actions. */
@media screen{
 #product-shell #controls-bar{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;gap:8px;overflow-x:auto}
 #product-shell #controls-bar #page-actions{display:flex;flex:0 0 auto;flex-wrap:nowrap;gap:5px}
 #product-shell #controls-bar #page-actions>button{width:34px!important;height:34px!important;min-height:34px!important;box-sizing:border-box;padding:6px!important;justify-content:center;flex:0 0 auto}
 #product-shell #controls-bar #page-actions>button>span{display:none!important}
 #product-shell #controls-bar .crm-search-field{flex:0 0 200px!important;width:200px;min-width:170px;max-width:200px}
 #product-shell #controls-bar>.flex{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;gap:6px}
 #product-shell #controls-bar>.flex>*{flex:0 0 auto;width:auto}
 #product-shell #controls-bar :is(input,select){height:34px;min-height:34px;box-sizing:border-box}
 #product-shell #controls-bar #client-filter-wrapper{width:180px}
 #product-shell #controls-bar #client-filter-wrapper select{width:100%}
 #product-shell #controls-bar :is(#status-filter,#source-filter){width:135px}
 #product-shell #controls-bar #sort-order{width:140px}
 #product-shell #controls-bar>div>button{white-space:nowrap}
}
@media screen and (max-width:767px){
 #product-shell #controls-bar #page-actions>button{width:44px!important;height:44px!important;min-height:44px!important}
 #product-shell #controls-bar :is(input,select,button){min-height:44px;height:44px}
 #product-shell #controls-bar .crm-search-field{flex-basis:180px!important;width:180px;max-width:180px}
}

/* One compact Projects row for scope, short search, archive option and creation. */
@media screen{
 #product-shell #view-projects .projects-header{display:flex;flex-wrap:nowrap;align-items:flex-end;gap:10px;overflow-x:auto;margin-bottom:6px;padding-bottom:3px}
 #product-shell #view-projects .projects-header>div:first-child{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 #product-shell #view-projects .projects-header .projects-toolbar{display:flex!important;flex:1 0 auto;flex-wrap:nowrap!important;align-items:flex-end;gap:10px}
 #product-shell #view-projects .projects-toolbar>label:not(.projects-search):not(.projects-archive-toggle){width:180px;flex:0 0 180px}
 #product-shell #view-projects .projects-toolbar .projects-search{flex:0 0 240px;min-width:200px;width:240px;max-width:240px}
 #product-shell #view-projects .projects-toolbar .projects-archive-toggle{flex:0 0 auto;white-space:nowrap;min-height:36px;gap:7px}
 #product-shell #view-projects #project-new{flex:0 0 auto;margin-left:auto;white-space:nowrap;min-height:36px}
 #product-shell #view-projects .projects-description{font-size:11px;line-height:1.4;margin:0 0 4px;color:var(--es-text-muted)}
 #product-shell #view-projects .projects-sync{margin-top:4px}
}
@media screen and (max-width:767px){
 #product-shell #view-projects .projects-header{flex-direction:row!important;align-items:flex-end}
 #product-shell #view-projects .projects-toolbar .projects-search{flex-basis:200px;width:200px;max-width:200px}
 #product-shell #view-projects .projects-toolbar .projects-archive-toggle,#product-shell #view-projects #project-new{min-height:44px}
}

@media screen{html.es-module-site .heading>div:has(>#title){display:none!important}html.es-module-site .heading:has(>#add[hidden]){display:none!important}html.es-module-site .heading{margin:0 0 8px!important;min-height:0!important}html.es-module-site .tools:not(:has(input:not([hidden]),select:not([hidden]))){display:none!important}}

@media screen{
 html.es-module-accounting .module-context{flex-wrap:nowrap!important;align-items:flex-end!important;gap:8px!important;padding:8px 12px!important;overflow-x:auto}
 html.es-module-accounting .module-context>div{flex:0 0 auto!important;width:auto!important;min-width:0!important;text-align:left!important}
 html.es-module-accounting .module-context #companySelector{min-width:180px!important;max-width:420px!important;flex:none!important;margin-top:4px!important}
 html.es-module-accounting .module-context #fySelector{width:160px!important;min-width:160px!important;margin-top:4px!important}
 html.es-module-accounting .account-company-label{display:flex;align-items:center;gap:10px;white-space:nowrap}
 html.es-module-accounting .module-context #appModeBadge{display:inline!important;background:transparent!important;color:var(--es-primary)!important;font:600 11px/1.4 var(--es-sans)!important;padding:0!important;margin:0!important;text-transform:none;letter-spacing:0}
 html.es-module-accounting .module-context>button{flex:0 0 auto;white-space:nowrap;margin-bottom:0!important}
}
/* Sidebar reduced by one quarter while keeping the collapsed and mobile layouts. */
@media screen and (min-width:1101px){#product-shell:not(.is-collapsed){--nav-width:186px}}
@media screen and (min-width:768px) and (max-width:1100px){#product-shell:not(.is-collapsed){--nav-width:160px}}
@media screen and (min-width:768px){#product-shell:not(.is-collapsed) #product-sidebar{padding-left:9px;padding-right:9px}#product-shell:not(.is-collapsed) #product-sidebar .nav-item{gap:8px;padding-left:9px;padding-right:8px;font-size:11px}#product-shell:not(.is-collapsed) #product-sidebar .nav-item .es-icon{flex:0 0 18px;width:18px}#product-shell:not(.is-collapsed) #product-sidebar .nav-item>span{white-space:normal;line-height:1.35}#product-shell:not(.is-collapsed) #product-sidebar .es-wordmark{font-size:15px;margin-left:3px;margin-right:0;gap:7px}}

@media screen{
 #product-shell #contact-followup-row{display:flex!important;flex-wrap:nowrap!important;align-items:center!important;gap:6px!important;padding:7px 8px!important;margin-bottom:8px!important;min-width:0;overflow-x:auto}
 #product-shell #contact-followup-row>label{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}
 #product-shell #contact-followup-row :is(input,select,button){height:32px!important;min-height:32px!important;padding:4px 7px!important;font-size:11px!important;flex:0 0 auto;box-sizing:border-box}
 #product-shell #contact-followup-row #d-next-followup{width:124px!important;min-width:124px!important}
 #product-shell #contact-followup-row #d-se{width:104px!important;min-width:104px!important;max-width:104px!important}
 #product-shell #contact-followup-row #d-follower{width:78px!important;min-width:78px!important}
 #product-shell #contact-followup-row #d-owner{flex:1 1 130px;min-width:90px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}
 #product-shell #contact-followup-row button{white-space:nowrap}
}
@media screen and (max-width:767px){#product-shell #contact-followup-row :is(input,select,button){height:44px!important;min-height:44px!important}}

@media screen{#product-shell #controls-bar.hidden{display:none!important}}