/**
 * Legacy Compatibility — shared frozen shell tokens
 * FROZEN: Home · Type · Search · Detail · Play · Header · Footer
 * Policy: docs/LAYOUT_DESIGN_SYSTEM.md
 *
 * Re-asserts pre-v2 spacing on mature pages so :root / new-track changes
 * cannot drift frozen layouts. Page-specific legacy files may add rules only.
 */
.tipsy-layout--home,
.tipsy-layout--listing,
.tipsy-layout--detail,
.tipsy-layout--player {
  --tipsy-viewport-max: none;
  --tipsy-container-max: 100%;
  --tipsy-gutter: var(--space-4);
  --tipsy-grid-cols: 2;
  --tipsy-grid-gap: var(--space-3);
  --tipsy-section-gap: var(--space-6);
  --tipsy-block-gap: var(--space-4);
  --tipsy-page-section-gap: var(--space-6);
  --tipsy-card-gap: var(--space-4);
  --tipsy-radius-card: var(--tipsy-radius-lg);
}

@media (min-width: 480px) {
  .tipsy-layout--home,
  .tipsy-layout--listing,
  .tipsy-layout--detail,
  .tipsy-layout--player {
    --tipsy-gutter: 16px;
    --tipsy-grid-gap: 16px;
  }
}

@media (min-width: 768px) {
  .tipsy-layout--home,
  .tipsy-layout--listing,
  .tipsy-layout--detail,
  .tipsy-layout--player {
    --tipsy-gutter: 24px;
    --tipsy-grid-cols: 3;
    --tipsy-grid-gap: 20px;
    --tipsy-section-gap: 48px;
    --tipsy-block-gap: 24px;
  }
}

@media (min-width: 1024px) {
  .tipsy-layout--home,
  .tipsy-layout--listing,
  .tipsy-layout--detail,
  .tipsy-layout--player {
    --tipsy-gutter: 32px;
    --tipsy-container-max: 1180px;
    --tipsy-grid-cols: 4;
    --tipsy-grid-gap: 24px;
    --tipsy-section-gap: 64px;
    --tipsy-block-gap: 32px;
  }
}

@media (min-width: 1280px) {
  .tipsy-layout--home,
  .tipsy-layout--listing,
  .tipsy-layout--detail,
  .tipsy-layout--player {
    --tipsy-container-max: 1320px;
  }
}

@media (min-width: 1440px) {
  .tipsy-layout--home,
  .tipsy-layout--listing,
  .tipsy-layout--detail,
  .tipsy-layout--player {
    --tipsy-container-max: 1440px;
  }
}

@media (min-width: 1600px) {
  .tipsy-layout--home,
  .tipsy-layout--listing,
  .tipsy-layout--detail,
  .tipsy-layout--player {
    --tipsy-container-max: 1400px;
  }
}

@media (min-width: 1920px) {
  .tipsy-layout--home,
  .tipsy-layout--listing,
  .tipsy-layout--detail,
  .tipsy-layout--player {
    --tipsy-viewport-max: 1560px;
    --tipsy-container-max: 1440px;
  }
}