/* AXLE ONE focused workspace. Loaded after the charcoal theme. */
/* Keep every list item available: visual caps scroll rather than truncate. */
:root{--focus-row-height:73px}
#dashboard{max-width:1480px}
.main{--page-gutter:clamp(18px,2.6vw,38px)}
.topbar,.main>.topbar{min-height:76px;margin-bottom:20px;padding-top:15px;padding-bottom:15px}
.topbar h1{font-size:clamp(23px,2vw,29px)}
.topbar p{margin-top:3px}
.panel{padding:19px 20px}
.panel h2{margin-bottom:11px}
.cols{gap:14px}
.stats{gap:10px;margin-bottom:14px}
.stats .stat{min-height:88px;padding:14px 17px;gap:5px}
.stats .stat strong{font-size:clamp(21px,2vw,27px)}
.stat small:empty{display:none}
.sectionhead{align-items:center;margin-bottom:9px}
.sectionhead h2,.sectionhead h3{margin:0}
.sectionhead .button{padding:6px 10px;font-size:11px;font-weight:600}
.item{padding:10px 0;gap:10px}
.item-main strong{font-size:12.5px}
.item-main small{margin-top:2px;line-height:1.45}
.item button{padding:6px 9px}
.muted,.fine-print{font-size:12px;line-height:1.55}
#nav{gap:12px}
#nav .nav-group{gap:1px;display:block}
#nav .nav-group>button{margin:2px 0}
#nav .nav-group>summary{
 display:flex;align-items:center;justify-content:space-between;gap:8px;
 cursor:pointer;padding:7px 11px;border-radius:8px;list-style:none;
}
#nav .nav-group>summary::-webkit-details-marker{display:none}
#nav .nav-group>summary::after{content:"+";font-size:15px;font-weight:500;color:#777}
#nav .nav-group[open]>summary::after{content:"−"}
#nav .nav-group>summary:hover{background:#1e1e1e;color:#e3e3e3}
#nav .nav-group>summary:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.nav-group-title{margin:0 0 3px}
#nav button{padding:9px 11px}
.sidebar{padding-top:20px}
/* Lists retain every loaded row and allow keyboard/touch scrolling. */
#dashboard .item-list,#dashboard .ava-priorities,#dashboard .ava-review-list,
#dashboard .workload-grid,#dashboard .ava-sources{
 scrollbar-width:none;-ms-overflow-style:none
}
#dashboard .item-list::-webkit-scrollbar,
#dashboard .ava-priorities::-webkit-scrollbar,
#dashboard .ava-review-list::-webkit-scrollbar,
#dashboard .ava-sources::-webkit-scrollbar{width:0;height:0;display:none}
#dashboard .item-list{
 max-height:365px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:auto;
}
#dashboard .item-list:focus-visible{
 outline:2px solid var(--gold);outline-offset:4px;border-radius:5px
}
#overview-section .overview-metrics{grid-template-columns:repeat(6,minmax(0,1fr))}
#overview-section .overview-primary{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
#overview-section .overview-primary>.panel{min-height:190px}
#overview-section .overview-primary .item-list{max-height:340px}
#overview-section .overview-more{margin-top:14px}
#overview-section .overview-more > .overview-more-title{
  margin:0;
  color:var(--text);
  font-size:13px;
  font-weight:700;
  line-height:1.5;
  letter-spacing:0;
}
#overview-section .overview-more .cols{margin-top:14px;grid-template-columns:repeat(2,minmax(0,1fr))}
#overview-section .overview-more>.cols>.panel{background:var(--panel)}
.disclosure-surface{
 border:1px solid var(--edge);background:var(--panel);border-radius:12px;
 padding:14px 18px;margin-top:14px;min-width:0
}
.disclosure-surface>summary,.inline-disclosure>summary,.entry-form-details>summary{
 cursor:pointer;color:var(--text);font-weight:700;font-size:13px;
 list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px
}
.disclosure-surface>summary::-webkit-details-marker,
.inline-disclosure>summary::-webkit-details-marker,
.entry-form-details>summary::-webkit-details-marker{display:none}
.disclosure-surface>summary::after,.inline-disclosure>summary::after,.entry-form-details>summary::after{
 content:"+";color:var(--muted);font:500 20px/1 Manrope,Arial,sans-serif;
 flex:0 0 auto
}
.disclosure-surface[open]>summary::after,
.inline-disclosure[open]>summary::after,
.entry-form-details[open]>summary::after{content:"−"}
.disclosure-surface>summary:hover,.inline-disclosure>summary:hover,
.entry-form-details>summary:hover{color:#fff}
.disclosure-surface>summary:focus-visible,.inline-disclosure>summary:focus-visible,
.entry-form-details>summary:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
.inline-disclosure{border-top:1px solid var(--edge);margin-top:17px;padding-top:13px}
.inline-disclosure[open]>summary{margin-bottom:13px}
.inline-disclosure .item-list{margin-top:9px}
.manual-collections-inner{padding-top:15px}
.manual-collections-inner>.panel,.manual-collections-inner>.cols{margin-top:0!important}
.manual-collections-inner>.cols{margin-top:14px!important}
#collections-section>.panel,#collections-section>.manual-collections{margin-bottom:14px}
#collections-section .panel h3{font-size:14px}
#collections-section #qbo-links-panel{margin-top:16px}
#collections-section #qbo-panel>.pair{margin:11px 0}
#collections-section #qbo-totals .stat,#collections-section #debtors-ageing .stat{min-height:88px}
/* Create/edit actions appear only on demand; forms and bindings stay mounted. */
.panel.entry-compact>.entry-form-details{margin-top:2px}
.entry-form-details>summary{padding:3px 0;min-height:26px}
.entry-form-details>summary::after{content:"+"}
.entry-form-details[open]>summary{margin-bottom:16px;border-bottom:1px solid var(--edge);padding-bottom:12px}
.entry-form-details[open]>.form-stack{margin-top:8px}
.entry-compact>.entry-description{font-size:12px}
.settings-advanced .button{margin:8px 0 2px}
#settings-section .panel{align-self:start}
#settings-section #account-info p{margin:8px 0}
#settings-section .settings-help .button{
 display:inline-flex;text-decoration:none;align-items:center;margin-top:4px
}
#qbo-auth-status{margin:4px 0 14px;line-height:1.5}
#qbo-callback-label[hidden],#qbo-auth-test-refresh[hidden]{display:none!important}
#ava-section .ava-layout{align-items:start}
#ava-section .ava-intro{padding:19px 21px}
#ava-section .ava-intro .muted{max-width:48ch}
#ava-section #ava-mode{display:none}
#ava-section .ava-notice{font-size:12px}
#dashboard .item-list .empty{font-size:12px}
/* Never let technical details dominate, even on small screens. */
@media(max-width:1240px){
 #overview-section .overview-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
 #overview-section .overview-more .cols{grid-template-columns:1fr}
}
@media(max-width:900px){
 .topbar{min-height:74px}
 #overview-section .overview-primary{grid-template-columns:1fr}
 .panel{padding:16px}
}
@media(max-width:600px){
 #overview-section .overview-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
 #overview-section .stats>.stat:last-child{grid-column:auto}
 .stats .stat{min-height:82px;padding:13px}
 .stats .stat strong{font-size:23px}
 .topbar{margin-bottom:16px}
 #dashboard .item-list{max-height:330px}
 .disclosure-surface{padding:13px 14px}
}

/* Unified UX rhythm: final layer for all 14 authenticated sections.
   One spacing scale; same button language at standard and compact sizes.
   Do not change data, interaction hooks, or the Spotify/AXLE palette. */
:root{
 --ui-section-gap:16px;
 --ui-grid-gap:16px;
 --ui-panel-pad:20px;
 --ui-action-height:38px;
 --ui-action-radius:9px;
}
#dashboard > section > * + *{margin-top:var(--ui-section-gap)}
#dashboard > section > .stats{margin-bottom:0}
#dashboard > section > .cols,
#dashboard > section > .stats,
#dashboard .workload-grid{gap:var(--ui-grid-gap)}
#dashboard .panel:not(.stat){padding:var(--ui-panel-pad)}
#dashboard .stats .stat{padding:14px 16px}
#dashboard .panel:not(.stat) > :first-child{margin-top:0}
#dashboard .sectionhead{
 display:flex;
 align-items:center;
 flex-wrap:wrap;
 column-gap:12px;
 row-gap:8px;
 margin-bottom:12px;
 min-width:0;
}
#dashboard .sectionhead > :is(h2,h3){margin:0;min-width:0;overflow-wrap:anywhere}
#dashboard .formactions,#dashboard .ava-insight-actions,
#dashboard .workload-actions{
 display:flex;align-items:center;flex-wrap:wrap;gap:10px;
}
#dashboard .button,#dashboard .item button,
#dashboard .workload-actions button,#dashboard .ava-insight-actions button,
#dashboard .mini,.axle-dialog-primary,.axle-dialog-secondary{
 box-sizing:border-box;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 text-align:center;
 gap:7px;
 border-radius:var(--ui-action-radius);
 border:1px solid #353535;
 background:#282828;
 color:#ffffff;
 font-family:Manrope,Arial,sans-serif;
 font-size:12px;
 font-weight:650;
 line-height:1.35;
 box-shadow:none;
 max-width:100%;
 text-decoration:none;
 transition:background-color .16s ease,border-color .16s ease,color .16s ease;
}
#dashboard .button,.axle-dialog-primary,.axle-dialog-secondary{
 min-height:var(--ui-action-height);padding:9px 14px;
}
#dashboard .sectionhead .button,#dashboard .item button,
#dashboard .mini,#dashboard .workload-actions button,
#dashboard .ava-insight-actions button{
 min-height:34px;padding:7px 11px;font-size:11.5px;
}
#dashboard .button:hover:not(:disabled),#dashboard .item button:hover:not(:disabled),
#dashboard .mini:hover:not(:disabled),
#dashboard .workload-actions button:hover:not(:disabled),
#dashboard .ava-insight-actions button:hover:not(:disabled),
.axle-dialog-secondary:hover:not(:disabled){
 background:#333333;border-color:#4d4d4d;color:#ffffff;filter:none;
}
#dashboard .button.primary,#dashboard .button-quick,
.axle-dialog-primary{
 background:var(--gold);border-color:var(--gold);
 color:#000000;font-weight:800;
}
#dashboard .button.primary:hover:not(:disabled),
#dashboard .button-quick:hover:not(:disabled),
.axle-dialog-primary:hover:not(:disabled){
 background:#f2c34a;border-color:#f2c34a;color:#000000;filter:none;
}
#dashboard button:disabled,.axle-dialog button:disabled{opacity:.55;cursor:not-allowed}
#dashboard .panel :is(.button,button):focus-visible,
.axle-dialog button:focus-visible{
 outline:2px solid var(--gold);outline-offset:2px;
}
#dashboard .form-stack{gap:14px}
#dashboard .pair{gap:14px}
#dashboard .panel .item-list{min-width:0}
#dashboard .panel :is(p,.muted,.fine-print){overflow-wrap:anywhere}
/* Ava uses the same card inset, while its nested insight cards remain compact. */
#ava-section .ava-intro{padding:var(--ui-panel-pad)}
/* Match the side-by-side grid gap when forms wrap to a single column. */
@media(max-width:900px){
 :root{--ui-grid-gap:14px;--ui-panel-pad:16px}
 #dashboard > section > * + *{margin-top:14px}
 #dashboard .panel:not(.stat){padding:var(--ui-panel-pad)}
 #ava-section .ava-intro{padding:var(--ui-panel-pad)}
}
@media(max-width:580px){
 #dashboard .sectionhead{align-items:flex-start;row-gap:10px}
 #dashboard .formactions > .button{flex:0 1 auto;white-space:normal}
}
@media(prefers-reduced-motion:reduce){
 #dashboard .button,#dashboard .item button,
 #dashboard .workload-actions button,#dashboard .ava-insight-actions button{
  transition:none!important
 }
}

/* Compact, complete workspace: maximise useful columns without squeezing content. */
:root{
 --ui-section-gap:14px;
 --ui-grid-gap:14px;
 --ui-panel-pad:18px;
}
#dashboard > section > * + *{margin-top:var(--ui-section-gap)}
#dashboard .panel:not(.stat){padding:var(--ui-panel-pad)}
#dashboard .stats .stat{padding:12px 14px}
#dashboard .sectionhead{margin-bottom:10px}
#dashboard .form-stack{gap:12px}
#dashboard .pair{gap:12px}
.ui-section-space{margin-top:var(--ui-section-gap)!important}
.ui-inline-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
#dashboard .panel>.form-stack:only-child{margin-top:0}
#dashboard .panel .sectionhead+.item-list{margin-top:4px}
#dashboard .panel .sectionhead:has(+ .item-list:empty){margin-bottom:8px}
/* The Settings cards can occupy one row at larger widths. */
#settings-section > .cols{
 display:grid;
 grid-template-columns:repeat(4,minmax(0,1fr));
 align-items:start;
}
#settings-section > .cols > .panel{min-width:0}
#settings-section .panel .formactions{gap:8px}
/* Plan results are two compact, independent lists instead of two full rows. */
#planner-section{
 display:grid;
 grid-template-columns:repeat(2,minmax(0,1fr));
 gap:var(--ui-section-gap) var(--ui-grid-gap);
 align-items:start;
}
#planner-section > .cols{grid-column:1/-1}
#planner-section > .panel{margin-top:0!important}
#planner-section > .panel > .item-list{max-height:350px}
/* The estimator takes the main column, while saved quotes and rates share the side. */
@media(min-width:1181px){
 #quotes-section{
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr);
  gap:var(--ui-grid-gap);
  align-items:start;
 }
 #quotes-section > .cols{display:contents}
 #quotes-section > .cols > .panel:first-child{grid-column:1;grid-row:1 / span 2}
 #quotes-section > .cols > .panel:last-child{grid-column:2;grid-row:1}
 #quotes-section > .panel{grid-column:2;grid-row:2;margin-top:0!important}
 #quotes-section > .panel .cols{grid-template-columns:minmax(0,1fr)}
}
/* AVA feels like a place to work with her, not a sequence of reports. */
#ava-section .ava-home-layout{
 display:grid;
 grid-template-columns:minmax(0,1.6fr) minmax(330px,.9fr);
 align-items:start;
 gap:var(--ui-grid-gap);
 min-width:0;
}
#ava-section .ava-home-sidebar{display:grid;gap:var(--ui-grid-gap);min-width:0}
#ava-section .ava-chat-panel{
 margin:0;
 display:flex;
 flex-direction:column;
 gap:14px;
 min-width:0;
 min-height:505px;
 max-height:min(710px,calc(100dvh - 110px));
 background:var(--panel);
 border-color:var(--edge);
}
#ava-section .ava-chat-heading{align-items:center}
#ava-section .ava-chat-heading h2{font-size:18px}
#ava-section .ava-chat-transcript{
 flex:1 1 auto;
 min-height:0;
 max-height:none;
 overflow-y:auto;
}
#ava-section .ava-chat-welcome{
 display:flex;
 flex:1 1 auto;
 min-height:180px;
 flex-direction:column;
 align-items:flex-start;
 justify-content:center;
 gap:10px;
 padding:12px clamp(0px,2vw,25px);
}
#ava-section .ava-chat-welcome h3{
 font-size:clamp(17px,2vw,23px);
 letter-spacing:-.5px;
 line-height:1.3;
 margin:0;
}
#ava-section .ava-chat-welcome p{
 margin:0;
 max-width:48ch;
 font-size:13px;
 color:var(--muted);
 line-height:1.65;
}
#ava-section .ava-chat-transcript:not(:empty) ~ .ava-chat-welcome{display:none}
:is(#ava-section, #ava-checkin-main-chat-host) .ava-starter-prompts{
 display:flex;
 flex-wrap:wrap;
 gap:8px;
 margin-top:12px;
}
:is(#ava-section, #ava-checkin-main-chat-host) .ava-starter-prompts button{
 display:inline-flex;
 align-items:center;
 padding:8px 12px;
 min-height:34px;
 max-width:100%;
 border:1px solid #3e3e3e;
 border-radius:999px;
 background:#282828;
 color:#fff;
 font:600 11.5px/1.3 Manrope,Arial,sans-serif;
 cursor:pointer;
}
:is(#ava-section, #ava-checkin-main-chat-host) .ava-starter-prompts button:hover{background:#333;border-color:#555}
:is(#ava-section, #ava-checkin-main-chat-host) .ava-starter-prompts button:focus-visible{
 outline:2px solid var(--gold);outline-offset:2px;
}
#ava-section .ava-chat-form{margin-top:auto}
#ava-section .ava-chat-form textarea{min-height:38px}
#ava-section .ava-chat-footnote{font-size:10.5px}
#ava-section .ava-chat-user{background:#191919;border-color:#353535}
#ava-section .ava-home-sidebar .ava-review-panel{margin:0}
#ava-section .ava-daily-panel .sectionhead{justify-content:space-between}
#ava-section .ava-daily-panel .sectionhead h3{font-size:13px}
#ava-section .ava-totals{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:7px;
 margin:10px 0 18px;
}
#ava-section .ava-totals>.stat{
 grid-column:auto;
 padding:11px 9px;
 min-height:72px;
 border-radius:10px;
}
#ava-section .ava-totals>.stat span,
#ava-section .ava-totals>.stat small{
 font-size:10px;
 line-height:1.3;
}
#ava-section .ava-totals>.stat strong{font-size:21px}
#ava-section .ava-notice{min-height:0;margin:7px 0 10px}
/* A 280px scroll window cut off the bottom border and second action row
 * of Ava's priority cards. Scroll multiple insights, never half a card:
 * the renderer supplies the first card's measured height on narrow widths. */
#ava-section .ava-priorities{
 max-height:max(380px,var(--ava-priority-first-height,0px));
 overflow-y:auto;
 overflow-x:hidden;
 overscroll-behavior:contain;
 scroll-padding-bottom:8px;
 padding-right:2px;
}
#ava-section .ava-priorities>.ava-insight{
 box-sizing:border-box;
 gap:8px
}
#ava-section .ava-priorities .ava-insight-actions{margin-top:0}
#ava-section .ava-quick-actions{margin:12px 0 0;gap:8px}
#ava-section .ava-review-panel > p.muted{margin:4px 0 0}
#ava-section .ava-review-list{margin-top:10px}
#ava-section .ava-more{margin-top:var(--ui-section-gap)}
#ava-section .ava-more[open] > summary{margin-bottom:14px}
#ava-section .ava-more-grid{
 display:grid;
 grid-template-columns:repeat(2,minmax(0,1fr));
 gap:var(--ui-grid-gap);
 align-items:start;
}
#ava-section .ava-schedule-panel h2{margin:0 0 12px}
#ava-section .ava-schedule-panel .ava-capacity{margin-top:0}
#ava-section .ava-knowledge-panel{margin:0}
#ava-section #ava-live-panel{margin-top:var(--ui-grid-gap)}
#ava-section .ava-live-check{max-width:100%}
/* Support narrower laptops first; mobile layouts never force columns. */
@media(max-width:1250px){
 #settings-section > .cols{grid-template-columns:repeat(2,minmax(0,1fr))}
 #ava-section .ava-home-layout{grid-template-columns:minmax(0,1.2fr) minmax(300px,1fr)}
}
@media(max-width:1000px){
 #ava-section .ava-home-layout{grid-template-columns:minmax(0,1fr)}
 #ava-section .ava-chat-panel{max-height:none;min-height:390px}
 #ava-section .ava-home-sidebar{grid-template-columns:repeat(2,minmax(0,1fr))}
 #ava-section .ava-more-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:900px){
 :root{--ui-panel-pad:16px;--ui-grid-gap:12px;--ui-section-gap:12px}
 #dashboard .panel:not(.stat){padding:var(--ui-panel-pad)}
 #quotes-section > .cols{display:grid}
 #planner-section{grid-template-columns:minmax(0,1fr)}
 #planner-section > .cols{grid-column:auto}
 #planner-section > .panel{grid-column:auto}
 #ava-section .ava-chat-panel{min-height:380px}
}
@media(max-width:650px){
 #settings-section > .cols{grid-template-columns:minmax(0,1fr)}
 #ava-section .ava-home-sidebar{grid-template-columns:minmax(0,1fr)}
 #ava-section .ava-totals{grid-template-columns:repeat(3,minmax(0,1fr))}
 #ava-section .ava-chat-welcome{min-height:140px;padding:8px 0}
 #ava-section .ava-chat-panel{min-height:350px}
 #ava-section .ava-more-grid{grid-template-columns:minmax(0,1fr)}
}

/* Compact mailbox tools: prominent sync controls, advanced actions on demand. */
#email-intake .item-actions{gap:7px}
#email-intake .email-row-more{position:relative;display:inline-block;min-width:0}
#email-intake .email-row-more>summary{
  list-style:none;cursor:pointer;border:1px solid var(--edge);
  border-radius:9px;padding:7px 10px;color:var(--text);
  font-size:12px;font-weight:650;user-select:none;
}
#email-intake .email-row-more>summary::-webkit-details-marker{display:none}
#email-intake .email-row-more>summary::after{content:"";display:none}
#email-intake .email-row-more>summary:hover{background:var(--hover)}
#email-intake .email-row-more>summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
#email-intake .email-row-more-content{
  position:absolute;z-index:15;right:0;top:calc(100% + 5px);
  display:grid;gap:5px;min-width:132px;padding:9px;
  background:var(--panel);border:1px solid var(--edge);border-radius:10px;
  box-shadow:0 6px 25px rgba(0,0,0,.24);
}
#email-intake .email-row-more-content button{width:100%}
#email-import-progress{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;
  gap:10px;margin:12px 0;padding:12px 14px;border:1px solid var(--edge);
  border-radius:10px
}
#email-import-progress[hidden],#email-import-stop[hidden]{display:none!important}
#email-import-status{margin:0;flex:1;min-width:220px}
@media(max-width:600px){
 #email-intake .item-actions{width:100%;justify-content:flex-start}
 #email-intake .email-row-more-content{left:0;right:auto}
}

/* Equal-height rows — size from actual content, never from blank padding.
 * Grid tracks grow with the tallest card. Paired panels stretch into those
 * tracks and organise their form actions / lists within the available height.
 * When columns stack, each card returns to its natural content height. */
#dashboard .cols,
#dashboard .stats,
#dashboard .workload-grid,
#overview-section .overview-primary,
#planner-section,
#settings-section > .cols,
#ava-section .ava-home-layout,
#ava-section .ava-home-sidebar,
#ava-section .ava-more-grid {
  align-items:stretch;
}
#dashboard .cols > .panel,
#dashboard .workload-grid > .workload-member,
#settings-section > .cols > .panel,
#planner-section > .panel,
#ava-section .ava-more-grid > .panel {
  align-self:stretch;
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
}
#dashboard .stats > .stat {
  align-self:stretch;
  min-width:0;
  min-height:0;
}
/* Forms use remaining card space; actions remain aligned without spacer blocks. */
#dashboard .cols > .panel > .form-stack,
#settings-section > .cols > .panel > .form-stack {
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  min-height:0;
}
#dashboard .cols > .panel > .form-stack > :is(.formactions,button[type="submit"]),
#settings-section > .cols > .panel > .form-stack > :is(.formactions,button[type="submit"]) {
  margin-top:auto;
}
#dashboard .cols > .panel > :is(.item-list,.ava-review-list),
#settings-section > .cols > .panel > .item-list {
  flex:1 1 auto;
  min-height:0;
}
#settings-section > .cols > .panel > .account-actions,
#settings-section > .cols > .settings-help > .button {
  margin-top:auto;
}
/* Results and details can expand the whole grid row. No fixed panel height,
 * clipped text, or oversized bottom padding is used to simulate equality. */
#planner-section > .cols,
#planner-section > .panel,
#quotes-section > .cols > .panel,
#quotes-section > .panel,
#ava-section .ava-more-grid > .panel {
  align-self:stretch;
  min-width:0;
  min-height:0;
}
@media(min-width:1181px) {
  #quotes-section { align-items:stretch; }
}
/* One conversation column, one sidebar column: both share a natural row.
 * Keep message scrolling inside Ava; don't cap the conversation card itself. */
#ava-section .ava-home-layout { align-items:stretch; }
#ava-section .ava-home-sidebar { align-self:stretch; align-content:start; }
#ava-section .ava-chat-panel {
  align-self:stretch;
  max-height:none;
  height:auto;
  min-height:505px;
}
#ava-section .ava-chat-transcript { overflow-y:auto; min-height:0; }
#ava-section .ava-home-sidebar > .panel {
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
}
#ava-section .ava-daily-panel > .ava-quick-actions {
  margin-top:auto;
  padding-top:12px;
}
#ava-section .ava-more-grid { align-items:stretch; }
/* Columnar card alignment ends naturally when the layout becomes single-column. */
@media(max-width:1050px) {
  #dashboard .cols > .panel > .form-stack { flex:0 1 auto; }
  #dashboard .cols > .panel > .form-stack > :is(.formactions,button[type="submit"]) {
    margin-top:0;
  }
}
@media(max-width:1000px) {
  #ava-section .ava-chat-panel { min-height:390px; }
  #ava-section .ava-home-sidebar { align-content:normal; }
}
@media(max-width:650px) {
  #ava-section .ava-chat-panel { min-height:350px; }
}

/* Email review excerpts display as plain text, never render email HTML. */
#email-review-list .email-source-preview{
 display:grid;gap:5px;width:100%;border:1px solid var(--edge);
 border-radius:9px;padding:12px;margin:8px 0;background:var(--panel);
}
#email-review-list .email-source-preview p{
 margin:2px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;
 font-size:12px;line-height:1.6;max-height:220px;overflow:auto;
 scrollbar-width:none;
}
#email-review-list .email-source-preview p::-webkit-scrollbar{display:none}
#email-review-list .email-source-preview small{color:var(--muted);word-break:break-word}
.ava-email-summary .sectionhead h2{font-size:15px}
.ava-email-summary .muted{margin:0}

/* Header and all 14 tab contents share one horizontal alignment contract.
   Keep the header's background/border full width, while its title and
   actions follow the same centred 1480px content edges as the cards. */
:root{--workspace-content-max:1480px}
#dashboard{max-width:var(--workspace-content-max)}
.main > .topbar > .topbar-inner{
  width:100%;
  max-width:var(--workspace-content-max);
  margin-inline:auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:12px 20px;
  min-width:0;
}
.main > .topbar > .topbar-inner > .topbar-heading{min-width:0}
.main > .topbar > .topbar-inner > .actions{
  margin-left:auto;
  width:auto;
  justify-content:flex-end;
  flex-shrink:0;
}
/* Titles remain left-aligned and actions right-aligned even when a small
   viewport requires the two groups to wrap into separate rows. */
@media(max-width:580px){
  .main > .topbar > .topbar-inner{
    gap:8px 12px;
    align-items:center;
  }
  .main > .topbar > .topbar-inner > .topbar-heading{flex:0 1 auto}
  .main > .topbar > .topbar-inner > .actions{
    margin-left:auto;
    width:auto;
    justify-content:flex-end;
  }
}

/* Quiet workspace operations. The global banner is for errors only.
   Align error alerts to precisely the same 1480px content edges as cards and
   header actions, including compact/mobile layouts. No success/loading bars. */
#status[hidden],#status:not(.error){display:none!important}
.main > #status.error:not([hidden]){
  box-sizing:border-box;
  display:block;
  width:100%;
  max-width:var(--workspace-content-max);
  margin:0 auto var(--ui-section-gap);
  padding:12px 16px;
  min-width:0;
  border:1px solid #8e4637;
  border-radius:10px;
  background:#392b2b;
  color:#ffb7ae;
  font-size:12px;
  line-height:1.5;
  overflow-wrap:anywhere;
}

/* Ava's empty conversation: a calm, centred invitation until the first reply.
   Keep content and starter actions in the usable centre of the chat panel,
   rather than pinning them to a new card or adding decorative report blocks. */
#ava-section .ava-chat-welcome{
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  min-width:0;
  width:100%;
  gap:18px;
  padding:24px 14px;
  text-align:center;
}
#ava-section .ava-chat-welcome .ava-chat-ready{
  margin:0;
  color:#ffffff;
  font:700 clamp(28px,2.6vw,34px)/1.24 Manrope,Arial,sans-serif;
  letter-spacing:-.85px;
}
:is(#ava-section, #ava-checkin-main-chat-host) .ava-starter-prompts{
  margin-top:0;
  justify-content:center;
  align-items:center;
  gap:9px;
  max-width:590px;
}
:is(#ava-section, #ava-checkin-main-chat-host) .ava-starter-prompts button{
  border-radius:10px;
  min-height:36px;
  padding:9px 13px;
  font-size:12px;
  white-space:normal;
  text-align:center;
}
/* Once a message is present, the welcome state relinquishes all space. */
#ava-section .ava-chat-transcript:not(:empty) ~ .ava-chat-welcome,
#ava-section .ava-chat-welcome[hidden]{display:none!important}
/* Use a centred one-line composer while retaining manual multiline resizing. */
#ava-section .ava-chat-form{
  align-items:center;
}
#ava-section .ava-chat-form textarea{
  align-self:center;
  box-sizing:border-box;
  height:41px;
  min-height:41px;
  padding:10px 2px!important;
  line-height:20px!important;
}
@media(max-width:650px){
  #ava-section .ava-chat-welcome{padding:18px 4px;gap:14px}
  #ava-section .ava-chat-welcome .ava-chat-ready{font-size:clamp(26px,6.5vw,29px)}
  :is(#ava-section, #ava-checkin-main-chat-host) .ava-starter-prompts{gap:8px}
}

/* Cards in the same CSS grid row must share the row's natural height.
 * Grid tracks (not padding or hard-coded card heights) determine equality.
 * Existing compact/mobile one-column stacks stay independent. */
#dashboard .cols,
#dashboard .stats,
#dashboard .workload-grid,
#overview-section .overview-primary,
#overview-section .overview-more > .cols,
#settings-section .settings-overview-grid{
 align-items:stretch
}
#dashboard .cols > .panel,
#dashboard .workload-grid > .workload-member,
#settings-section .settings-overview-grid > .panel{
 align-self:stretch;min-width:0
}

/* Ava: chat and both right-hand cards form ONE grid row on desktop.
 * The sidebar (not message count) can raise the row height. The transcript
 * uses its available space and scrolls; the composer stays at the bottom. */
#ava-section .ava-home-layout{align-items:stretch}
#ava-section .ava-home-sidebar{
 align-self:stretch;align-content:stretch;
 grid-template-rows:auto minmax(min-content,1fr)
}
#ava-section .ava-chat-panel{
 box-sizing:border-box;
 height:auto;
 min-height:clamp(505px,calc(100dvh - 50px),785px);
 max-height:none;
 align-self:stretch;
 overflow:hidden
}
/* The 0px flex basis and zero nominal height exclude long messages from
 * intrinsic CSS grid sizing, while flex-grow fills the existing chat card.
 * No messages are clipped: scrolling stays inside this transcript. */
#ava-section .ava-chat-transcript{
 flex:1 1 0px;height:0;min-height:0;max-height:none;
 overflow-y:auto;overflow-x:hidden;
 overscroll-behavior:contain;align-content:start;
 grid-auto-rows:max-content;scrollbar-width:none!important
}
#ava-section .ava-chat-form{flex:0 0 auto;margin-top:auto}
#ava-section .ava-chat-welcome{flex:1 1 auto;min-height:0}

/* The review panel grows to the chat's height when it is the shorter column.
 * An empty state is vertically centred in that real content area; populated
 * proposals retain their normal top-aligned list flow. */
#ava-section .ava-review-panel .ava-review-list{
 flex:1 1 auto;min-height:0;align-content:start
}
#ava-section .ava-review-panel .ava-review-list:has(> .ava-empty:only-child){
 align-content:stretch;grid-template-rows:minmax(90px,1fr)
}
#ava-section .ava-review-panel .ava-review-list > .ava-empty:only-child{
 display:grid;place-items:center;margin:0;min-height:90px
}

/* Stacked breakpoints are separate rows. Retain the existing comfortable
 * conversation viewport instead of stretching chat to a later sidebar row. */
@media(max-width:1000px){
 #ava-section .ava-home-sidebar{grid-template-rows:auto;align-content:normal}
 #ava-section .ava-chat-panel{
  height:clamp(390px,calc(100dvh - 140px),700px);
  min-height:0
 }
}
@media(max-width:650px){
 #ava-section .ava-chat-panel{
  height:clamp(350px,calc(100dvh - 180px),650px);
  min-height:0
 }
}

/* Clients: contacts first, compact QuickBooks refresh, expandable Add Client. */
#clients-section > .clients-grid{
  grid-template-columns:minmax(0,1.28fr) minmax(0,1fr);
  align-items:stretch;
}
#clients-section > .clients-grid > .panel{min-width:0}
#clients-section .clients-list-panel .sectionhead{
  justify-content:space-between;
  align-items:center;
  margin-bottom:12px;
}
#clients-section .clients-sync-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 34px;
  width:34px;
  height:34px;
  min-height:34px;
  padding:0!important;
  border:1px solid #3e3e3e;
  border-radius:9px;
  background:#282828;
  color:#fff;
  cursor:pointer;
}
#clients-section .clients-sync-button svg{display:block;width:16px;height:16px;flex:none}
#clients-section .clients-sync-button:hover:not(:disabled){
  background:#333333;border-color:#4d4d4d;
}
#clients-section .clients-sync-button:focus-visible{
  outline:2px solid var(--gold);outline-offset:2px;
}
#clients-section .clients-sync-button:disabled{cursor:not-allowed;opacity:.55}
#clients-section .clients-sync-button.is-syncing svg{
  animation:axle-client-sync-rotation 1s linear infinite;
}
@keyframes axle-client-sync-rotation{to{transform:rotate(360deg)}}
#clients-section #qbo-clients-import-status{
  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;
}
#clients-section .client-create-panel{position:relative}
#clients-section .client-create-panel > h2{
  margin:0 42px 8px 0;
  line-height:1.4;
}
#clients-section .client-create-panel > .entry-description{margin:0}
#clients-section .client-create-panel > .entry-form-details{margin-top:0}
#clients-section .client-create-panel > .entry-form-details > summary{
  position:absolute;
  top:15px;
  right:17px;
  width:34px;
  height:34px;
  min-height:34px;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:0;
  margin:0;
  border:1px solid #3e3e3e;
  border-radius:9px;
  background:#282828;
  font-size:0;
  line-height:1;
}
#clients-section .client-create-panel > .entry-form-details > summary::after{
  font-size:19px;
  margin:0;
}
#clients-section .client-create-panel > .entry-form-details > summary:hover{
  background:#333333;border-color:#4d4d4d;
}
#clients-section .client-create-panel > .entry-form-details[open] > summary{
  padding:0;margin:0;border-bottom:1px solid #3e3e3e;
}
#clients-section .client-create-panel > .entry-form-details[open] > .form-stack{
  margin-top:18px;
}
@media(max-width:1240px){
  #clients-section > .clients-grid{grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){
  #clients-section .clients-sync-button.is-syncing svg{animation:none}
}

/* Connected application shell (Railway/Monday-inspired).
 * Keep the existing sidebar geometry and #000000 surface untouched.
 * Let the same black run through the slim topbar and around the curved
 * content canvas. Inner cards retain their original widths and spacing. */
#app.shell { background:var(--side); }
#app > .main {
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  background:var(--side);
  background-image:none;
  padding:0;
  margin:0;
  max-width:none;
  min-height:100dvh;
}
#app > .main > .topbar {
  box-sizing:border-box;
  flex:0 0 56px;
  height:56px;
  min-height:56px;
  margin:0;
  padding:8px calc(var(--page-gutter) + 10px);
  border:0;
  border-radius:0;
  background:var(--side);
  box-shadow:none;
  gap:0;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:flex-end;
  z-index:11;
}
#app > .main > .topbar > .topbar-inner {
  min-height:0;
  height:100%;
  flex-wrap:nowrap;
  gap:0;
}
#app > .main > .topbar .workspace-page-identity {
  /* Page identity remains available to screen readers and existing routing,
     but no longer takes space or creates a large page header. */
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  margin:-1px!important;
  padding:0!important;
  overflow:hidden!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
  border:0!important;
}
#app > .main > .topbar .actions {
  margin-left:auto;
  width:auto;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:flex-end;
}
#app > .main > .workspace-surface {
  box-sizing:border-box;
  flex:1 0 auto;
  min-width:0;
  min-height:calc(100dvh - 56px);
  margin:0 10px;
  padding:60px var(--page-gutter) 88px;
  background:var(--bg);
  border:1px solid var(--edge);
  border-bottom:0;
  border-radius:18px 18px 0 0;
  box-shadow:none;
}
#app > .main > .workspace-surface > #dashboard {
  width:100%;
  max-width:var(--workspace-content-max);
  margin-inline:auto;
}
#app > .main > .workspace-surface > #status.error:not([hidden]) {
  box-sizing:border-box;
  display:block;
  width:100%;
  max-width:var(--workspace-content-max);
  margin:0 auto var(--ui-section-gap);
  padding:12px 16px;
  min-width:0;
  border:1px solid #8e4637;
  border-radius:10px;
  background:#392b2b;
  color:#ffb7ae;
  font-size:12px;
  line-height:1.5;
  overflow-wrap:anywhere;
}
@media (min-width:751px) and (max-width:1050px) {
  #app > .main > .workspace-surface { padding-top:48px; }
}
@media(max-width:750px) {
  #app > .main > .topbar {
    height:52px;
    min-height:52px;
    flex-basis:52px;
    padding:6px calc(var(--page-gutter) + 8px);
  }
  #app > .main > .workspace-surface {
    min-height:calc(100dvh - 52px);
    margin:0 8px;
    padding:40px var(--page-gutter) calc(106px + env(safe-area-inset-bottom));
    border-radius:15px 15px 0 0;
  }
}
@media(max-width:370px){
  #app > .main > .topbar { padding-inline:calc(var(--page-gutter) + 6px); }
  #app > .main > .workspace-surface {
    margin-inline:6px;
    border-radius:13px 13px 0 0;
  }
}

/* Finish the connected shell: the content begins at the sidebar edge.
 * Remove only decorative sidebar borders, not its width or padding. */
#app > .sidebar {
  border-right:0!important;
}
#app > .sidebar .signature {
  border-bottom:0!important;
}
#app > .main > .workspace-surface {
  margin-left:0;
  border-left:0;
}
#app > .main > .topbar {
  padding-left:var(--page-gutter);
  /* The right-hand 10px canvas inset remains, so the date must match it. */
  padding-right:calc(var(--page-gutter) + 10px);
}
#app > .main > .topbar .topbar-date {
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
/* Sidebar sections remain plain, non-collapsible groups and all
 * destination buttons stay visible at desktop and in the mobile drawer. */
#nav > .nav-group {
  display:block;
}
#nav > .nav-group > .nav-group-title {
  display:block;
}
@media(max-width:750px){
  /* The existing mobile content inset stays in place. */
  #app > .main > .workspace-surface {
    margin-left:8px;
    border-left:1px solid var(--edge);
  }
  #app > .main > .topbar {
    padding-inline:calc(var(--page-gutter) + 8px);
  }
}
@media(max-width:370px){
  #app > .main > .workspace-surface { margin-left:6px; }
  #app > .main > .topbar {
    padding-inline:calc(var(--page-gutter) + 6px);
  }
}

/* Balanced inset frame. Cards sit equally far from the curved panel's top,
   left and right edges; the panel itself is narrower so the original sidebar
   has a little more clear black space on its right. No changes to nav width. */
#app > .sidebar { padding-right:24px; }
#app > .main > .workspace-surface {
  margin-inline:20px;
  padding:60px 60px 88px;
  border-left:1px solid var(--edge);
}
#app > .main > .workspace-surface > #dashboard,
#app > .main > .workspace-surface > #status.error:not([hidden]) {
  max-width:none;
}
@media (max-width:1240px){
  #app > .sidebar { padding-right:20px; }
}
@media (max-width:1050px){
  #app > .main > .workspace-surface {
    margin-inline:16px;
    padding:48px 48px 88px;
  }
}
@media (max-width:750px){
  #app > .main > .workspace-surface {
    margin-inline:8px;
    padding:40px 40px calc(106px + env(safe-area-inset-bottom));
  }
}
@media (max-width:370px){
  #app > .main > .workspace-surface {
    margin-inline:6px;
    padding:32px 32px calc(106px + env(safe-area-inset-bottom));
  }
}

/* Viewport-locked application frame.
 * Only the curved content canvas scrolls. The sidebar retains its own
 * independent navigation scroll; nested lists and Ava retain theirs.
 * The document, topbar and curved panel outline never move. */
html,body{
  height:100%;
  overflow:hidden;
  overscroll-behavior:none;
}
#app.shell{
  height:100dvh;
  min-height:0;
  overflow:hidden;
}
#app > .main{
  flex:1 1 auto;
  height:100dvh;
  min-height:0;
  min-width:0;
  overflow:hidden;
}
#app > .main > .topbar{
  flex:0 0 56px;
  height:56px;
  min-height:56px;
}
#app > .main > .workspace-surface{
  flex:1 1 0;
  height:auto;
  min-height:0;
  max-height:none;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior-y:contain;
  scroll-behavior:auto;
  scroll-padding-top:24px;
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}
#app > .main > .workspace-surface::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}
#app > .main > .workspace-surface:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:-3px;
}
/* Keep mobile's original bottom navigation outside the scrollable panel.
 * A smaller screen still has one primary scroll surface, not body scrolling. */
@media(max-width:900px){
  #app.shell{display:block}
  #app > .main{
    width:100%;
    height:100dvh;
  }
}
@media(max-width:750px){
  #app > .main > .topbar{
    flex-basis:52px;
    height:52px;
    min-height:52px;
  }
  #app > .main > .workspace-surface{
    scroll-padding-bottom:calc(106px + env(safe-area-inset-bottom));
  }
}

/* Checkbox audit: field-wide text-input sizing had been inherited by native
   checkboxes, pushing ticks below their labels. Keep labels on one flex row
   and restore true 18px controls wherever a form nests the input in a label. */
.form-stack label:has(> input[type="checkbox"]){
 display:flex!important;flex-direction:row!important;align-items:center!important;
 justify-content:flex-start;gap:11px!important;min-width:0;
 line-height:1.5;cursor:pointer
}
.form-stack label > input[type="checkbox"]{
 flex:0 0 18px!important;align-self:center!important;
 width:18px!important;height:18px!important;
 min-width:18px!important;min-height:18px!important;
 max-width:18px!important;max-height:18px!important;
 padding:0!important;margin:0!important;
 box-sizing:border-box;accent-color:var(--gold,#e7b122)
}
.form-stack label:has(> input[type="checkbox"]) > span{
 display:block;flex:1 1 auto;min-width:0;overflow-wrap:anywhere
}

/* AXLE ONE global expand/collapse indicator contract:
 * + is closed, − is open, on every content disclosure.
 * Action menus (three-dot integrations and email "More") are not accordions.
 * Calendar, select and navigation popovers keep their own affordances.
 * The same rule covers static HTML and future details-based panels. */
#dashboard details:not(.ava-integration-menu):not(.email-row-more) > summary{
 list-style:none;
}
#dashboard details:not(.ava-integration-menu):not(.email-row-more) > summary::-webkit-details-marker{
 display:none;
}
#dashboard details:not(.ava-integration-menu):not(.email-row-more) > summary::after{
 content:"+";
 display:block;
 flex:0 0 20px;
 width:20px;
 height:auto;
 color:var(--muted,#b3b3b3);
 font:500 20px/1 Manrope,Arial,sans-serif;
 text-align:center;
 border:0;
 background:none;
 box-shadow:none;
 padding:0;
 margin:0;
 transform:none;
 transition:none;
}
#dashboard details:not(.ava-integration-menu):not(.email-row-more)[open] > summary::after{
 content:"−";
 transform:none;
}
/* The email Review task button also expands an inline editor, not a menu.
 * Render its state with the same glyphs without changing its action label. */
#dashboard #email-review-list button[aria-expanded]{
 display:inline-flex;align-items:center;justify-content:center;gap:8px;
}
#dashboard #email-review-list button[aria-expanded]::after{
 content:"+";
 color:currentColor;
 font:500 18px/1 Manrope,Arial,sans-serif;
}
#dashboard #email-review-list button[aria-expanded="true"]::after{content:"−";}

/* Unified client work: compact native task brief. Keep existing task row size. */
#task-list .native-task-brief{margin-top:8px;max-width:100%;font-size:12px;color:var(--muted,#aeb2b8)}
#task-list .native-task-brief summary{width:max-content;max-width:100%;cursor:pointer;font-weight:600}
#task-list .native-task-brief p{white-space:pre-wrap;line-height:1.55;max-width:70ch;overflow-wrap:anywhere;margin:8px 0 4px}
#task-list .native-task-brief a{display:inline-block;margin-top:5px;text-decoration:underline;text-underline-offset:2px}
#task-list .native-task-brief summary:focus-visible{outline:2px solid currentColor;outline-offset:3px}

/* The supplied Axle One SVG is the complete icon, wordmark and subbrand.
   Keep it vector-sharp at the current sidebar width without changing shell
   geometry, adding synthetic A/1 text, or clipping the mobile close button. */
#app > .sidebar .signature-logo{
 display:block;
 width:195px;
 max-width:100%;
 height:auto;
 max-height:52px;
 min-width:0;
 flex:0 1 195px;
 object-fit:contain;
 object-position:left center
}
@media(max-width:900px){
 #app > .sidebar .signature-logo{max-width:calc(100% - 43px)}
}
