.commerce-layout { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(250px,.8fr); align-items: start; gap: 20px; }
.commerce-card, .commerce-summary { min-width: 0; padding: clamp(18px,3vw,30px); }
.commerce-card h2, .commerce-summary h2 { font-size: clamp(1.35rem,2vw,1.8rem); }
.commerce-summary { position: sticky; top: 20px; }
.commerce-summary p { overflow-wrap: anywhere; line-height: 1.6; }
.commerce-summary .section-kicker { margin-bottom: 14px; }
.commerce-total { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding-top: 14px; margin-top: 18px; border-top: 1px solid #dce5da; color: #263027; }
.commerce-total strong { font-family: "Space Grotesk",sans-serif; font-size: 1.2rem; }
.commerce-privacy { margin: 0; color: #667265; font-size: .78rem; line-height: 1.5; }
.commerce-buy-hero { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 18px; }
.commerce-buy-hero strong { color: #b8ef70; font: 600 1.3rem "Space Grotesk",sans-serif; }
.commerce-buy-hero > span { color: #d0d9cf; font-size: .83rem; }
.payment-methods { display: grid; gap: 10px; padding: 14px; border: 1px solid #dce5da; }
.payment-methods legend { padding-inline: 6px; font-weight: 700; }
.payment-choice { display: flex; align-items: flex-start; gap: 10px; padding: 12px; border: 1px solid #dce5da; background: #fafcf9; }
.payment-choice input { flex: 0 0 auto; margin-top: 3px; accent-color: #287b37; }
.payment-choice span { display: grid; gap: 4px; }
.payment-choice small { color: #5c695d; font-size: .78rem; font-weight: 400; line-height: 1.45; }
.order-items { display: grid; gap: 10px; margin-block: 18px; }
.order-items article { display: flex; min-width: 0; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; padding: 14px; border: 1px solid #dce5da; }
.order-items article > div { display: grid; min-width: 0; gap: 5px; }
.order-items small { color: #5c695d; }
.payment-qr { display: block; width: min(100%,320px); aspect-ratio: 1; margin: 12px auto; border: 1px solid #dce5da; background: #fff; object-fit: contain; }
.status-pending { display: inline-flex; padding: 8px 12px; background: #fff5d9; color: #755700; }
.payment-verification { display: grid; gap: 8px; padding: 14px 16px; border: 1px solid #c9dfcf; border-left: 3px solid #16834a; background: #f4faf5; color: #18221b; }
.payment-verification p { margin: 0; color: #526258; line-height: 1.55; }
.payment-verification .btn { justify-self: start; margin-top: 4px; }
.payment-bank-details { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin: 16px 0; }
.payment-bank-details > div { min-width: 0; padding: 12px; border: 1px solid #dce5da; background: #fafcfb; }
.payment-bank-details dt { color: #5c695d; font-size: .8rem; }
.payment-bank-details dd { margin: 4px 0 0; overflow-wrap: anywhere; }
[data-payment-account-fields][hidden] { display: none !important; }
.narrow-container { width: min(100% - 36px,620px); }
.commerce-card .flash { position: static; }
.account-activity-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.account-activity-actions form { margin: 0; }
.account-activity-section { margin-bottom: 16px; }
.account-activity-section > header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.account-activity-section > header h2 { margin: 3px 0 0; font-size: 1.25rem; }
.account-activity-section > header p { margin: 0; color: #5c695d; font-size: .82rem; }
.account-order-table { min-width: 760px !important; }
.account-activity-row-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.account-tracking-list { display: grid; gap: 10px; }
.account-tracking-card { min-width: 0; padding: 14px; border: 1px solid #dce5da; background: #fff; }
.account-tracking-card > header,
.account-tracking-card > footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; }
.account-tracking-card h3 { margin: 0 0 4px; font-size: 1rem; }
.account-tracking-card header small { color: #5c695d; }
.account-tracking-card dl { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 13px 0; }
.account-tracking-card dl > div { min-width: 0; padding: 9px 10px; background: #f6f9f7; }
.account-tracking-card dt { color: #5c695d; font-size: .75rem; }
.account-tracking-card dd { margin: 3px 0 0; color: #18221b; font-size: .85rem; overflow-wrap: anywhere; }
.account-tracking-card > footer { padding-top: 10px; border-top: 1px solid #e6ede8; color: #5c695d; font-size: .78rem; }
.account-admin-note { padding: 8px 10px; border-left: 2px solid #16834a; background: #f4faf5; font-size: .82rem; overflow-wrap: anywhere; }
.account-activity-empty { padding: 12px; border: 1px dashed #cbd7ce; color: #5c695d; }
.account-access-history { margin-top: 14px; border-top: 1px solid #dce5de; padding-top: 12px; }
.account-access-history summary { cursor: pointer; font-weight: 700; }
.account-access-history .account-tracking-list { margin-top: 12px; }
.account-chat-context { padding: 10px 12px; border-left: 3px solid #16834a; background: #f4faf5; }
@media (max-width: 760px) {
  .commerce-layout { grid-template-columns: minmax(0,1fr); }
  .commerce-summary { position: static; order: -1; }
  .commerce-card, .commerce-summary { padding: 18px; }
  .payment-bank-details { grid-template-columns: minmax(0,1fr); }
  .account-activity-actions { width: 100%; }
  .account-activity-actions .btn { flex: 1 1 auto; justify-content: center; }
  .account-tracking-card dl { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
