/* Support contact: shared header, cards and tokens from /billing/styles.css; only this page's layout lives here. */
.support-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 20px; align-items: start; }
.support-values { display: grid; gap: 12px; margin: 16px 0 0; }
.support-value { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 6px 12px; padding: 12px 14px; background: hsl(var(--muted)); border-radius: calc(var(--radius) / 2); }
.support-value dt { grid-column: 1 / -1; font-size: 12px; color: hsl(var(--muted-foreground)); }
.support-value dd { margin: 0; min-width: 0; }
.support-value input { font: 14px ui-monospace,SFMono-Regular,Menlo,monospace; }
.support-context { margin-top: 20px; padding-top: 16px; border-top: 1px solid hsl(var(--border)); }
.support-context .field { max-width: 320px; }
.support-preview { margin: 8px 0 0; padding: 12px 14px; border: 1px solid hsl(var(--border)); border-radius: calc(var(--radius) / 2); font: 13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.support-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 20px; }
.support-actions .button:focus-visible { outline: 2px solid hsl(var(--ring)); outline-offset: 3px; }
.support-guidance { padding-left: 18px; margin: 0; }
.support-guidance li + li { margin-top: 6px; }
@media(max-width:760px) { .support-grid { grid-template-columns: 1fr; gap: 0; } .support-actions .button { width: 100%; min-height: 44px; } .support-value { grid-template-columns: 1fr; } .support-value button { min-height: 44px; } }
