/* Preserved source70 auxiliary read-only components; current approved palette/layout remain authoritative. */
.visual-blocked-reason{display:block;font-size:calc(14px * var(--font-scale));line-height:1.5;color:var(--muted);margin-top:8px;white-space:normal;overflow-wrap:anywhere}
.visual-square{display:inline-flex;justify-content:center;align-items:center;width:22px;height:22px;flex-shrink:0;border:2px solid var(--control-border);border-radius:4px;background:var(--white);color:var(--on-primary)}
.visual-square svg{width:17px;height:17px}
.visual-square.is-checked{background:var(--primary);border-color:var(--primary)}
.visual-square.is-blocked{background:var(--surface-soft);border-style:dashed}
.visual-completion{align-self:start;color:var(--green)}
.visual-completion:hover{background:var(--surface-soft)!important}
.visual-square.is-checked{background:Highlight;color:HighlightText}
.visual-square.is-blocked{border-style:dashed}
.visual-draft-completion{gap:10px!important;font-size:calc(14px * var(--font-scale))}
.visual-task-progress{font-size:calc(14px * var(--font-scale));color:var(--muted);margin:10px 0}
.visual-calendar-detail{position:fixed;inset:auto;margin:0;width:400px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow:auto;padding:24px;border:1px solid var(--control-border);border-radius:calc(16px * var(--radius-scale));background:var(--white);color:var(--ink);box-shadow:0 12px 32px rgba(23,38,40,.20)}
.visual-calendar-detail::backdrop{background:rgba(23,38,40,.20)}
.visual-calendar-head{display:flex;gap:12px;align-items:flex-start;justify-content:space-between}.visual-calendar-head h2{font-size:calc(24px * var(--font-scale));line-height:1.35;overflow-wrap:anywhere}.visual-calendar-head .icon-button{flex-shrink:0}.visual-calendar-project{color:var(--muted);font-size:calc(14px * var(--font-scale));margin:12px 0 24px}.visual-calendar-properties{display:grid;gap:12px}.visual-calendar-properties>div{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px}.visual-calendar-properties dt{color:var(--muted)}.visual-calendar-properties dd{margin:0}.visual-calendar-properties small{display:block;color:var(--muted);font-size:calc(14px * var(--font-scale));margin-top:4px}.visual-calendar-description{white-space:pre-wrap;overflow-wrap:anywhere;margin-top:20px}.visual-calendar-children{border-top:1px solid var(--line);padding-top:20px;margin-top:20px}.visual-calendar-children h3{font-size:calc(16px * var(--font-scale))}.visual-calendar-children ul{list-style:none;padding:0;margin:12px 0}.visual-calendar-children li{display:flex;gap:12px;padding:10px 0;align-items:flex-start}.visual-calendar-children small{display:block;color:var(--muted);font-size:calc(14px * var(--font-scale))}.visual-calendar-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px;margin-top:24px}.visual-calendar-actions .button{flex:1}
@media(max-width:700px){.visual-calendar-detail{inset:auto 0 0!important;width:100%;max-width:none;max-height:85dvh;margin:0;border-radius:16px 16px 0 0;padding:24px 20px calc(24px + env(safe-area-inset-bottom))}.visual-calendar-detail::before{content:"";display:block;width:36px;height:4px;background:var(--line);border-radius:2px;margin:-12px auto 20px}.visual-calendar-head h2{font-size:calc(24px * var(--font-scale))}}
.visual-calendar-project,.visual-calendar-properties dd,.visual-calendar-children li>span:last-child{min-width:0;overflow-wrap:anywhere}.visual-calendar-properties .due{max-width:100%;white-space:normal}.visual-calendar-children .visual-square{flex-shrink:0}
/* Dashboard presentation only. Existing appearance tokens and saved palettes win. */
:root{--dashboard-space:24px;--dashboard-complete:#456f45;--dashboard-on-complete:#ffffff}
[data-density="compact"]{--dashboard-space:16px}
[data-density="spacious"]{--dashboard-space:32px}
.topbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
.topbar .breadcrumbs{display:contents}.topbar .search-anchor{grid-column:2;grid-row:1;justify-self:center}.topbar .top-actions{grid-column:3;grid-row:1;justify-self:end}
.topbar .mobile-menu{grid-column:1;grid-row:1}
/* Natural content rows must win over legacy stacked and enlarged-text fixed tracks, in both Dashboard and Arrange. */
.unified-widget-grid,.unified-widget-grid.is-stacked,:root[data-text-size] .unified-widget-grid{grid-auto-rows:auto;align-items:start;gap:var(--dashboard-space)}
.unified-widget-grid>.dash-widget{grid-row:auto;min-width:0;height:auto;overflow:visible}
.dash-widget .widget-body{min-width:0;overflow:visible}.dash-widget button{max-width:100%;overflow-wrap:anywhere}
.widget-heading{flex-wrap:wrap}.widget-heading h2{min-width:0;overflow-wrap:anywhere}
.dashboard-task-list{display:grid;gap:12px}.dashboard-task-row{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px;min-width:0;border-inline-start:3px solid var(--project-accent);border-radius:12px;padding:8px 10px 8px 5px}
.dashboard-task-row:focus-within{background:var(--nav-active,#dde8f5)}
.dashboard-check{width:44px;min-height:44px;display:grid;place-items:center;background:transparent;border:0;color:var(--ink)}
.dashboard-check>span{display:grid;place-items:center;width:22px;height:22px;border:2px solid currentColor;border-radius:4px;font-weight:700}
.is-complete .dashboard-check{color:var(--dashboard-complete)}.is-complete .dashboard-check>span{background:var(--dashboard-complete);border-color:var(--dashboard-complete);color:var(--dashboard-on-complete)}
.dashboard-task-open{border:0;background:transparent;text-align:start;color:var(--ink);min-height:44px;display:grid;gap:4px;padding:2px;min-width:0;white-space:normal}
.dashboard-task-open strong{font-size:1rem;line-height:1.5;overflow-wrap:anywhere}.dashboard-task-open>span{font-size:.875rem;line-height:1.5;color:var(--muted)}
.dashboard-task-open .due{background:none;justify-self:start}.dashboard-task-open .due.today{color:var(--danger)}.dashboard-task-open .due.overdue{color:var(--danger)}.is-complete .dashboard-task-open strong{text-decoration:line-through;color:var(--dashboard-complete)}.is-complete .dashboard-task-open .due{color:var(--dashboard-complete)}
.dashboard-prerequisite{grid-column:2;margin:0;font-size:.875rem;color:var(--muted);line-height:1.5;overflow-wrap:anywhere}
.dashboard-note-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:16px}
.dashboard-note-tile{display:flex;flex-direction:column;gap:10px;min-width:0;border:0;border-inline-start:3px solid var(--project-accent);border-radius:12px;background:var(--white);color:var(--ink);text-align:start;padding:16px;white-space:normal}
.dashboard-note-tile strong{font-size:1rem;line-height:1.5}.dashboard-note-tile small{color:var(--muted);font-size:.875rem}.dashboard-note-tile>span{font-size:.875rem;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
.dashboard-week-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.dashboard-week-strip>button{min-width:0;min-height:76px;padding:8px 2px;display:flex;flex-direction:column;gap:5px;align-items:center;white-space:normal}
.dashboard-week-strip small{font-size:.75rem}.week-desktop-previews{display:grid;gap:5px;max-width:100%;font-size:.875rem;line-height:1.4}.week-desktop-previews>span{overflow-wrap:anywhere;max-width:100%}
.dashboard-week-strip>button[aria-pressed="true"],.dashboard-month>button[aria-pressed="true"]{background:var(--nav-active,#dde8f5);color:var(--ink);outline:2px solid var(--primary);outline-offset:-2px}
.week-selected-preview{margin-top:16px}.dashboard-month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;min-width:0}
.dashboard-month>button{min-width:0;min-height:36px;border:0;background:transparent;color:var(--ink);padding:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;font:inherit}
.month-weekday{font-size:.75rem;color:var(--muted);text-align:center;padding-block:8px}.dashboard-month button>span{height:6px;line-height:6px}
.widget-note-form textarea{min-height:120px}.dash-widget[data-widget-size="standard"] .widget-note-form textarea{min-height:180px}.dash-widget[data-widget-size="expanded"] .widget-note-form textarea,.dash-widget[data-widget-size="wide"] .widget-note-form textarea{min-height:280px}
.widget-note-save{display:flex;flex-wrap:wrap;gap:8px}.widget-note-save p{flex-basis:100%}.widget-note-save button,.widget-view-all,.dashboard-agenda-row{min-height:44px;white-space:normal}
.widget-body h3,.widget-body p{overflow-wrap:anywhere}.widget-body h3{font-size:1rem}.dashboard-agenda-row strong{white-space:normal;overflow-wrap:anywhere}
.dash-widget :focus-visible{outline:2px solid var(--primary);outline-offset:3px;scroll-margin-block:20px}
@media(max-width:767px){.sidebar{transition:none!important}.topbar{grid-template-columns:auto minmax(0,1fr) auto;gap:8px}.topbar .search-anchor{justify-self:center;min-width:0}.unified-widget-grid{grid-template-columns:minmax(0,1fr)}.unified-widget-grid>.dash-widget{grid-column:1!important}.dashboard-note-tiles{grid-template-columns:minmax(0,1fr)}.week-desktop-previews{display:none}.dashboard-week-strip>button{font-size:.75rem}.dashboard-week-strip small{font-size:.75rem}.widget-body{padding-inline:0}.dashboard-task-row{padding-inline-end:2px}.dashboard-note-tile{padding:12px}}
@media(prefers-reduced-motion:reduce){.dash-widget *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){.dashboard-task-row,.dashboard-note-tile{border:1px solid CanvasText}.is-complete .dashboard-check>span{background:Highlight;color:HighlightText}.dashboard-week-strip>button[aria-pressed="true"],.dashboard-month>button[aria-pressed="true"]{outline-color:Highlight}.dash-widget :focus-visible{outline-color:Highlight}}

[data-theme="dark"]{--dashboard-complete:#9ccc97;--dashboard-on-complete:#1c2936}

@media(max-width:767px){.week-count-unit{display:none}.dashboard-week-strip small{font-size:.875rem}}

.dashboard-week-navigation{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}.dashboard-week-navigation button{min-height:44px;flex:1;min-width:0;padding:8px;white-space:normal;font-size:.875rem}
@media(max-width:600px){#editor.widget-customization-dialog{width:calc(100vw - 16px);max-width:calc(100vw - 16px);padding:12px;box-sizing:border-box}.widget-customization-dialog .dash-widget{padding:8px}.widget-customization-dialog .dashboard-week-strip{gap:1px}.widget-customization-dialog .dashboard-week-strip>button{padding-inline:0}.widget-customization-dialog .dashboard-week-strip strong{font-size:1rem;white-space:nowrap}.widget-customization-dialog .dashboard-week-navigation{gap:4px}.widget-customization-dialog .dashboard-week-navigation button{font-size:.75rem;padding:4px}}

/* Refined Dashboard composition uses the existing appearance palette and font tokens. */
.unified-dashboard{color:var(--ink);font-family:var(--ui-font);padding-bottom:var(--dashboard-space)}
.unified-dashboard h1,.unified-dashboard h2,.unified-dashboard h3{color:var(--ink);letter-spacing:-.015em}
.unified-dashboard .dashboard-c-heading h1{font-weight:650;line-height:1.2}
.unified-dashboard .dashboard-c-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0 32px}
.unified-dashboard .dashboard-summary-tile{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 12px;align-items:center;min-width:0;padding:20px;border:1px solid var(--line);border-radius:calc(8px * var(--radius-scale,1.7));background:var(--white);box-shadow:none;text-align:start;color:var(--ink)}
.unified-dashboard .dashboard-summary-tile strong{grid-column:2;font-size:2rem;line-height:1.2;font-weight:650;white-space:normal;overflow-wrap:anywhere}
.unified-dashboard .dashboard-summary-tile>span:not(.dashboard-summary-icon){font-size:1rem;color:var(--muted)}
.unified-dashboard .dashboard-summary-icon{grid-row:1/3;color:var(--primary);background:var(--surface-soft);padding:12px;border-radius:12px}
.unified-dashboard .dash-widget{border:1px solid var(--line);box-shadow:none;background:var(--white)}
.unified-dashboard .widget-heading{padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:16px}
.unified-dashboard .widget-heading h2{font-size:1.25rem;line-height:1.35;font-weight:600}
.unified-dashboard .dashboard-week-strip>button{padding-block:12px}
.unified-dashboard .week-desktop-previews{padding-inline:4px;font-size:.875rem}
.widget-note-form{display:flex;flex-direction:column;gap:8px}
.widget-note-form label{font-size:.875rem;font-weight:600;color:var(--ink)}
.widget-note-form input:not([type=hidden]),.widget-note-form textarea{width:100%;box-sizing:border-box;margin:0 0 8px;min-width:0}
.widget-note-form input[type=hidden]{display:none}
.widget-note-save{align-items:center;justify-content:flex-start}
.widget-note-save [data-quick-full-editor]{border:0;background:transparent;box-shadow:none;min-height:44px;padding:8px;color:var(--green);font-weight:500}
@media(max-width:767px){.unified-dashboard .dashboard-c-summary{gap:8px;margin:20px 0 24px}.unified-dashboard .dashboard-summary-tile{grid-template-columns:minmax(0,1fr);padding:12px 8px;gap:6px}.unified-dashboard .dashboard-summary-icon{display:none}.unified-dashboard .dashboard-summary-tile strong{grid-column:1;font-size:1.375rem}.unified-dashboard .dashboard-summary-tile>span:not(.dashboard-summary-icon){font-size:.875rem}.unified-dashboard .widget-heading h2{font-size:1.125rem}}
@media(forced-colors:active){.unified-dashboard .dashboard-summary-tile,.unified-dashboard .dash-widget{border-color:CanvasText}.unified-dashboard .dashboard-summary-icon{color:CanvasText}}

/* Positive due-today metric uses the existing danger token; completed task state remains separate. */
.unified-dashboard .dashboard-summary-tile.summary-schedule.has-due-today>span:not(.dashboard-summary-icon),.unified-dashboard .dashboard-summary-tile.summary-schedule.has-due-today strong{color:var(--danger)}

/* Honor the selected layout when the actual canvas can hold two readable
   widgets. em follows enlarged text; neither the font nor saved layout changes.
   Arrange owns a separate canvas, so its narrower preview reflows independently. */
.unified-dashboard,.widget-customization-dialog{container-type:inline-size;container-name:dashboard-canvas}
:root[data-text-size] .unified-widget-grid{grid-template-columns:minmax(0,1fr)}
:root[data-text-size] .unified-widget-grid>.dash-widget{grid-column:1}
@container dashboard-canvas (min-width:52em){
  :root[data-text-size] .unified-widget-grid:not(.is-stacked){grid-template-columns:repeat(2,minmax(0,1fr))}
  :root[data-text-size] .unified-widget-grid:not(.is-stacked)>.dash-widget{grid-column:span var(--widget-columns)}
}
/* Keep the 44px header/control targets and content-led rows, with less empty
   space on either side of the heading divider. Preset detail stays unchanged. */
.unified-dashboard .widget-heading{padding-bottom:10px;margin-bottom:12px}

/* Each note is its own quiet surface. Keep the curved project edge and the
   existing whole-card selected tint separate from this permanent boundary. */
.dashboard-note-tile{border:1px solid var(--line);border-color:color-mix(in srgb,var(--primary) 30%,var(--white));border-inline-start:3px solid var(--project-accent);box-shadow:none}
.dashboard-note-tiles{gap:16px}
.notes-refined[data-notes-layout=cards] .notes-master{gap:16px}
.notes-refined[data-notes-layout=cards] .note-list-item{border:1px solid var(--line);border-color:color-mix(in srgb,var(--primary) 30%,var(--white));box-shadow:none}
.notes-refined[data-notes-layout=cards] .note-list-item.selected{border-color:var(--primary);background:var(--surface-soft)}
@media(forced-colors:active){.dashboard-note-tile,.notes-refined[data-notes-layout=cards] .note-list-item{border-color:CanvasText}.notes-refined[data-notes-layout=cards] .note-list-item.selected{border-color:Highlight}}

/* Shared pointer feedback is a translucent layer, not a replacement for the
   item's selected/project/urgency/completed surface. No geometry or animation. */
:root{--interaction-hover-layer:color-mix(in srgb,var(--primary) 8%,transparent);--interaction-pressed-layer:color-mix(in srgb,var(--primary) 14%,transparent)}
:root[data-theme="dark"]{--interaction-hover-layer:rgba(255,255,255,.09);--interaction-pressed-layer:rgba(255,255,255,.15)}
@media(hover:hover) and (pointer:fine){
  :is(button,input[type=button],input[type=submit],input[type=reset],a.button,[role=button],summary):not(:disabled):not([aria-disabled=true]):not([inert] *):hover,
  :is(.task-row,.board-card,.dashboard-task-row,.project-card,.project-row,.note-card,.note-preview,.note-list-item,.dashboard-note-tile,.widget-project,.widget-note-preview):not([aria-disabled=true]):not([inert] *):hover{background-image:linear-gradient(var(--interaction-hover-layer),var(--interaction-hover-layer))}
  :is(button,input[type=button],input[type=submit],input[type=reset],a.button,[role=button],summary):not(:disabled):not([aria-disabled=true]):not([inert] *):active{background-image:linear-gradient(var(--interaction-pressed-layer),var(--interaction-pressed-layer))}
  /* These established reference controls retain their existing token-based
     hover fill, rather than receiving a second tint on top of it. */
  :is(.nav-item,.icon-button,.button,.search-button):not(:disabled):not([aria-disabled=true]):hover:not(:active){background-image:none}
  /* Legacy button hover rules also matched disabled controls. Keep their
     original inactive fill and boundary, with no suggestion of availability. */
  .button:is(:disabled,[aria-disabled=true]):hover{background:var(--white);border-color:var(--line);color:var(--ink);background-image:none}
  .button.primary:is(:disabled,[aria-disabled=true]):hover{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
}
@media(forced-colors:active) and (hover:hover) and (pointer:fine){
  :is(button,input[type=button],input[type=submit],input[type=reset],a.button,[role=button],summary):not(:disabled):not([aria-disabled=true]):not([inert] *):hover{outline:1px solid Highlight;outline-offset:-2px}
}

/* Let the search trigger own a real share of the header, so the existing
   anchored results algorithm receives that same useful width. No search or
   overlay-positioning behavior changes; reserved action space stays clear. */
@media(min-width:768px){
  .topbar{grid-template-columns:minmax(184px,1fr) minmax(0,2.5fr) minmax(184px,1fr);gap:24px}
  .topbar .search-anchor{width:100%;max-width:none;min-width:0}
  .topbar .search-anchor>.search-button{width:100%;max-width:none;min-height:48px;min-width:0;padding:10px 16px;gap:12px;font-size:1rem;white-space:normal}
}
@media(min-width:768px) and (max-width:1100px){
  .topbar{grid-template-columns:minmax(0,1fr) auto;row-gap:12px}
  .topbar .search-anchor{grid-column:1/-1;grid-row:2}
  .topbar .top-actions{grid-column:2;grid-row:1}
}
#search-dialog .search-top{gap:12px}
#search-dialog .search-top input{min-width:0;min-height:44px;padding:8px 0;border:0;border-radius:0;background:transparent}
#search-dialog .search-top input:focus-visible{outline:0;box-shadow:none}
#search-dialog .search-top:focus-within{box-shadow:inset 0 -2px var(--focus)}
#search-dialog{container-type:inline-size;container-name:search-panel}
#search-dialog .search-filters{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
@container search-panel (min-width:28em){#search-dialog .search-filters{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(forced-colors:active){#search-dialog .search-top:focus-within{outline:2px solid Highlight;outline-offset:-2px}}
/* Hide the requested visible keyboard-hint footer while retaining the input's
   existing aria-describedby instructions and all keyboard behavior. */
#search-dialog .search-hint{position:absolute;width:1px;height:1px;min-height:0;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.workspace-status-notice{display:none}
.workspace-status-notice:has(#save-status[data-meaningful=true]){display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:0 var(--page-gutter) 24px;padding:12px 16px;border-inline-start:3px solid var(--primary);border-radius:8px;background:var(--surface-soft);color:var(--ink);font-size:1rem;line-height:1.5;overflow-wrap:anywhere}
.workspace-status-notice #cancel-import{min-height:44px}

/* Preferred thin outline icons and small, softly tinted square badges. Keep
   the three existing metric categories, actions and count definitions. */
.unified-dashboard .dashboard-summary-tile{grid-template-columns:36px minmax(0,1fr);align-content:start}
.unified-dashboard .dashboard-summary-icon{grid-row:1;align-self:center;width:36px;height:36px;padding:8px;border-radius:10px}
.unified-dashboard .dashboard-summary-icon svg{width:20px;height:20px}
.unified-dashboard .dashboard-summary-label{font-size:1.125rem!important;font-weight:600;color:var(--ink)!important}
.unified-dashboard .dashboard-summary-support{grid-column:2;font-size:.875rem;line-height:1.4;font-weight:400;color:var(--muted);overflow-wrap:anywhere}
.unified-dashboard .summary-projects .dashboard-summary-icon{background:#edf8f2;color:var(--dash-projects)}
.unified-dashboard .summary-tasks .dashboard-summary-icon{background:var(--surface-soft);color:var(--primary)}
.unified-dashboard .summary-schedule .dashboard-summary-icon{background:var(--surface-soft);color:var(--primary)}
.unified-dashboard .summary-schedule.has-due-today .dashboard-summary-icon{background:color-mix(in srgb,var(--white) 92%,var(--danger));color:var(--danger)}
.unified-dashboard .summary-schedule.has-due-today .dashboard-summary-label{color:var(--danger)!important}
@media(max-width:767px){.unified-dashboard .dashboard-summary-tile{grid-template-columns:minmax(0,1fr)}.unified-dashboard .dashboard-summary-label{font-size:.875rem!important}.unified-dashboard .dashboard-summary-support{grid-column:1}}
@media(forced-colors:active){.unified-dashboard .dashboard-summary-icon{background:Canvas;color:CanvasText}}

/* Retain readable full labels and target sizes instead of fragmenting a word
   into equal-width navigation tracks. The stored order/count stay unchanged. */
@media(max-width:767px){
  #mobile-nav .mobile-main{grid-template-columns:repeat(var(--mobile-destination-count,5),minmax(max-content,1fr))}
  #mobile-nav .mobile-main>#mobile-new-slot{min-width:44px}
  #mobile-nav .mobile-main .mobile-tab>span{white-space:nowrap;overflow-wrap:normal;word-break:normal}
}
/* A compact inline badge fits the wider phone cards. At 320px retain the
   text-first cards rather than crowding or shrinking their titles. */
@media(min-width:380px) and (max-width:767px){
  .unified-dashboard .dashboard-summary-tile{grid-template-columns:24px minmax(0,1fr);column-gap:6px}
  .unified-dashboard .dashboard-summary-icon{display:flex;width:24px;height:24px;padding:4px;border-radius:7px}
  .unified-dashboard .dashboard-summary-icon svg{width:16px;height:16px}
  .unified-dashboard .dashboard-summary-label{grid-column:2;overflow-wrap:normal}
  .unified-dashboard .dashboard-summary-tile strong,.unified-dashboard .dashboard-summary-support{grid-column:1/-1}
}

/* Use the wide Dashboard canvas while keeping two columns and ordinary
   reading measures. Other page widths and saved layout settings are untouched. */
@media(min-width:1600px){
  .workspace:has(>#main>.unified-dashboard)>#main,.workspace:has(>#main>.unified-dashboard)>.topbar{max-width:1560px}
  .unified-dashboard .unified-widget-grid{gap:20px}
  .unified-dashboard .dashboard-c-summary{margin-top:20px;margin-bottom:24px}
  .unified-dashboard .dashboard-task-open strong{max-width:62ch}
  .unified-dashboard .dashboard-note-tile>span{max-width:45ch}
}

/* Keep each short weekday and date intact in the narrow seven-day strip.
   Recover inline space from gaps/padding; retain the chosen date font and
   existing tall hit areas, selected state and selected-day detail below. */
@media(max-width:600px){
  .unified-dashboard .dashboard-week-strip{gap:2px}
  .unified-dashboard .dashboard-week-strip>button{padding-inline:0}
  .unified-dashboard .dashboard-week-strip>button>span:first-child,
  .unified-dashboard .dashboard-week-strip>button>strong,
  .unified-dashboard .dashboard-week-strip>button>small{white-space:nowrap;overflow-wrap:normal;word-break:normal}
  .unified-dashboard .dashboard-week-navigation button{min-width:min-content;padding-inline:4px;overflow-wrap:normal;word-break:normal}
}

/* Desktop search follows the leading edge of the main content.
   Existing <=1100px two-row/mobile layouts and search behavior are unchanged. */
@media(min-width:1101px){
  .topbar{grid-template-columns:minmax(0,1fr) auto}
  .topbar .search-anchor{grid-column:1;grid-row:1;justify-self:start;width:100%;max-width:none;min-width:0}
  .topbar .top-actions{grid-column:2;grid-row:1;justify-self:end}
}

/* Collection actions and view controls share a compact, wrapping hierarchy.
   Keep native buttons/selects, existing filters and full-size pointer targets. */
.task-reference-tools{gap:8px;margin-bottom:16px;align-items:center}
.task-reference-tools .visual-view-switch{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;flex:none}
.task-reference-tools .visual-view-switch button{display:grid;place-items:center;min-width:44px;min-height:44px;padding:10px;border:0;background:transparent;color:var(--ink)}
.task-reference-tools .visual-view-switch button[aria-pressed=true]{background:var(--surface-soft);color:var(--primary)}
.task-reference-tools .visual-view-switch svg{width:20px;height:20px}
.task-reference-tools .task-reference-tabs{margin:0;flex:none;flex-wrap:wrap;min-width:0}
.task-reference-tools .task-reference-tabs button{min-height:44px;padding-inline:12px;flex:1 1 max-content}
.task-reference-tools .task-reference-sort{margin-inline-start:auto}
.task-reference-tools .tasks-page-more{margin:0}
.task-reference-tools summary{flex:none}
.task-reference-list .task-row.task-row-with-menu{grid-template-columns:44px minmax(0,1fr) 44px;column-gap:8px;row-gap:0;align-items:start;min-height:76px;padding:12px}
.task-reference-list .task-row.task-row-with-menu>.task-complete-action{grid-column:1;grid-row:1;min-width:44px;min-height:44px;justify-content:center;align-self:start;padding:0}
.task-reference-list .task-row.task-row-with-menu>.task-content{grid-column:2;grid-row:1;min-width:0;min-height:44px;padding-block:6px}
.task-reference-list .task-row.task-row-with-menu>.task-card-more{grid-column:3;grid-row:1}
.task-reference-list .task-row .task-meta{gap:4px 10px}
.task-reference-list .task-row .visual-blocked-reason{margin-top:6px;line-height:1.5}
/* Completion stays distinct from opening a card or reassigning its status. */
.board-card-title{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px;align-items:start}
.board-card-title>.task-complete-action{min-width:44px;min-height:44px;padding:0;justify-content:center}
.board-card .board-card-title>[data-task]{min-width:0;min-height:44px;text-align:start;padding:8px 0;font-size:calc(14px * var(--font-scale));line-height:calc(22px * var(--font-scale));font-weight:600;overflow-wrap:anywhere}
.board-card .visual-blocked-reason{max-height:none;overflow:visible}
.board-card .board-status-disclosure{margin-top:12px}
.board-card .board-status-disclosure>summary{justify-content:space-between;gap:12px;width:100%;padding:8px 12px;color:var(--muted);background:transparent;font-size:inherit;box-sizing:border-box}
.board-card .board-status-disclosure>summary svg{width:16px;height:16px}
.board-card .board-status-disclosure>div{position:static;inset:auto;width:auto;max-width:none;max-height:none;box-shadow:none;margin-top:8px}
.board-card .board-status-disclosure label{font-size:inherit}
.board-card .board-status-disclosure select{min-height:44px}
.note-overflow>div .field-help{max-width:30ch;margin:4px 12px 12px;line-height:1.5;font-size:.875rem}
/* Persistent editor chrome with a single scrolling body. Other dialogs and
   the dedicated inline note editor keep their existing layout and behavior. */
#editor[open]:has(.refined-editor-form){display:flex;flex-direction:column;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:visible;padding:0}
#editor:has(.refined-editor-form)>.dialog-header{flex:none;margin:0;padding:16px 24px;border-bottom:1px solid var(--line)}
#editor .refined-editor-form{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;padding:0;overflow:hidden}
#editor .refined-editor-form .editor-scroll-body{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding:20px 24px;scroll-padding-block:16px}
#editor .refined-editor-form>.form-actions{flex:none;display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin:0;padding:16px 24px;border-top:1px solid var(--line);background:var(--white)}
#editor .refined-editor-form>.form-actions .button{min-height:44px;flex:0 1 auto;margin:0}
#editor .refined-editor-form :is(input,textarea,select,button,summary){scroll-margin-block:16px}
.editor-section{border-top:1px solid var(--line);margin-top:16px;min-width:0}
.editor-section>summary{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:48px;cursor:pointer;list-style:none;color:var(--ink);font-weight:600}
.editor-section>summary::-webkit-details-marker{display:none}
.editor-section>summary svg{width:18px;height:18px;flex:none}
.editor-section>summary:focus-visible,.calendar-legend-disclosure>summary:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.editor-section-body{padding-block:8px 16px;min-width:0}
.editor-secondary-actions .editor-section-body{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.editor-secondary-actions #note-copy-status{flex-basis:100%;margin:0}
/* Legend is an inline disclosure, never a modal or an alternative calendar.
   All periods, navigation controls and selected-day full titles remain. */
.calendar-view-tools{display:flex;align-items:start;gap:8px 16px;flex-wrap:wrap;margin-bottom:16px}
.calendar-view-tools .calendar-period-controls{margin:0}
.calendar-legend-disclosure{min-width:0;margin-inline-start:auto}
.calendar-legend-disclosure>summary{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer;list-style:none;box-sizing:border-box}
.calendar-legend-disclosure>summary::-webkit-details-marker{display:none}
.calendar-legend-disclosure>summary svg{width:16px;height:16px}
.calendar-legend-disclosure .calendar-legend{margin:12px 0 0;max-width:28rem}
@media(max-width:600px){
  .page-heading:has(>[data-action=new-task]),.page-heading:has(>[data-action=new-project]){display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:20px}
  .page-heading:has(>[data-action=new-task])>div,.page-heading:has(>[data-action=new-project])>div{flex:1 1 130px;min-width:0}
  .page-heading>.button{min-height:44px;white-space:normal}
  .task-reference-tools .task-reference-sort{flex-basis:calc(100% - 112px);margin:0;text-align:start}
  .task-reference-tools .task-reference-tabs{flex:1 1 auto;display:flex}
  .task-reference-tools .task-reference-tabs button{flex:1 1 max-content;white-space:normal;padding-inline:8px}
  .task-reference-list .task-row.task-row-with-menu{grid-template-columns:44px minmax(0,1fr) 44px;column-gap:4px;padding:8px}
  #editor[open]:has(.refined-editor-form){width:calc(100% - 24px);max-width:none;max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}
  #editor:has(.refined-editor-form)>.dialog-header,#editor .refined-editor-form>.form-actions{padding:12px 16px}
  #editor .refined-editor-form .editor-scroll-body{padding:16px}
  .calendar-month .calendar-month-bar{gap:8px;margin-bottom:12px;align-items:center;flex-wrap:wrap}
  .calendar-month .calendar-month-bar h2{flex:1 1 120px;margin:0;min-width:0}
  .calendar-month-actions{gap:4px;flex-wrap:wrap}
  .calendar-month-actions .button{padding-inline:10px;min-height:44px}
  .calendar-view-tools{gap:8px;margin-bottom:12px}
  .calendar-legend-disclosure .calendar-legend{gap:8px}
}
@media(forced-colors:active){.editor-section,#editor .refined-editor-form>.form-actions,#editor:has(.refined-editor-form)>.dialog-header{border-color:CanvasText}.task-reference-tools .visual-view-switch button[aria-pressed=true]{outline:2px solid Highlight;outline-offset:-3px}}

/* Tasks alone has a contextual New action beside its title. Reserve that
   first row, then let Search lead the whole available second row and keep
   Notifications trailing. Explicit grid placement avoids the old flex/order
   interaction; the shared controls and their DOM/tab order are unchanged. */
@media(max-width:700px){
  #main>.page-heading:has(>[data-action="new-task"]):has(>.search-anchor):has(>.notification-control){display:grid;grid-template-columns:minmax(0,1fr) auto 44px;gap:12px;align-items:center}
  #main>.page-heading:has(>[data-action="new-task"])>div:first-child{grid-column:1;grid-row:1;min-width:0}
  #main>.page-heading:has(>[data-action="new-task"])>[data-action="new-task"]{grid-column:2/-1;grid-row:1;justify-self:end;max-width:100%;min-height:44px}
  #main>.page-heading:has(>[data-action="new-task"])>.search-anchor{grid-column:1/3;grid-row:2;justify-self:start;min-width:0;width:100%;max-width:none;margin:0;order:0}
  #main>.page-heading:has(>[data-action="new-task"])>.search-anchor>.search-button{width:100%;min-width:0;min-height:44px;text-align:start}
  #main>.page-heading:has(>[data-action="new-task"])>.notification-control{grid-column:3;grid-row:2;justify-self:end;align-self:center;width:44px;min-width:44px;margin:0;order:0}
}