:root{
  /* main content — always light, regardless of system theme */
  --bg:#FCFAF7;
  --surface:#FFFFFF;
  --surface-2:#F4ECE0;
  --ink:#3A2010;
  --ink-soft:#7A4F2E;
  --ink-faint:#B08D63;
  --accent:#8B5E3C;
  --accent-soft:#F0E1D2;
  --accent-2:#6E8F5C;
  --accent-2-soft:#E7EEE0;
  --line:#EBE0D2;
  --line-strong:#D8C4A8;
  --shadow:0 1px 2px rgba(61,36,16,0.05), 0 8px 22px rgba(61,36,16,0.06);
  --st-nova:#8A8378; --st-nova-soft:#EDE9E2;
  --st-contatada:#3C5E7B; --st-contatada-soft:#DCE6ED;
  --st-negociando:#8B5E3C; --st-negociando-soft:#F0E1D2;
  --st-fechada:#4A7C4E; --st-fechada-soft:#DEEBDD;
  --st-sem:#B0473B; --st-sem-soft:#F2DFDB;

  /* sidebar nav — always this dark caramel, doesn't follow the theme above */
  --nav-bg:#2B1C0F;
  --nav-surface-2:#3A2716;
  --nav-ink:#F5EAD9;
  --nav-ink-soft:#D9BB93;
  --nav-ink-faint:#96795A;
  --nav-accent:#E0AD74;
  --nav-accent-soft:#4A3319;
  --nav-line:#4A3319;
}

*{box-sizing:border-box;}
html,body{ height:100%; }
body{ margin:0; background:var(--bg); color:var(--ink); font-family:"Work Sans", ui-sans-serif, system-ui, sans-serif; font-size:15.5px; line-height:1.5; }
h1,h2,h3{ font-family:"Fraunces", Georgia, serif; margin:0; text-wrap:balance; color:var(--ink); }
.mono, code.mono{ font-family:"JetBrains Mono", ui-monospace, monospace; }
code.mono{ background:var(--surface-2); border:1px solid var(--line); border-radius:4px; padding:1px 5px; font-size:0.92em; }
button{ font-family:inherit; cursor:pointer; }
a{ color:inherit; }

.demo-flag{
  position:sticky; top:0; z-index:30; background:var(--nav-bg); color:var(--nav-ink);
  font-family:"JetBrains Mono",monospace; font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase;
  text-align:center; padding:6px 10px;
}

.shell{ display:grid; grid-template-columns:230px 1fr; min-height:calc(100vh - 28px); }
@media (max-width:900px){
  .shell{grid-template-columns:1fr;}
  .nav{ position:sticky; top:28px; z-index:20; border-right:none; border-bottom:1px solid var(--line);
    flex-direction:row; align-items:center; padding:10px 12px; overflow-x:auto; gap:14px; }
  .nav-brand{display:none;}
  .nav-list{flex-direction:row; gap:4px;}
  .nav-item span.label{display:none;}
  .nav-item .badge{display:none;}
  .nav-shortcut, .nav-settings{display:none;}
}

/* ---------- Nav (fixed dark palette, independent of the light content theme) ---------- */
.nav{ background:var(--nav-bg); border-right:1px solid var(--nav-line); display:flex; flex-direction:column; padding:20px 14px; }
.nav-brand{ display:flex; align-items:center; gap:9px; margin-bottom:22px; padding:0 6px; }
.nav-brand .dot{ width:9px;height:9px;border-radius:50%; background:var(--nav-accent); box-shadow:0 0 0 3px var(--nav-accent-soft); }
.nav-brand span{ font-family:"Fraunces",serif; font-weight:600; font-size:15px; color:var(--nav-ink); }
.nav-list{ display:flex; flex-direction:column; gap:2px; }
.nav-item{ display:flex; align-items:center; gap:11px; padding:9px 10px; border-radius:8px; border:none; background:transparent;
  color:var(--nav-ink-soft); font-size:13.8px; font-weight:500; text-align:left; transition:background .12s ease, color .12s ease; width:100%; }
.nav-item svg{ flex:none; width:17px; height:17px; stroke:currentColor; }
.nav-item:hover{ background:var(--nav-surface-2); color:var(--nav-ink); }
.nav-item.active{ background:var(--nav-accent-soft); color:var(--nav-accent); }
.nav-item .badge{ margin-left:auto; font-family:"JetBrains Mono",monospace; font-size:10.5px; background:var(--nav-accent); color:var(--nav-bg); border-radius:100px; padding:1px 6px; }

.nav-shortcut{ margin-top:18px; padding-top:14px; border-top:1px solid var(--nav-line); display:flex; flex-direction:column; gap:8px; }
.nav-settings{ margin-top:auto; padding-top:14px; border-top:1px solid var(--nav-line); }
.nav-shortcut-label{ font-family:"JetBrains Mono",monospace; font-size:10.5px; letter-spacing:0.07em; text-transform:uppercase; color:var(--nav-ink-faint); padding:0 10px; margin-bottom:2px; }
.shortcut-btn, .ext-link{ display:flex; align-items:center; gap:9px; padding:7px 10px; border-radius:8px; background:var(--nav-surface-2);
  border:1px solid var(--nav-line); color:var(--nav-ink); font-size:12.6px; font-weight:500; text-decoration:none; cursor:pointer; }
.shortcut-btn:hover, .ext-link:hover{ border-color:var(--nav-accent); }
.shortcut-btn svg, .ext-link svg{ width:14px;height:14px; stroke:var(--nav-accent); flex:none; }

/* ---------- Main ---------- */
main{ padding:28px 34px 60px; max-width:1000px; }
@media (max-width:640px){ main{padding:20px 16px 46px;} }

.greeting{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:16px; margin-bottom:24px; }
.greeting .eyebrow{ font-family:"JetBrains Mono",monospace; font-size:12px; color:var(--ink-faint); letter-spacing:0.05em; margin-bottom:6px; }
.greeting h1{ font-size:29px; font-style:italic; font-weight:500; }
.stat-strip{ display:flex; gap:10px; flex-wrap:wrap; }
.stat-tile{ background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:10px 16px; min-width:100px; box-shadow:var(--shadow); }
.stat-tile .num{ font-family:"Fraunces",serif; font-size:21px; font-weight:600; font-variant-numeric:tabular-nums; }
.stat-tile .lbl{ font-size:11px; color:var(--ink-soft); }

.view{ display:none; } .view.active{ display:block; }
.section-title{ font-size:19px; margin-bottom:4px; }
.section-sub{ font-size:13px; color:var(--ink-faint); margin-bottom:16px; }

.grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:820px){ .grid-2{grid-template-columns:1fr;} }

.widget{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:18px 18px 16px; box-shadow:var(--shadow); }
.widget-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; gap:10px; flex-wrap:wrap; }
.widget-head h2{ font-size:16px; }
.source-tag{ font-family:"JetBrains Mono",monospace; font-size:10.5px; color:var(--ink-faint); border:1px solid var(--line); border-radius:100px; padding:2px 9px; white-space:nowrap; }
.link-more{ font-size:12px; font-weight:600; color:var(--accent-2); background:none; border:none; padding:0; }

.tabs{ display:flex; gap:4px; background:var(--surface-2); padding:3px; border-radius:100px; }
.tab-btn{ border:none; background:transparent; padding:5px 13px; border-radius:100px; font-size:12.5px; font-weight:500; color:var(--ink-soft); }
.tab-btn.active{ background:var(--surface); color:var(--ink); box-shadow:var(--shadow); }

/* email */
.email-list{ display:flex; flex-direction:column; gap:2px; }
.email-row{ display:flex; gap:12px; align-items:flex-start; padding:10px 4px; border-bottom:1px solid var(--line); }
.email-row:last-child{ border-bottom:none; }
.email-row a.email-open{ flex:none; align-self:center; font-size:11px; font-weight:600; color:var(--accent-2); text-decoration:none; border:1px solid var(--line); border-radius:100px; padding:3px 9px; white-space:nowrap; }
.email-row a.email-open:hover{ border-color:var(--line-strong); }
.email-avatar{ width:32px;height:32px;border-radius:9px; flex:none; display:flex; align-items:center; justify-content:center; font-family:"Fraunces",serif; font-weight:600; font-size:13px; color:#fff; }
.email-body{ flex:1; min-width:0; }
.email-sender{ font-weight:600; font-size:13.5px; }
.email-sub{ font-size:12.6px; color:var(--ink-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.urgency{ flex:none; font-family:"JetBrains Mono",monospace; font-size:10px; padding:3px 8px; border-radius:100px; text-transform:uppercase; white-space:nowrap; }
.urgency.alta{ background:var(--st-sem-soft); color:var(--st-sem); }
.urgency.media{ background:var(--st-negociando-soft); color:var(--st-negociando); }
.urgency.baixa{ background:var(--st-fechada-soft); color:var(--st-fechada); }

/* tasks */
.view-toggle{ display:flex; gap:2px; background:var(--surface-2); border-radius:8px; padding:3px; }
.view-toggle button{ border:none; background:transparent; width:28px; height:26px; border-radius:6px; display:flex; align-items:center; justify-content:center; color:var(--ink-faint); }
.view-toggle button svg{ width:14px;height:14px; stroke:currentColor; }
.view-toggle button.active{ background:var(--surface); color:var(--accent); box-shadow:var(--shadow); }

.filter-row{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.filter-chip{ border:1px solid var(--line); background:transparent; color:var(--ink-soft); font-size:12px; font-weight:500; padding:4px 11px; border-radius:100px; }
.filter-chip.active{ background:var(--accent); border-color:var(--accent); color:var(--bg); }

.task-list{ list-style:none; margin:0 0 14px; padding:0; display:flex; flex-direction:column; gap:2px; }
.task-row{ display:flex; align-items:flex-start; gap:10px; padding:10px 4px; border-bottom:1px solid var(--line); }
.task-row:last-child{ border-bottom:none; }
.task-check{ width:18px;height:18px; border-radius:6px; border:1.5px solid var(--line-strong); flex:none; margin-top:1px;
  display:flex; align-items:center; justify-content:center; background:var(--surface); }
.task-check svg{ width:11px;height:11px; opacity:0; stroke:#fff; }
.task-row.done .task-check{ background:var(--st-fechada); border-color:var(--st-fechada); }
.task-row.done .task-check svg{ opacity:1; }
.task-row.done .task-text{ text-decoration:line-through; color:var(--ink-faint); }
.task-main{ flex:1; min-width:0; }
.task-text{ font-size:13.6px; }
.task-meta{ display:flex; align-items:center; gap:6px; margin-top:4px; flex-wrap:wrap; }
.cat-tag{ font-family:"JetBrains Mono",monospace; font-size:10px; color:var(--ink-faint); border:1px solid var(--line); border-radius:5px; padding:1px 6px; }
.recur-tag{ display:flex; align-items:center; gap:3px; font-size:10.5px; color:var(--accent-2); }
.recur-tag svg{ width:10px;height:10px; stroke:currentColor; }
.task-del{ background:none; border:none; color:var(--ink-faint); font-size:16px; line-height:1; padding:0 4px; flex:none; }
.priority-dot{ width:7px;height:7px;border-radius:50%; flex:none; margin-top:5px; }
.priority-dot.alta{ background:var(--st-sem); } .priority-dot.media{ background:var(--st-negociando); } .priority-dot.baixa{ background:var(--st-fechada); }

.kanban{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
@media (max-width:700px){ .kanban{grid-template-columns:1fr;} }
.kcol{ background:var(--surface-2); border-radius:10px; padding:10px; min-height:80px; }
.kcol-head{ display:flex; justify-content:space-between; align-items:center; padding:2px 4px 10px; font-size:12px; font-weight:600; color:var(--ink-soft); }
.kcard{ background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:9px 10px; margin-bottom:8px; box-shadow:var(--shadow); cursor:grab; touch-action:none; user-select:none; }
.kcard .task-text{ font-size:12.8px; }
.kcard .task-meta{ margin-top:6px; }
.kcard.dragging{ opacity:0.85; cursor:grabbing; box-shadow:0 8px 20px rgba(61,36,16,0.2); position:relative; z-index:40; }
.kcol.drag-over{ background:var(--accent-soft); outline:2px dashed var(--line-strong); outline-offset:-2px; }

.shortcuts{ display:flex; gap:8px; flex-wrap:wrap; }

/* forms (ideas / tasks / crm) */
.idea-form{ display:grid; grid-template-columns:2fr 1fr auto; gap:8px; margin-bottom:16px; }
@media (max-width:640px){ .idea-form{grid-template-columns:1fr;} }
.idea-form input, .idea-form select{ padding:9px 11px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--ink); font-size:13px; font-family:inherit; }
.idea-form button{ background:var(--accent); color:var(--bg); border:none; border-radius:8px; padding:9px 16px; font-size:13px; font-weight:600; }
.idea-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px; }
.idea-card{ background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:14px; box-shadow:var(--shadow); }
.idea-top{ display:flex; justify-content:space-between; gap:8px; margin-bottom:8px; }
.idea-cat{ font-family:"JetBrains Mono",monospace; font-size:10px; color:var(--accent-2); background:var(--accent-2-soft); padding:2px 8px; border-radius:100px; white-space:nowrap; }
.idea-title{ font-size:14px; font-weight:600; margin-bottom:4px; }
.idea-note{ font-size:12.5px; color:var(--ink-soft); margin-bottom:10px; }
.idea-foot{ display:flex; justify-content:space-between; align-items:center; }
.idea-date{ font-size:11px; color:var(--ink-faint); }
.status-pill{ font-size:10.5px; font-weight:600; border-radius:100px; padding:3px 9px; border:none; }
.status-pill.ideia{ background:var(--accent-2-soft); color:var(--accent-2); }
.status-pill.producao{ background:var(--st-negociando-soft); color:var(--st-negociando); }
.status-pill.publicado{ background:var(--st-fechada-soft); color:var(--st-fechada); }
.idea-del{ background:none; border:none; color:var(--ink-faint); font-size:16px; line-height:1; padding:0 2px; }

/* coach */
.coach-widget{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:20px 20px 18px; box-shadow:var(--shadow); margin-bottom:18px; }
.coach-tag{ font-family:"JetBrains Mono",monospace; font-size:10.5px; color:var(--accent-2); background:var(--accent-2-soft); border-radius:100px; padding:2px 10px; }
.tip-text{ font-size:15px; color:var(--ink); max-width:60ch; margin:6px 0 0; }
.coach-cats{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.tip-list{ display:flex; flex-direction:column; gap:0; }
.tip-item{ display:flex; gap:10px; padding:12px 2px; border-bottom:1px solid var(--line); }
.tip-item:last-child{ border-bottom:none; }
.tip-dot{ width:6px;height:6px;border-radius:50%; background:var(--accent-2); margin-top:7px; flex:none; }
.tip-body p{ margin:0; font-size:13.6px; }
.tip-body .tip-date{ font-size:11px; color:var(--ink-faint); margin-top:3px; }

/* CRM */
.crm-form{ background:var(--surface-2); border:1px dashed var(--line-strong); border-radius:10px; padding:14px; margin-bottom:14px; display:grid; grid-template-columns:1.4fr 1fr 1.4fr auto; gap:8px; align-items:center; }
@media (max-width:820px){ .crm-form{grid-template-columns:1fr;} }
.crm-form input, .crm-form select{ padding:8px 10px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink); font-size:12.8px; font-family:inherit; }
.crm-form button{ background:var(--accent); color:var(--bg); border:none; border-radius:7px; padding:8px 14px; font-size:12.8px; font-weight:600; }
.lead-list{ display:flex; flex-direction:column; gap:10px; }
.lead-card{ background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:13px 15px; box-shadow:var(--shadow); }
.lead-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.lead-name{ font-weight:600; font-size:14px; }
.lead-meta{ font-size:12px; color:var(--ink-faint); margin-top:2px; }
.lead-status{ font-size:11px; font-weight:600; border-radius:100px; padding:3px 10px; white-space:nowrap; border:1px solid var(--line); font-family:inherit; }
.lead-note{ font-size:12.5px; color:var(--ink-soft); margin-top:8px; }
.lead-del{ background:none; border:none; color:var(--ink-faint); font-size:16px; }

/* settings */
.settings-card{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:18px 20px; margin-bottom:14px; box-shadow:var(--shadow); }
.settings-top{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:6px; }
.settings-top h3{ font-size:15.5px; }
.conn-pill{ font-family:"JetBrains Mono",monospace; font-size:10.5px; font-weight:600; padding:3px 10px; border-radius:100px; }
.conn-pill.on{ background:var(--st-fechada-soft); color:var(--st-fechada); }
.conn-pill.off{ background:var(--st-nova-soft); color:var(--st-nova); }
.settings-desc{ font-size:12.8px; color:var(--ink-soft); max-width:56ch; margin-bottom:12px; }
.connect-btn{ border:1px solid var(--line-strong); background:var(--surface-2); color:var(--ink); border-radius:8px; padding:8px 14px; font-size:12.8px; font-weight:600; }
.connect-btn.connected{ background:var(--accent); color:var(--bg); border-color:var(--accent); }
.settings-callout{ background:var(--accent-2-soft); border-left:3px solid var(--accent-2); border-radius:0 8px 8px 0; padding:12px 15px; font-size:12.8px; color:var(--ink); margin-top:18px; }
.radio-row{ display:flex; gap:14px; margin-top:8px; font-size:12.8px; }
.radio-row label{ display:flex; align-items:center; gap:6px; }

.stack-hint{ font-size:12px; color:var(--ink-faint); margin-top:12px; }
.empty-hint{ font-size:13px; color:var(--ink-faint); padding:16px 4px; }

/* category manager */
.cat-manager{ background:var(--surface-2); border:1px dashed var(--line-strong); border-radius:10px; padding:14px; margin-bottom:14px; }
.cat-manager-add{ display:flex; gap:8px; margin-bottom:10px; }
.cat-manager-add input{ flex:1; padding:8px 10px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink); font-size:12.8px; font-family:inherit; }
.cat-manager-add button{ background:var(--accent); color:#fff; border:none; border-radius:7px; padding:8px 14px; font-size:12.8px; font-weight:600; }
.cat-manager-list{ display:flex; flex-wrap:wrap; gap:6px; }
.cat-chip{ display:flex; align-items:center; gap:6px; background:var(--surface); border:1px solid var(--line); border-radius:100px; padding:4px 6px 4px 12px; font-size:12px; color:var(--ink); }
.cat-chip-name{ white-space:nowrap; }
.cat-chip button{ background:var(--surface-2); border:none; border-radius:50%; width:18px; height:18px; color:var(--ink-faint); font-size:11px; line-height:1; flex:none; }
.cat-chip button[data-action="del-cat"]:hover{ color:var(--st-sem); }
.cat-chip button[data-action="edit-cat"]:hover{ color:var(--accent-2); }
.cat-rename-input{ font-size:12px; font-family:inherit; border:1px solid var(--line-strong); border-radius:100px; padding:2px 8px; color:var(--ink); background:var(--bg); }

/* analytics */
.analytics-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; }
.analytics-card{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:16px 18px; box-shadow:var(--shadow); }
.analytics-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.analytics-platform{ font-family:"JetBrains Mono",monospace; font-size:11px; letter-spacing:0.05em; text-transform:uppercase; color:var(--ink-faint); }
.analytics-delta{ font-size:11.5px; font-weight:600; padding:2px 8px; border-radius:100px; }
.analytics-delta.up{ background:var(--st-fechada-soft); color:var(--st-fechada); }
.analytics-delta.down{ background:var(--st-sem-soft); color:var(--st-sem); }
.analytics-metric{ font-family:"Fraunces",serif; font-size:26px; font-weight:600; font-variant-numeric:tabular-nums; }
.analytics-label{ font-size:12px; color:var(--ink-soft); margin-bottom:12px; }
.spark{ display:flex; align-items:flex-end; gap:4px; height:36px; }
.spark span{ flex:1; border-radius:2px 2px 0 0; min-height:4px; opacity:0.85; }
.spark span:last-child{ opacity:1; }

/* agenda */
.agenda-list{ display:flex; flex-direction:column; gap:10px; }
.agenda-item{ display:flex; gap:14px; align-items:flex-start; background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:13px 15px; box-shadow:var(--shadow); }
.agenda-date{ flex:none; width:52px; text-align:center; background:var(--accent-soft); border-radius:8px; padding:6px 4px; }
.agenda-date .d{ font-family:"Fraunces",serif; font-size:18px; font-weight:600; color:var(--accent); line-height:1; }
.agenda-date .m{ font-family:"JetBrains Mono",monospace; font-size:9.5px; text-transform:uppercase; color:var(--ink-faint); }
.agenda-main{ flex:1; min-width:0; }
.agenda-title{ font-weight:600; font-size:14px; }
.agenda-meta{ font-size:12px; color:var(--ink-soft); margin-top:2px; }
.agenda-notes{ font-size:12.5px; color:var(--ink-soft); margin-top:6px; }
.agenda-del{ background:none; border:none; color:var(--ink-faint); font-size:16px; flex:none; }