/* UI workstream: task, collection and dialog polish only.
   Keep pool stages/reveal selectors in styles.css owned by the pool workstream. */

/* VP-01: semantic state, readable surfaces and native task inputs. */
body[data-theme="sweet"] #view-collection .collection-card.rarity-UR {
  background: var(--color-bg-card-soft);
  color: var(--color-text-main);
  box-shadow: var(--shadow-sm);
}

body[data-theme="default"] .task-card.priority-normal { border-left: 3px solid var(--priority-normal); }
body[data-theme="default"] .task-card.priority-important { border-left: 3px solid var(--priority-important); }
body[data-theme="default"] .task-card.priority-urgent { border-left: 3px solid var(--priority-urgent); }

.import-success-panel[hidden] { display: none; }
.collection-grid > .empty-state { grid-column: 1 / -1; }

body[data-theme] #task-form :is(.form-input, .form-textarea, .form-select, input[type="date"]) {
  width: 100%;
  min-width: 0;
  min-height: var(--tap-min);
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg-elevated);
  color: var(--color-text-main);
  font: inherit;
  font-size: 1rem;
  line-height: var(--line-height-normal);
  box-shadow: none;
}

body[data-theme] #task-form :is(.form-input, .form-textarea)::placeholder {
  color: var(--color-text-muted);
  opacity: 1;
}

body[data-theme] #task-form :is(.form-input, .form-textarea, .form-select):focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
  border-color: var(--color-primary);
}

body[data-theme="default"] #task-form input[type="date"] { color-scheme: dark; }
body[data-theme="sweet"] #task-form input[type="date"] { color-scheme: light; }
#task-form, #task-form > *, #task-form :is(.form-field, .subtask-form-input) { min-width: 0; max-width: 100%; }
#task-form .form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: var(--space-3); }
#task-form .form-field { display: grid; gap: var(--space-2); }
#task-form :is(.subtask-form-add, .subtask-form-item) { display: flex; align-items: center; gap: var(--space-2); }
#task-form .subtask-form-add { flex-wrap: wrap; }
#task-form .subtask-form-add > .form-input { flex: 1 1 10rem; }
#task-form .subtask-form-item > .form-input { flex: 1 1 0; }
#task-form :is(.subtask-form-add, .subtask-form-item) > .btn { flex-shrink: 0; min-height: var(--tap-min); max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
#task-form :is(.form-hint, .form-label, .settings-toggle__text) { overflow-wrap: anywhere; }
#task-form .segmented-control__btn { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
#task-form .form-hint { color: var(--color-text-secondary); font-size: var(--font-size-sm); line-height: var(--line-height-normal); }

/* VP-02: the daily list precedes optional companion / adventure summaries. */
body[data-theme] #view-tasks .page-title {
  color: var(--color-text-main);
  background: none;
  -webkit-text-fill-color: currentColor;
}
body[data-theme] #view-tasks .stats-bar { gap: var(--space-2); padding-bottom: var(--space-2); scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: var(--color-border) transparent; }
body[data-theme] #view-tasks .stats-bar::-webkit-scrollbar { display: block; height: 3px; }
body[data-theme] #view-tasks .stats-bar::-webkit-scrollbar-thumb { background: var(--color-border); border-radius: var(--radius-pill); }
body[data-theme] #view-tasks .stat-card { background: var(--color-bg-surface); box-shadow: none; border: 1px solid var(--color-border-soft); padding: var(--space-3); scroll-snap-align: start; }
body[data-theme] #view-tasks .stat-value { font-size: var(--font-size-xl); }
body[data-theme] #view-tasks .stat-label { font-size: var(--font-size-sm); color: var(--color-text-secondary); }
body[data-theme] #view-tasks .task-view-tabs { margin-bottom: var(--space-3); }
body[data-theme] #view-tasks .filter-bar { margin-bottom: var(--space-4); }
body[data-theme] #view-tasks .filter-btn { min-height: var(--tap-min); font-size: var(--font-size-sm); }
body[data-theme] #view-tasks .filter-btn.active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
body[data-theme] #view-tasks .section-title { font-size: var(--font-size-base); line-height: var(--line-height-normal); color: var(--color-text-main); }
body[data-theme] #view-tasks .task-card { background: var(--color-bg-card); box-shadow: none; padding: var(--space-4); }
body[data-theme] #view-tasks .task-card__title { color: var(--color-text-main); font-size: var(--font-size-lg); line-height: var(--line-height-normal); overflow-wrap: anywhere; }
body[data-theme] #view-tasks .task-card__preview { color: var(--color-text-secondary); font-size: var(--font-size-md); line-height: var(--line-height-normal); overflow-wrap: anywhere; }
body[data-theme] #view-tasks .task-check { width: var(--tap-min); height: var(--tap-min); }
body[data-theme] #view-tasks .task-card__meta { gap: var(--space-1); }
body[data-theme] #view-tasks .task-card__actions { gap: var(--space-2); flex-wrap: wrap; padding-top: var(--space-3); margin-top: var(--space-3); border-top: 1px solid var(--color-divider); }
body[data-theme] #view-tasks .task-card__actions .btn { min-height: var(--tap-min); font-size: var(--font-size-sm); }
body[data-theme] #view-tasks .task-card__actions .btn--ghost { background: transparent; box-shadow: none; border-color: transparent; color: var(--color-text-secondary); }
body[data-theme] #view-tasks .task-card__actions .btn--danger { color: var(--color-danger); }
body[data-theme] #view-tasks .task-card--done { opacity: 1; background: var(--color-bg-surface); }
body[data-theme] #view-tasks .task-card--done .task-card__title { color: var(--color-text-secondary); }
body[data-theme] #view-tasks .task-view-content > .empty-state:not(:first-child) { padding: var(--space-3) var(--space-4); background: transparent; box-shadow: none; border: 1px solid var(--color-border-soft); }
body[data-theme] #view-tasks .task-view-content > .empty-state:not(:first-child) .empty-state__icon { display: none; }
body[data-theme] #view-tasks .task-view-content > .empty-state:not(:first-child) .empty-state__title { font-size: var(--font-size-md); }
body[data-theme] #view-tasks .task-view-content > .empty-state:not(:first-child) .empty-state__desc { margin: 0; }
body[data-theme] #view-tasks .today-plan-summary { background: transparent; box-shadow: none; padding: var(--space-3) 0; border: 0; }
body[data-theme] #view-tasks .today-plan-summary__value { font-size: var(--font-size-base); }
body[data-theme] #view-tasks #companion-section > .empty-state { padding: var(--space-4); box-shadow: none; }
body[data-theme] #view-tasks #companion-section > .empty-state .empty-state__icon { font-size: var(--font-size-xl); margin-bottom: var(--space-2); }

/* VP-04: display the pet first; keep image, detail and progression controls separate. */
body[data-theme] #view-collection :is(.collection-progress-summary, .collection-milestones-panel, .collection-companion) { background: var(--color-bg-surface); box-shadow: none; padding: var(--space-3); border-color: var(--color-border-soft); }
body[data-theme] #view-collection .collection-summary__title { font-size: var(--font-size-base); }
body[data-theme] #view-collection .collection-summary__next strong { color: var(--color-text-secondary); }
body[data-theme] #view-collection .collection-summary__rarities { gap: var(--space-1); }
body[data-theme] #view-collection .collection-rarity-chip { padding: var(--space-1) 6px; }
body[data-theme] #view-collection .filter-btn { min-height: var(--tap-min); }
body[data-theme] #view-collection .filter-btn.active { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.collection-browse-hint { margin: 0 0 var(--space-3); color: var(--color-text-muted); font-size: var(--font-size-sm); }
body[data-theme] #view-collection .collection-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: var(--space-3);
  background: var(--color-bg-card);
  color: var(--color-text-main);
  border-radius: var(--radius-lg);
  box-shadow: none;
}
body[data-theme] #view-collection .collection-card--locked { opacity: 1; background: var(--color-bg-surface); }
body[data-theme] #view-collection .collection-card__image { margin-bottom: var(--space-2); }
body[data-theme] #view-collection .collection-card__image :is(.pet-image-frame, .pet-img-wrap, .pet-img) { width: 100%; height: auto; aspect-ratio: 1; }
body[data-theme] #view-collection .collection-card__image img { object-fit: contain; }
body[data-theme] #view-collection .collection-card__tap { flex: 1; }
body[data-theme] #view-collection .collection-card__name { color: var(--color-text-main); font-size: var(--font-size-base); line-height: var(--line-height-snug); overflow-wrap: anywhere; }
body[data-theme] #view-collection .collection-card__title { color: var(--color-text-secondary); font-size: var(--font-size-sm); line-height: var(--line-height-normal); min-height: 1.5em; margin: var(--space-1) 0 var(--space-2); }
body[data-theme] #view-collection :is(.fragments, .pet-original-name, .locked-label) { color: var(--color-text-muted); font-size: var(--font-size-sm); line-height: var(--line-height-normal); overflow-wrap: anywhere; }
.collection-card__meta { display: flex; justify-content: center; gap: var(--space-1) var(--space-2); flex-wrap: wrap; margin-top: var(--space-2); }
.collection-card__actions { display: grid; gap: var(--space-2); margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--color-divider); }
body[data-theme] #view-collection .collection-card__actions .btn { margin: 0; width: 100%; min-height: var(--tap-min); border-radius: var(--radius-sm); box-shadow: none; font-size: var(--font-size-sm); line-height: var(--line-height-normal); padding: var(--space-2); }
body[data-theme] #view-collection .collection-card__actions .btn--companion { background: var(--color-primary-soft); color: var(--color-primary-light); border: 1px solid var(--color-primary-border); }
body[data-theme] #view-collection .collection-card__actions .btn--upgrade { background: transparent; color: var(--color-text-secondary); border: 1px solid var(--color-border); }
.collection-card__state { display: flex; align-items: center; justify-content: center; min-height: var(--tap-min); color: var(--color-text-muted); font-size: var(--font-size-sm); }
body[data-theme] .pet-detail__hero .pet-image-frame { width: min(100%, 220px); height: auto; aspect-ratio: 1; }
body[data-theme] .pet-detail__hero .pet-detail-image-button { width: min(100%, 220px); }

/* VP-05: preserve the summon result's own scrolling/actions layout. */
body[data-theme] .modal:not(:has(.sweet-summon-result, .default-summon-result)) {
  padding: 0;
  max-height: calc(100dvh - var(--safe-top) - var(--space-4));
  overflow: hidden;
  background: var(--color-bg-card);
  border-color: var(--color-border);
}
body[data-theme] .modal:not(:has(.sweet-summon-result, .default-summon-result)) > .modal-body {
  max-height: min(88dvh, calc(100dvh - var(--safe-top) - var(--space-4)));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: var(--space-6);
  padding-bottom: calc(var(--space-6) + var(--safe-bottom));
  scroll-padding: var(--space-6) 0;
}
body[data-theme] .modal:has(#task-form) > .modal-body {
  overflow-x: hidden;
  overflow-y: auto;
  touch-action: pan-y pinch-zoom;
}
body[data-theme] .modal:not(:has(.sweet-summon-result, .default-summon-result)) .modal-title {
  min-height: var(--tap-min);
  padding-right: calc(var(--tap-min) + var(--space-2));
  margin-bottom: var(--space-4);
  font-size: var(--font-size-xl);
  line-height: var(--line-height-snug);
  color: var(--color-text-main);
  overflow-wrap: anywhere;
}
body[data-theme] .modal:not(:has(.sweet-summon-result, .default-summon-result)) .modal-close {
  width: var(--tap-min);
  height: var(--tap-min);
  top: var(--space-3);
  right: var(--space-3);
  background: var(--color-bg-elevated);
  color: var(--color-text-secondary);
  border-color: var(--color-border);
}
body[data-theme] .modal:not(:has(.sweet-summon-result, .default-summon-result)) :is(.form-actions, .confirm-modal__actions, .pet-detail__nickname-actions) { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-4); }
body[data-theme] .modal:not(:has(.sweet-summon-result, .default-summon-result)) :is(.form-actions, .confirm-modal__actions) .btn { flex: 1; min-height: var(--tap-min); white-space: normal; }
body.modal-open:has(#modal-overlay.open):not(:has(#modal-overlay .sweet-summon-result, #modal-overlay .default-summon-result)),
body.global-mailbox-open,
body.expedition-dispatch-open,
body.is-pet-image-viewer-open { overflow: hidden; touch-action: auto; }
body[data-theme] :is(.global-mailbox-modal__sheet, .expedition-dispatch-modal__content) { max-height: calc(100dvh - var(--safe-top) - var(--safe-bottom) - var(--space-6)); }
body[data-theme] :is(.global-mailbox-modal__body, .expedition-dispatch-modal__body) { min-height: 0; overscroll-behavior: contain; }
body[data-theme] .expedition-dispatch-modal__pet-list { max-height: none; overflow: visible; }
body[data-theme] :is(.global-mailbox-modal__icon-btn, .expedition-dispatch-modal__close, .pet-image-viewer__close) { min-width: var(--tap-min); min-height: var(--tap-min); flex-shrink: 0; }
body[data-theme] :is(.global-mailbox-modal__title, .expedition-dispatch-modal__title, .pet-image-viewer__title) { font-size: var(--font-size-xl); line-height: var(--line-height-snug); overflow-wrap: anywhere; }
body[data-theme] .pet-image-viewer__content { max-height: calc(100dvh - var(--safe-top) - var(--safe-bottom) - var(--space-6)); overflow-y: auto; overscroll-behavior: contain; }
body[data-theme] :is(.modal-body, .global-mailbox-modal__sheet, .expedition-dispatch-modal__content) :focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
@media (max-width: 600px) {
  #task-form .form-row { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 360px) {
  body[data-theme] .modal:not(:has(.sweet-summon-result, .default-summon-result)) > .modal-body { padding-inline: var(--space-4); }
}

/* Daily habits can be completed beside today's tasks in every theme. */
.today-habits { margin-block: var(--space-4); }
.today-habits__header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.today-habits__header .section-title { margin: 0; min-width: 0; }
.today-habits__header .btn { min-height: 44px; white-space: normal; }
.today-habits__list { display: grid; gap: var(--space-2); }
.today-habit-card { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-bg-card); }
.today-habit-check { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border: 1px solid var(--color-primary-border); border-radius: 50%; background: var(--color-primary-soft); color: var(--color-primary); font: inherit; font-size: var(--font-size-xl); cursor: pointer; }
.today-habit-check:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 3px; }
.today-habit-check:disabled { opacity: 0.6; cursor: wait; }
.today-habit-card__body { flex: 1; min-width: 0; }
.today-habit-card__name { margin: 0; color: var(--color-text-main); font-size: var(--font-size-base); line-height: var(--line-height-normal); overflow-wrap: anywhere; }
.today-habit-card__meta, .today-habits__hint { margin: var(--space-1) 0 0; color: var(--color-text-secondary); font-size: var(--font-size-sm); line-height: var(--line-height-normal); overflow-wrap: anywhere; }
.today-habit-card--done { background: var(--color-bg-card-soft); }
.today-habit-card--done .today-habit-card__name { color: var(--color-text-muted); }
.today-habit-card--done .today-habit-check { color: var(--color-success); background: var(--color-success-soft); border-color: var(--color-success); }
.today-habits__empty { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-3); padding: var(--space-3); border: 1px dashed var(--color-border); border-radius: var(--radius-md); }
.today-habits__empty .btn { min-height: 44px; white-space: normal; }
/* Quiet, consistent bulk rewards alongside the existing section controls. */
.btn.reward-claim-all {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  flex: 0 0 auto;
  width: auto;
  min-height: 40px;
  padding: 7px 12px;
  margin-left: auto;
  border: 1px solid var(--color-primary-border, var(--color-border));
  border-radius: var(--radius-pill);
  background: var(--color-primary-soft);
  color: var(--color-text-main);
  box-shadow: none;
  font-size: var(--font-size-sm);
  line-height: 1.4;
  white-space: nowrap;
}

.reward-claim-all__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  min-height: 22px;
  padding: 0 5px;
  border-radius: var(--radius-pill);
  background: var(--color-bg-surface);
  font-size: 0.85em;
  font-variant-numeric: tabular-nums;
}

.btn.reward-claim-all:disabled {
  opacity: 0.6;
  cursor: wait;
}

.btn.reward-claim-all:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 3px;
}

.reward-claim-header,
.quest-panel__header-wrap,
.daily-blessing-card__header {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.reward-claim-header > button:first-child,
.quest-panel__header-wrap > .quest-panel__header,
.daily-blessing-card__header > .daily-blessing-card__toggle {
  flex: 1 1 175px;
  width: auto;
  min-width: 0;
}

.collection-milestones-header {
  padding-right: 14px;
}

.collection-milestones-header > .reward-claim-all {
  margin: 8px 0 8px auto;
}

.reward-claim-header.collection-milestones-header > .collection-milestones-toggle {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  flex-basis: 125px;
}

.collection-milestones-header .collection-milestones-toggle__meta {
  grid-column: 1;
  text-align: left;
  font-size: var(--font-size-xs);
}

.collection-milestones-header .collection-milestones-toggle__arrow {
  grid-column: 2;
  grid-row: 1 / 3;
}

.quest-panel__header-wrap:has(.reward-claim-all) .quest-panel__subtitle,
.quest-panel__header-wrap:has(.reward-claim-all) .quest-panel__status-badge,
.daily-blessing-card__header:has(.reward-claim-all) .daily-status-badge,
.reward-claim-header:has(.reward-claim-all) .exploration-panel__claimable {
  display: none;
}

.achievement-summary__actions {
  display: flex;
  justify-content: flex-end;
}

.mailbox-claim-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  flex-shrink: 0;
  gap: 8px;
  padding: 0 16px 12px;
}

.mailbox-claim-actions[hidden] {
  display: none;
}

.mailbox-claim-actions__hint {
  flex: 1 1 160px;
  color: var(--color-text-secondary);
  font-size: var(--font-size-xs);
  line-height: 1.5;
}