/* Workspace colours. Purple belongs to navigation and small brand accents. */
:root {
  --text-primary: #25272b;
  --text-secondary: #62666e;
  --text-muted: #737780;
  --surface: #fff;
  --surface-subtle: #f6f7f8;
  --surface-hover: #f0f1f3;
  --line: #e4e6e8;
  --accent: #7250c5;
  --muted: var(--text-muted);
  color: var(--text-primary);
  background: #f1f2f3;
}
body { background: #f1f2f3; }
.shell { background: var(--surface); border-color: #fff; box-shadow: 0 12px 60px #20252b06; }
.main { background: #fcfcfc; }
.page-head h1,.task-title,.project-name { color: var(--text-primary); }
.eyebrow,.section-title,.sort-hint,.marketing-source,.review-note { color: var(--text-muted); }
.subtitle,.marketing-content .subtitle,.form-hint,.project-meta,.task-meta,.back-link { color: var(--text-secondary); }
.section-title:after { background: var(--line); }
.loading,.empty,.capture-top { color: var(--text-muted); }
.empty strong { color: var(--text-secondary); }
.primary-button { background: #30343b; border-color: #30343b; color: #fff; box-shadow: 0 3px 8px #20252b0b; }
.primary-button:hover { background: #1f2329; border-color: #1f2329; }
.secondary-button { background: var(--surface); border-color: #dce0e4; color: #4c525a; box-shadow: none; }
.secondary-button:hover { background: var(--surface-subtle); border-color: #c9ced4; }
.main .text-button,.dialog .text-button { color: var(--text-secondary); }
.search,.toolbar select,.week-picker input,.week-picker select {
  background: var(--surface); border-color: var(--line); color: var(--text-primary);
}
input::placeholder,textarea::placeholder { color: #858991; }
.search:focus,input:focus,textarea:focus,select:focus,.focus-card textarea:focus {
  border-color: #a7afb9; outline-color: #6e788526;
}
.list,.document-list,.focus-card,.capture,.project-card,.stat {
  background: var(--surface); border-color: var(--line); box-shadow: 0 2px 8px #20252b02;
}
.task-row { border-color: #eceef0; }
.task-row:hover,.document-link:hover { background: #f8f9fa; }
.task-check { border-color: #b7bdc5; }
.task-check.done { background: #39976a; border-color: #39976a; }
.task-title.is-done { color: #858b91; }
.badge.normal,.badge.low { background: #f0f2f3; color: #626a73; }
.badge.high { background: #fcf0e5; color: #9b602e; }
.stats .stat { background: var(--surface); }
.stats .stat-total,.stats .stat-active,.stats .stat-attention,.stats .stat-done { background: var(--surface); }
.stat-number,.stats .stat-total .stat-number { color: #4b535d; }
.stats .stat-active .stat-number { color: #456d92; }
.stats .stat-attention .stat-number { color: #a36b29; }
.stats .stat-done .stat-number { color: #2e7c57; }
.stat-label { color: var(--text-secondary); }
.note-card { background: var(--surface-subtle); border-color: var(--line); color: var(--text-secondary); }
.note-card strong { color: var(--text-primary); }
.project-icon { background: #eef0f3; color: #687382; }
.project-card:hover { border-color: #cbd1d8; box-shadow: 0 4px 14px #20252b07; }
.document-link { border-color: var(--line); }
.document-link small,.focus-actions span { color: var(--text-muted); }
.board-column { background: var(--surface-subtle); border-color: var(--line); }
.board-column h2 { color: var(--text-secondary); }
.board-task:not(.marketing-card) { background: var(--surface); border-color: var(--line); color: var(--text-primary); }
.board-task small,.board-empty,.date-button { color: var(--text-secondary); }

/* Light status washes help distinguish columns; task cards stay white. */
.column-red { --column-wash:#faf5f5; --column-ink:#88545a; --column-accent:#b57880; }
.column-purple { --column-wash:#f5f6f7; --column-ink:#5c6370; --column-accent:#9b8cad; }
.column-blue { --column-wash:#f3f7fa; --column-ink:#486b87; --column-accent:#7c9bb3; }
.column-gray { --column-wash:#f5f6f7; --column-ink:#666e78; --column-accent:#969da6; }
.column-yellow { --column-wash:#faf7f1; --column-ink:#8c703d; --column-accent:#b9a16e; }
.column-green { --column-wash:#f3f8f5; --column-ink:#48745e; --column-accent:#83a58e; }
.column-brown { --column-wash:#f8f5f2; --column-ink:#826854; --column-accent:#b39a86; }
.marketing-summary { background: var(--surface); border-color: var(--line); color: var(--text-secondary); }
.marketing-summary span+span { border-color: var(--line); }
.marketing-tabs { background: #f1f2f4; border-color: #e7e9ec; }
.marketing-tabs button { color: var(--text-secondary); }
.marketing-tabs button.selected { background: var(--surface); color: var(--text-primary); box-shadow: 0 2px 6px #20252b08; }
.marketing-board { scrollbar-color: #c8cdd3 transparent; }
.marketing-board .board-column { background: var(--column-wash,#f6f7f8); border-color: #e4e6e8; }
.marketing-board .board-column h2 { color: var(--text-secondary); border-color: #e0e4e7; }
.column-count { background: #ffffffc9; border-color: #ffffffd9; }
.marketing-card,.marketing-task-group .marketing-card {
  background: var(--surface); border-color: #e6e8ea; box-shadow: 0 1px 3px #20252b04;
}
.marketing-card:hover,.marketing-task-group .marketing-card:hover {
  background: #fdfdfd; border-color: #cfd4da; box-shadow: 0 3px 10px #20252b08;
}
.marketing-card strong { color: var(--text-primary); }
.marketing-card small { color: var(--text-secondary); }
.category-chip,.kind-chip,.marketing-card .category-chip,.marketing-card .kind-chip,.marketing-card .badge {
  background: #f2f4f5; color: #646c75; border-color: #e9ecef;
}
.marketing-card .badge.high { background: #fcf0e5; color: #9b602e; }
.marketing-board .board-empty { color: var(--text-muted); border-color: #dce1e5; }
.marketing-table-wrap { border-color: var(--line); }
.marketing-table { background: var(--surface); color: var(--text-primary); }
.marketing-table th { background: #f5f6f7; color: var(--text-secondary); }
.marketing-table td,.marketing-table th { border-color: #e8eaed; }
.marketing-table tbody tr:hover { background: #f8f9fa; }
.marketing-table td:before { color: var(--text-secondary); }
.board-swipe-hint { color: var(--text-muted); }
.board-page-controls button { background: var(--surface); border-color: #dde1e5; color: #565e68; }

/* Neutral glass keeps the translucency without a coloured overlay. */
.dialog {
  background: linear-gradient(135deg,#fffffff0,#f5f6f7d9);
  border-color: #ffffffeb;
  box-shadow: inset 0 1px 0 #fff,0 24px 80px #20252b26,0 2px 10px #20252b08;
  -webkit-backdrop-filter: blur(28px) saturate(105%);
  backdrop-filter: blur(28px) saturate(105%);
}
.dialog::backdrop { background: #20252b2b; }
.dialog h2,.login-card h1 { color: var(--text-primary); }
.dialog label,.login-card label { color: var(--text-secondary); }
.date-field { display: grid; align-content: start; gap: 7px; }
.field-hint { color: var(--text-muted); font-size: 12px; font-weight: 400; line-height: 1.5; }
.dialog input,.dialog textarea,.dialog select,.glass-select-trigger,.login-card input,.focus-card textarea {
  background: #ffffffc7; color: var(--text-primary); border-color: #dce0e4;
  box-shadow: inset 0 1px 2px #20252b03;
}
.dialog input:hover,.dialog textarea:hover,.glass-select-trigger:hover { background: #fff; border-color: #c8cfd6; }
.dialog input:focus,.dialog textarea:focus,.glass-select-trigger:focus-visible {
  outline-color: #6e788526; border-color: #a7afb9; box-shadow: 0 0 0 1px #7d87933d;
}
.dialog .secondary-button { background: #ffffffb3; color: #4c525a; border-color: #dce0e4; box-shadow: none; }
.dialog .secondary-button:hover { background: #fff; }
.dialog .icon-button,.icon-button { color: #757d87; }
.glass-select-chevron { border-color: #7c8590; }
.glass-select-trigger[aria-expanded=true] { background: #fff; border-color: #c9cfd7; }
.glass-select-menu {
  background: linear-gradient(135deg,#fffffff2,#f5f6f7e6);
  border-color: #ffffffeb; scrollbar-color: #b7bec680 transparent;
  box-shadow: inset 0 1px 0 #fff,0 16px 44px #20252b24;
  -webkit-backdrop-filter: blur(30px) saturate(105%);
  backdrop-filter: blur(30px) saturate(105%);
}
.glass-select-menu button { color: #353c45; }
.glass-select-menu button[aria-selected=true] { background: #e5e9ee; color: #303a47; }
.glass-select-menu button[aria-selected=true]:before { color: #516479; }
.glass-select-menu button:hover,.glass-select-menu button.highlighted { background: #fff; border-color: #e1e5e9; box-shadow: 0 1px 4px #20252b05; }
.dialog label.check-field { background: #ffffff91; border-color: #e0e4e7; }
.dialog .check-field input[type=checkbox] { accent-color: #5e738a; }
.check-field small { color: var(--text-secondary); }
#toast { background: #353b43; box-shadow: 0 7px 28px #20252b26; }
.rules-status,.rule-card,.rules-save { background: var(--surface); border-color: var(--line); box-shadow: none; }
.rules-status strong,.rule-card label { color: var(--text-primary); }
.rules-status p,.rule-card p,.rules-explainer,.rules-save span { color: var(--text-secondary); }
.rules-explainer strong { color: #4c525a; }
.rule-heading>span { color: #67717d; background: #eef0f3; }
.rule-card textarea { background: #fafbfc; border-color: #dde1e5; color: var(--text-primary); }
.rule-card textarea::placeholder { color: #858991; }
.rules-save { background: #fffffff0; box-shadow: 0 4px 16px #20252b08; }
.login-body { background: #f3f4f5; }
.login-card { background: #fff; border-color: var(--line); box-shadow: 0 18px 60px #20252b0a; }
.login-card p { color: var(--text-secondary); }
.mobilebar { background: #fffffff2; border-color: var(--line); color: var(--text-primary); }
.mobilebar button:active { background: var(--surface-hover); }
.menu-backdrop:not([hidden]) { background: #20252b38; }
@media(max-width:760px) {
  .marketing-table tr { background: var(--surface); border-color: var(--line); }
  .task-check { background: #f2f4f6; }
  .task-check:before { border-color: #b7bdc5; }
  .task-check:hover { background: #e9edf0; }
  .task-check.done { background: #eaf4ed; }
  .task-check.done:before { background: #39976a; border-color: #39976a; }
  .small-action { background: #f7f8f9; border-color: #e1e5e9; color: var(--text-secondary); }
  .dialog-top,.dialog-actions { background: #f8f9faf2; border-color: #e4e7ea; }
}
@supports not (backdrop-filter:blur(1px)) {
  .dialog,.glass-select-menu { background: #f8f9fa; }
}
@media(prefers-reduced-transparency:reduce) {
  .dialog,.glass-select-menu { background: #f8f9fa; -webkit-backdrop-filter:none; backdrop-filter:none; }
}
