/* Signed-in dashboard, stage 2 — content pages (scoped to body.is-dash): the Hunt
   journal (views/docs.js) with its post viewer (post.js) and week's weather
   (weather.js), AI (views/ai.js), Forms (views/forms.js) and the form pages
   (views/form.js, forms/*.js). Nothing grows into a wall: the journal pages its
   posts, filter chip lists and roster chips scroll in their own box, the chat scrolls
   inside its panel, and forms keep a capped column with Save in a sticky bar. */

/* Boxes that scroll inside the page get a thin, quiet scrollbar. */
.is-dash .filter-chips, .is-dash .ai-thread, .is-dash .d-form .dogs > .chip-toggles, .is-dash .sheet-body {
  scrollbar-width: thin; scrollbar-color: var(--d-border-strong) transparent;
}

/* Hunt journal: header, three stat cards, then filters beside (≥1280px) or above the grid. */
.is-dash .journal-weather:empty { display: none; }
.is-dash .d-journal .d-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.is-dash .journal-body { display: grid; align-items: start; gap: 16px; min-width: 0; }
.is-dash .d-journal .filters-panel { gap: 0; padding: 0; }
.is-dash .d-journal .filters-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 12px 6px 6px; }
.is-dash .d-journal .filters-toggle {
  min-height: 32px; padding: 0 10px; border-radius: var(--d-radius); color: var(--d-text); font: 600 13px/1 var(--d-sans);
}
.is-dash .d-journal .filters-toggle:active { background: var(--d-selected); }
.is-dash .d-journal .filters-toggle .icon { width: 14px; height: 14px; color: var(--d-muted); }
.is-dash .d-journal .filters-sort { padding: 0; color: var(--d-muted); font-size: 12px; white-space: nowrap; }
.is-dash .d-journal .filters-body {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); align-items: start; gap: 16px 20px;
  padding: 12px 16px 16px; border-top: 1px solid var(--d-border);
}
.is-dash .d-journal .filters-body[hidden] { display: none; }
.is-dash .d-journal .filter-group { gap: 8px; }
.is-dash .d-journal .filter-group legend, .is-dash .d-journal .filter-legend {
  margin: 0 0 8px; padding: 0; color: var(--d-muted); font-size: 12px; font-weight: 500;
}
.is-dash .d-journal .filter-legend { margin: 0; }
/* Hunter and blind chips grow with the club: about five rows show, the rest scroll. */
.is-dash .d-journal .filter-chips {
  gap: 6px; max-height: 176px; margin: -4px; padding: 4px; overflow-y: auto; overscroll-behavior: contain; align-content: flex-start;
}
.is-dash .d-journal .filter-select { width: 100%; max-width: none; }
.is-dash .d-journal .filters-clear { justify-self: start; align-self: end; min-height: 32px; padding: 0 10px; }
.is-dash .journal-posts { gap: 12px; }
.is-dash .d-journal .post-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; border-radius: 0; overflow: visible; }
.is-dash .post-tile { overflow: hidden; border-radius: var(--d-radius); background: var(--d-raised); }
/* The photo box covers the tile, so hover/press tint it (a loaded photo dims over it). */
.is-dash .post-tile:hover .photo { background: var(--d-hover); }
.is-dash .post-tile:active .photo { background: var(--d-selected); }
.is-dash .post-tile:active .photo.is-loaded img { opacity: 0.7; }
.is-dash .post-badge {
  top: 6px; right: 6px; padding: 2px 6px; border-radius: 4px; background: rgba(9, 9, 11, 0.78); color: #fafafa;
  font: 600 11px/1.4 var(--d-sans); font-variant-numeric: tabular-nums;
}
.is-dash .journal-foot { display: flex; justify-content: flex-end; padding-top: 12px; border-top: 1px solid var(--d-border); }
.is-dash .journal-foot[hidden] { display: none; }
@media (min-width: 640px) { .is-dash .d-journal .post-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .is-dash .d-journal .post-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (min-width: 1280px) {
  .is-dash .journal-body { grid-template-columns: 272px minmax(0, 1fr); }
  .is-dash .d-journal .filters-panel {
    position: sticky; top: calc(var(--d-bar-h) + 16px); max-height: calc(100vh - var(--d-bar-h) - 32px);
    overflow-y: auto; overscroll-behavior: contain;
  }
  .is-dash .d-journal .filters-body { grid-template-columns: minmax(0, 1fr); }
  .is-dash .d-journal .post-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (min-width: 1680px) { .is-dash .d-journal .post-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); } }
@media (min-width: 1880px) { .is-dash .d-journal .post-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
@media (max-width: 639.98px) {
  .is-dash .d-journal .d-stats { gap: 8px; }
  .is-dash .d-journal .d-stat { padding: 12px; }
  .is-dash .d-journal .d-stat-value { font-size: 22px; }
}

/* The post viewer (a dialog over the page): flat, one column, photo shown whole. */
.is-dash .post-viewer { width: min(560px, calc(100% - 24px)); max-height: calc(100svh - 24px); padding: 12px 16px 16px; }
.is-dash .post-bar { margin: -12px -16px 12px; padding: 6px 12px; border-bottom: 1px solid var(--d-border); }
.is-dash .post-bar .back-link { justify-self: start; }
.is-dash .post-title { font: 600 14px/1.4 var(--d-sans); }
.is-dash .post-byline { gap: 10px; margin-bottom: 12px; }
.is-dash .post-avatar { width: 32px; height: 32px; font-size: 13px; }
.is-dash .post-hunters { font-size: 13px; font-weight: 600; }
.is-dash .post-where { color: var(--d-muted); font-size: 12px; }
.is-dash .post-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.is-dash .post-photo .photo { max-height: 56svh; border: 1px solid var(--d-border); border-radius: var(--d-radius-lg); background: #000; }
.is-dash .post-photo .photo.is-missing { background: var(--d-raised); }
.is-dash .post-nav { width: 32px; height: 32px; border-radius: var(--d-radius); }
.is-dash .post-nav:hover:not(:disabled) { background: var(--d-hover); }
.is-dash .post-nav:active:not(:disabled) { background: var(--d-selected); }
.is-dash .post-nav .icon { width: 16px; height: 16px; }
.is-dash .post-nav--prev { left: 8px; }
.is-dash .post-nav--next { right: 8px; }
.is-dash .post-result { margin-top: 12px; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.is-dash .post-count { color: var(--d-muted); font-weight: 500; }
.is-dash .post-dots { margin-top: 8px; }
.is-dash .post-dots span { background: var(--d-border-strong); }
.is-dash .post-caption, .is-dash .post-bag, .is-dash .post-notes { margin: 8px 0 0; font-size: 13px; line-height: 1.5; }
.is-dash .post-bag, .is-dash .post-notes { color: var(--d-text-2); }
.is-dash .post-open { width: 100%; min-height: 36px; margin-top: 16px; }
.is-dash .post-hint { margin: 8px 0 0; color: var(--d-muted); font-size: 12px; }

/* The week's weather: seven compact day cards (they scroll sideways on a phone). */
.is-dash .weather { gap: 12px; }
.is-dash .weather-body { gap: 8px; min-width: 0; }
.is-dash .weather-note { color: var(--d-muted); font-size: 12px; }
.is-dash .week-days { grid-template-columns: repeat(7, minmax(96px, 1fr)); gap: 8px; min-width: 0; scroll-snap-type: x proximity; }
.is-dash .day-card { gap: 2px; padding: 10px 12px; color: var(--d-text); }
.is-dash .day-card:active { background: var(--d-selected); }
.is-dash .day-name { font-size: 13px; font-weight: 600; }
.is-dash .day-date { color: var(--d-muted); font-size: 12px; }
.is-dash .day-temp { margin-top: 4px; font: 600 16px/1.3 var(--d-sans); font-variant-numeric: tabular-nums; }
.is-dash .day-wind { gap: 4px; color: var(--d-text-2); font-size: 12px; font-variant-numeric: tabular-nums; }
.is-dash .day-wind .icon { width: 13px; height: 13px; color: var(--d-muted); }
.is-dash .hourly-sheet { width: min(420px, calc(100% - 24px)); max-height: min(78svh, 640px); }
.is-dash .hourly-list li {
  grid-template-columns: 56px 44px 1fr; gap: 8px; padding: 6px 2px; border-bottom: 1px solid var(--d-border); font-size: 13px;
}
.is-dash .hourly-time { color: var(--d-muted); }
.is-dash .hourly-wind { font-weight: 500; }
.is-dash .hourly-gust { color: var(--d-amber); }

/* AI: one panel as tall as the workspace — modes on top, the conversation scrolling
   inside, the composer pinned at the foot. */
.is-dash .d-ai {
  display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 16px; min-height: 440px;
  height: calc(100vh - var(--d-bar-h) - 2 * var(--d-pad));
  height: calc(100dvh - var(--d-bar-h) - 2 * var(--d-pad));
}
/* `.panel.ai-panel`: dash-system.css loads later and makes every panel a flex column. */
.is-dash .panel.ai-panel { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 0; min-height: 0; }
.is-dash .ai-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 10px 16px; border-bottom: 1px solid var(--d-border); }
.is-dash .ai-modes { flex: none; margin: 0; }
.is-dash .ai-hint { flex: 1 1 280px; max-width: 80ch; margin: 0; color: var(--d-muted); font-size: 13px; }
.is-dash .ai-thread { min-height: 0; max-height: none; gap: 12px; padding: 16px; overflow-y: auto; overscroll-behavior: contain; }
.is-dash .ai-thread:has(> .ai-empty), .is-dash .ai-thread:has(> .ai-off) { align-content: center; }
.is-dash .ai-off { margin: 8px auto; }
.is-dash .ai-off-title { font-size: 16px; color: var(--d-text, inherit); }
.is-dash .ai-off p { color: var(--d-muted); font-size: 14px; }
.is-dash .ai-thread:focus-visible { outline-offset: -2px; }
.is-dash .ai-empty { margin: 0; padding: 24px 0; color: var(--d-muted); font-size: 13px; text-align: center; }
.is-dash .ai-turn { gap: 4px; max-width: min(88%, 760px); }
.is-dash .ai-bubble { padding: 8px 12px; border-radius: var(--d-radius-lg); font-size: 14px; line-height: 1.5; }
.is-dash .ai-turn--user .ai-bubble { border-bottom-right-radius: 2px; }
.is-dash .ai-turn--assistant .ai-bubble { border-bottom-left-radius: 2px; }
.is-dash .ai-typing { color: var(--d-muted); }
.is-dash .ai-open { min-height: 30px; padding: 0 12px; }
.is-dash .ai-report { padding: 0 2px; color: var(--d-muted); font-size: 12px; }
.is-dash .ai-composer { gap: 8px; align-items: flex-end; padding: 12px 16px; border-top: 1px solid var(--d-border); }
.is-dash .ai-input { min-height: 40px; max-height: 160px; padding: 9px 12px; line-height: 1.4; resize: vertical; }
.is-dash .ai-send { min-height: 40px; padding: 0 16px; }
@media (max-width: 639.98px) {
  .is-dash .ai-head, .is-dash .ai-composer { padding-inline: 12px; }
  .is-dash .ai-thread { padding: 12px; }
}

/* Forms: the four forms as a compact grid of cards. */
.is-dash .d-forms .form-list { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.is-dash .d-forms .form-list > li { display: grid; }
.is-dash .d-forms .form-card {
  align-items: flex-start; gap: 12px; padding: 14px 16px; border: 1px solid var(--d-border); border-radius: var(--d-radius-lg);
  background: var(--d-panel); color: var(--d-text); transition: none;
}
.is-dash .d-forms .form-card:hover { background: var(--d-hover); border-color: var(--d-border-strong); }
.is-dash .d-forms .form-card:active { background: var(--d-selected); }
.is-dash .d-forms .form-card:focus-visible { outline-offset: 2px; }
.is-dash .d-forms .form-card-text { gap: 2px; min-width: 0; }
.is-dash .d-forms .form-card-title { font: 600 14px/1.4 var(--d-sans); }
.is-dash .d-forms .form-card-about { color: var(--d-muted); font-size: 13px; line-height: 1.45; }
.is-dash .d-forms .form-card .icon { flex: none; align-self: center; color: var(--d-muted); }
.is-dash .d-forms .form-card:hover .icon { color: var(--d-text); }

/* Form pages: a left-aligned column capped at 880px (the hunt form's eight sections
   split into two columns from 1280px), short fields two to a row from 768px, flat
   dense sections and Save in a bar that sticks to the foot of the window. */
.is-dash .form-grid { display: grid; align-items: start; gap: 12px; min-width: 0; max-width: 880px; }
.is-dash .form-col { display: grid; align-content: start; gap: 12px; min-width: 0; }
@media (min-width: 1280px) {
  .is-dash .form-grid--split { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 1320px; }
  .is-dash .form-grid--split .form-actions { grid-column: 1 / -1; }
}
.is-dash .d-form .form-section { gap: 12px; padding: 16px; }
.is-dash .form-section-head { display: grid; gap: 2px; }
.is-dash .d-form .section-sub { margin: 0; color: var(--d-muted); font-size: 13px; }
.is-dash .form-body { display: grid; align-items: start; gap: 14px 16px; min-width: 0; }
.is-dash .form-body > [hidden] { display: none; }
@media (min-width: 768px) {
  .is-dash .form-body { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .is-dash .form-body > .is-wide { grid-column: 1 / -1; }
}
.is-dash .d-form .form-field { gap: 6px; }
.is-dash .d-form .field-help, .is-dash .d-form .field-note, .is-dash .d-form .field-status { margin: 0; }
.is-dash .d-form .field-note { font-style: normal; }
.is-dash .d-form .field-group-title { margin: 0; color: var(--d-text-2); font: 600 13px/1.4 var(--d-sans); }
.is-dash .d-form .field-sublabel { color: var(--d-muted); font-size: 12px; font-weight: 500; }
.is-dash .d-form .field-number { max-width: 160px; }
.is-dash .d-form .field-wide { width: fit-content; min-height: 32px; }
.is-dash .d-form .field-mini { min-height: 36px; padding: 0 12px; }
.is-dash .d-form .picker-button { gap: 8px; max-width: 360px; color: var(--d-text); font-size: 14px; }
.is-dash .d-form .picker-button > [aria-hidden] { color: var(--d-muted); }
.is-dash .d-form .date-field { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.is-dash .d-form .date-field .field-input { flex: 1 1 160px; width: auto; max-width: 220px; }
.is-dash .d-form .date-today { padding: 4px 0; font-size: 12px; }
.is-dash .d-form .date-today:disabled { color: var(--d-muted); }
.is-dash .d-form .choice span { min-height: 30px; padding: 4px 10px; font-size: 13px; }
.is-dash .d-form .hunters, .is-dash .d-form .dogs, .is-dash .d-form .harvest, .is-dash .d-form .seen { gap: 10px; }
.is-dash .d-form .chip-toggles { gap: 6px; }
/* Roster dogs grow with the club: about three rows show, the rest scroll. */
.is-dash .d-form .dogs > .chip-toggles { max-height: 108px; margin: -4px; padding: 4px; overflow-y: auto; overscroll-behavior: contain; }
.is-dash .d-form .dog-card { gap: 8px 12px; padding: 10px 12px; border: 1px solid var(--d-border); border-radius: var(--d-radius); background: transparent; box-shadow: none; }
.is-dash .d-form .dog-card-title { font-size: 13px; font-weight: 600; }
@media (min-width: 640px) {
  /* One row per dog: "Dog 1", name, retrieves, Remove. */
  .is-dash .d-form .dog-card { grid-template-columns: 48px minmax(0, 1fr) 112px auto; align-items: start; }
  .is-dash .d-form .dog-card-head { display: contents; }
  .is-dash .d-form .dog-card-title { margin-top: 24px; line-height: 36px; white-space: nowrap; }
  .is-dash .d-form .dog-card .text-button--danger { order: 1; min-height: 36px; margin-top: 24px; }
}
.is-dash .d-form .species-tiles { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 6px; }
.is-dash .d-form .species-tile { min-height: 34px; padding: 6px 10px; font-size: 13px; }
.is-dash .d-form .species-tile:active, .is-dash .d-form .picker-button:active { background-color: var(--d-selected); }
.is-dash .d-form .species-tile[aria-pressed="true"]:hover { background: #e4e4e7; border-color: #e4e4e7; }
.is-dash .d-form .species-tile[aria-pressed="true"]:active { background: #d4d4d8; border-color: #d4d4d8; }
.is-dash .d-form .count-rows, .is-dash .d-form .mix { gap: 6px; }
.is-dash .d-form .count-rows { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.is-dash .d-form .count-row {
  gap: 4px 10px; padding: 5px 6px 5px 10px; border: 1px solid var(--d-border); border-radius: var(--d-radius); background: transparent;
}
.is-dash .d-form .count-name { font-size: 13px; font-weight: 500; }
.is-dash .d-form .stepper { gap: 4px; }
.is-dash .d-form .stepper-button { width: 28px; height: 28px; border: 1px solid var(--d-border); color: var(--d-text); font: 500 16px/1 var(--d-sans); }
.is-dash .d-form .stepper-button:active { background: var(--d-selected); }
.is-dash .d-form .stepper-input { width: 44px; min-height: 28px; padding: 0 4px; text-align: center; font-variant-numeric: tabular-nums; }
.is-dash .d-form .stepper-suffix { color: var(--d-muted); font-size: 12px; }
.is-dash .d-form .count-total {
  align-items: center; padding: 10px 0 0; border-top: 1px solid var(--d-border); color: var(--d-text-2);
  font: 500 13px var(--d-sans); letter-spacing: normal;
}
.is-dash .d-form .count-total-value { color: var(--d-text); font: 600 20px/1 var(--d-sans); font-variant-numeric: tabular-nums; }
.is-dash .d-form .mix-total { margin: 2px 0 0; font-size: 13px; font-weight: 500; font-variant-numeric: tabular-nums; }
.is-dash .d-form .location { gap: 10px; }
.is-dash .d-form .location-pair, .is-dash .d-form .location-paste { max-width: 520px; }
.is-dash .d-form .location-pair { gap: 12px; }
.is-dash .d-form .location-links { gap: 4px 16px; }
.is-dash .d-form .location-links .text-button { text-decoration: underline; text-decoration-color: var(--d-border-strong); text-underline-offset: 3px; }
.is-dash .d-form .location-links .text-button:hover { text-decoration-color: currentColor; }
.is-dash .d-form .photos-field { gap: 8px; }
.is-dash .d-form .photos-field > :empty { display: none; }
.is-dash .d-form .photo-edit-grid { grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: 8px; }
.is-dash .d-form .photo-edit-image { border: 1px solid var(--d-border); border-radius: var(--d-radius); }
.is-dash .d-form .photo-remove {
  top: 4px; right: 4px; width: 26px; height: 26px; border: 1px solid var(--d-border-strong); border-radius: var(--d-radius);
  background: rgba(9, 9, 11, 0.8); color: var(--d-text); font-size: 15px;
}
.is-dash .d-form .photo-remove:hover { background: var(--d-hover); }
/* Save first on the left (clear of the feedback tab on the right edge), then any problem. */
.is-dash .d-form .form-actions {
  position: sticky; z-index: 5; bottom: 0; display: flex; flex-direction: row-reverse; flex-wrap: wrap-reverse; align-items: center;
  justify-content: flex-end; gap: 8px 12px; padding: 12px 0 16px; border-top: 1px solid var(--d-border); background: var(--d-bg);
}
.is-dash .d-form .form-actions .form-error { flex: 0 1 auto; margin: 0; }
.is-dash .d-form .form-submit { width: auto; min-height: 36px; padding: 0 16px; font-size: 13px; }

/* Picker sheets (hunters, species): a flat dialog whose list scrolls inside it. */
.is-dash .picker-sheet { width: min(440px, calc(100% - 24px)); max-height: min(78svh, 640px); gap: 12px; padding: 16px; }
.is-dash .picker-sheet .dialog-title { margin: 0; }
.is-dash .sheet-body { gap: 8px; margin: -4px; padding: 4px; overscroll-behavior: contain; }
.is-dash .check-list { gap: 1px; }
.is-dash .check-row {
  gap: 10px; min-height: 36px; padding: 6px 10px; border-radius: var(--d-radius); background: transparent;
  color: var(--d-text); font: 400 14px/1.35 var(--d-sans);
}
.is-dash .check-row[aria-pressed="true"] { background: var(--d-raised); }
.is-dash .check-row:hover { background: var(--d-hover); }
.is-dash .check-row:active { background: var(--d-selected); }
.is-dash .check-row[aria-pressed="true"] .check-mark { color: var(--d-text); }
.is-dash .check-mark { color: var(--d-muted); font-weight: 600; }
.is-dash .check-detail { color: var(--d-muted); font-size: 12px; }
.is-dash .sheet-done { min-height: 36px; }
