/* Shared workspace design. Color preferences remain independent of workspace data.
   The app-root scope deliberately takes precedence over legacy theme rules. */
:root[data-theme] {
    --workspace-accent: #0879e8;
    --workspace-link: #075caf;
    --workspace-ink: #21384f;
    --workspace-muted: #61758b;
    --workspace-line: #dfe7f0;
    --workspace-surface: #fff;
    --workspace-canvas: #f6f8fb;
    --workspace-soft: #f5f8fc;
    --workspace-selected: #e9f3ff;
    --control-height: 38px;
    --control-radius: 5px;
    color: var(--workspace-ink);
    background: var(--workspace-canvas);
}
:root[data-theme="violet-twilight"] { --workspace-accent:#7057bd; --workspace-link:#6243a7; --workspace-selected:#f0ebfa; }
:root[data-theme="soft-linen"] { --workspace-accent:#5f7470; --workspace-link:#405e58; --workspace-selected:#eef2ed; }
:root[data-theme="onyx-dark"] {
    --workspace-accent:#82baff; --workspace-link:#a2ceff; --workspace-ink:#e4edf6;
    --workspace-muted:#adbed0; --workspace-line:#3b4d60; --workspace-surface:#1b2838;
    --workspace-canvas:#121e2c; --workspace-soft:#223246; --workspace-selected:#284462;
    color-scheme:dark;
}
:root[data-theme] body { background:var(--workspace-canvas); color:var(--workspace-ink); font-family:'Segoe UI',Arial,sans-serif; font-size:14px; }
:root[data-theme] #app .shell { grid-template-columns:218px minmax(0,1fr); grid-template-rows:auto 1fr; align-items:start; }
:root[data-theme] #app .shell.menu-unpinned { grid-template-columns:minmax(0,1fr); }
:root[data-theme] #app .shell > .topbar { grid-column:1/-1; grid-row:1; }
:root[data-theme] #app .shell > main { grid-column:2; grid-row:2; width:100%; }
:root[data-theme] #app .shell.menu-unpinned > main { grid-column:1; }
:root[data-theme] #app .topbar {
    min-height:66px; height:auto; padding:9px 20px; gap:16px;
    border:0; border-top:3px solid var(--workspace-accent); border-bottom:1px solid var(--workspace-line);
    background:var(--workspace-surface); color:var(--workspace-muted); box-shadow:none;
}
:root[data-theme] #app .topbar .brand { margin:0; flex:0 0 180px; gap:9px; color:var(--workspace-ink); }
:root[data-theme] #app .brand-logo { width:34px; height:34px; }
:root[data-theme] #app .brand strong { font-size:21px; }
:root[data-theme] #app .brand-subtitle { font-size:10px; letter-spacing:1.2px; text-transform:uppercase; color:var(--workspace-muted); }
:root[data-theme] #app .topbar .header-navigation { flex:1 1 490px; gap:12px; }
:root[data-theme] #app .topbar .quick-access { gap:4px; }
:root[data-theme] #app .topbar .quick-access .top-search {
    background:transparent; color:var(--workspace-muted); border:0; border-bottom:2px solid transparent;
    box-shadow:none; border-radius:0; min-height:38px; padding:9px 10px; font-size:13px; font-weight:600;
}
:root[data-theme] #app .topbar .quick-access .top-search[aria-current="page"] { color:var(--workspace-link); border-bottom-color:var(--workspace-accent); background:var(--workspace-selected); }
:root[data-theme] #app .topbar .theme-control select { min-height:34px; width:145px; padding:6px 8px; font-size:12px; }
:root[data-theme] #app .header-status { gap:14px; }
:root[data-theme] #app .avatar { background:var(--workspace-selected); border:1px solid var(--workspace-line); color:var(--workspace-link); }
:root[data-theme] #app .navigation {
    grid-column:1; grid-row:2; position:sticky; top:0; height:100dvh;
    background:var(--workspace-soft); border:0; border-right:1px solid var(--workspace-line); padding:14px 12px; gap:0;
}
:root[data-theme] #app .navigation-controls { margin-bottom:18px; }
:root[data-theme] #app :is(.menu-pin,.menu-toggle,.navigation-close) { border:1px solid var(--workspace-line); color:var(--workspace-muted); background:var(--workspace-surface); min-height:36px; padding:7px 9px; border-radius:5px; box-shadow:none; }
:root[data-theme] #app .menu-pin { font-size:12px; }
:root[data-theme] #app .nav-caption { display:block; color:var(--workspace-muted); font-size:10px; letter-spacing:1px; margin:0 10px 10px; }
:root[data-theme] #app .navigation nav { display:block; overflow:visible; }
:root[data-theme] #app .navigation .nav-item { display:flex; width:100%; border:0; border-left:3px solid transparent; border-radius:4px; min-height:38px; padding:8px 9px; gap:10px; background:transparent; color:var(--workspace-ink); font-size:13px; white-space:normal; margin:2px 0; }
:root[data-theme] #app .navigation .nav-item.selected { background:var(--workspace-selected); border-left-color:var(--workspace-accent); color:var(--workspace-link); font-weight:650; }
:root[data-theme] #app .nav-item > span { width:20px; font-size:18px; color:var(--workspace-muted); }
:root[data-theme] #app .nav-item small { display:block; background:var(--workspace-selected); color:var(--workspace-link); border-radius:10px; }
:root[data-theme] #app .area-caption { margin-top:24px; font-size:9px; }
:root[data-theme] #app .area-link { display:block; color:var(--workspace-ink); padding:9px; font-size:13px; background:transparent; }
:root[data-theme] #app .area-link span { color:var(--workspace-muted); }
:root[data-theme] #app .local-card { display:block; border:1px solid var(--workspace-line); background:var(--workspace-surface); color:var(--workspace-link); margin-top:24px; border-radius:5px; }
:root[data-theme] #app .local-card p { color:var(--workspace-muted); }
:root[data-theme] #app .shell.menu-unpinned .navigation { position:fixed; grid-area:auto; height:100dvh; border-right:1px solid var(--workspace-line); }
:root[data-theme] #app .content { max-width:1800px; width:100%; margin:0 auto; padding:0 24px; }
:root[data-theme] #app .workspace-breadcrumb { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:13px 0; margin-bottom:20px; border-bottom:2px solid var(--workspace-accent); color:var(--workspace-muted); font-size:12px; overflow-wrap:anywhere; }
:root[data-theme] #app .workspace-breadcrumb [aria-current] { color:var(--workspace-ink); font-weight:600; }
:root[data-theme] #app .route-heading { font-size:24px; line-height:1.3; letter-spacing:-.4px; margin:0 0 20px; font-weight:600; }
:root[data-theme] #app :is(.panel,.stats article,.planning-card,.today-stats article,.contact-card,.connection) { border:1px solid var(--workspace-line); border-radius:6px; box-shadow:none; background:var(--workspace-surface); color:var(--workspace-ink); }
:root[data-theme] #app .panel { padding:20px; margin-bottom:20px; }
:root[data-theme] #app .panel-title { margin-bottom:16px; padding-bottom:12px; border-bottom:1px solid var(--workspace-line); }
:root[data-theme] #app h2 { font-size:16px; letter-spacing:0; font-weight:600; color:var(--workspace-ink); }
:root[data-theme] #app h3 { font-size:14px; color:var(--workspace-ink); }
:root[data-theme] #app .panel > .panel-title > h2 { border-left:3px solid var(--workspace-accent); padding-left:10px; }
:root[data-theme] #app :is(p,.hint,.field-label,label,.item-meta,.item-tags,.results-count,.selection-context,.contact-details,.task-metadata) { color:var(--workspace-muted); }
:root[data-theme] #app :is(.hint,.item-meta,.selection-context) { font-size:12px; }
:root[data-theme] #app label { font-size:12px; font-weight:500; }
:root[data-theme] #app :is(a,.text-button,.item-actions button,.saved-link) { color:var(--workspace-link); }
:root[data-theme] #app .stats { gap:14px; margin-bottom:20px; }
:root[data-theme] #app .stats article { padding:16px 18px; border-top:2px solid var(--workspace-accent); }
:root[data-theme] #app .stats article > span { font-size:10px; letter-spacing:.65px; color:var(--workspace-muted); }
:root[data-theme] #app .stats strong { font-size:28px; line-height:1.5; font-weight:600; color:var(--workspace-ink); }
:root[data-theme] #app .stats small { color:var(--workspace-muted); font-size:12px; }
:root[data-theme] #app .stats .time-stat { background:var(--workspace-surface); }
:root[data-theme] #app .planning-summary { gap:10px; }
:root[data-theme] #app .planning-card { border-top:1px solid var(--workspace-line); padding:14px; min-height:0; gap:6px; }
:root[data-theme] #app .planning-card strong { font-size:23px; font-weight:600; color:var(--workspace-ink); }
:root[data-theme] #app .planning-card > span { font-size:12px; color:var(--workspace-muted); }
:root[data-theme] #app .planning-card .planning-card-action { color:var(--workspace-link); font-size:12px; }
:root[data-theme] #app :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
    border:1px solid var(--workspace-line); border-radius:5px; background:var(--workspace-surface); color:var(--workspace-ink);
    min-height:38px; padding:8px 10px; font-size:14px; box-shadow:none;
}
:root[data-theme] #app input::placeholder, :root[data-theme] #app textarea::placeholder { color:var(--workspace-muted); opacity:.85; }
:root[data-theme] #app :is(input[type="checkbox"],input[type="radio"]) { accent-color:var(--workspace-accent); }
:root[data-theme] #app :is(.primary-button,.attach-file-button,.mud-button-filled-primary) { background:var(--workspace-accent); color:var(--workspace-surface); border:1px solid var(--workspace-accent); border-radius:5px; box-shadow:none; min-height:38px; font-size:13px; font-weight:600; }
:root[data-theme="onyx-dark"] #app :is(.primary-button,.attach-file-button,.mud-button-filled-primary) { color:#121e2c; }
:root[data-theme] #app .attach-file-button { background:var(--workspace-surface); color:var(--workspace-link); border-color:var(--workspace-line); }
:root[data-theme] #app :is(.text-button,.item-actions button) { min-height:36px; font-size:13px; }
:root[data-theme] #app .filter-tabs { border-bottom:1px solid var(--workspace-line); }
:root[data-theme] #app .filter-tabs > button { color:var(--workspace-muted); font-size:13px; border:0; border-bottom:2px solid transparent; border-radius:0; }
:root[data-theme] #app .filter-tabs > button.active { color:var(--workspace-link); border-bottom-color:var(--workspace-accent); background:transparent; }
:root[data-theme] #app .retrieval-filters { margin-top:14px; gap:12px; }
:root[data-theme] #app .retrieval-filters .search-label { flex:2 1 300px; }
:root[data-theme] #app .search-options { padding-top:14px; gap:12px; }
:root[data-theme] #app .search-options label { flex:1 1 160px; min-width:0; }
:root[data-theme] #app .capture-row { border-bottom:1px solid var(--workspace-line); padding:18px 0; }
:root[data-theme] #app .capture-text { color:var(--workspace-ink); font-size:14px; }
:root[data-theme] #app .note-content p { color:inherit; }
:root[data-theme] #app .nav-item > span { display:inline-flex; align-items:center; }
:root[data-theme] #app :is(.kind-icon,.tag,.area-tag,.capture-kinds,.task-state,.email-draft-toolbar,.today-task-meta) { background:var(--workspace-soft); color:var(--workspace-muted); border-color:var(--workspace-line); }
:root[data-theme] #app .tag { font-size:11px; padding:4px 8px; border-radius:4px; }
:root[data-theme] #app :is(.capture-kinds button.chosen,.isi-tag) { background:var(--workspace-selected); color:var(--workspace-link); box-shadow:none; }
:root[data-theme] #app :is(.contact-card,.calendar-event,.today-task,.project-row,.attachment,.task-activity,.outlook-message,.screenshot-paste-zone,.edit-attachment) { border-color:var(--workspace-line); }
:root[data-theme] #app .screenshot-paste-zone { border-width:1px; background:var(--workspace-soft); color:var(--workspace-muted); border-radius:5px; }
:root[data-theme] #app :is(.message,.planning-warning,.edit-warning) { border-width:1px; border-radius:5px; }
:root[data-theme] #app .capture-editor { max-width:none; }
:root[data-theme] #app .editor-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,320px); gap:24px; min-width:0; }
:root[data-theme] #app .editor-main, :root[data-theme] #app .editor-details { min-width:0; }
:root[data-theme] #app .editor-section-title { padding-bottom:12px; margin-bottom:16px; border-bottom:1px solid var(--workspace-line); font-size:13px; color:var(--workspace-link); }
:root[data-theme] #app .editor-details { padding-left:20px; border-left:1px solid var(--workspace-line); }
:root[data-theme] #app .editor-details .edit-organization { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
:root[data-theme] #app .editor-details .edit-organization label { grid-column:auto; }
:root[data-theme] #app .note-toolbar { border:1px solid var(--workspace-line); border-bottom:0; background:var(--workspace-soft); padding:6px; gap:4px; border-radius:5px 5px 0 0; }
:root[data-theme] #app .note-toolbar button { border:1px solid transparent; background:transparent; color:var(--workspace-ink); border-radius:4px; min-height:32px; }
:root[data-theme] #app .note-toolbar button:hover { background:var(--workspace-selected); border-color:var(--workspace-line); }
:root[data-theme] #app .note-toolbar button[aria-pressed="true"] { background:var(--workspace-selected); border-color:var(--workspace-accent); color:var(--workspace-link); }
:root[data-theme] #app .note-editable { border:1px solid var(--workspace-line); border-radius:0 0 5px 5px; background:var(--workspace-surface); color:var(--workspace-ink); min-height:240px; padding:16px; font-size:14px; }
:root[data-theme] #app .capture-editor .note-editable { min-height:320px; }
:root[data-theme] #app :is(button,a,input,select,textarea,summary,.note-editable):focus-visible { outline:2px solid var(--workspace-accent); outline-offset:3px; }
:root[data-theme] #app :is(.nav-item,.area-link,.project-row,.text-button,.item-actions button,.top-search):hover { background:var(--workspace-selected); }
:root[data-theme] #app footer { border-top:1px solid var(--workspace-line); margin-top:26px; padding:16px 0; font-size:11px; color:var(--workspace-muted); }
@media (max-width:1200px) {
    :root[data-theme] #app .topbar .brand { flex-basis:160px; }
    :root[data-theme] #app .topbar .header-navigation { flex-basis:450px; }
    :root[data-theme] #app .header-status { margin-left:auto; }
    :root[data-theme] #app .editor-layout { grid-template-columns:minmax(0,1fr); }
    :root[data-theme] #app .editor-details { border-left:0; padding-left:0; }
    :root[data-theme] #app .editor-details .edit-organization { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:760px) {
    :root[data-theme] #app .shell { grid-template-columns:180px minmax(0,1fr); }
    :root[data-theme] #app .navigation { padding:12px 8px; }
    :root[data-theme] #app .content { padding:0 16px; }
    :root[data-theme] #app .stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
    :root[data-theme] #app .planning-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
    :root[data-theme] #app .editor-details .edit-organization { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:640px) {
    :root[data-theme] #app .shell, :root[data-theme] #app .shell.menu-unpinned { display:flex; flex-direction:column; }
    :root[data-theme] #app .shell > .topbar { width:100%; padding:10px 14px; gap:12px; }
    :root[data-theme] #app .topbar .brand { flex:1 1 100%; }
    :root[data-theme] #app .topbar .header-navigation { flex:1 1 100%; display:grid; grid-template-columns:44px minmax(0,1fr); }
    :root[data-theme] #app .topbar .quick-access { grid-template-columns:repeat(2,minmax(0,1fr)); }
    :root[data-theme] #app .topbar .quick-access .top-search { min-height:44px; padding:8px 6px; font-size:13px; }
    :root[data-theme] #app .topbar .theme-control select { min-height:44px; width:145px; font-size:14px; }
    :root[data-theme] #app .header-status { width:100%; margin:0; }
    :root[data-theme] #app .shell.menu-pinned .navigation { width:100%; height:auto; position:static; border-right:0; border-bottom:1px solid var(--workspace-line); }
    :root[data-theme] #app .shell.menu-pinned .navigation nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
    :root[data-theme] #app .shell.menu-pinned .navigation :is(.area-caption,.area-link,.local-card) { display:none; }
    :root[data-theme] #app .content { padding:0 12px; }
    :root[data-theme] #app .route-heading { font-size:22px; }
    :root[data-theme] #app .panel { padding:16px; }
    :root[data-theme] #app .stats article { padding:12px; }
    :root[data-theme] #app .stats small { font-size:11px; }
    :root[data-theme] #app .retrieval-filters > label, :root[data-theme] #app .retrieval-filters .search-label { flex:1 1 100%; }
    :root[data-theme] #app :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) { font-size:16px; min-height:44px; }
    :root[data-theme] #app :is(.primary-button,.attach-file-button,.text-button,.item-actions button,.menu-pin,.menu-toggle,.navigation .nav-item,.note-toolbar button) { min-height:44px; }
    :root[data-theme] #app .note-editable { font-size:16px; padding:12px; }
    :root[data-theme] #app .capture-editor .note-editable { min-height:260px; }
}
@media (prefers-reduced-motion:reduce) { :root[data-theme] #app * { scroll-behavior:auto; transition:none; } }
