/* Main goals: scoped styles, one column on desktop and mobile. */
.main-goals-page { display: grid; gap: 22px; min-width: 0; }
.main-goals-page .panel { min-width: 0; }
.main-goals-intro { display: grid; grid-template-columns: 1fr auto; gap: 16px 24px; align-items: start; background: linear-gradient(125deg, #fffaf0, #ffffff); }
.main-goals-intro h2 { font-size: clamp(24px, 3vw, 34px); margin: 5px 0 8px; }
.main-goals-intro p { color: var(--muted); margin-bottom: 0; line-height: 1.6; }
.main-goals-year { font-size: 29px; font-weight: 800; color: #9b6b1d; background: #f9edcf; border-radius: 18px; padding: 12px 17px; }
.main-goals-toolbar { grid-column: 1 / -1; display: flex; gap: 12px; flex-wrap: wrap; }
.main-goals-page button { min-height: 44px; width: auto; justify-content: center; }
.main-goals-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.main-goals-stat { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 20px; background: #fffdf9; }
.main-goals-stat h3 { display: flex; gap: 8px; align-items: center; margin: 0 0 14px; font-size: 15px; }
.main-goals-stat-numbers { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.main-goals-stat-numbers strong { font-size: 23px; color: #7e5b21; }
.main-goals-stat-numbers span, .main-goals-stat p { color: var(--muted); font-size: 12px; }
.main-goals-stat p { margin: 8px 0 0; }
.main-goals-stat progress { display: block; width: 100%; height: 7px; margin-top: 14px; border: 0; border-radius: 999px; appearance: none; overflow: hidden; background: #efe6d5; }
.main-goals-stat progress::-webkit-progress-bar { background: #efe6d5; }
.main-goals-stat progress::-webkit-progress-value { background: #ba8a33; }
.main-goals-stat progress::-moz-progress-bar { background: #ba8a33; }
.main-goals-stat[data-goals-stat="future"] progress::-webkit-progress-value { background: #398579; }
.main-goals-stat[data-goals-stat="future"] progress::-moz-progress-bar { background: #398579; }
.main-goals-stat[data-goals-stat="archive"] progress::-webkit-progress-value { background: #8190a4; }
.main-goals-stat[data-goals-stat="archive"] progress::-moz-progress-bar { background: #8190a4; }
.main-goals-current-stack { display: grid; gap: 22px; }
.main-goal-current { overflow: hidden; padding: 0 !important; border: 1px solid #e9d6ac; background: #fffdf9; }
.main-goal-current > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 25px 28px 20px; background: linear-gradient(110deg, #fff5df, #fffdf9 78%); }
.main-goal-list-heading { display: flex; align-items: flex-start; gap: 14px; min-width: 0; }
.main-goal-list-heading > div { min-width: 0; }
.main-goal-list-heading h3 { margin: 0 0 7px; font-size: 21px; overflow-wrap: anywhere; }
.main-goal-list-heading p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.main-goal-list-icon { flex: 0 0 auto; font-size: 27px; }
.main-goal-count { flex: 0 0 auto; font-size: 14px; white-space: nowrap; font-weight: 700; padding: 8px 12px; border-radius: 999px; color: #7e5b21; background: #f5eacf; }
.main-goal-progress { display: block; width: 100%; height: 4px; border: 0; appearance: none; background: #efe6d5; }
.main-goal-progress::-webkit-progress-bar { background: #efe6d5; }
.main-goal-progress::-webkit-progress-value { background: #ba8a33; }
.main-goal-progress::-moz-progress-bar { background: #ba8a33; }
.main-goal-list-body { padding: 8px 28px 25px; }
.main-goal-items { display: grid; }
.main-goal-item { min-width: 0; padding: 20px 0; border-bottom: 1px solid var(--line); }
.main-goal-item-title { display: flex; align-items: flex-start; gap: 10px; }
.main-goal-item h4 { margin: 0; font-size: 17px; line-height: 1.55; overflow-wrap: anywhere; }
.main-goal-check { color: #b38b49; font-size: 20px; line-height: 1.3; flex: 0 0 auto; }
.main-goal-item.is-achieved .main-goal-check { color: #267449; font-weight: 800; }
.main-goal-item.is-cancelled .main-goal-item-title { color: var(--muted); }
.main-goal-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; color: var(--muted); margin: 8px 0 0 30px; }
.main-goal-achieved { color: #267449; font-weight: 700; }
.main-goal-note { font-size: 14px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; margin: 10px 0 0 30px; }
.main-goal-list-note { margin: 14px 0 4px; }
.main-goal-extras { display: flex; align-items: baseline; gap: 10px 22px; flex-wrap: wrap; margin: 10px 0 0 30px; font-size: 13px; }
.main-goal-extras a { color: #255fcf; text-decoration: underline; text-underline-offset: 3px; }
.main-goal-reward { display: flex; gap: 6px; margin: 0; color: #805a1b; min-width: 0; }
.main-goal-reward span { white-space: pre-wrap; overflow-wrap: anywhere; }
.main-goal-item-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 14px 0 0 30px; }
.main-goal-item-actions button { padding: 8px 12px; font-size: 12px; }
.main-goal-complete { border: 1px solid #b9d9c3; border-radius: 12px; background: #f0f8f2; color: #25623e; font-weight: 700; }
.main-goals-page .main-goal-delete { color: #a02c3c; border-color: #e7c4ca; }
.main-goal-list-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 14px 0 4px; }
.main-goal-list-toolbar button { border: 1px solid var(--line); font-size: 12px; padding: 8px 12px; }
.dashboard-goal-item .dashboard-goal-extras { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 8px; font-size: 12px; }
.dashboard-goal-item .dashboard-goal-extras a { color: #255fcf; text-decoration: underline; }
.dashboard-goal-item .dashboard-goal-extras span { color: #805a1b; white-space: pre-wrap; overflow-wrap: anywhere; }
.dashboard-pin-item .dashboard-goal-pin-reward { color: #805a1b; white-space: pre-wrap; overflow-wrap: anywhere; }
.main-goal-order { display: flex; gap: 4px; margin-left: auto; }
.main-goal-order button { width: 44px; }
.main-goal-empty, .main-goal-help { color: var(--muted); font-size: 14px; line-height: 1.7; margin: 16px 0; }
.main-goal-form { display: grid; gap: 14px; padding-top: 16px; }
.main-goal-form label { display: grid; gap: 7px; font-size: 13px; font-weight: 600; min-width: 0; }
.main-goal-form input, .main-goal-form textarea, .main-goal-form select { min-width: 0; font-size: 14px; font-weight: 400; }
.main-goal-form textarea { min-height: 76px; }
.main-goal-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; min-width: 0; }
.main-goal-form > button { justify-self: start; }
.main-goal-form-buttons { display: flex; flex-wrap: wrap; gap: 10px; }
.main-goal-form-error { margin: 0; color: #a02c3c; font-size: 13px; line-height: 1.6; }
.main-goal-form-error:empty { display: none; }
.main-goal-edit { margin-top: 16px; padding: 18px; border-radius: 16px; background: #f7f5ee; }
.main-goal-add { margin-top: 18px; }
.main-goal-add > summary, .main-goal-extra > summary, .main-goal-list-edit > summary { cursor: pointer; color: #255fcf; font-size: 13px; font-weight: 600; padding: 10px 0; }
.main-goal-extra .main-goal-fields { padding-top: 12px; }
.main-goal-subgroup { display: grid; gap: 12px; }
.main-goal-subgroup-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px 18px; flex-wrap: wrap; }
.main-goal-subgroup-heading h2 { font-size: 21px; margin: 4px 0; }
.main-goal-subgroup-heading h3 { font-size: 16px; margin: 6px 0 0; }
.main-goal-subgroup-heading > span { font-size: 12px; color: var(--muted); }
.main-goal-subgroup > h2 { font-size: 21px; margin: 4px 0; }
.main-goal-subgroup > h3 { font-size: 16px; margin: 6px 0 0; }
.main-goal-subgroup > .main-goal-help { margin: 0 0 2px; }
.main-goal-fold { border: 1px solid var(--line); border-radius: 18px; background: #fffdf9; overflow: hidden; }
.main-goal-fold > summary { display: flex; align-items: center; gap: 14px; padding: 18px 20px; cursor: pointer; list-style: none; }
.main-goal-fold .main-goal-list-heading { flex: 1; }
.main-goal-fold .main-goal-list-heading h3 { font-size: 16px; }
.main-goal-fold .main-goal-list-icon { font-size: 22px; }
.main-goal-fold .main-goal-count { font-size: 12px; }
.main-goal-fold .main-goal-list-body { padding-left: 20px; padding-right: 20px; }
.main-goal-fold.is-archive { background: #fafbfc; }
.main-goals-section { padding: 0 !important; overflow: hidden; background: #fffdf9; }
.main-goals-section > summary { display: flex; align-items: center; gap: 15px; padding: 22px 26px; cursor: pointer; font-size: 19px; font-weight: 700; list-style: none; }
.main-goal-section-count { margin-left: auto; font-size: 12px; color: var(--muted); font-weight: 500; }
.main-goal-chevron { color: var(--muted); flex: 0 0 auto; transition: transform .15s; }
.main-goals-section[open] > summary > .main-goal-chevron, .main-goal-fold[open] > summary > .main-goal-chevron { transform: rotate(180deg); }
.main-goals-section > summary::-webkit-details-marker, .main-goal-fold > summary::-webkit-details-marker { display: none; }
.main-goals-section-body { display: grid; gap: 26px; padding: 0 26px 26px; }
.main-goals-notice p { margin-bottom: 12px; line-height: 1.7; }
.main-goals-footnote { font-size: 12px; color: var(--muted); line-height: 1.7; margin: 0; }
.main-goals-page summary:focus-visible, .main-goals-page button:focus-visible, .main-goals-page a:focus-visible { outline: 3px solid #91b6f4; outline-offset: 4px; }
@media (max-width: 680px) {
  .main-goals-page { gap: 16px; }
  .main-goals-overview { grid-template-columns: 1fr; gap: 10px; }
  .main-goals-stat { padding: 16px 18px; }
  .main-goals-stat h3 { margin-bottom: 8px; }
  .main-goals-intro { padding: 20px; gap: 14px; }
  .main-goals-year { font-size: 22px; padding: 10px 12px; }
  .main-goal-current > header { padding: 20px 18px 17px; gap: 10px; align-items: flex-start; }
  .main-goal-list-heading { gap: 10px; }
  .main-goal-list-heading h3 { font-size: 18px; }
  .main-goal-list-heading p { font-size: 12px; }
  .main-goal-list-icon { font-size: 23px; }
  .main-goal-count { font-size: 12px; padding: 6px 9px; }
  .main-goal-list-body { padding: 6px 18px 20px; }
  .main-goal-item h4 { font-size: 16px; }
  .main-goal-note, .main-goal-meta, .main-goal-extras, .main-goal-item-actions { margin-left: 0; }
  .main-goal-fields { grid-template-columns: 1fr; }
  .main-goal-fold > summary { padding: 16px 14px; gap: 9px; }
  .main-goal-fold .main-goal-list-body { padding-left: 14px; padding-right: 14px; }
  .main-goal-fold .main-goal-list-heading { gap: 8px; }
  .main-goals-section > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; padding: 20px 18px; font-size: 17px; gap: 8px 10px; }
  .main-goals-section > summary > span:first-child { overflow-wrap: anywhere; }
  .main-goals-section > summary > .main-goal-chevron { grid-column: 2; grid-row: 1 / span 2; }
  .main-goals-section-body { padding: 0 16px 20px; }
  .main-goal-section-count { grid-column: 1; grid-row: 2; margin-left: 0; font-size: 11px; }
}