/* First-party support and private feedback; no payment widget or tracking. */
.support-page {max-width: 1100px; margin: 0 auto; padding: 8px 0 28px;}
.marketing-body .support-page {padding: 48px 28px 72px;}
.support-intro {display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 30px;}
.support-intro > div {max-width: 650px;}
.support-eyebrow {font-size: 11px; color: #74628f; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase;}
.support-intro h1 {margin: 11px 0 12px; font: 800 clamp(31px, 3.4vw, 43px)/1.2 var(--display); letter-spacing: -1.5px;}
.support-intro p {margin: 0; color: #726a80; font-size: 16px; line-height: 1.7;}
.support-intro > .button {flex-shrink: 0;}
.support-layout {display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(270px, .9fr); align-items: start; gap: 24px;}
.support-layout > *, .support-sidebar {min-width: 0;}
.support-panel {padding: 28px; border: 1px solid #e8e3ed; border-radius: 22px; background: #fff;}
.support-panel h2, .support-history h2 {margin: 0 0 12px; font: 700 23px/1.3 var(--display); letter-spacing: -.6px;}
.support-panel > p {margin: 0 0 20px; color: #726a80; font-size: 15px; line-height: 1.7;}
.support-panel .support-form-intro {margin-bottom: 24px;}
.support-form {display: grid; gap: 20px; margin: 0;}
.support-form .field {font-size: 14px;}
.support-form .field small {font-size: 12px;}
.support-form .field input, .support-form .field select, .support-form .field textarea {font-size: 16px;}
.support-form .field textarea {min-height: 168px;}
.support-form-context {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px;}
.support-form p {margin: 0;}
.support-field-help {color: #71697b; font-size: 13px; line-height: 1.65;}
.support-form #support-message-help {margin-top: -11px;}
.support-privacy {padding: 14px 16px; border-radius: 12px; background: #f6f4fa; color: #6d647b; font-size: 13px; line-height: 1.7;}
.support-panel > .support-privacy {margin: 24px 0 0; font-size: 13px;}
.support-submit-row {display: flex; align-items: center; gap: 16px; flex-wrap: wrap;}
.support-submit-row span {flex: 1; min-width: 150px; color: #726a80; font-size: 12px; line-height: 1.6;}
.support-submit-row .button {flex-shrink: 0; min-height: 46px;}
.support-actions {display: flex; flex-wrap: wrap; gap: 10px;}
.support-sidebar {display: grid; gap: 22px;}
.support-donate {background: linear-gradient(145deg, #edf7f2, #fff 90%); border-color: #dfebe3;}
.support-coffee-icon {display: grid; width: 46px; height: 46px; place-items: center; margin-bottom: 22px; border-radius: 14px; background: #dfeee5; color: #537a62;}
.support-coffee-icon svg {width: 25px; height: 25px; stroke-width: 1.6;}
.support-donate .support-donate-button {width: 100%; background: #537a62; box-shadow: none; margin-bottom: 12px;}
.support-donate .support-donate-button:hover {background: #42634f;}
.support-donate > .support-field-help {font-size: 12px; color: #667a6e; margin-bottom: 22px;}
.support-donate > .support-donate-pending {padding: 13px 15px; background: #e8f2ec; border-radius: 12px; color: #4c6c59; font-size: 14px; font-weight: 600;}
.support-donate > .support-donate-fineprint {margin: 0; padding-top: 18px; border-top: 1px solid #dfe9e3; color: #67776d; font-size: 12px; line-height: 1.75;}
.support-side-note {padding: 2px 10px;}
.support-side-note h2 {margin: 0 0 10px; font: 700 17px/1.4 var(--display);}
.support-side-note p {margin: 0; color: #726a80; font-size: 13px; line-height: 1.8;}
.support-text-link {display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: 5px; color: #665197; font-size: 13px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px;}
.support-errors {padding: 17px 18px; margin-bottom: 23px; border: 1px solid #efcfca; border-radius: 12px; background: #fff5f3; color: #8f4c43; font-size: 14px; line-height: 1.65;}
.support-errors ul {padding-left: 20px; margin: 7px 0 0;}
.support-notice {padding: 16px 18px; border: 1px solid #e7dfed; border-radius: 12px; background: #f8f5fc; color: #716580; font-size: 14px; line-height: 1.7;}
.support-notice p {margin: 0;}
.support-history {margin-top: 40px;}
.support-history-header {display: flex; justify-content: space-between; align-items: end; flex-wrap: wrap; gap: 16px; margin-bottom: 20px;}
.support-history-header h2 {margin-bottom: 6px;}
.support-history-header p, .support-history-header > span {margin: 0; color: #726a80; font-size: 13px;}
.support-history-list {display: grid; gap: 12px;}
.support-history-item {min-width: 0; border: 1px solid #e8e3ed; border-radius: 16px; background: #fff;}
.support-history-item summary {display: flex; align-items: center; gap: 16px; padding: 20px 23px; list-style: none; cursor: pointer; border-radius: 16px;}
.support-history-item summary::-webkit-details-marker {display: none;}
.support-history-item summary:hover {background: #fcfaff;}
.support-history-summary {display: grid; gap: 6px; min-width: 0; flex: 1;}
.support-history-meta {color: #726a80; font-size: 12px; line-height: 1.6;}
.support-history-meta > span {padding-inline: 3px;}
.support-history-summary strong {font-size: 15px; font-weight: 600; line-height: 1.6; overflow-wrap: anywhere;}
.support-status {display: inline-flex; flex-shrink: 0; align-items: center; min-height: 29px; padding: 5px 10px; border-radius: 100px; background: #f0edf7; color: #6a5c87; font-size: 11px; font-weight: 700; line-height: 1.4;}
.support-status-planned {background: #f9eddd; color: #87643c;}
.support-status-resolved {background: #e8f3ec; color: #4d7259;}
.support-status-closed {background: #f0f0f3; color: #666574;}
.support-history-chevron {width: 18px; flex-shrink: 0; font-size: 22px; color: #887c9b; text-align: center;}
.support-history-item[open] .support-history-chevron {transform: rotate(180deg);}
.support-history-body {padding: 0 23px 22px; border-top: 1px solid #f0ecf5;}
.support-history-message {white-space: pre-wrap; overflow-wrap: anywhere; color: #655e72; font-size: 14px; line-height: 1.8; margin: 18px 0;}
.support-history-context {display: flex; flex-wrap: wrap; gap: 18px 32px; margin: 18px 0; font-size: 12px; line-height: 1.6;}
.support-history-context > div {min-width: 0; max-width: 100%;}
.support-history-context dt {color: #82768f; margin-bottom: 4px;}
.support-history-context dd {color: #655e72; margin: 0; overflow-wrap: anywhere;}
.support-reference {color: #82768f; font-size: 11px;}
.support-history-empty {padding: 28px; border: 1px dashed #ddd5e8; border-radius: 18px; color: #726a80; background: #fff; font-size: 14px; line-height: 1.7;}
.support-history-empty p {margin: 0;}
.support-pagination {display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 20px; color: #726a80; font-size: 13px;}
.support-pagination > .button {font-size: 12px;}

@media (max-width: 1000px) {
    .support-layout {grid-template-columns: minmax(0, 1.4fr) minmax(250px, .9fr); gap: 18px;}
    .support-panel {padding: 24px;}
    .support-form-context {grid-template-columns: 1fr; gap: 20px;}
}
@media (max-width: 780px) {
    .support-layout {grid-template-columns: 1fr; gap: 24px;}
    .support-intro {align-items: start; flex-direction: column; gap: 18px;}
    .support-sidebar {grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start;}
    .support-side-note {padding-top: 16px;}
}
@media (max-width: 560px) {
    .marketing-body .support-page {padding: 32px 20px 50px;}
    .support-intro {margin-bottom: 24px;}
    .support-intro h1 {letter-spacing: -1px;}
    .support-intro p {font-size: 15px;}
    .support-panel {padding: 22px;}
    .support-sidebar {grid-template-columns: 1fr; gap: 18px;}
    .support-side-note {padding: 4px 8px;}
    .support-submit-row {align-items: stretch; flex-direction: column; gap: 10px;}
    .support-submit-row span {text-align: center;}
    .support-history {margin-top: 32px;}
    .support-history-item summary {position: relative; flex-wrap: wrap; gap: 10px; padding: 18px; padding-right: 43px;}
    .support-history-summary {flex-basis: 100%;}
    .support-history-chevron {position: absolute; right: 17px; top: 24px;}
    .support-history-body {padding: 0 18px 19px;}
    .support-pagination {gap: 8px; font-size: 12px;}
    .support-pagination > .button {padding: 10px 11px;}
    .support-history-empty {padding: 22px;}
}