*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
[hidden] { display: none !important; }

:root {
  --bg: #0e1015; --bg2: #161922; --bg3: #222734; --border: #2c3242;
  --bd2: #3a4153;                              /* emphasis border */
  --surface-a: #222734; --surface-b: #1a1e29;  /* tactile card gradient stops */
  --text: #f4f5fa; --text2: #9aa3b4; --text3: #5f6878;
  --accent: #9fb0c7; --accent-dim: rgba(159,176,199,.14);
  /* Semantic / urgency channel — fixed roles */
  --waiting: #f0b34a; --stale: #e0607e; --done: #46c98a;
  --danger: #e0607e; --active: #46c98a; --paused: #f0b34a; --archived: #5f6878;
  --radius: 8px; --font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Light theme — overrides the palette variables; everything else reads var(--…) */
:root[data-theme="light"] {
  --bg: #FAF7F0; --bg2: #FFFFFF; --bg3: #F1EEE4; --border: #E4E1D8;
  --bd2: #D4D0C4; --surface-a: #FFFFFF; --surface-b: #F5F2EA;
  --text: #1F3A2E; --text2: #5F6B62; --text3: #8A9690;
  --accent: #2D6C4E; --accent2: #2D6C4E; --accent-dim: rgba(45,108,78,.12); --sidebar-bg: #DDE8D8;
  --waiting: #9A6700; --stale: #B83030; --done: #2D6C4E;
  --danger: #B83030; --active: #2D6C4E; --paused: #9A6700; --archived: #8A9690;
}

/* Lyra dark — shadcn-svelte "Lyra" preset (olive neutrals, JetBrains Mono, zero radius).
   Accent: warm olive-stone, monochrome-faithful (no violet). */
:root[data-theme="lyra"] {
  --bg: oklch(0.153 0.006 107.1); --bg2: oklch(0.228 0.013 107.4);
  --bg3: oklch(0.286 0.016 107.4); --border: oklch(1 0 0 / 10%);
  --bd2: oklch(1 0 0 / 18%);
  --surface-a: oklch(0.228 0.013 107.4); --surface-b: oklch(0.19 0.011 107.4);
  --text: oklch(0.988 0.003 106.5); --text2: oklch(0.737 0.021 106.9); --text3: oklch(0.58 0.031 107.3);
  --accent: oklch(0.78 0.05 107.1); --accent2: oklch(0.78 0.05 107.1);
  --accent-dim: oklch(0.78 0.05 107.1 / 18%);
  --radius: 0px;
  --font: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}
:root[data-theme="lyra"] * { border-radius: 0 !important; }
:root[data-theme="lyra"] .brief-prose,
:root[data-theme="lyra"] .brief-title { font-family: var(--font); }

/* Lyra light — same aesthetic, light olive-warm background, muted olive accent. */
:root[data-theme="lyra-light"] {
  --bg: oklch(0.97 0.005 107.1); --bg2: oklch(0.93 0.008 107.4);
  --bg3: oklch(0.87 0.012 107.4); --border: oklch(0.153 0.006 107.1 / 14%);
  --bd2: oklch(0.153 0.006 107.1 / 24%);
  --surface-a: oklch(0.93 0.008 107.4); --surface-b: oklch(0.90 0.01 107.4);
  --text: oklch(0.18 0.008 107.1); --text2: oklch(0.42 0.022 107.1); --text3: oklch(0.58 0.018 107.3);
  --accent: oklch(0.42 0.07 107.1); --accent2: oklch(0.42 0.07 107.1);
  --accent-dim: oklch(0.42 0.07 107.1 / 14%);
  --sidebar-bg: oklch(0.91 0.011 107.4);
  --radius: 0px;
  --font: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}
:root[data-theme="lyra-light"] * { border-radius: 0 !important; }
:root[data-theme="lyra-light"] .brief-prose,
:root[data-theme="lyra-light"] .brief-title { font-family: var(--font); }

html, body { height: 100%; background: var(--bg); color: var(--text); font-family: var(--font); font-size: 16.8px; }

#app { display: grid; grid-template-columns: 240px 1fr; grid-template-rows: minmax(0, 1fr); height: 100vh; overflow: hidden; }

/* Sidebar */
#sidebar { background: var(--sidebar-bg, var(--bg2)); border-right: 1px solid var(--border); display: flex; flex-direction: column; overflow: hidden; }
.sidebar-header { display: flex; align-items: center; justify-content: space-between; padding: 18px 16px 12px; border-bottom: 1px solid var(--border); }
.sidebar-header h1 { font-size: 18px; font-weight: 600; letter-spacing: .02em; }
.continuum-wordmark { cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 2px; line-height: 1; }
.cw-top { font-family: 'Jost', sans-serif; font-weight: 700; font-size: 17px; letter-spacing: .18em; text-transform: uppercase; }
.cw-bracket-open { color: #3b82f6; }
.cw-bracket-close { color: #e8212e; }
.cw-bottom { font-family: 'Jost', sans-serif; font-weight: 700; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; color: #FFD84D; }
#btn-new-project { width: 28px; height: 28px; background: var(--accent); color: #fff; border: none; border-radius: 6px; font-size: 24px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
#btn-new-project:hover { opacity: .85; }
.filter-row { display: flex; gap: 4px; padding: 8px 10px; border-bottom: 1px solid var(--border); }
.filter-btn { flex: 1; background: none; border: 1px solid transparent; border-radius: 5px; color: var(--text2); font-size: 13.2px; padding: 4px 2px; cursor: pointer; }
.filter-btn:hover { color: var(--text); background: var(--bg3); }
.filter-btn.active { border-color: transparent; color: var(--accent2); background: var(--accent-dim); }
#project-list { list-style: none; overflow-y: auto; flex: 1; min-height: 0; padding: 6px 0; }
#shared-project-list { list-style: none; padding: 6px 0; }
.proj-list-item { display: flex; align-items: center; gap: 8px; padding: 8px 9px; cursor: pointer; border-radius: 9px; margin-bottom: 2px; }
.proj-list-item:hover { background: var(--bg3); }
.proj-list-item.selected { background: var(--accent-dim); }
.proj-rail { width: 5px; height: 28px; border-radius: 3px; flex-shrink: 0; }
.proj-list-item.dragging { opacity: .35; }
.proj-list-item.drag-over-top { border-top: 2px solid var(--accent); }
.proj-list-item.drag-over-bottom { border-bottom: 2px solid var(--accent); }
.drag-handle { flex-shrink: 0; color: var(--text3); cursor: grab; font-size: 15.6px; padding: 2px 3px; user-select: none; line-height: 1; opacity: 0; transition: opacity .12s; }
.proj-list-item:hover .drag-handle { opacity: 1; }
.proj-list-content { flex: 1; min-width: 0; }
.proj-list-name { font-weight: 500; font-size: 14.4px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.proj-list-meta { font-size: 12px; color: var(--text3); margin-top: 1px; }
.star-btn { flex-shrink: 0; background: none; border: none; color: var(--text3); cursor: pointer; font-size: 16.8px; padding: 2px 3px; line-height: 1; opacity: 0; transition: opacity .12s; }
.proj-list-item:hover .star-btn { opacity: 1; }
.star-btn.starred { color: #e0b341; opacity: 1; }
.star-btn.starred:hover { color: #caa12e; }

/* Main */
#main { overflow-y: auto; min-height: 0; padding: 32px 40px; }
#empty-state { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--text2); font-size: 18px; }

/* Portfolio */
.portfolio-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.portfolio-header h2 { font-size: 24px; font-weight: 700; }
.pf-mode-tabs { display: flex; gap: 4px; }
.pf-mode-btn { background: none; border: 1px solid var(--border); border-radius: 5px; color: var(--text2); font-size: 14.4px; padding: 5px 12px; cursor: pointer; }
.pf-mode-btn:hover { color: var(--text); background: var(--bg3); }
.pf-mode-btn.active { border-color: var(--accent); color: var(--accent); background: var(--accent-dim); }
.guide-tabs { display: flex; gap: 8px; margin-bottom: 18px; }
.guide-tab-btn { background: none; border: 1px solid var(--border); border-radius: 5px; color: var(--text2); font-size: 14.4px; padding: 5px 12px; cursor: pointer; }
.guide-tab-btn:hover { color: var(--text); background: var(--bg3); }
.guide-tab-btn.active { border-color: var(--accent); color: var(--accent); background: var(--accent-dim); }
#pf-signal-strip { display: flex; gap: 24px; padding: 10px 0 20px; }
.pf-signal-stat { display: flex; align-items: baseline; gap: 5px; }
.pf-signal-num { font-size: 26.4px; font-weight: 700; line-height: 1; }
.pf-signal-label { font-size: 13.2px; color: var(--text2); text-transform: uppercase; letter-spacing: .05em; }
.pf-signal--blocked .pf-signal-num { color: var(--paused); }
.pf-signal--stale .pf-signal-num { color: var(--danger); }
.pf-signal--muted .pf-signal-num { color: var(--text2); }
.pf-group { margin-bottom: 28px; }
.pf-group-header { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.pf-group-label { font-size: 13.2px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--text2); }
.pf-group-count { background: var(--bg3); border: 1px solid var(--border); color: var(--text2); border-radius: 10px; padding: 1px 7px; font-size: 13.2px; font-weight: 600; }
.pf-group-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.pf-group-cards:has(> .pf-card:only-child) { grid-template-columns: 1fr; }
.pf-card { background: linear-gradient(155deg, var(--surface-a), var(--surface-b)); border: 1px solid var(--border); border-radius: 13px; padding: 14px 16px; cursor: pointer; display: flex; flex-direction: column; gap: 8px; transition: transform .12s, border-color .12s; border-left: 3px solid transparent; box-shadow: 0 6px 20px rgba(0,0,0,.064), inset 0 1px 0 rgba(255,255,255,.04); }
.pf-card:hover { border-color: var(--bd2); transform: translateY(-2px); }
.pf-card--blocked { border-left-color: var(--paused); }
.pf-card--stale { border-left-color: var(--danger); }
.pf-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.pf-card-name { font-weight: 600; font-size: 16.8px; line-height: 1.3; flex: 1; }
.pf-card-badges { display: flex; align-items: center; gap: 5px; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }
.pf-card-badge { font-size: 12px; font-weight: 600; padding: 2px 6px; border-radius: 20px; text-transform: uppercase; letter-spacing: .05em; white-space: nowrap; }
.pf-card-pills { display: flex; gap: 4px; flex-wrap: wrap; }
.pf-card-wait { font-size: 14.4px; color: var(--paused); display: flex; align-items: center; gap: 6px; }
.pf-card-wait-days { font-size: 13.2px; font-weight: 600; background: rgba(240,165,0,.15); border-radius: 4px; padding: 1px 5px; }
.pf-card-next { display: flex; align-items: baseline; gap: 6px; overflow: hidden; }
.pf-card-next--empty { color: var(--text2); font-size: 14.4px; font-style: italic; }
.pf-next { font-size: 14.4px; color: var(--text2); font-style: italic; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-next-count { display: inline-block; background: var(--accent-dim); color: var(--accent); border-radius: 10px; padding: 1px 7px; font-size: 13.2px; font-weight: 600; font-style: normal; flex-shrink: 0; }
.pf-card-footer { font-size: 13.2px; color: var(--text2); margin-top: 2px; }
#pf-popover { position: fixed; z-index: 50; background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: 0 8px 24px rgba(0,0,0,.07); padding: 12px 16px; width: 260px; pointer-events: none; }
#pf-popover-inner { display: flex; flex-direction: column; gap: 8px; }
.pf-pop-list { list-style: none; display: flex; flex-direction: column; gap: 5px; }
.pf-pop-list li { font-size: 14.4px; line-height: 1.4; color: var(--text); padding-left: 12px; position: relative; }
.pf-pop-list li::before { content: '›'; position: absolute; left: 0; color: var(--accent); }
.pf-pop-desc { font-size: 13.2px; color: var(--text2); font-style: italic; border-top: 1px solid var(--border); padding-top: 8px; line-height: 1.5; }

/* Project header */
.project-header { margin-bottom: 32px; padding-bottom: 20px; border-bottom: 1px solid var(--border); display: flex; flex-direction: column; gap: 12px; }
.proj-actions-row { display: flex; align-items: center; gap: 10px; }
.proj-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
#proj-status-select { background: var(--bg3); border: 1px solid var(--border); color: var(--text); border-radius: 5px; padding: 4px 8px; font-size: 14.4px; cursor: pointer; }
.field-group { display: flex; flex-direction: column; gap: 5px; }
.field-label { font-size: 13.2px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--text2); }
.field-input { background: var(--bg3); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: var(--font); font-size: 15.6px; padding: 8px 12px; width: 100%; max-width: 560px; }
.field-input:focus { outline: none; border-color: var(--accent); }
.field-input::placeholder { color: var(--text2); opacity: .5; }
.field-input--title { font-size: 21.6px; font-weight: 600; }
#proj-status-badge { font-size: 13.2px; font-weight: 600; padding: 3px 8px; border-radius: 20px; text-transform: uppercase; letter-spacing: .05em; }
.badge-active { background: rgba(46,204,113,.15); color: var(--active); }
.badge-paused { background: rgba(240,165,0,.15); color: var(--paused); }
.badge-archived { background: rgba(102,102,128,.15); color: var(--archived); }

/* Sections */
.section { margin-bottom: 40px; }
.section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.section-header h3 { font-size: 15.6px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--text2); }
.section-header-left { display: flex; align-items: center; gap: 6px; }
.section-toggle { background: none; border: none; color: var(--text3); cursor: pointer; font-size: 13px; padding: 0; line-height: 1; }
.section-toggle:hover { color: var(--text2); }
.section-count { font-size: 12px; color: var(--text3); font-weight: 400; letter-spacing: 0; text-transform: none; }
.section--collapsed .section-body { display: none; }
.section--collapsed .section-header { margin-bottom: 0; }

/* Tools + Deployments tables */
#tools-table, #deploy-table { width: 100%; border-collapse: collapse; font-size: 15.6px; }
#tools-table th, #deploy-table th { text-align: left; padding: 7px 12px; border-bottom: 1px solid var(--border); color: var(--text2); font-weight: 500; font-size: 14.4px; }
#tools-table td, #deploy-table td { padding: 9px 12px; border-bottom: 1px solid var(--border); vertical-align: middle; }
#tools-table tr:last-child td, #deploy-table tr:last-child td { border-bottom: none; }
#tools-table tr:hover td, #deploy-table tr:hover td { background: var(--bg3); }
.tool-chip { display: inline-block; background: var(--accent-dim); color: var(--accent); border-radius: 4px; padding: 2px 8px; font-size: 14.4px; font-weight: 500; }
.profile-chip { display: inline-block; background: var(--bg3); color: var(--text2); border: 1px solid var(--border); border-radius: 4px; padding: 1px 6px; font-size: 13.2px; margin-left: 4px; }
.tool-location a, #deploy-table a { color: var(--accent); text-decoration: none; }
.tool-location a:hover, #deploy-table a:hover { text-decoration: underline; }
.tool-notes { color: var(--text2); font-size: 14.4px; }

/* Drops + Work Log shared styles */
.drop-input-row { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; align-items: center; }
#drop-input, #log-input { flex: 1 1 100%; background: var(--bg3); border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); font-family: var(--font); font-size: 15.6px; padding: 10px 14px; resize: vertical; min-height: 70px; }
#drop-input:focus, #log-input:focus { outline: none; border-color: var(--accent); }
#drops-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.drop-item { background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; }
.drop-item:first-child { border-color: var(--accent-dim); }
.drop-content { font-size: 15.6px; line-height: 1.6; white-space: pre-wrap; }
.drop-meta { font-size: 13.2px; color: var(--text2); margin-top: 8px; display: flex; justify-content: space-between; align-items: center; }
.drop-delete { background: none; border: none; color: var(--text2); cursor: pointer; font-size: 14.4px; padding: 2px 6px; border-radius: 4px; }
.drop-delete:hover { background: rgba(224,85,85,.2); color: var(--danger); }

/* Buttons */
button { font-family: var(--font); cursor: pointer; }
.primary-btn { background: var(--accent); color: #fff; border: none; border-radius: 6px; padding: 8px 16px; font-size: 15.6px; font-weight: 500; }
.primary-btn:hover { opacity: .88; }
.danger-btn { background: none; border: 1px solid var(--danger); color: var(--danger); border-radius: 6px; padding: 4px 12px; font-size: 14.4px; }
.danger-btn:hover { background: rgba(224,85,85,.15); }
#btn-add-tool, #btn-add-deployment, #btn-add-document { background: var(--bg3); border: 1px solid var(--border); color: var(--text); border-radius: 6px; padding: 5px 12px; font-size: 14.4px; }
#btn-add-tool:hover, #btn-add-deployment:hover, #btn-add-document:hover { border-color: var(--accent); color: var(--accent); }
#btn-add-drop, #btn-add-log { background: var(--bg3); border: 1px solid var(--border); color: var(--text); border-radius: 6px; padding: 10px 16px; font-size: 15.6px; white-space: nowrap; }
#btn-add-drop:hover, #btn-add-log:hover { border-color: var(--accent); color: var(--accent); }
.icon-btn { background: none; border: none; color: var(--text2); cursor: pointer; padding: 3px 6px; border-radius: 4px; font-size: 14.4px; }
.icon-btn:hover { background: var(--bg3); color: var(--text); }
.nav-section { border-top: 1px solid var(--border); padding: 10px 12px; }
.ask-btn { display: flex; align-items: center; justify-content: space-between; width: 100%; background: none; color: #e86a00; border: none; border-radius: var(--radius); padding: 5px 6px; font-size: 13px; font-weight: 400; cursor: pointer; margin-bottom: 2px; }
.ask-btn:hover { background: var(--bg3); color: #c45500; }
.ask-shortcut { font-size: 11px; font-weight: 400; opacity: 0.75; }
.nav-util-list { list-style: none; margin: 6px 0 0; padding: 0; }
.nav-util-item { display: flex; align-items: center; gap: 4px; font-size: 13px; padding: 5px 6px; border-radius: var(--radius); color: var(--text2); cursor: pointer; }
.nav-util-item:hover { background: var(--bg3); color: var(--text); }
.nav-icon { display: inline-block; width: 18px; text-align: center; opacity: 0.7; flex-shrink: 0; }
#wn-input { flex: 1 1 200px; background: var(--bg3); border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); font-family: var(--font); font-size: 14.4px; padding: 6px 10px; resize: vertical; min-height: 34px; box-sizing: border-box; }
#wn-input:focus { outline: none; border-color: var(--accent); }
.empty-hint { color: var(--text2); font-size: 15.6px; padding: 14px 0; }

/* Modals */
#modal-overlay, #tool-modal-overlay, #deploy-modal-overlay, #complete-modal-overlay, #settings-modal-overlay, #admin-modal-overlay, #sw-modal-overlay, #document-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.6); display: flex; align-items: center; justify-content: center; z-index: 100; }
#sw-modal-overlay[hidden] { display: none !important; }
.modal { background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; padding: 28px 28px 22px; width: 400px; max-width: 95vw; display: flex; flex-direction: column; gap: 14px; }
.sw-modal { width: 640px; }
@keyframes wn-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
.wn-generating { animation: wn-pulse 1.2s ease-in-out infinite; }
.modal-btn-secondary { background: none; border: 1px solid var(--border); color: var(--text2); border-radius: 6px; padding: 8px 16px; font-size: 15.6px; }
.modal-btn-secondary:hover { border-color: var(--text2); color: var(--text); }
.modal h3 { font-size: 19.2px; font-weight: 600; }
.modal label { display: flex; flex-direction: column; gap: 5px; font-size: 14.4px; color: var(--text2); font-weight: 500; text-transform: uppercase; letter-spacing: .04em; }
.modal input { background: var(--bg3); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: var(--font); font-size: 15.6px; padding: 8px 12px; }
.modal input:focus { outline: none; border-color: var(--accent); }
.modal select { background: var(--bg3); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: var(--font); font-size: 15.6px; padding: 8px 12px; cursor: pointer; }
.modal select:focus { outline: none; border-color: var(--accent); }
.modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 4px; }
.modal-actions button:first-child { background: none; border: 1px solid var(--border); color: var(--text2); border-radius: 6px; padding: 8px 16px; font-size: 15.6px; }
.modal-actions button:first-child:hover { border-color: var(--text2); color: var(--text); }
.modal-divider { height: 1px; background: var(--border); margin: 2px 0; }
.modal-section-label { font-size: 14.4px; font-weight: 600; color: var(--text2); text-transform: uppercase; letter-spacing: .05em; }
.modal-hint { font-size: 13.2px; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--archived); }
.tool-row { display: grid; grid-template-columns: 1fr 1.4fr; gap: 8px; }
.tool-row input { background: var(--bg3); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: var(--font); font-size: 14.4px; padding: 7px 10px; }
.tool-row input:focus { outline: none; border-color: var(--accent); }
.tool-row input::placeholder { color: var(--text2); opacity: .45; }

/* Work Log */
#log-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.log-delete { background: none; border: none; color: var(--text2); cursor: pointer; font-size: 14.4px; padding: 2px 6px; border-radius: 4px; }
.log-delete:hover { background: rgba(224,85,85,.2); color: var(--danger); }

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }

/* Login gate */
#login-overlay { position: fixed; inset: 0; background: var(--bg); display: flex; align-items: center; justify-content: center; z-index: 200; }
.login-box { background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; padding: 32px; width: 320px; display: flex; flex-direction: column; gap: 14px; }
.login-box h2 { font-size: 19.2px; font-weight: 600; }
.login-box input { background: var(--bg3); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font: inherit; padding: 10px 12px; }
.login-box input:focus { outline: none; border-color: var(--accent); }
.login-error { color: var(--danger); font-size: 14.4px; min-height: 14px; }

/* Track pill */
.track-pill { display: inline-block; border-radius: 20px; padding: 2px 8px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; white-space: nowrap; }
.subtrack-pill { display: inline-block; border-radius: 20px; padding: 2px 8px; font-size: 12px; font-weight: 500; letter-spacing: .03em; white-space: nowrap; border: 1px solid var(--border); color: var(--text2); background: var(--bg3); }

/* Waiting-on banner */
/* Cold-read header */
.proj-title-input { background: transparent; border: none; color: var(--text); font-family: var(--font); font-size: 30px; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; width: 100%; padding: 2px 0; outline: none; }
.proj-title-input:focus { background: var(--bg3); border-radius: 6px; padding: 2px 8px; margin-left: -8px; }
.proj-title-input::placeholder { color: var(--text3); }
.proj-desc-input { background: transparent; border: none; color: var(--text2); font-family: var(--font); font-size: 15.6px; width: 100%; max-width: 620px; padding: 2px 0; margin-top: 4px; outline: none; }
.proj-desc-input:focus { background: var(--bg3); border-radius: 6px; padding: 2px 8px; margin-left: -8px; }
.proj-desc-input::placeholder { color: var(--text3); opacity: .7; }
.proj-edit { margin-top: 10px; }
.proj-edit > summary { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--text3); cursor: pointer; padding: 4px 0; list-style: none; user-select: none; }
.proj-edit > summary::-webkit-details-marker { display: none; }
.proj-edit > summary::before { content: '▸ '; }
.proj-edit[open] > summary::before { content: '▾ '; }
.proj-edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 10px; }

/* Waiting-on banner (structured) */
.waiting-on { display: flex; align-items: center; gap: 10px; background: rgba(240,179,74,.12); border: 1px solid rgba(240,179,74,.28); border-radius: 10px; padding: 10px 13px; margin: 14px 0 4px; font-size: 14.4px; color: var(--waiting); }
.waiting-on .wo-tx { font-weight: 500; }
.waiting-on .wo-tx b { font-weight: 700; }
.waiting-on .wo-meta { margin-left: auto; font-size: 12px; color: var(--text3); text-align: right; line-height: 1.4; }

/* Staleness flag */
.stale-flag { color: var(--danger); font-size: 13.2px; font-weight: 600; }
.proj-list-meta .stale-dot { color: var(--danger); }

/* Unread dot for shared projects with new activity */
.unread-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #46f08a; margin-left: 5px; vertical-align: middle; flex-shrink: 0; }

/* What's Next item controls */
.wn-item { display: flex; align-items: flex-start; gap: 10px; background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; }
.wn-item .wn-drag-handle { margin-top: 2px; }
.wn-item:hover .wn-drag-handle { color: var(--text2); }
.wn-text { flex: 1; font-size: 15.6px; line-height: 1.5; border-radius: 4px; padding: 2px 4px; margin: -2px -4px; outline: none; }
.wn-text:hover { background: var(--bg3); }
.wn-text:focus { background: var(--bg3); box-shadow: 0 0 0 2px var(--accent); }
.wn-actions { display: flex; gap: 6px; flex-shrink: 0; }
.wn-complete { background: var(--accent); color: #fff; border: none; border-radius: 5px; padding: 4px 10px; font-size: 14.4px; }
.wn-complete:hover { opacity: .85; }

/* Sort-by-neglected toggle + track filter row */
.sort-row { display: none; }
.sort-row select { flex: 1; background: var(--bg3); border: 1px solid var(--border); color: var(--text); border-radius: 5px; font-size: 13.2px; padding: 4px; }
.log-note { color: var(--text2); font-style: italic; margin-top: 4px; font-size: 14.4px; }

/* What's Next prompt helper (copy button, bulk paste, settings textarea) */
#wn-bulk { flex: 1; background: var(--bg3); border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); font-family: var(--font); font-size: 15.6px; padding: 10px 14px; resize: vertical; min-height: 70px; }
#wn-bulk:focus { outline: none; border-color: var(--accent); }
.modal textarea { background: var(--bg3); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: var(--font); font-size: 14.4px; line-height: 1.5; padding: 8px 12px; resize: vertical; width: 100%; }
.modal textarea:focus { outline: none; border-color: var(--accent); }
/* Track swatch picker */
.swatch-row { display: flex; flex-wrap: wrap; gap: 6px; }
.swatch { width: 26px; height: 26px; border-radius: 6px; cursor: pointer; border: 2px solid transparent; padding: 0; flex-shrink: 0; }
.swatch:hover { border-color: var(--text2); }
.swatch.selected { border-color: var(--text); box-shadow: 0 0 0 2px var(--bg2), 0 0 0 4px var(--accent); }
.inline-track-form { background: var(--bg3); border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.inline-track-form input[type="text"] { background: var(--bg2); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: var(--font); font-size: 15.6px; padding: 7px 10px; width: 100%; box-sizing: border-box; }
.inline-track-form input[type="text"]:focus { outline: none; border-color: var(--accent); }
.track-color-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.track-color-row input[type="color"] { width: 26px; height: 26px; padding: 1px; border: 2px solid var(--border); border-radius: 6px; background: var(--bg2); cursor: pointer; flex-shrink: 0; }
.track-color-row input[type="color"]:hover { border-color: var(--text2); }
.inline-track-actions { display: flex; gap: 6px; justify-content: flex-end; }
.inline-track-actions button:first-child { background: none; border: 1px solid var(--border); color: var(--text2); border-radius: 6px; padding: 5px 10px; font-size: 14.4px; }
.inline-track-actions button:first-child:hover { border-color: var(--text2); color: var(--text); }
.inline-track-actions .primary-btn { padding: 5px 10px; font-size: 14.4px; }

.reference-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; align-items: stretch; }
.reference-grid > .section { margin-bottom: 0; background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; }
.reference-grid > .section .section-header { margin-bottom: 8px; }
.reference-grid > .section .section-header h3 { font-size: 10.8px; color: var(--text3); }
@media (max-width: 900px) { .reference-grid { grid-template-columns: 1fr; } }
.ref-list { list-style: none; display: flex; flex-direction: column; }
.ref-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 0; font-size: 13.2px; border-bottom: 1px solid var(--border); }
.ref-row:last-child { border-bottom: none; }
.ref-name { color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ref-sub { color: var(--text3); font-size: 12px; }
.ref-act { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.ref-act a { color: var(--accent2); text-decoration: none; }
.ref-act a:hover { text-decoration: underline; }
.ref-loc { color: var(--text3); font-family: ui-monospace, "SF Mono", monospace; font-size: 12px; max-width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ref-icon { background: none; border: none; color: var(--text3); cursor: pointer; font-size: 13.2px; padding: 0 2px; opacity: 0; transition: opacity .12s; }
.ref-row:hover .ref-icon { opacity: 1; }
.ref-icon:hover { color: var(--text); }

.wn-next { display: block; background: linear-gradient(150deg, var(--surface-a), var(--surface-b)); border: 1px solid var(--bd2); border-radius: 14px; padding: 16px 18px; box-shadow: 0 10px 28px rgba(0,0,0,.072); margin-bottom: 12px; list-style: none; }
.wn-next-label { display: flex; align-items: center; gap: 6px; font-size: 10.8px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; }
.wn-num { font-size: 11px; font-weight: 700; color: var(--text3); min-width: 16px; flex-shrink: 0; }
.wn-next-row { display: flex; align-items: center; gap: 12px; }
.wn-next-text { flex: 1; font-size: 20.4px; font-weight: 600; line-height: 1.3; }
.wn-complete--lg { background: var(--done); color: #08120c; font-weight: 700; padding: 9px 16px; }
.wn-demote, .wn-promote { background: var(--bg3); border: 1px solid var(--border); color: var(--text2); border-radius: 5px; padding: 4px 9px; font-size: 15.6px; line-height: 1; }
.wn-demote:hover, .wn-promote:hover { border-color: var(--accent); color: var(--accent); }
.wn-copy-btn { background: none; border: none; color: var(--text2); cursor: pointer; font-size: 14.4px; padding: 2px 6px; border-radius: 4px; opacity: 0; transition: opacity .15s; }
.wn-item:hover .wn-copy-btn, .wn-next:hover .wn-copy-btn { opacity: 1; }
.wn-copy-btn:hover { background: var(--bg3); color: var(--accent); }
.wn-queued-label { list-style: none; font-size: 10.8px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--text3); margin: 4px 0 7px 2px; }

.documents-list { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.doc-item { padding: 8px 0; border-bottom: 1px solid var(--border); min-width: 0; }
.doc-item:last-child { border-bottom: none; }
.doc-row1 { display: flex; align-items: center; gap: 7px; min-width: 0; }
.doc-kind { font-size: 9.6px; font-weight: 700; letter-spacing: .05em; padding: 1px 5px; border-radius: 4px; background: var(--accent-dim); color: var(--accent); flex-shrink: 0; }
.doc-name { font-size: 14.4px; color: var(--text); font-weight: 500; overflow-wrap: anywhere; min-width: 0; }
.doc-loc { font-size: 12px; color: var(--text3); font-family: ui-monospace, "SF Mono", monospace; margin: 3px 0 5px; overflow-wrap: anywhere; word-break: break-all; }
.doc-acts { display: flex; gap: 6px; }
.doc-btn { font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 6px; border: 1px solid var(--border); color: var(--accent); background: var(--bg); cursor: pointer; text-decoration: none; }
.doc-btn.doc-del { color: var(--text3); margin-left: auto; }
.doc-hint { font-size: 12px; color: var(--text3); font-style: italic; margin-top: 4px; }
.doc-loc-link { display: block; }
.doc-loc-link:hover { color: var(--accent); text-decoration: underline; }
#doc-drop-zone { position: relative; min-height: 36px; border-radius: 6px; transition: background 0.12s; }
#doc-drop-zone.drag-over { background: var(--accent-dim); outline: 2px dashed var(--accent); outline-offset: 3px; }
.doc-drop-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 600; color: var(--accent); pointer-events: none; opacity: 0; transition: opacity 0.1s; z-index: 1; }
#doc-drop-zone.drag-over .doc-drop-overlay { opacity: 1; }

.log-daygroup { list-style: none; margin-bottom: 13px; }
.log-day { font-size: 12px; color: var(--text3); font-weight: 600; margin-bottom: 6px; padding-bottom: 4px; border-bottom: 1px solid var(--border); }
.log-row { display: flex; gap: 9px; align-items: baseline; padding: 5px 0; }
.log-tag { font-size: 9.6px; font-weight: 700; letter-spacing: .06em; padding: 2px 6px; border-radius: 5px; flex-shrink: 0; width: 64px; text-align: center; }
.tag-done { background: rgba(70,201,138,.13); color: var(--done); }
.tag-dec { background: var(--accent-dim); color: var(--accent); }
.tag-note { background: rgba(95,104,120,.18); color: var(--text2); }
.tag-blk { background: rgba(240,179,74,.13); color: var(--waiting); }
.log-body { flex: 1; font-size: 13.2px; color: var(--text2); line-height: 1.45; }
.log-text { color: var(--text2); }
.log-note { color: var(--text3); font-style: italic; margin-left: 6px; }
.log-time { color: var(--text3); font-size: 12px; margin-left: 6px; cursor: default; }
.log-seq { font-weight: 600; color: var(--text2); }
.wn-time { font-size: 11px; color: var(--text3); letter-spacing: .02em; flex-shrink: 0; padding-left: 8px; align-self: center; cursor: default; }
.wn-prompt-btn { color: var(--accent); }
.log-delete { background: none; border: none; color: var(--text3); cursor: pointer; font-size: 14.4px; }
.log-delete:hover { color: var(--danger); }
#log-type { background: var(--bg3); border: 1px solid var(--border); color: var(--text); border-radius: 6px; padding: 5px 8px; font-size: 14.4px; margin-left: auto; }

/* Command palette */
#cmdk-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.5); display: flex; align-items: flex-start; justify-content: center; padding-top: 14vh; z-index: 300; }
.cmdk { background: var(--bg2); border: 1px solid var(--bd2); border-radius: 14px; width: 480px; max-width: 92vw; box-shadow: 0 20px 60px rgba(0,0,0,.10); overflow: hidden; }
#cmdk-input { width: 100%; background: transparent; border: none; border-bottom: 1px solid var(--border); color: var(--text); font-family: var(--font); font-size: 18px; padding: 14px 16px; outline: none; }
#cmdk-input::placeholder { color: var(--text3); }
#cmdk-results { list-style: none; max-height: 320px; overflow-y: auto; padding: 6px; }
.cmdk-row { display: flex; align-items: center; gap: 9px; padding: 9px 10px; border-radius: 8px; cursor: pointer; }
.cmdk-row.active { background: var(--accent-dim); }
.cmdk-rail { width: 5px; height: 22px; border-radius: 3px; flex-shrink: 0; }
.cmdk-name { font-size: 15.6px; color: var(--text); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmdk-meta { font-size: 12px; color: var(--text3); text-transform: uppercase; letter-spacing: .05em; flex-shrink: 0; }
.cmdk-empty { padding: 16px; color: var(--text3); font-size: 15.6px; text-align: center; }
.cmdk-hint { border-top: 1px solid var(--border); padding: 8px 14px; font-size: 12px; color: var(--text3); }

/* Clickable empty states */
.empty-hint.clickable { cursor: pointer; }
.empty-hint.clickable:hover { color: var(--text2); }

/* Responsive / narrow screens */
@media (max-width: 760px) {
  #app { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); }
  #sidebar { max-height: 42vh; border-right: none; border-bottom: 1px solid var(--border); }
  #main { padding: 18px 16px; }
  .proj-edit-grid { grid-template-columns: 1fr; }
  .reference-grid { grid-template-columns: 1fr; }
  .proj-title-input { font-size: 25.2px; }
  .wn-next-row { flex-wrap: wrap; }
}

/* Track color editing */
.track-select-row { display: flex; gap: 8px; align-items: center; }
.track-select-row .field-input { flex: 1; }
.track-color-edit { width: 30px; height: 30px; padding: 1px; border: 1px solid var(--border); border-radius: 6px; background: var(--bg3); cursor: pointer; flex-shrink: 0; }
.track-color-edit:hover { border-color: var(--accent); }
.settings-tracks { display: flex; flex-direction: column; gap: 8px; }
#settings-track-list { display: flex; flex-direction: column; gap: 9px; max-height: 220px; overflow-y: auto; }
.strack-row { display: flex; align-items: center; gap: 9px; }
.strack-dot { width: 14px; height: 14px; border-radius: 4px; flex-shrink: 0; }
.strack-name { font-size: 14.4px; color: var(--text); font-weight: 500; text-transform: none; letter-spacing: 0; min-width: 96px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.strack-swatches { display: flex; gap: 4px; flex-wrap: wrap; flex: 1; }
.strack-swatches .swatch { width: 18px; height: 18px; }
.strack-color { width: 26px; height: 26px; padding: 1px; border: 1px solid var(--border); border-radius: 6px; background: var(--bg3); cursor: pointer; flex-shrink: 0; }

.settings-email { display: flex; flex-direction: column; gap: 8px; }
.settings-email .email-toggle { display: flex; align-items: center; gap: 8px; font-size: 14.4px; }
.settings-email .email-timing { display: flex; gap: 16px; flex-wrap: wrap; }
.settings-email .email-timing label { display: flex; align-items: center; gap: 6px; font-size: 14.4px; }
.settings-email .email-timing select { font-size: 14px; padding: 3px 6px; border: 1px solid var(--border); border-radius: 4px; background: var(--bg); color: var(--text); }
.settings-email .icon-btn { align-self: flex-start; border: 1px solid var(--border); padding: 6px 12px; }
.settings-email .icon-btn:hover { border-color: var(--accent); color: var(--accent); }
.settings-export { display: flex; flex-direction: column; gap: 8px; }
.settings-export .icon-btn { align-self: flex-start; border: 1px solid var(--border); padding: 6px 12px; }
.settings-export .icon-btn:hover { border-color: var(--accent); color: var(--accent); }

.settings-mcp-tokens { display: flex; flex-direction: column; gap: 8px; }
.mcp-token-generate-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.mcp-token-generate-row input { flex: 1; min-width: 140px; font-size: 14px; padding: 5px 8px; border: 1px solid var(--border); border-radius: 5px; background: var(--bg); color: var(--text); }
.mcp-token-generate-row .icon-btn { border: 1px solid var(--border); padding: 6px 12px; white-space: nowrap; }
.mcp-token-generate-row .icon-btn:hover { border-color: var(--accent); color: var(--accent); }
#mcp-token-reveal { display: flex; align-items: center; gap: 8px; background: var(--bg2); border: 1px solid var(--border); border-radius: 5px; padding: 6px 10px; flex-wrap: wrap; }
#mcp-token-reveal code { font-family: var(--mono, monospace); font-size: 13px; word-break: break-all; flex: 1; }
#mcp-token-reveal .icon-btn { border: 1px solid var(--border); padding: 4px 10px; flex-shrink: 0; }
#mcp-token-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
#mcp-token-list li { display: flex; align-items: center; gap: 8px; font-size: 14px; padding: 4px 0; border-bottom: 1px solid var(--border); }
#mcp-token-list li:last-child { border-bottom: none; }
#mcp-token-list .token-meta { flex: 1; color: var(--text2); font-size: 13px; }
#mcp-token-list .token-revoked { color: var(--archived); font-size: 12px; }

.cmdk-section { list-style: none; font-size: 9.6px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--text3); padding: 9px 10px 4px; }
.cmdk-kind { font-size: 9.6px; font-weight: 700; text-transform: uppercase; color: var(--text3); flex-shrink: 0; width: 58px; }

/* ── ⌘K tab strip ── */
.cmdk-tabs { display: flex; border-bottom: 1px solid var(--border); }
.cmdk-tab { flex: 1; background: none; border: none; color: var(--text3); font-family: var(--font); font-size: 13.2px; font-weight: 600; padding: 10px 0; cursor: pointer; letter-spacing: .04em; text-transform: uppercase; transition: color .15s; }
.cmdk-tab:hover { color: var(--text); }
.cmdk-tab.active { color: var(--accent); border-bottom: 2px solid var(--accent); margin-bottom: -1px; }

/* ── Chat (Ask tab) ── */
#cmdk-ask-pane { display: flex; flex-direction: column; height: 420px; }
#chat-messages { flex: 1; overflow-y: auto; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.chat-msg { max-width: 85%; padding: 9px 13px; border-radius: 10px; font-size: 15px; line-height: 1.5; white-space: pre-wrap; word-break: break-word; }
.chat-msg-user { align-self: flex-end; background: var(--accent-dim); color: var(--text); border-bottom-right-radius: 3px; }
.chat-msg-assistant { align-self: flex-start; background: var(--bg3,var(--bg2)); border: 1px solid var(--border); color: var(--text); border-bottom-left-radius: 3px; }
.chat-msg-error { color: var(--danger, #e05252); background: transparent; border-color: var(--danger, #e05252); }
.chat-input-row { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--border); }
#chat-input { flex: 1; background: transparent; border: 1px solid var(--bd2); border-radius: 7px; color: var(--text); font-family: var(--font); font-size: 15.6px; padding: 8px 12px; outline: none; }
#chat-input:focus { border-color: var(--accent); }
#chat-input::placeholder { color: var(--text3); }

/* ── Shared-with-me section ── */
.shared-section-header { font-size: 10.8px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--text3); padding: 10px 14px 4px; border-top: 1px solid var(--border); margin-top: 4px; }
.shared-badge { font-size: 9.6px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; background: var(--accent-dim); color: var(--accent); border-radius: 3px; padding: 1px 5px; vertical-align: middle; margin-left: 5px; }

/* ── Attribution chip ── */
.attribution { font-size: 11.4px; font-style: italic; color: var(--text3); }

/* ── Admin modal ── */
.admin-modal { width: min(640px, 92vw); max-height: 80vh; overflow-y: auto; }
.admin-tabs { display: flex; border-bottom: 1px solid var(--border); margin-bottom: 16px; }
.admin-tab { flex: 1; background: none; border: none; color: var(--text3); font-family: var(--font); font-size: 13.2px; font-weight: 600; padding: 9px 0; cursor: pointer; letter-spacing: .04em; text-transform: uppercase; transition: color .15s; }
.admin-tab:hover { color: var(--text); }
.admin-tab.active { color: var(--accent); border-bottom: 2px solid var(--accent); margin-bottom: -1px; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 14.4px; }
.admin-table th { text-align: left; font-size: 10.8px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--text3); padding: 4px 8px 8px; border-bottom: 1px solid var(--border); }
.admin-table td { padding: 8px 8px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.admin-table tr:last-child td { border-bottom: none; }
.status-inactive { color: var(--danger, #e05252); font-size: 13.2px; }
.admin-invite-row { display: flex; gap: 8px; margin-bottom: 10px; }
.admin-invite-row input { flex: 1; background: var(--bg3); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font: inherit; font-size: 14.4px; padding: 7px 10px; }
.admin-invite-row input:focus { outline: none; border-color: var(--accent); }
.admin-invite-result { font-size: 13px; padding: 8px 10px; border-radius: 6px; margin-bottom: 10px; word-break: break-all; }
.admin-invite-ok { background: var(--accent-dim); color: var(--done); }
.admin-invite-err { background: rgba(184,48,48,.12); color: var(--danger); }
.admin-field-row { display: flex; gap: 10px; align-items: center; margin-bottom: 12px; }
.admin-field-row label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--text3); flex: 1; }
.admin-field-row select { background: var(--bg3); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font: inherit; padding: 7px 10px; width: 100%; }
.admin-member-list { list-style: none; padding: 0; margin: 0 0 14px; display: flex; flex-direction: column; gap: 6px; }
.admin-member-row { display: flex; align-items: center; justify-content: space-between; padding: 7px 10px; background: var(--bg3); border-radius: 6px; font-size: 14.4px; }
.admin-member-empty { color: var(--text3); font-size: 13.2px; font-style: italic; padding: 6px 0; }

.admin-project-grouped-list { max-height: 200px; overflow-y: auto; border: 1px solid var(--border); border-radius: 8px; margin-bottom: 14px; }
.admin-project-group-label { font-size: 10.8px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--text3); padding: 8px 10px 4px; border-top: 1px solid var(--border); }
.admin-project-group-label:first-child { border-top: none; }
.admin-project-item { display: flex; align-items: center; padding: 7px 10px; cursor: pointer; font-size: 14.4px; color: var(--text); transition: background .1s; }
.admin-project-item:hover { background: var(--bg3); }
.admin-project-item.selected { background: var(--accent-dim); color: var(--accent); font-weight: 500; }
.admin-members-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--text3); margin-bottom: 6px; }

/* ── Reset success state ── */
.login-success { color: #4caf7d; font-size: 14.4px; }

/* Morning briefing — borderless elevated surface, editorial type, one sparing accent */
#pf-briefing { margin-bottom: 16px; }
#pf-briefing:empty { margin-bottom: 0; }
.brief-card {
  background: var(--bg2);
  border-left: 2px solid var(--accent);
  border-radius: 16px;
  padding: 20px 22px;
  box-shadow: 0 6px 20px rgba(0,0,0,.07), inset 0 1px 0 rgba(255,255,255,.03);
}
.brief-skeleton { color: var(--text2); font-style: italic; padding: 18px 22px; }
.brief-show-link { background: none; border: none; color: var(--text3); font-size: 13.2px; cursor: pointer; padding: 4px 0; letter-spacing: .02em; }
.brief-show-link:hover { color: var(--text2); }
.brief-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.brief-collapsed { display: flex; align-items: center; gap: 10px; }
.brief-toggle {
  background: none; border: 1px solid var(--border); cursor: pointer; line-height: 1;
  font-size: 16px; color: var(--text2); width: 28px; height: 28px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  transition: color .12s, background .12s, border-color .12s;
}
.brief-toggle:hover { color: var(--text); background: var(--bg3); border-color: var(--accent); }
.brief-title {
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-size: 22px; font-weight: 600; letter-spacing: -.01em; color: #d4875a;
}
.brief-headline { font-size: 15px; font-weight: 600; letter-spacing: -.01em; color: var(--text); }
.brief-prose {
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  margin: 0 0 18px; font-size: 18.5px; line-height: 1.5;
  letter-spacing: 0; color: var(--text); max-width: 64ch;
}
.brief-muted { color: var(--text2); font-style: italic; font-size: 14.4px; }
.brief-groups { display: flex; flex-wrap: wrap; gap: 28px; }
.brief-group { min-width: 175px; }
.brief-group-label {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .08em; color: var(--text3); margin-bottom: 8px;
}
.brief-count {
  background: var(--bg3); color: var(--text2);
  border-radius: 100px; padding: 1px 9px; font-size: 12px; font-weight: 600; letter-spacing: 0;
}
.brief-group--accent .brief-count { background: var(--accent-dim); color: var(--accent); }
.brief-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.brief-chip {
  display: inline-flex; align-items: center; cursor: pointer; max-width: 100%;
  padding: 5px 11px; border-radius: 9px;
  background: linear-gradient(155deg, var(--surface-a), var(--surface-b));
  border: 1.5px solid var(--border);
  box-shadow: 0 3px 10px rgba(0,0,0,.05), inset 0 1px 0 rgba(255,255,255,.04);
  font-size: 13.5px; font-weight: 600; color: var(--text); letter-spacing: -.01em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: transform .12s, box-shadow .12s;
}
.brief-chip:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(0,0,0,.09), inset 0 1px 0 rgba(255,255,255,.04); }
.brief-blocked { margin: 0 0 16px; padding: 10px 12px; background: var(--accent-dim); border-left: 3px solid var(--accent); border-radius: 8px; }
.brief-blocked-label { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--accent); margin-bottom: 6px; }
.brief-blocked-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.brief-blocked-item { display: flex; align-items: baseline; gap: 8px; cursor: pointer; font-size: 13px; overflow: hidden; padding: 2px 0; }
.brief-blocked-name { font-weight: 700; color: var(--text); white-space: nowrap; flex-shrink: 0; }
.brief-blocked-wait { color: var(--text2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brief-blocked-days { margin-left: auto; color: var(--accent); font-weight: 600; font-size: 12px; flex-shrink: 0; }

.brief-recent { margin-bottom: 16px; }
.brief-recent-label { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--text3); margin-bottom: 8px; }
.brief-recent-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.brief-recent-item { display: flex; align-items: baseline; gap: 8px; cursor: pointer; font-size: 13px; overflow: hidden; padding: 3px 0; }
.brief-recent-item:hover .brief-recent-text { color: var(--text); }
.brief-recent-proj { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--accent); white-space: nowrap; flex-shrink: 0; }
.brief-recent-text { color: var(--text2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Light-mode palettes — apply only with data-theme="light". Taproot is the base. */
:root[data-theme="light"][data-light-palette="slate"] {
  --bg: #F6F8FA; --bg2: #FFFFFF; --bg3: #EDF1F5; --border: #DCE3EA; --bd2: #C7D2DD;
  --surface-a: #FFFFFF; --surface-b: #F0F4F8;
  --text: #1E293B; --text2: #566276; --text3: #8A95A6;
  --accent: #2563EB; --accent2: #2563EB; --accent-dim: rgba(37,99,235,.12); --sidebar-bg: #E3E9F1;
}
:root[data-theme="light"][data-light-palette="rose"] {
  --bg: #FBF6F4; --bg2: #FFFFFF; --bg3: #F4EAE6; --border: #EAD9D2; --bd2: #DCC3B9;
  --surface-a: #FFFFFF; --surface-b: #F7EEEA;
  --text: #3F2A26; --text2: #6E5751; --text3: #9C857E;
  --accent: #B5524B; --accent2: #B5524B; --accent-dim: rgba(181,82,75,.12); --sidebar-bg: #F0DED7;
}
:root[data-theme="light"][data-light-palette="lavender"] {
  --bg: #F8F7FC; --bg2: #FFFFFF; --bg3: #EFEDF8; --border: #E2DEF1; --bd2: #CFC8E6;
  --surface-a: #FFFFFF; --surface-b: #F2F0FA;
  --text: #2A2540; --text2: #5C5677; --text3: #8A85A3;
  --accent: #6B4FBF; --accent2: #6B4FBF; --accent-dim: rgba(107,79,191,.12); --sidebar-bg: #E6E1F2;
}

/* Light-palette selector (Settings modal) */
.palette-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.palette-swatch { display: flex; align-items: center; gap: 7px; background: none; border: 1px solid var(--border); border-radius: 8px; padding: 5px 10px 5px 6px; cursor: pointer; color: var(--text2); font-family: var(--font); font-size: 13.2px; }
.palette-swatch:hover { color: var(--text); background: var(--bg3); }
.palette-swatch.active { border-color: var(--accent); color: var(--text); }
.palette-chip { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 5px; border: 1px solid var(--border); }
.palette-dot { width: 10px; height: 10px; border-radius: 50%; }

/* Settings page */
#settings-view { padding: 24px 28px; overflow-y: auto; max-width: 760px; height: 100%; box-sizing: border-box; }
.settings-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
.settings-header h2 { margin: 0; font-size: 24px; font-weight: 700; }
.settings-card { background: linear-gradient(155deg, var(--surface-a), var(--surface-b)); border: 1px solid var(--border); border-radius: 13px; padding: 20px 22px; margin-bottom: 14px; box-shadow: 0 4px 16px rgba(0,0,0,.055), inset 0 1px 0 rgba(255,255,255,.04); }
.settings-card h3 { margin: 0 0 16px; font-size: 13.2px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--text2); }
.settings-card label { display: flex; flex-direction: column; gap: 5px; font-size: 14.4px; font-weight: 500; color: var(--text2); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 12px; }
.settings-card label.email-toggle { flex-direction: row; align-items: center; gap: 8px; text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--text); font-size: 15.6px; }
.settings-card .email-timing { display: flex; gap: 16px; margin-bottom: 12px; }
.settings-card .email-timing label { margin-bottom: 0; }
.settings-card input[type="number"],
.settings-card input[type="text"],
.settings-card textarea,
.settings-card select { background: var(--bg3); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: var(--font); font-size: 15.6px; padding: 8px 12px; width: 100%; box-sizing: border-box; }
.settings-card textarea { line-height: 1.5; resize: vertical; }
.settings-card input[type="number"] { max-width: 120px; }
.settings-card input:focus,
.settings-card textarea:focus,
.settings-card select:focus { outline: none; border-color: var(--accent); }
.settings-save-row { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.settings-card .mcp-token-generate-row input { width: auto; flex: 1; min-width: 140px; }

/* User Guide */
#guide-view { padding: 24px 28px; overflow-y: auto; max-width: 760px; height: 100%; box-sizing: border-box; }
.guide-body { display: flex; flex-direction: column; gap: 4px; }
.guide-section { background: linear-gradient(155deg, var(--surface-a), var(--surface-b)); border: 1px solid var(--border); border-radius: 13px; padding: 20px 22px; box-shadow: 0 4px 16px rgba(0,0,0,.055), inset 0 1px 0 rgba(255,255,255,.04); }
.guide-section h3 { margin: 0 0 12px; font-size: 13.2px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--text2); }
.guide-section p { margin: 0 0 10px; font-size: 15px; line-height: 1.6; color: var(--text); }
.guide-section p:last-child { margin-bottom: 0; }
.guide-section ul, .guide-section ol { margin: 0 0 10px; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; }
.guide-section ul:last-child, .guide-section ol:last-child { margin-bottom: 0; }
.guide-section li { font-size: 15px; line-height: 1.5; color: var(--text); }
.guide-section li strong { color: var(--text); }
.guide-section code { font-family: var(--mono, monospace); font-size: 13px; background: var(--bg3); border: 1px solid var(--border); border-radius: 4px; padding: 2px 6px; word-break: break-all; }
.settings-tracks-empty { font-size: 13.2px; color: var(--text3); font-style: italic; margin-top: 4px; }
#dev-log-view { padding: 24px 28px; overflow-y: auto; max-width: 760px; height: 100%; box-sizing: border-box; }
.dev-log-week { font-size: 12px; font-weight: 600; color: var(--text3); text-transform: uppercase; letter-spacing: .06em; margin: 24px 0 8px; padding-bottom: 4px; border-bottom: 1px solid var(--border); }
.dev-log-week:first-child { margin-top: 0; }
.dev-log-entry { background: var(--bg2); border: 1px solid var(--border); border-radius: var(--radius); padding: 10px 14px; margin-bottom: 6px; }
.dev-log-title { font-size: 14px; font-weight: 500; color: var(--text); }
.dev-log-desc { margin: 4px 0 0; font-size: 13.2px; color: var(--text2); line-height: 1.5; }
.source-mcp { display: inline-block; font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; background: var(--bg3); color: #22c55e; border-radius: 4px; padding: 1px 5px; vertical-align: middle; margin-left: 5px; }
.mcp-setup-label { margin: 12px 0 6px; }
.mcp-setup-row { display: flex; align-items: flex-start; gap: 8px; background: var(--bg3); border: 1px solid var(--border); border-radius: 6px; padding: 8px 10px; }
.mcp-setup-row code { flex: 1; font-family: var(--mono, monospace); font-size: 13px; line-height: 1.5; word-break: break-all; color: var(--text); }
.mcp-setup-row .icon-btn { flex-shrink: 0; border: 1px solid var(--border); padding: 4px 10px; }
.blast-off-btn {
  background: #0e1015;
  color: var(--waiting);
  border: 1px solid var(--waiting);
  border-radius: 6px;
  padding: 6px 14px;
  font-size: 14.4px;
  font-weight: 600;
  letter-spacing: .03em;
  cursor: pointer;
  transition: box-shadow .15s ease, background .15s ease;
}
.blast-off-btn:hover { background: #161922; box-shadow: 0 0 10px rgba(240, 179, 74, .45); }
.blast-off-btn.liftoff:hover { box-shadow: 0 0 10px rgba(70, 201, 138, .45); }
.blast-off-btn.copied { color: var(--done); border-color: var(--done); }
.blast-off-btn.liftoff { color: var(--done); border-color: var(--done); }
.admin-banner { background: var(--accent-dim); color: var(--accent); border: 1px solid var(--accent); border-radius: 8px; padding: 8px 14px; font-size: 14px; font-weight: 600; margin-bottom: 10px; }

.agent-console {
  position: fixed; right: 16px; bottom: 16px; width: 480px; max-height: 60vh;
  display: flex; flex-direction: column; background: #0f1115; color: #d6dae0;
  border: 1px solid #2a2f3a; border-radius: 8px; box-shadow: 0 8px 30px rgba(0,0,0,.4);
  z-index: 1000; font-family: ui-monospace, monospace; font-size: 12px;
}
.agent-console__bar {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px;
  border-bottom: 1px solid #2a2f3a;
}
.agent-console__bar span { flex: 1; }
.agent-console__bar button { background: #1c2230; color: #d6dae0; border: 1px solid #2a2f3a; border-radius: 4px; cursor: pointer; padding: 2px 8px; }
.agent-console__log { margin: 0; padding: 10px; overflow: auto; white-space: pre-wrap; word-break: break-word; }
