/* Início: dashboard de widgets por pessoa (views/inicio.js). A grade e a moldura são as do painel das Tarefas (.pn, .pn-w em trabalho.css). */
.ini { margin-top: 14px; }
/* Fora do modo editar: nada de pegador, alças, remover nem ↑/↓; o cabeçalho não arrasta. */
.ini:not(.pn--editando) .pn-w__pega, .ini:not(.pn--editando) .pn-w__alca, .ini:not(.pn--editando) .ini-so-editar { display: none; }
.ini:not(.pn--editando) .pn-w__topo { cursor: default; touch-action: auto; user-select: auto; }
.ini.pn--editando .pn-w { outline: 1.5px dashed color-mix(in srgb, var(--tinta-3) 60%, transparent); outline-offset: 2px; }
.ini.pn--editando .pn-w__acoes { opacity: 1; }

.ini-barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 14px; padding: 12px 16px; border: 1px solid var(--linha); border-radius: var(--r-card); background: color-mix(in srgb, var(--amarelo) 12%, var(--superficie)); }
.ini-barra p { margin: 0; font-size: calc(13px * var(--fs, 1)); color: var(--tinta-2); }
.ini-barra p b { color: var(--tinta); }
.ini-barra > span { display: flex; flex-wrap: wrap; gap: 8px; }

/* Números do dia: o bloco navy de antes, agora como widget. */
.ini-w--numeros { background: var(--bloco); color: var(--bloco-tinta); border-color: transparent; isolation: isolate; }
.ini-w--numeros::after { content: ''; position: absolute; inset: auto -10% -60% 40%; height: 120%; z-index: -1; background: radial-gradient(closest-side, rgba(201, 207, 221, .16), transparent); pointer-events: none; }
.ini-w--numeros .pn-w__topo { border-bottom-color: rgba(241, 239, 232, .12); }
.ini-w--numeros .pn-w__topo h2 { color: rgba(241, 239, 232, .64); font-weight: 500; }
.ini-w--numeros .pn-w__acoes button, .ini-w--numeros .pn-w__pega { color: rgba(241, 239, 232, .7); }
.ini-w--numeros .pn-w__acoes button:hover { background: rgba(241, 239, 232, .1); color: var(--bloco-tinta); }
.ini-w--numeros .pn-w__corpo { padding: 10px clamp(16px, 2.4vw, 28px) 18px; }
.ini-w--numeros .rotulo { color: rgba(241, 239, 232, .64); }
.ini-w--numeros h1 { margin: 8px 0 0; font-size: clamp(22px, 2.8vw, 36px); letter-spacing: -.03em; }
.ini-w--numeros p { margin: 6px 0 0; color: rgba(241, 239, 232, .72); }
.ini-w--numeros kbd { background: transparent; color: inherit; border-color: rgba(241, 239, 232, .3); }
.ini-w--numeros .kpis { margin-top: 18px; }

.ini-linha { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.ini-atalhos { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 10px; padding-top: 6px; }
.ini-atalhos .botao { justify-content: flex-start; }
.ini-nota { margin: 8px 0 0; font-size: calc(12px * var(--fs, 1)); }
.ini-w .fontes { padding-top: 6px; }
.ini-w .lista { margin: 0; }

/* Tela estreita e celular: uma coluna, na ordem de leitura; reordenar só pelos botões ↑/↓. */
@media (max-width: 900px) {
  .ini-w--numeros { max-height: none; }
}
.modo-movel .ini.pn--editando .pn-w__acoes { display: flex !important; }
.ini.pn--editando [data-pn="recolher"] { display: none; } /* no modo editar o chevron de ↓ já é "descer" */

/* Widgets novos (19/10/2026): cores pelos tokens do tema, então o modo escuro sai de graça. */
.ini-w .ini-ponto--ok { background: var(--ok); }
.ini-w .ini-ponto--aviso { background: var(--aviso); }
.ini-w .pn-barras__nome small { display: block; color: var(--tinta-2); font-size: calc(11px * var(--fs, 1)); overflow: hidden; text-overflow: ellipsis; }
.ini-ver { display: inline-block; margin-top: 10px; }
.ini-selo { flex: none; min-width: 52px; text-align: center; }
.ini-w .pn-w__extra .pn-abas { display: inline-flex; }

/* Cronômetro */
.ini-cron { display: grid; gap: 10px; padding-top: 6px; }
.ini-cron p { margin: 0; }
.ini-cron__info { display: grid; gap: 2px; min-width: 0; }
.ini-cron__info small { color: var(--tinta-2); }
.ini-cron__tempo { font: 500 calc(30px * var(--fs, 1)) var(--dados); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ini-cron--pausado .ini-cron__tempo { color: var(--tinta-2); }
.ini-cron__acoes { display: flex; flex-wrap: wrap; gap: 8px; }

/* Conversas do Gather */
.ini-gather { display: grid; gap: 12px; justify-items: start; padding-top: 6px; }
.ini-gather > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; }
.ini-gather__n { font: 600 calc(34px * var(--fs, 1)) var(--display); line-height: 1; color: var(--tinta-2); }
.ini-gather__n--tem { color: var(--tinta); }

/* Notas rápidas */
.ini-notas { display: flex; flex-direction: column; gap: 6px; height: 100%; padding-top: 4px; }
.ini-notas textarea { flex: 1; min-height: 120px; width: 100%; resize: none; padding: 10px 12px; border: 1px solid var(--linha); border-radius: 10px; background: var(--superficie-2); color: var(--tinta); font: calc(13.5px * var(--fs, 1)) / 1.5 var(--texto); }
.ini-notas textarea:focus { outline: 2px solid color-mix(in srgb, var(--tinta-3) 60%, transparent); outline-offset: 1px; }

/* Meus links */
.ini-links { list-style: none; margin: 0; padding: 2px 0 0; display: grid; gap: 2px; }
.ini-links li { display: flex; align-items: center; gap: 4px; }
.ini-links a { flex: 1; min-width: 0; padding: 6px 6px; border-radius: 8px; color: inherit; text-decoration: none; font-size: calc(13px * var(--fs, 1)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ini-links a:hover { background: var(--linha-suave); }
.ini-links a small { color: var(--tinta-2); }
.ini-links button { display: grid; place-items: center; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 6px; background: none; color: var(--tinta-2); cursor: pointer; opacity: 0; }
.ini-links li:hover button, .ini-links button:focus-visible, .modo-movel .ini-links button { opacity: 1; }
@media (hover: none) { .ini-links button { opacity: 1; } }
.ini-links button:hover { background: var(--linha-suave); color: var(--erro); }
.ini-links button svg { width: 13px; height: 13px; }
.ini-links__novo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) auto; gap: 6px; margin-top: 10px; }
.ini-links__novo input { min-width: 0; padding: 6px 9px; border: 1px solid var(--linha); border-radius: 8px; background: var(--superficie); color: var(--tinta); font: calc(13px * var(--fs, 1)) var(--texto); }
@media (max-width: 600px) { .ini-links__novo { grid-template-columns: 1fr; } }