/* Category identity follows the approved homepage. */
.category-heading > .category-royal-icon {
    width: clamp(64px, 9vw, 112px); height: auto; aspect-ratio: 1;
    flex: 0 0 auto; display: grid; place-items: center;
    border: 1px solid #BDA493; border-radius: 50%;
    background: #0D0B0B; color: #BDA493;
}
.category-royal-icon svg { width: 48%; height: 48%; fill: none; stroke: currentColor; }
.category-page .store-tile-brand-only {
    padding: 0; gap: 0; position: relative; display: grid;
    grid-template-rows: minmax(0, 1fr) auto; align-items: stretch;
}
.category-page .store-tile-brand-only .tile-logo-only {
    position: relative; inset: auto; width: 100%; height: 100%; max-width: none;
    min-width: 0; min-height: 0; box-sizing: border-box;
    aspect-ratio: auto; padding: 4px; border: 0; border-radius: 0;
    box-shadow: none; background: #0D0B0B;
}
.category-page .tile-logo-only img {
    display: block; width: 100%; height: 100%; max-width: none;
    object-fit: contain; object-position: center;
}
.category-page .store-tile-brand-only .tile-company-name {
    position: static; width: 100%; max-width: none; min-width: 0;
    padding: 10px 12px; margin: 0; color: #fff;
    background: #0D0B0B;
    text-shadow: 0 1px 3px #000; text-align: center; box-sizing: border-box;
    display: block; line-height: 1.2; overflow-wrap: anywhere;
}
.category-page .store-tile-brand-only:focus-visible { outline: 3px solid #BDA493; outline-offset: 3px; }
.category-page .empty-crown, .category-page .carousel-empty > img { object-fit: contain; }
.category-page .carousel-controls[hidden] { display: none; }
@media (max-width: 820px) {
    .category-heading { gap: 14px; }
    .category-page .store-tile-brand-only .tile-company-name { padding: 8px; }
}

/* Size the image against a definite box, never its intrinsic grid dimensions.
   Higher specificity also overrides the legacy landscape/mobile logo widths. */
html body .category-page .store-tile.store-tile-brand-only {
    display: grid; grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto;
    padding: 0; gap: 0; align-items: stretch; justify-items: stretch;
}
html body .category-page .store-tile.store-tile-brand-only[hidden] { display: none !important; }
html body .category-page .store-tile.store-tile-brand-only .tile-logo-only {
    position: relative; width: 100%; height: 100%; min-height: 0;
    min-width: 0; max-width: none; max-height: none; padding: 0;
    aspect-ratio: auto; border: 0; border-radius: 0; overflow: hidden;
}
html body .category-page .store-tile.store-tile-brand-only .tile-logo-only img {
    position: absolute; inset: 0; display: block;
    width: 100% !important; height: 100% !important;
    max-width: 100%; max-height: 100%; padding: 0; margin: 0;
    object-fit: contain !important; object-position: center !important;
    transform: none; border-radius: 0;
}
html body .category-page .store-tile.store-tile-brand-only .tile-company-name {
    position: static; width: 100%; max-width: 100%; margin: 0;
    padding: 8px; text-align: center; background: #0D0B0B;
    box-sizing: border-box; line-height: 1.2;
}

/* Compact frames: constrain the outer card as well as the image. */
html body .category-page .showcase-slot:not(.rotating-showcase) {
    display: grid; place-items: center;
}
html body .category-page .showcase-slot > .store-tile,
html body .category-page .carousel-track .store-tile-carousel {
    width: min(100%, 220px); height: min(100%, 252px);
    max-width: 220px; max-height: 252px; justify-self: center; align-self: center;
    border-radius: 16px;
}
html body .category-page .store-tile-empty { padding: 12px 8px; text-align: center; box-sizing: border-box; }
html body .category-page .store-tile-empty .empty-crown { width: 48px; height: 40px; }
html body .category-page .store-tile-empty strong { font-size: 13px; }
html body .category-page .store-tile-empty small { font-size: 10px; }
html body .category-page .store-tile-empty .tile-action { padding: 10px; font-size: 9px; margin-top: 10px; }
@media(max-width:820px) {
    html body .category-page .carousel-track .store-tile-carousel { max-width: 190px; max-height: 220px; }
}

/* Every cell is occupied by a company or the existing sales invitation. */
html body .category-page .carousel-track .store-tile-carousel {
    width: 100%; height: 100%; max-width: none; max-height: none;
    justify-self: stretch; align-self: stretch;
}
html body .category-page .carousel-track .store-tile-carousel[hidden] { display: none !important; }

html body .category-page .carousel-track .store-tile.store-tile-brand-only {
    width: var(--vitrine-art-side, 180px); height: calc(var(--vitrine-art-side, 180px) + 40px);
    grid-template-rows: var(--vitrine-art-side, 180px) 40px;
    justify-self: center; align-self: center;
}
html body .category-page .store-tile.store-tile-brand-only .tile-company-name { display: grid; place-content: center; font-size: 13px; padding: 4px 8px; overflow: hidden; }

html body .category-page .showcase-slot > .store-tile.store-tile-brand-only {
    width: var(--fixed-art-side, 180px); height: calc(var(--fixed-art-side, 180px) + 40px);
    max-height: none; grid-template-rows: var(--fixed-art-side, 180px) 40px;
}

/* Premium upper slots follow the persisted editor geometry on both devices. */
html body .category-page .showcase-slot.slot-super > .store-tile,
html body .category-page .showcase-slot.slot-super > .store-tile.store-tile-brand-only {
    width: 100%; height: 100%; max-width: none; max-height: none;
    justify-self: stretch; align-self: stretch;
}
html body .category-page .showcase-slot.slot-super > .store-tile.store-tile-brand-only {
    grid-template-rows: minmax(0, 1fr) 40px;
}
html body .category-page .showcase-slot.slot-super .tile-logo-only {
    width: 100%; height: 100%; max-width: none; aspect-ratio: auto;
}
html body .category-page .showcase-slot.slot-super .store-tile-empty {
    padding: clamp(12px, 2vw, 28px);
}
html body .category-page .showcase-slot.slot-super .empty-crown {
    width: clamp(48px, 6vw, 100px); height: clamp(40px, 5vw, 82px);
}

html body .category-page .store-tile.store-tile-brand-only .tile-company-name { font-size:var(--card-name-size-desktop); color:var(--text-color); }
.category-heading > .category-royal-icon { color:var(--category-accent); border-color:var(--category-accent); }
@media(max-width:820px){html body .category-page .store-tile.store-tile-brand-only .tile-company-name { font-size:var(--card-name-size-mobile); }}

/* Public geometry and typography come from the same validated editor values. */
html[data-royal-theme][data-royal-kind=showcase] body {
    --royal-font:var(--body-font); --royal-serif:var(--title-font);
    --royal-paper:var(--text-color); --royal-muted:var(--muted-color);
    background:radial-gradient(ellipse at 95% 0%,color-mix(in srgb,var(--category-accent) 12%,transparent),transparent 40rem),var(--page-bg) !important;
    color:var(--text-color) !important;
}
html[data-royal-theme][data-royal-kind=showcase] body .category-page .category-heading h1 {
    font-size:var(--title-size-desktop) !important;
    font-family:var(--title-font) !important; color:var(--text-color) !important;
}
html[data-royal-theme][data-royal-kind=showcase] body .category-page .carousel-heading h2 {
    font-family:var(--title-font) !important; color:var(--text-color) !important;
}
html[data-royal-theme][data-royal-kind=showcase] body .category-page .company-panel {
    color:var(--button-color) !important;
}
html[data-royal-theme][data-royal-kind=showcase] body .category-page .brand img[src*='/assets/royal-system/logo.png'] {
    width:min(var(--logo-width-desktop),42vw) !important;
}
html body .category-page .showcase-slot > .store-tile,
html body .category-page .carousel-track .store-tile-carousel { border-radius:var(--tile-radius); }
html body .category-page .store-tile-brand-only .tile-logo-only,
html body .category-page .store-tile-brand-only .tile-company-name { background:var(--card-bg); }
html body .category-page .category-heading {
    background:radial-gradient(circle at 90% 20%,color-mix(in srgb,var(--category-accent) 16%,transparent),transparent 42%),var(--panel-bg);
}
@media(max-width:820px){
    html[data-royal-theme][data-royal-kind=showcase] body .category-page .category-heading h1 { font-size:var(--title-size-mobile) !important; }
    html[data-royal-theme][data-royal-kind=showcase] body .category-page .brand img[src*='/assets/royal-system/logo.png'] { width:min(var(--logo-width-mobile),62vw) !important; }
}
@media(max-width:560px){
    html[data-royal-theme][data-royal-kind=showcase] body .category-page .brand img[src*='/assets/royal-system/logo.png'] { width:min(var(--logo-width-mobile),88vw) !important; }
}

/* A populated frame occupies exactly the same cell as its empty invitation. */
html body .category-page .showcase-slot > .store-tile,
html body .category-page .showcase-slot > .store-tile.store-tile-brand-only,
html body .category-page .carousel-track .store-tile.store-tile-brand-only {
 width:100%;height:100%;max-width:none;max-height:none;
 justify-self:stretch;align-self:stretch;border-radius:var(--tile-radius);
}
html body .category-page .showcase-slot > .store-tile.store-tile-brand-only,
html body .category-page .carousel-track .store-tile.store-tile-brand-only {
 grid-template-rows:minmax(0,1fr) auto;
}
html body .category-page .store-tile.store-tile-brand-only .tile-company-name {
 min-height:40px;padding:6px 8px;
}
html body .category-page .showcase-grid {gap:min(var(--grid-gap-desktop),16px);}
html body .category-page .carousel-track.is-fill-grid {gap:min(var(--carousel-gap-desktop),12px);}
@media(max-width:820px){
 html body .category-page .showcase-grid {gap:min(var(--grid-gap-mobile),12px);}
 html body .category-page .carousel-track.is-fill-grid {gap:min(var(--carousel-gap-mobile),10px);}
}
