/* Organizaê — visual com cor cheia (estilo quadro de trabalho)
   Etapas em cor sólida, lista agrupada por etapa, Kanban com cabeçalhos coloridos
   e Início com saudação, números coloridos e barra de etapas. */
:root{
  --s-backlog:#6B7588;--s-backlog-on:#fff;
  --s-priorizado:#7357F0;--s-priorizado-on:#fff;
  --s-andamento:#2470E8;--s-andamento-on:#fff;
  --s-aguardando:#F2B035;--s-aguardando-on:#3A2800;
  --s-concluido:#14925A;--s-concluido-on:#fff;
  --s-change:#E2533A;--s-change-on:#fff;
}
html body .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[data-stage]{--solid:var(--s-backlog);--on:var(--s-backlog-on);--fg:var(--st-backlog-fg);--tint:var(--st-backlog-bg)}
[data-stage="priorizado"]{--solid:var(--s-priorizado);--on:var(--s-priorizado-on);--fg:var(--st-priorizado-fg);--tint:var(--st-priorizado-bg)}
[data-stage="andamento"]{--solid:var(--s-andamento);--on:var(--s-andamento-on);--fg:var(--st-andamento-fg);--tint:var(--st-andamento-bg)}
[data-stage="aguardando"]{--solid:var(--s-aguardando);--on:var(--s-aguardando-on);--fg:var(--st-aguardando-fg);--tint:var(--st-aguardando-bg)}
[data-stage="concluido"]{--solid:var(--s-concluido);--on:var(--s-concluido-on);--fg:var(--st-concluido-fg);--tint:var(--st-concluido-bg)}

/* Etiqueta de etapa: cor cheia */
html body .demand-stage[data-stage]{background:var(--solid)!important;color:var(--on)!important;padding:0 10px}
html body .demand-stage[data-stage]::before{display:none}
html body .demand-stage.is-change{background:var(--s-change)!important;color:var(--s-change-on)!important;padding:0 10px}
html body .demand-stage.is-change::before{display:none}

/* ---------- Lista agrupada por etapa ---------- */
html body .dgroup{--cols:minmax(0,2.4fr) minmax(0,1.3fr) 176px 184px 208px;margin:0 0 32px}
html body .dgroup-head{display:flex;align-items:center;gap:12px;margin:0 0 8px;padding:0 4px}
html body .dgroup-head h2{display:flex;align-items:center;gap:8px;margin:0;color:var(--fg);font-size:17px;line-height:24px;font-weight:700}
html body .dgroup-head h2::before{content:"";width:12px;height:12px;border-radius:4px;background:var(--solid)}
html body .dgroup-count{color:var(--muted);font-size:13px;font-weight:500}
html body .dgroup-table{overflow:hidden;border:1px solid var(--line-soft);border-left:6px solid var(--solid);border-radius:var(--r-md);background:var(--surface);box-shadow:var(--shadow-1)}
html body .dgroup-cols,html body .drow{display:grid;grid-template-columns:var(--cols);align-items:stretch}
html body .dgroup-cols{background:var(--surface-2);border-bottom:1px solid var(--line-soft)}
html body .dgroup-cols>span{padding:8px 16px;color:var(--muted);font-size:12px;font-weight:600;letter-spacing:.01em}
html body .dgroup-cols>span:nth-child(3){text-align:center}
html body .drow{border-bottom:1px solid var(--line-soft);transition:background .12s}
html body .drow:last-child{border-bottom:0}
html body .drow:hover{background:var(--surface-2)}
html body .drow>div{display:flex;align-items:center;min-width:0;padding:12px 16px;border-right:1px solid var(--line-soft)}
html body .drow>div:last-child{border-right:0;justify-content:flex-end}
html body .drow-main{flex-direction:column;align-items:flex-start!important;justify-content:center;gap:2px}
html body .drow-main .di-title{font-size:15px;line-height:22px}
html body .drow-sub{display:flex;align-items:center;gap:8px;width:100%;min-width:0;margin:0;color:var(--muted);font-size:13px;line-height:20px}
html body .drow-next{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body .drow-next.is-empty{font-style:italic}
html body .drow-owner{gap:8px;font-size:14px}
html body .drow-owner>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body .drow-owner .is-empty{color:var(--muted)}
html body .owner-avatar{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--accent-container);color:var(--on-accent);font-size:11px;font-weight:700}
html body .drow>.drow-stage{padding:0}
html body .stage-cell{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:56px;padding:0 8px;background:var(--solid);color:var(--on);font-size:13px;font-weight:650;text-align:center}
html body .drow-due{font-size:13px}
html body .drow-action button{min-height:36px;padding:0 14px;font-size:13px}

/* ---------- Kanban: cabeçalho em cor cheia ---------- */
html body .kanban-column header{margin:0 0 4px;padding:8px 8px 8px 12px;border-radius:var(--r-md);background:var(--solid)!important;color:var(--on)!important}
html body .kanban-column header h2{color:var(--on)!important}
html body .kanban-column header h2::before{display:none}
html body .kanban-column header>span{background:rgba(255,255,255,.28)!important;color:var(--on)!important}
html body .kanban-column[data-stage="aguardando"] header>span{background:rgba(0,0,0,.12)!important}
html body .kanban-card{border-top:3px solid var(--solid)!important}
html body .kanban-column .kanban-card{border-top-color:var(--solid)!important}

/* ---------- Início ---------- */
html body #view .home-hero .hero-date{margin:0 0 4px;color:var(--muted);font-size:13px;font-weight:600;text-transform:capitalize}
html body #view .home-hero h1{font-size:32px;line-height:40px}
html body #view .home-hero p.muted b{color:var(--ink)}
html body #view .tiles .tile{border:0!important;box-shadow:none!important;background:var(--tile-bg)!important}
html body #view .tiles .tile strong{color:var(--tile-fg)!important;font-size:40px;line-height:48px}
html body #view .tiles .tile>span:first-child,html body #view .tiles .tile small{color:var(--tile-fg)!important;opacity:.85}
html body #view .tiles .tile .stat-more{color:var(--tile-fg)!important}
html body #view .tile[data-tone="late"]{--tile-bg:var(--st-change-bg);--tile-fg:var(--st-change-fg)}
html body #view .tile[data-tone="today"],html body #view .tile[data-tone="aguardando"]{--tile-bg:var(--st-aguardando-bg);--tile-fg:var(--st-aguardando-fg)}
html body #view .tile[data-tone="ok"]{--tile-bg:var(--st-concluido-bg);--tile-fg:var(--st-concluido-fg)}
html body #view .tile[data-tone="andamento"]{--tile-bg:var(--st-andamento-bg);--tile-fg:var(--st-andamento-fg)}
html body #view .tile.stat-link:hover{filter:brightness(.98);box-shadow:var(--shadow-2)!important}
html body #view .stage-overview{margin-bottom:24px}
html body #view .stage-overview .sectionhead{margin:0 0 16px}
html body .stage-bar{display:flex;gap:3px;height:16px;overflow:hidden;border-radius:var(--r-full);background:var(--surface-3)}
html body .stage-bar>span{min-width:8px;background:var(--solid)}
html body .stage-legend{display:flex;flex-wrap:wrap;gap:8px 24px;margin:16px 0 0;padding:0;list-style:none;font-size:14px}
html body .stage-legend li{display:flex;align-items:center;gap:8px}
html body .stage-legend .dot{width:10px;height:10px;border-radius:3px;background:var(--solid)}
html body .stage-legend b{margin-left:2px;font-variant-numeric:tabular-nums}

/* ---------- Celular ---------- */
@media (max-width:760px){
  html body .dgroup{margin:0 0 24px}
  html body .dgroup-cols{display:none}
  html body .drow{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"main main" "owner stage" "due action";padding:12px 0}
  html body .drow>div{padding:4px 16px;border-right:0}
  html body .drow-main{grid-area:main}
  html body .drow-owner{grid-area:owner}
  html body .drow-stage{grid-area:stage;justify-content:flex-end}
  html body .drow>.drow-stage{padding:4px 16px}
  html body .stage-cell{width:auto;height:auto;min-height:28px;padding:0 12px;border-radius:var(--r-full);font-size:12px}
  html body .drow-due{grid-area:due}
  html body .drow-action{grid-area:action}
  html body .drow-next{white-space:normal}
  html body #view .home-hero h1{font-size:26px;line-height:32px}
  html body #view .tiles .tile strong{font-size:28px;line-height:36px}
  html body #view .tiles .tile small{display:block!important;font-size:11px}
  html body .stage-legend{gap:8px 16px;font-size:13px}
}
html body .drow-sub .di-code{flex:none;white-space:nowrap}
html body #view .home-hero .hero-date{text-transform:none}
html body #view .home-hero .hero-date::first-letter{text-transform:uppercase}
html body .drow-action button,html[data-theme="dark"] body .drow-action button{background:var(--accent-container)!important;border-color:transparent!important;color:var(--on-accent)!important;font-weight:600}
html body .drow .drow-action button.outline,html[data-theme] body .drow .drow-action button.outline{border:1px solid transparent!important}
@media (max-width:760px){
  html body .drow{grid-template-areas:"main main" "owner owner" "due action"}
  html body .drow>.drow-stage{display:none}
  html body .drow-due .di-due:not(.due-chip){white-space:normal}
}