/* Layout and interaction refinements for the existing Beam theme. */
.run-links-detail { min-width: 0; overflow-wrap: anywhere; }
:root { --form-summary-top: 1rem; }
[hidden] { display: none !important; }
.btn, .btn-ghost, .btn-gold, .btn-danger { min-height: 42px; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid #34d399; outline-offset: 4px; }
.site-nav-group + .site-nav-group { margin-top: 1.15rem; }
.site-nav-heading { padding: 0 .75rem; margin-bottom: .4rem; color: #89aa99; font-size: .6875rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.site-nav-link { min-height: 40px; }
.site-mobile-bar { display: none; }
.site-mobile-drawer { margin: 0 0 0 auto; width: min(350px, 92vw); max-width: 100%; max-height: 100dvh; height: 100dvh; padding: 1.25rem; border: 0; border-left: 1px solid #2b4b39; background: #061a11; color: #e7f5ee; box-shadow: -16px 0 50px #0007; }
.site-mobile-drawer::backdrop { background: #0009; backdrop-filter: blur(5px); }
.site-mobile-drawer-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; }
.site-mobile-drawer-heading h2 { font-weight: 600; font-size: 1.1rem; }
.site-mobile-drawer .site-nav-link { min-height: 44px; }
.site-mobile-drawer .site-nav-link > .absolute { display: none; }
.site-mobile-account { border-top: 1px solid #254432; padding-top: 1rem; margin-top: 1.25rem; }
.site-mobile-account .site-nav-link { display: flex; align-items: center; gap: .6rem; padding: .55rem .75rem; font-size: .875rem; width: 100%; }
.site-navigation-fallback { font-size: .875rem; }
.site-navigation-fallback nav { padding: 1rem; background: #061a11; }
.dashboard-balance-heading { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem 1rem; flex-wrap: wrap; margin-bottom: .75rem; }
.dashboard-balance-heading h2 { font-size: 1rem; font-weight: 600; }
.dashboard-balance-heading > span { color: #89aa99; font-size: .75rem; }
.dashboard-balances { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stat-tile { min-width: 0; }
.stat-tile .gold-num { overflow-wrap: anywhere; }
.stat-tile-link { display: block; transition: border-color .15s, background-color .15s; }
.stat-tile-link:hover { border-color: #10b98180; background-color: #0d2d20a8; }
.stat-tile-hint { display: flex; align-items: center; justify-content: space-between; gap: .5rem; line-height: 1.5; }
.stat-tile-hint svg { flex-shrink: 0; }
.boost-run-card { display: flex; flex-direction: column; min-width: 0; padding: 1.25rem; }
.boost-card-top { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .4rem .75rem; margin-bottom: .65rem; }
.boost-card-top > span:last-child { color: #89aa99; font-size: .75rem; }
.boost-card-title { margin: 0 0 .6rem; font-size: 1.0625rem; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.boost-card-meta { display: flex; flex-wrap: wrap; gap: .25rem .85rem; color: #9cbeac; font-size: .75rem; line-height: 1.6; overflow-wrap: anywhere; }
.boost-card-meta strong { color: #c5dece; font-weight: 500; }
.boost-card-secondary { color: #89aa99; margin-top: .25rem; margin-bottom: .3rem; }
.boost-card-payment { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .8rem; margin-top: auto; padding-top: 1rem; align-items: flex-end; }
.boost-card-caption { display: block; margin-bottom: .35rem; color: #89aa99; font-size: .6875rem; }
.boost-card-amount { font-size: 1.0625rem; }
.boost-card-amount .gold-num { overflow-wrap: anywhere; }
.boost-card-status { text-align: right; }
.boost-card-status p { font-size: .6875rem; line-height: 1.5; max-width: 230px; }
.boost-card-own { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; border-top: 1px solid #254633; margin-top: .9rem; padding-top: .75rem; color: #a5c4b3; font-size: .75rem; }
.boost-card-own-state { margin-left: auto; font-size: .6875rem; }
.payment-control { display: inline-flex; align-items: center; justify-content: flex-end; vertical-align: middle; }
.payment-state { white-space: nowrap; font-size: .75rem; }
.payment-toggle { cursor: pointer; transition: filter .15s; }
.payment-toggle:hover { filter: brightness(1.15); }
.payment-toggle:disabled { opacity: .65; cursor: wait; }
/* Every run keeps the same information row and payment row, regardless of title length. */
.my-run-card { min-width: 0; padding: 1rem; }
.my-run-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(140px, 230px); align-items: center; gap: 1rem; }
.my-run-info { min-width: 0; }
.my-run-title { display: block; overflow-wrap: anywhere; line-height: 1.5; }
.my-run-meta { display: flex; flex-wrap: wrap; gap: .25rem 1rem; margin-top: .3rem; color: #89aa99; font-size: .75rem; }
.my-run-meta > span { min-width: 0; overflow-wrap: anywhere; }
.my-run-progress { min-width: 0; text-align: right; }
.my-run-progress p { margin-top: 0; line-height: 1.6; }
.my-run-progress p + p { margin-top: .35rem; }
.my-run-payments { display: grid; grid-template-columns: 130px 130px minmax(0, 1fr); align-items: end; gap: 1rem 1.5rem; margin-top: .85rem; padding-top: .85rem; border-top: 1px solid #254633; }
.my-run-payment { min-width: 0; }
.my-run-payment-label { margin-bottom: .4rem; font-size: .625rem; text-transform: uppercase; letter-spacing: .06em; color: #89aa99; }
.my-run-payment .payment-control { justify-content: flex-start; }
.my-run-manage { justify-self: end; min-height: 34px; text-align: right; }
.my-run-participant { display: grid; grid-template-columns: minmax(0, 1fr) auto 90px; align-items: center; gap: .75rem; }
.my-run-participant-name, .my-run-participant-cut { min-width: 0; overflow-wrap: anywhere; }
.my-run-participant-cut { text-align: right; }
@media (max-width: 1100px) {
  .my-run-payments { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 1rem; }
}
@media (max-width: 600px) {
  .my-run-heading { grid-template-columns: minmax(0, 1fr); gap: .6rem; }
  .my-run-progress { text-align: left; }
  .my-run-payments { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .my-run-manage { grid-column: 1 / -1; justify-self: stretch; text-align: center; min-height: 40px; border: 1px solid #345d46; border-radius: 9px; }
  .my-run-participant { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .my-run-participant .payment-control { grid-column: 1 / -1; }
}
.run-filter-form { padding: 1.25rem; }
.run-filter-label { display: block; font-size: .75rem; color: #9cbeac; }
.run-filter-label > .input, .run-filter-label > .relative { margin-top: .4rem; }
.run-filter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem; }
.run-filter-actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: flex-end; }
.run-filter-actions > label { flex: 1; min-width: 140px; max-width: 220px; }
.run-filter-hint { color: #89aa99; font-size: .75rem; margin: .5rem 0 0; }
.run-active-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: .85rem 0 1.25rem; font-size: .75rem; color: #9cbeac; }
.run-filter-chip { display: inline-flex; align-items: center; gap: .5rem; border: 1px solid #28503c; border-radius: 8px; padding: .35rem .6rem; color: #b0dcc3; background: #0c291c; max-width: 100%; overflow-wrap: anywhere; }
.run-filter-chip:hover { border-color: #10b981; }
.run-filter-chip svg { width: 12px; height: 12px; flex-shrink: 0; }
.report-overview { margin-top: 2.5rem; }
.report-currency-name, .report-currency-payments, .report-scale-note, .report-note, .report-chart-footer { font-size: .75rem; }
@media (min-width: 1380px) { .dashboard-balances { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .run-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) {
  .site-mobile-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: .75rem 1rem; gap: .5rem; border-bottom: 1px solid #254633; background: #061a11bd; backdrop-filter: blur(16px); }
  .site-mobile-brand { display: inline-flex; align-items: center; gap: .5rem; font-size: .9375rem; font-weight: 600; }
  .site-mobile-brand > svg { color: #34d399; }
  .site-mobile-bar .btn-ghost { min-height: 40px; padding: .45rem .7rem; font-size: .8125rem; }
  .site-mobile-bar noscript { width: 100%; }
  .boost-card-status { margin-left: auto; }
}
@media (max-width: 480px) {
  .dashboard-balances { grid-template-columns: minmax(0, 1fr); }
  .stat-tile { padding: 1rem 1.1rem; }
  .stat-tile .text-2xl { font-size: 1.35rem; line-height: 1.5; }
  .boost-run-card { padding: 1rem; }
  .boost-card-status { max-width: 100%; }
  .run-filter-form { padding: 1rem; }
  .run-filter-grid { gap: .7rem; }
  .run-filter-actions > label { min-width: 0; max-width: none; flex-basis: calc(50% - .75rem); }
  .run-filter-actions > button { flex: 1; }
}
@media (pointer: coarse) { .input { min-height: 44px; font-size: 16px; } .payment-toggle, .btn, .btn-gold, .btn-ghost, .btn-danger { min-height: 44px; } }
@media (prefers-reduced-motion: reduce) { .stat-tile-link, .payment-toggle { transition: none; } }
