/* Lucy visual system V1 — local preview. Presentation only; original content and behavior remain. */
:root {
  --vs-purple:#6258E8; --vs-purple-ink:#5145CD; --vs-purple-soft:#EFEDFF;
  --vs-blue:#2466B8; --vs-blue-soft:#EBF3FF;
  --vs-green:#13764F; --vs-green-soft:#E8F5EE;
  --vs-amber:#985510; --vs-amber-soft:#FFF4E5;
  --vs-red:#BF354B; --vs-red-soft:#FFF0F2;
  --vs-text:#23304A; --vs-muted:#5D6B82; --vs-line:#DCE3EF;
  --vs-icon-decision:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M7%204v8a5%205%200%200%200%205%205h5M7%2012a5%205%200%200%201%205-5h5M14%204l3%203-3%203m0%204%203%203-3%203%22%2F%3E%3C%2Fsvg%3E");
  --vs-icon-review:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%224%22%20width%3D%2214%22%20height%3D%2217%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M9%204V2h6v2M9%2012l2%202%204-4m-6%207h6%22%2F%3E%3C%2Fsvg%3E");
  --vs-icon-risk:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%203%2010%2017H2L12%203Z%22%2F%3E%3Cpath%20d%3D%22M12%209v5m0%203h.01%22%2F%3E%3C%2Fsvg%3E");
  --vs-icon-clarify:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%202H5v20h14V7l-5-5ZM14%202v5h5M8%2012h8m-8%204h5%22%2F%3E%3C%2Fsvg%3E");
  --vs-icon-done:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22m7.5%2012%203%203%206-6%22%2F%3E%3C%2Fsvg%3E");
  --vs-icon-chart:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%203v17h17M8%2016v-5m5%205V7m5%209V4%22%2F%3E%3C%2Fsvg%3E");
  --vs-icon-clock:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22M12%207v5l3%202%22%2F%3E%3C%2Fsvg%3E");
  --vs-icon-tasks:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%224%22%20y%3D%223%22%20width%3D%2216%22%20height%3D%2218%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22m7%209%201%201%202-2m3%201h4M7%2015h3m3%200h4%22%2F%3E%3C%2Fsvg%3E");
}
/* Hierarchy: page -> module -> item -> metadata. */
#tmApp .tm-topbar h2,#exApp .ex-topbar h2 {font-size:28px;font-weight:700;letter-spacing:-.5px}
#tmApp .tm-card,#exApp .ex-card,.card {border-radius:12px;box-shadow:0 2px 6px #23304A03}
#tmApp .tm-card h3,#exApp .ex-card h3 {font-size:17px;font-weight:650;line-height:1.5;color:var(--vs-text)}
#tmApp .tm-sub,#exApp .ex-sub {font-size:13px;line-height:1.7;color:var(--vs-muted)}
#tmApp :is(button,a,input,select,textarea):focus-visible,
#exApp :is(button,a,input,select,textarea):focus-visible {outline:3px solid #A69DF6;outline-offset:3px}
/* Only real primary actions use a filled purple button. */
#tmApp .tm-btn,#exApp .ex-btn,.button,.btn {border-radius:7px;font-weight:550}
#tmApp .tm-btn.tm-primary,#exApp .ex-btn.ex-primary,.button.primary,.btn.primary {
  background:var(--vs-purple);border-color:var(--vs-purple);color:#fff;font-weight:650;
  box-shadow:0 2px 3px #5145CD14;
}
#tmApp .tm-btn.tm-primary:hover,#exApp .ex-btn.ex-primary:hover,.button.primary:hover,.btn.primary:hover {
  background:var(--vs-purple-ink);border-color:var(--vs-purple-ink);color:#fff;
}
#tmApp .tm-btn.tm-danger,#exApp .ex-btn.ex-danger {color:var(--vs-red);border-color:#E9BBC3;box-shadow:none}
#tmApp .tm-btn.tm-danger:hover,#exApp .ex-btn.ex-danger:hover {background:var(--vs-red-soft);border-color:var(--vs-red)}
#tmApp .td-text,.text-button,.text-btn {color:var(--vs-muted);text-decoration:none}
#tmApp .td-text:hover,.text-button:hover,.text-btn:hover {color:var(--vs-purple-ink);text-decoration:underline}
/* KPI cards: separated tiles, consistent number hierarchy and a distinct icon. */
#tmApp .td-stats {gap:12px;border:0;overflow:visible;background:transparent;border-radius:0}
#tmApp .td-stat {
  position:relative;min-height:160px;padding:20px 18px 17px;border:1px solid var(--vs-tone-line);
  border-radius:12px;background:#fff;color:var(--vs-tone);box-shadow:0 2px 6px #23304A03;
  border-top:3px solid var(--vs-tone);transition:border-color .15s,box-shadow .15s;
}
#tmApp .td-stat:last-child {border-right:1px solid var(--vs-tone-line)}
#tmApp .td-stat[data-today-filter=decision] {--vs-tone:var(--vs-purple-ink);--vs-tone-soft:var(--vs-purple-soft);--vs-tone-line:#D9D5FF;--vs-tile-icon:var(--vs-icon-decision);background:#fff;color:var(--vs-tone)}
#tmApp .td-stat[data-today-filter=review] {--vs-tone:var(--vs-blue);--vs-tone-soft:var(--vs-blue-soft);--vs-tone-line:#C4D8F6;--vs-tile-icon:var(--vs-icon-review);background:#fff;color:var(--vs-tone)}
#tmApp .td-stat[data-today-filter=risk] {--vs-tone:var(--vs-amber);--vs-tone-soft:var(--vs-amber-soft);--vs-tone-line:#EED5B3;--vs-tile-icon:var(--vs-icon-risk);background:#fff;color:var(--vs-tone)}
#tmApp .td-stat[data-today-filter=clarify] {--vs-tone:#5D6B82;--vs-tone-soft:#EEF2F8;--vs-tone-line:#DCE3EF;--vs-tile-icon:var(--vs-icon-clarify);background:#fff;color:var(--vs-tone)}
#tmApp .td-stat::before,#tmApp .tm-stat::before {
  content:"";position:absolute;top:17px;right:16px;width:34px;height:34px;border-radius:10px;background:var(--vs-tone-soft);
}
#tmApp .td-stat::after,#tmApp .tm-stat::after {
  content:"";position:absolute;top:24px;right:23px;width:20px;height:20px;background:var(--vs-tone);
  -webkit-mask:var(--vs-tile-icon) center/contain no-repeat;mask:var(--vs-tile-icon) center/contain no-repeat;
}
#tmApp .td-stat>span {display:block;padding-right:35px;font-size:14px;font-weight:650;line-height:1.5;color:var(--vs-text)}
#tmApp .td-stat strong {font:700 38px/1.15 var(--tm-font-mono);margin:19px 0 10px;letter-spacing:-1px}
#tmApp .td-stat small {font-size:12px;color:var(--vs-muted)}
#tmApp .td-stat:hover {box-shadow:0 4px 14px #23304A10;border-color:var(--vs-tone)}
#tmApp .td-stat[aria-pressed=true] {background:var(--vs-tone-soft);box-shadow:0 0 0 2px var(--vs-tone)}
#tmApp .tm-stat {position:relative;padding:20px 22px;border-radius:12px;border-top:3px solid var(--vs-tone)}
#tmApp .tm-stat:nth-child(1) {--vs-tone:var(--vs-purple-ink);--vs-tone-soft:#E3DFFF;--vs-tile-icon:var(--vs-icon-tasks);background:#F6F4FF}
#tmApp .tm-stat:nth-child(2) {--vs-tone:var(--vs-green);--vs-tone-soft:#D5EDDF;--vs-tile-icon:var(--vs-icon-done);background:#F1FAF5}
#tmApp .tm-stat:nth-child(3) {--vs-tone:var(--vs-red);--vs-tone-soft:#FADCE2;--vs-tile-icon:var(--vs-icon-risk);background:#FFF5F6}
#tmApp .tm-stat .tm-k {font-size:14px;font-weight:600;color:var(--vs-text);padding-right:34px}
#tmApp .tm-stat .tm-v {font-size:40px;font-weight:700;margin:15px 0 7px}
#tmApp .tm-stat .tm-d {font-size:12px}
/* Schedule: a time column and calendar icon distinguish it from the task queue. */
#tmApp .td-section-head h3 {display:flex;align-items:center;gap:9px;padding-bottom:0;border:0;font-size:18px;font-weight:700}
#tmApp .td-section-head h3::before,
#tmApp #tm-view-dashboard .tm-card>h3::before {
  content:"";display:inline-block;vertical-align:-4px;width:20px;height:20px;flex-shrink:0;
  background:var(--vs-blue);-webkit-mask:var(--vs-icon-clock) center/contain no-repeat;mask:var(--vs-icon-clock) center/contain no-repeat;
}
#tmApp .td-section-head h3 small {font-size:12px;font-weight:500;margin-left:0}
#tmApp .td-agenda-row {padding:19px 0;gap:20px}
#tmApp .td-time {font-size:18px;font-weight:650;color:var(--vs-blue);line-height:1.4}
#tmApp .td-time small {font-size:11px;font-weight:400;color:var(--vs-muted)}
#tmApp .td-agenda-copy strong {font-size:15px;font-weight:650;color:var(--vs-text)}
#tmApp .td-agenda-copy p {font-size:13px;line-height:1.7}
#tmApp .td-agenda-copy small {font-size:12px}
/* Status is always text + color; green is reserved for completion/healthy states. */
#tmApp .td-badge,.badge,#exApp .ex-badge {font-size:12px;font-weight:600;border-radius:5px}
#tmApp .td-decision {color:var(--vs-purple-ink);background:var(--vs-purple-soft);border-color:#D9D5FF}
#tmApp .td-review {color:var(--vs-blue);background:var(--vs-blue-soft);border-color:#C4D8F6}
#tmApp .td-risk {color:var(--vs-amber);background:var(--vs-amber-soft);border-color:#EED5B3}
#tmApp .td-clarify {color:var(--vs-muted);background:#EEF2F8;border-color:#DCE3EF}
#tmApp .td-done {color:var(--vs-green);background:var(--vs-green-soft);border-color:#BBDDCB}
/* The legacy renderer sets the review badge inline; match only that existing badge color. */
#tmApp .tm-badge[style*="#0F7D72" i],#exApp .ex-badge[style*="#0F7D72" i] {color:var(--vs-blue)!important;background:var(--vs-blue-soft)!important}
#tmApp .tm-overdue-badge,#exApp .ex-overdue-badge {background:var(--vs-red);color:#fff}
/* Task queue: readable rows, visible selection, restrained risk highlights. */
#tmApp .td-workspace {border-radius:12px;box-shadow:0 2px 6px #23304A03}
#tmApp .td-list-head {background:#F8F9FC;padding:17px 20px}
#tmApp .td-list-head strong {font-size:15px;font-weight:650;color:var(--vs-text)}
#tmApp .td-task {border-left-width:4px;padding:20px 18px;position:relative}
#tmApp .td-task>strong {font-size:15px;font-weight:650;line-height:1.65}
#tmApp .td-task small {font-size:12px}
#tmApp .td-task p {font-size:13px}
#tmApp .td-task:hover {background:#F6F5FF}
#tmApp .td-task:has(.td-risk) {border-left-color:#CB832E;background:#FFFCF7}
#tmApp .td-task[aria-current=true] {border-left-color:var(--vs-purple);background:#F4F2FF}
#tmApp .td-detail {padding:26px}
#tmApp .td-detail h3 {font-size:23px;font-weight:700;line-height:1.45}
#tmApp .td-meta {font-size:12px}
#tmApp .td-tabs {gap:18px}
#tmApp .td-tabs button {font-size:13px;min-height:40px}
#tmApp .td-tabs button[aria-selected=true] {font-weight:650;color:var(--vs-purple-ink)}
#tmApp .td-next {border-left:3px solid var(--vs-purple);background:#F5F3FF;padding:16px 18px;border-radius:0 8px 8px 0}
#tmApp .td-next p {font-size:13px;line-height:1.8}
#tmApp .td-actions {gap:9px}
#tmApp .td-actions .tm-btn {min-height:38px}
#tmApp .td-actions [data-today-action=original] {background:#fff}
#exApp .ex-card {border-left:4px solid #C6C1F6}
#exApp .ex-card.ex-overdue {border-color:#E9BBC3;border-left-color:var(--vs-red);background:#FFFAFB}
#exApp .ex-card .ex-notes {line-height:1.8}
#exApp .ex-card-foot {padding-top:14px;gap:10px}
#exApp {--ex-review:var(--vs-blue)}
#exApp .ex-deliver {background:var(--vs-blue-soft)}
/* Native weekly charts have a recognizable chart header; the task list has its own icon. */
#tmApp #tm-view-dashboard .tm-card>h3 {display:flex;align-items:center;gap:9px;font-size:17px;font-weight:650}
#tmApp #tm-view-dashboard .tm-card>h3::before {
  -webkit-mask-image:var(--vs-icon-chart);mask-image:var(--vs-icon-chart);
}
#tmApp #tm-view-dashboard .tm-card:has(#tm-gantt)>h3::before {-webkit-mask-image:var(--vs-icon-clock);mask-image:var(--vs-icon-clock)}
#tmApp #tm-view-dashboard .tm-card:has(#tm-followupList)>h3::before {
  background:var(--vs-purple);-webkit-mask-image:var(--vs-icon-tasks);mask-image:var(--vs-icon-tasks);
}
#tmApp .tm-card h3 .tm-small {font-weight:400}
/* Analysis dashboards: KPI, chart/table and actionable findings use distinct treatments. */
.metric,.kpi {border-radius:12px;border-top:3px solid #C4BEF4;padding:20px;background:#fff;box-shadow:0 2px 6px #23304A03}
.metric-label,.kpi-label {font-size:14px;font-weight:600;color:var(--vs-text)}
.metric-value,.kpi-value {font-size:34px;font-weight:700;letter-spacing:-1px;margin:15px 0 10px;line-height:1.2}
.metric-value small,.kpi-value small {font-size:13px;font-weight:500;letter-spacing:0;color:var(--vs-muted)}
.metric-foot,.kpi-foot {font-size:12px;line-height:1.7}
.card-head {padding:19px 20px 15px;border-bottom:1px solid #E8ECF4;background:#FAFBFE;margin-bottom:18px}
.card-head h2,.card-head h3 {font-size:17px;font-weight:650;line-height:1.5;color:var(--vs-text)}
.hrv-card .card-head h2 {font-size:17px;font-weight:650;line-height:1.5}
.hrv-card .card-head p,.hrv-caption,.hrv-boundary,.hrv-legend {font-size:12px}
.fv-card {border-radius:12px;box-shadow:0 2px 6px #23304A03}
.fv-card-head {margin:-18px -18px 18px;padding:18px;border-bottom:1px solid #E8ECF4;background:#FAFBFE;align-items:center}
.fv-card-head h3 {display:flex;align-items:center;gap:8px;font-size:17px;font-weight:650;line-height:1.5}
.fv-card-head h3::before {content:"";display:inline-block;flex-shrink:0;width:19px;height:19px;background:var(--vs-blue);-webkit-mask:var(--vs-icon-chart) center/contain no-repeat;mask:var(--vs-icon-chart) center/contain no-repeat}
.fv-card-head span,.fv-note,.fv-legend {font-size:12px}
.card-head>span,.card-head small,.card-head p {font-size:12px}
.card:has(.chart,.visual-svg,.hrv-svg,.bars,.visual-donut,.visual-quadrant,.visual-funnel,.visual-stacked) .card-head h2,
.card:has(.chart,.visual-svg,.hrv-svg,.bars,.visual-donut,.visual-quadrant,.visual-funnel,.visual-stacked) .card-head h3 {display:flex;align-items:center;gap:8px}
.card:has(.chart,.visual-svg,.hrv-svg,.bars,.visual-donut,.visual-quadrant,.visual-funnel,.visual-stacked) .card-head :is(h2,h3)::before {
  content:"";display:inline-block;flex-shrink:0;width:19px;height:19px;background:var(--vs-blue);
  -webkit-mask:var(--vs-icon-chart) center/contain no-repeat;mask:var(--vs-icon-chart) center/contain no-repeat;
}
.card-body>p,.note,.insight {font-size:13px}
th {font-size:12px;font-weight:600;background:#F7F9FC;color:#4C5C75}
td {font-size:13px}
td small,.table-footer,.chart-caption,.legend,.source-note,.provenance {font-size:12px}
.note,.insight {border-radius:0 8px 8px 0;border-left-width:3px}
.note.amber {background:var(--vs-amber-soft);border-color:var(--vs-amber)}
.note.red {background:var(--vs-red-soft);border-color:var(--vs-red)}
.note.green {background:var(--vs-green-soft);border-color:var(--vs-green)}
.note h3,.note strong {font-size:14px;font-weight:650}
.note p,.insight p {font-size:13px}
.analysis-intro h2 {font-size:25px;font-weight:700}
.analysis-intro p {font-size:13px}
.chapter-current>strong {font-size:15px;font-weight:650}
.chapter-rail .chapter-directory button {font-size:12px}
.action-item {border-left:3px solid var(--vs-purple);padding-left:14px}
.action-item h4 {font-size:15px;font-weight:650}
.action-item p {font-size:13px}
.badge.green {color:var(--vs-green);background:var(--vs-green-soft)}
.badge.amber {color:var(--vs-amber);background:var(--vs-amber-soft)}
.badge.red {color:var(--vs-red);background:var(--vs-red-soft)}
@media(max-width:1100px) {
  #tmApp .td-stats {grid-template-columns:repeat(2,minmax(0,1fr))}
  .metric-value,.kpi-value {font-size:29px}
}
@media(max-width:650px) {
  #tmApp .tm-topbar h2,#exApp .ex-topbar h2 {font-size:25px}
  #tmApp .td-stats {gap:10px}
  #tmApp .td-stat {min-height:153px;padding:16px 13px 13px}
  #tmApp .td-stat>span {font-size:13px;padding-right:30px}
  #tmApp .td-stat strong {font-size:34px;margin:20px 0 9px}
  #tmApp .td-stat small {font-size:11px}
  #tmApp .td-stat::before {top:13px;right:10px;width:28px;height:28px;border-radius:8px}
  #tmApp .td-stat::after {top:19px;right:16px;width:16px;height:16px}
  #tmApp .td-agenda-row {gap:10px;grid-template-columns:54px minmax(0,1fr)}
  #tmApp .td-agenda-row>.td-actions {grid-column:2;flex-wrap:wrap}
  #tmApp .td-agenda-copy strong {font-size:14px}
  #tmApp .td-time {font-size:16px}
  #tmApp .td-detail {padding:20px}
  #tmApp .td-detail h3 {font-size:21px}
  #tmApp .td-actions .tm-btn,#exApp .ex-card-foot .ex-btn {min-height:42px}
  #tmApp #tm-view-dashboard .tm-card>h3 {flex-wrap:wrap;gap:7px}
  #tmApp .tm-stat .tm-v {font-size:35px}
  .metric,.kpi {padding:16px 14px}
  .metric-value,.kpi-value {font-size:27px}
  .metric-label,.kpi-label {font-size:13px}
  .card-head {padding:16px 16px 13px}
  .card-head h2,.card-head h3 {font-size:16px}
  .hrv-card .card-head h2 {font-size:16px}
  .fv-card-head h3 {font-size:16px}
  .analysis-intro h2 {font-size:22px}
  .chapter-current>strong {font-size:12px}
}
@media(prefers-reduced-motion:reduce) {#tmApp .td-stat {transition:none}}