/* Pop Quest UI layer: shared design tokens. */
:root{
  --pq-ui-feed-width: 1000px;
  --pq-ui-content-width: 960px;
  --pq-ui-page-gutter: clamp(16px, 4vw, 32px);
  --pq-ui-card-gap: clamp(16px, 2.4vw, 26px);
  --pq-ui-media-width: minmax(260px, 38%);
  --pq-ui-tap-target: 44px;
  --pq-ui-action-size: 44px;
  --pq-ui-icon-size: 20px;

  --pq-ui-ink: #111318;
  --pq-ui-muted: #6b7280;
  --pq-ui-faint: #9ca3af;
  --pq-ui-surface: #ffffff;
  --pq-ui-soft: #f7f8fb;
  --pq-ui-line: rgba(17, 19, 24, .09);
  --pq-ui-line-strong: rgba(17, 19, 24, .14);
  --pq-ui-shadow: 0 14px 38px rgba(17, 19, 24, .07);
  --pq-ui-shadow-soft: 0 8px 24px rgba(17, 19, 24, .045);
  --pq-ui-focus: 0 0 0 4px rgba(139, 63, 244, .14);
  --pq-ui-radius: 26px;
  --pq-ui-radius-sm: 18px;

  --pq-ui-display: clamp(38px, 5vw, 64px);
  --pq-ui-headline: clamp(24px, 3vw, 38px);
  --pq-ui-body: 16px;
  --pq-ui-meta: 13px;
  --pq-ui-caption: 12px;

  --pq-ui-purple: #8b3ff4;
  --pq-ui-purple-soft: rgba(139, 63, 244, .10);
  --pq-ui-upvote: #22c55e;
  --pq-ui-upvote-soft: rgba(34, 197, 94, .12);
  --pq-ui-downvote: #ef4444;
  --pq-ui-downvote-soft: rgba(239, 68, 68, .11);
}