/* Daily Reports — clean, readable, mobile-first */

:root{
  /* Legacy aliases -> design.md Cobalt tokens (tokens.css); light/dark via [data-theme] */
  --bg:var(--color-paper);
  --bg-panel:var(--color-paper-2);
  --bg-hover:var(--color-paper-3);
  --border:var(--color-rule);
  --text:var(--color-ink);
  --muted:var(--color-muted);
  --accent:var(--color-accent);
  --accent-soft:oklch(50% 0.205 256 / 0.14);
  --good:var(--color-success);
  --warn:var(--color-warning);
}




[data-theme="light"] .article h1,[data-theme="light"] .article h2,
[data-theme="light"] .article h3,[data-theme="light"] .article strong,
[data-theme="light"] .article th,[data-theme="light"] .cal-head span,
[data-theme="light"] .goal-day-head,[data-theme="light"] .brand{color:var(--color-ink)!important}
[data-theme="light"] .topbar{background:var(--color-paper)}
[data-theme="light"] .article blockquote{background:rgba(31,111,235,.06)}
[data-theme="light"] .topbar{background:var(--color-paper)}
[data-theme="light"] .searchbox input{background:var(--color-paper)}
[data-theme="light"] ::-webkit-scrollbar-thumb{background:var(--color-rule-2)}
[data-theme="light"] .pill-live.hasdata{color:var(--good)}
[data-theme="light"] .q-amber .task-tag{background:rgba(199,125,26,.12)}
[data-theme="light"] [data-theme="light"] .q-red .task-tag{color:var(--color-error)}
[data-theme="light"] .q-blue .task-tag{background:rgba(31,111,235,.12)}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans Thai",
    "IBM Plex Sans Thai",sans-serif;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

/* ---- top bar ---- */
.topbar{
  display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  padding:16px 22px;
  background:var(--color-paper-2);
  border-bottom:1px solid var(--border);
}
.brand{font-size:20px;font-weight:700;letter-spacing:.3px}
.brand, .brand:visited{color:var(--accent);text-decoration:none}
.tagline{color:var(--muted);font-size:13px}

/* ---- layout ---- */
.layout{display:flex;gap:20px;padding:20px 22px;max-width:1200px;margin:0 auto;align-items:flex-start}
.sidebar{width:280px;flex-shrink:0;position:sticky;top:16px}
.content{flex:1;min-width:0}

/* ---- sidebar ---- */
.sidebar-title{
  font-size:13px;text-transform:uppercase;letter-spacing:1px;
  color:var(--muted);margin-bottom:10px;
}
.searchbox input{
  width:100%;padding:9px 12px;margin-bottom:12px;
  background:var(--bg-panel);color:var(--text);
  border:1px solid var(--border);border-radius:8px;
  font-size:14px;outline:none;
}
.searchbox input:focus{border-color:var(--accent)}
.daylist{max-height:72vh;overflow-y:auto;display:flex;flex-direction:column;gap:6px}
.dayitem{
  padding:9px 12px;border-radius:8px;text-decoration:none;color:var(--text);
  background:var(--bg-panel);border:1px solid var(--border);
  display:flex;flex-direction:column;gap:2px;
  transition:background .15s,border-color .15s;
}
.dayitem:hover{background:var(--bg-hover);border-color:var(--accent-soft)}
.dayitem-date{font-weight:600;font-size:14px}
.dayitem-file{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---- article / content ---- */
.article{
  background:var(--bg-panel);border:1px solid var(--border);
  border-radius:12px;padding:26px 30px;
}
.article h1,.article h2,.article h3{line-height:1.3;margin:1.4em 0 .5em;color:var(--color-ink)}
.article h1{font-size:24px;border-bottom:1px solid var(--border);padding-bottom:.35em}
.article h2{font-size:19px}
.article h3{font-size:16px}
.article p{margin:.6em 0}
.article ul,.article ol{padding-left:1.4em}
.article li{margin:.25em 0}
.article a{color:var(--accent)}
.article table{
  border-collapse:collapse;width:100%;margin:1em 0;font-size:14px;
}
.article th,.article td{
  border:1px solid var(--border);padding:8px 10px;text-align:left;vertical-align:top;
}
.article th{background:var(--color-paper-3);color:var(--color-ink)}
.article blockquote{
  border-left:3px solid var(--accent);margin:1em 0;padding:.4em 1em;color:var(--muted);
  background:rgba(77,163,255,.05);border-radius:0 8px 8px 0;
}
.article hr{border:none;border-top:1px solid var(--border);margin:1.5em 0}
.article strong{color:var(--color-ink)}

/* article title + nav */
.article-nav{
  max-width:1200px;margin:16px auto 12px;padding:0 9px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.nav-btn{
  color:var(--accent);text-decoration:none;font-size:14px;font-weight:600;
  background:var(--bg-panel);border:1px solid var(--border);border-radius:8px;
  padding:7px 12px;white-space:nowrap;
}
.nav-btn:hover{background:var(--bg-hover)}
.nav-date{color:var(--muted);font-weight:600;font-size:14px}
.article-title{
  font-size:20px;font-weight:700;color:var(--accent);
  text-transform:uppercase;letter-spacing:.5px;margin-bottom:.5em;
}

/* loading / empty */
.loading,.empty{color:var(--muted);padding:30px;text-align:center}

/* ---- eye-catch summary cards ---- */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-bottom:26px}
.card{
  background:var(--bg-panel);border:1px solid var(--border);border-radius:12px;
  padding:16px 18px;margin-bottom:0;
}
.card-title{
  font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:1px;
  margin-bottom:12px;display:flex;align-items:center;gap:8px;
}
.card-tasks .card-title{color:var(--accent)}
.card-goals .card-title{color:var(--good)}
.card-cal .card-title{color:var(--warn)}
.card-email .card-title{color:var(--color-violet)}
.card-sub{font-size:12px;color:var(--muted);margin:12px 0 6px;font-weight:600}

/* task rows w/ priority colors */
.task-row{display:flex;gap:10px;align-items:flex-start;padding:6px 0;border-bottom:1px dashed var(--border);font-size:14px}
.task-row:last-child{border-bottom:none}
.task-tag{
  flex-shrink:0;font-size:11px;font-weight:700;border-radius:5px;padding:2px 7px;white-space:nowrap;
}
.q-red .task-tag{background:rgba(255,90,90,.16);color:var(--color-error)}
.q-amber .task-tag{background:rgba(255,180,84,.16);color:var(--warn)}
.q-blue .task-tag{background:rgba(77,163,255,.16);color:var(--accent)}
.q-gray .task-tag{background:rgba(154,163,181,.16);color:var(--muted)}
.task-body{color:var(--text)}

/* top3 ordered list */
.top3{list-style:none;padding:0;margin:0}
.top3 li{display:flex;gap:10px;align-items:flex-start;padding:5px 0;font-size:14px;border-bottom:1px dashed var(--border)}
.top3 li:last-child{border-bottom:none}
.topnum{
  flex-shrink:0;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:700;
}

/* goals */
.goal-list{margin:0;padding-left:18px}
.goal-list li{font-size:14px;margin:.3em 0;color:var(--text)}

/* calendar */
.cal-row{display:flex;gap:10px;align-items:flex-start;padding:5px 0;font-size:13.5px;border-bottom:1px dashed var(--border)}
.cal-row:last-child{border-bottom:none}
.cal-day{flex-shrink:0;font-weight:700;color:var(--warn);font-size:12px;min-width:74px}
.cal-body{color:var(--muted)}

/* emails */
.email-row{display:flex;flex-direction:column;gap:2px;padding:7px 0;border-bottom:1px dashed var(--border)}
.email-row:last-child{border-bottom:none}
.email-title{font-weight:600;color:var(--color-violet);font-size:13.5px}
.email-body{color:var(--muted);font-size:13px}

.full-article{border-top:1px solid var(--border);padding-top:8px}

/* ---- topbar pills / live indicator ---- */
.topbar{position:relative}
.topbar-right{margin-left:auto;display:flex;gap:8px;align-items:center}
.pill{
  font-size:12px;color:var(--muted);background:var(--bg-panel);
  border:1px solid var(--border);border-radius:999px;padding:4px 12px;
}
.pill-live{color:var(--good);border-color:rgba(55,214,122,.3)}
.pill-live.hasdata{color:var(--good)}
.pill-live.new{color:var(--color-graphite);background:var(--good);border-color:var(--good);font-weight:700}
.hint{color:var(--muted);font-weight:400;font-size:12px;text-transform:none;letter-spacing:0}

/* ---- tabs ---- */
.tabs{display:flex;gap:8px;margin-bottom:14px}
.tab{
  background:var(--bg-panel);border:1px solid var(--border);color:var(--muted);
  padding:8px 18px;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;
  transition:background .15s,color .15s,border-color .15s;
}
.tab:hover{border-color:var(--accent-soft);color:var(--text)}
.tab.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}

/* ---- live cron dashboard ---- */
.cronpanel{background:var(--bg-panel);border:1px solid var(--border);border-radius:12px;padding:22px 26px}
.cron-list{display:flex;flex-direction:column;gap:12px}
.cron-card{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:14px 16px}
.cron-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}
.cron-card-head h2{margin:0;font-size:16px;font-weight:700;color:var(--color-ink)}
.cron-status{flex-shrink:0;font-size:12px;font-weight:600;border-radius:999px;padding:3px 10px;border:1px solid var(--border);color:var(--muted)}
.cron-status.ok{color:var(--good);border-color:rgba(55,214,122,.35);background:rgba(55,214,122,.08)}
.cron-status.err{color:var(--color-error);border-color:rgba(220,50,50,.35);background:rgba(220,50,50,.08)}
.cron-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px 14px;margin:0}
.cron-meta dt{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.cron-meta dd{margin:0;font-size:13.5px;color:var(--text)}
.cron-error{margin:10px 0 0;font-size:13px;color:var(--color-error)}

/* ---- calendar month ---- */
.cal{background:var(--bg-panel);border:1px solid var(--border);border-radius:10px;padding:10px}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.cal-head span{font-weight:600;font-size:13.5px;color:var(--color-ink)}
.cal-head button{
  background:transparent;color:var(--muted);border:1px solid var(--border);
  border-radius:6px;width:26px;height:26px;cursor:pointer;font-size:16px;line-height:1;
}
.cal-head button:hover{color:var(--accent);border-color:var(--accent-soft)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.cal-dow{font-size:10.5px;color:var(--muted);text-align:center;padding:2px 0}
.cal-blank{height:26px}
.cal-day{
  position:relative;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;
  font-size:12px;color:var(--color-on-dark);text-decoration:none;
}
.cal-day:hover{background:var(--bg-hover)}
.cal-day.has{color:var(--color-ink);font-weight:600;background:var(--accent-soft)}
.cal-day.has i{
  position:absolute;bottom:2px;left:50%;transform:translateX(-50%);
  width:4px;height:4px;border-radius:50%;background:var(--accent);
}
.cal-day.today{box-shadow:inset 0 0 0 1px var(--accent)}

/* ---- goals tracker ---- */
.goalspanel{background:var(--bg-panel);border:1px solid var(--border);border-radius:12px;padding:22px 26px}
.goals-title{font-size:16px;font-weight:700;color:var(--accent);margin-bottom:16px}
.goals-list{display:flex;flex-direction:column;gap:14px}
.goal-day{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:14px 16px}
.goal-day-head{font-weight:700;color:var(--color-ink);margin-bottom:8px;font-size:14px}
.goals-day-goals ul{margin:0;padding-left:18px}
.goals-day-goals li{font-size:14px;margin:.25em 0;color:var(--text)}
.goals-update{margin-top:8px;border-top:1px dashed var(--border);padding-top:8px}
.gu-row{display:flex;gap:10px;font-size:13px;padding:2px 0}
.gu-k{flex-shrink:0;color:var(--muted);min-width:110px;font-size:12.5px}
.gu-v{color:var(--text)}
.muted{color:var(--muted)}

/* ---- stats tab ---- */
.stat-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin:6px 0 18px}
.kpi{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:4px;align-items:center}
.kpi-n{font-size:22px;font-weight:700;color:var(--color-ink)}
[data-theme="light"] .kpi-n{color:var(--color-ink)}
.kpi-n.kq1{color:var(--color-error)}.kpi-n.kq2{color:var(--warn)}.kpi-n.kmeet{color:var(--accent)}
.kpi-l{font-size:11.5px;color:var(--muted)}
.stat-daylist{display:flex;flex-direction:column;gap:6px}
.stat-row{display:flex;align-items:center;gap:12px;font-size:13px;padding:6px 0;border-bottom:1px dashed var(--border)}
.stat-date{flex-shrink:0;min-width:96px;color:var(--muted)}
.stat-bars{display:flex;gap:3px;align-items:center;flex:1}
.stat-bars i{display:block;height:12px;border-radius:3px}
.bq1{background:var(--color-error)}.bq2{background:var(--warn)}.bq3{background:var(--accent)}.bq4{background:var(--muted)}
.stat-meet{flex-shrink:0;color:var(--muted);font-size:12px}
.stat-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;font-size:12px;color:var(--muted)}
.stat-legend i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:middle}

/* ---- content search results ---- */
.results{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.res-title{font-size:12px;font-weight:700;color:var(--accent);margin:2px 0 4px}
.res-item{
  background:var(--bg-panel);border:1px solid var(--border);border-radius:8px;
  padding:8px 11px;text-decoration:none;color:var(--text);
  display:flex;flex-direction:column;gap:3px;
}
.res-item:hover{background:var(--bg-hover);border-color:var(--accent-soft)}
.res-date{font-size:12px;font-weight:600;color:var(--accent)}
.res-snip{font-size:12.5px;color:var(--muted);line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---- weekly digest ---- */
.w-block{margin-top:18px}
.w-block-title{font-size:13px;font-weight:700;color:var(--accent);margin-bottom:8px}
.w-topics{display:flex;flex-direction:column;gap:6px}
.w-topic{display:flex;align-items:center;gap:10px;font-size:13px}
.w-token{flex-shrink:0;min-width:110px;color:var(--text)}
.w-bar{flex:1;background:var(--bg-hover);border-radius:5px;height:12px;overflow:hidden}
.w-bar i{display:block;height:100%;background:var(--color-accent);border-radius:5px}
.w-count{color:var(--muted);font-size:12px;min-width:18px;text-align:right}

/* footer */
.foot{
  padding:18px 22px;color:var(--muted);font-size:12px;
  border-top:1px solid var(--border);text-align:center;max-width:1100px;margin:0 auto;
}
.foot a{color:var(--accent);text-decoration:none}

/* scrollbar */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--color-rule-2);border-radius:6px}
::-webkit-scrollbar-track{background:transparent}

/* responsive */
@media(max-width:760px){
  .layout{flex-direction:column}
  .sidebar{width:100%;position:static}
  .daylist{max-height:32vh}
  .article{padding:18px}
  .topbar{padding:12px 16px}
}

/* print / export-to-PDF */
@media print{
  body{background:#fff;color:#111}
  .topbar,.sidebar,.tabs,.article-nav,.foot{display:none!important}
  .content{max-width:100%}
  .article{box-shadow:none;border:none;background:#fff;color:#111;padding:0}
  .layout{display:block;padding:0}
  .article h1,.article h2,.article h3,.article strong{color:var(--color-ink)}
  .article a{color:var(--color-accent)}
  .article blockquote{border-color:var(--color-rule);color:var(--color-muted);background:none}
  .article th{background:var(--color-paper-3)}
  .cards-grid{display:block}
  .card{border:1px solid var(--color-rule);background:var(--color-paper);color:#111;margin-bottom:12px;page-break-inside:avoid}
  .task-tag,.cal-day,.email-title{color:#000!important;background:#eee!important;border-radius:3px;padding:1px 6px}
  .topnum{background:#eee;color:#000}
}