/* Shared container charter, derived from Puzzle's menuCorners.ts.
   Only cards/panels belong here: controls, device frames and printed artwork
   keep their own geometry. CSS-only: no observers, masks or resize work. */
:root {
  --card-corner: 48px;
  --card-shadow: 0 3px 0 rgba(36, 23, 57, .10), 0 2px 4px rgba(36, 23, 57, .045);
}
:root[data-theme="dark"] {
  --card-shadow: 0 3px 0 rgba(0, 0, 0, .20), 0 2px 4px rgba(0, 0, 0, .12);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --card-shadow: 0 3px 0 rgba(0, 0, 0, .20), 0 2px 4px rgba(0, 0, 0, .12);
  }
}

/* Equal specificity keeps the three profiles stable across themes and locales.
   Large/small ratio .22 and the soft profile .65/.3 follow the app. */
:is(.brand-home-tile, .brand-home-panel, .books-card, .books-home-card,
    .worksheet-card, .worksheet-detail__preview, .coloriage-card, .silhouette-card,
    .decoupage-card, .decoupage-resource, .decoupage-detail-preview,
    .puzzle-game-card, .puzzle-age-grid article, .puzzle-parent,
    .decouvertes-page .universe-card, .decouvertes-page .preview-card,
    .decouvertes-page .feature-card, .decouvertes-page .game-type, .decouvertes-page .trust-strip__item,
    .decouvertes-page .hero__stat, .decouvertes-page .safety__layout,
    .decouvertes-page .safety__notebook, .decouvertes-page .safety__list li,
    .legal-page .highlight-box, .puzzle-legal-status, .analytics-choice) {
  --card-tl: var(--card-corner);
  --card-tr: calc(var(--card-corner) * .22);
  --card-br: var(--card-corner);
  --card-bl: calc(var(--card-corner) * .22);
  --card-radii: var(--card-tl) var(--card-tr) var(--card-br) var(--card-bl);
  border-radius: var(--card-radii);
  corner-shape: squircle;
  box-shadow: var(--card-shadow);
}

:is(.brand-home-tile, .brand-home-panel, .books-card, .books-home-card,
    .worksheet-card, .coloriage-card, .silhouette-card, .decoupage-card,
    .decoupage-resource, .puzzle-game-card, .puzzle-age-grid article,
    .decouvertes-page .universe-card, .decouvertes-page .preview-card,
    .decouvertes-page .feature-card, .decouvertes-page .game-type, .decouvertes-page .trust-strip__item,
    .decouvertes-page .hero__stat, .decouvertes-page .safety__list li):nth-child(3n + 2) {
  --card-tl: calc(var(--card-corner) * .22);
  --card-tr: var(--card-corner);
  --card-br: calc(var(--card-corner) * .22);
  --card-bl: var(--card-corner);
}
:is(.brand-home-tile, .brand-home-panel, .books-card, .books-home-card,
    .worksheet-card, .coloriage-card, .silhouette-card, .decoupage-card,
    .decoupage-resource, .puzzle-game-card, .puzzle-age-grid article,
    .decouvertes-page .universe-card, .decouvertes-page .preview-card,
    .decouvertes-page .feature-card, .decouvertes-page .game-type, .decouvertes-page .trust-strip__item,
    .decouvertes-page .hero__stat, .decouvertes-page .safety__list li):nth-child(3n) {
  --card-tl: var(--card-corner);
  --card-tr: calc(var(--card-corner) * .65);
  --card-br: calc(var(--card-corner) * .3);
  --card-bl: calc(var(--card-corner) * .65);
}

/* Compact notices and stats must not lose their text to large corners. */
:is(.decouvertes-page .trust-strip__item, .decouvertes-page .hero__stat,
    .decouvertes-page .safety__list li, .legal-page .highlight-box,
    .puzzle-legal-status) { --card-corner: 24px; }
.brand-home-panel { --card-corner: 40px; }
.decouvertes-page .safety__notebook { --card-corner: 36px; }

/* Artwork touching a card's top edge follows the same two upper corners.
   A book cover/PDF preview is a real rectangular document, never cropped. */
.puzzle-game-card { overflow: hidden; background: var(--surface); padding-bottom: 14px; }
.puzzle-game-card > img {
  border-radius: var(--card-tl) var(--card-tr) 0 0;
  corner-shape: squircle;
}
.puzzle-game-card :is(h3, p, .puzzle-card-gesture) { padding-inline: 12px; }
.puzzle-game-card:hover img { transform: none; }
.decouvertes-page .universe-card__bg,
.decouvertes-page .preview-card__img,
.brand-home-resource-card__visual {
  border-radius: var(--card-tl) var(--card-tr) 0 0;
  corner-shape: squircle;
}
.books-card, .books-home-card {
  padding: 12px;
  background: var(--surface, var(--books-surface, var(--bg-warm)));
}
.books-card .books-cover, .books-home-card .books-cover { border-radius: 0; }

@media (max-width: 640px) {
  :root { --card-corner: 36px; }
  .brand-home-panel { --card-corner: 32px; }
  .brand-home-grid--resources .brand-home-tile { --card-corner: 24px; }
}