/* Cinematic details share the homepage palette; the active broadcast retains its own UI. */
.catalog-details { padding-top:12px; }
.details-breadcrumb { display:flex; align-items:center; gap:12px; min-height:44px; margin-bottom:12px; font-size:.8rem; color:var(--home-muted); }
.details-breadcrumb a { display:inline-flex; align-items:center; min-height:44px; }
.details-hero { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:48px; align-items:center; padding:40px 44px; border-radius:12px 12px 0 0; background:#0b2446; color:#fff; }
.details-hero-copy { min-width:0; }
.details-hero .home-eyebrow { color:#c8d9f0; }
.home .details-hero h1 { font-family:'Libre Caslon Display',Georgia,serif; font-weight:400; font-size:clamp(2.6rem,4.6vw,4.4rem); color:#ffc88b; letter-spacing:-.025em; line-height:1.06; overflow-wrap:anywhere; }
.details-channel { display:inline-flex; gap:12px; align-items:center; min-height:44px; margin-top:10px; font-size:.85rem; }
#main-content .home .details-hero a { color:#e2ecff; }
#main-content .home .details-hero a:hover { color:#fff; text-decoration:underline; }
.details-hero a:focus-visible { outline-color:#ffc88b; }
.home .details-description { max-width:610px; color:#d3e0f2; font-size:.95rem; line-height:1.75; margin:8px 0 16px; }
.details-cover { width:100%; height:auto; aspect-ratio:1; object-fit:cover; border-radius:8px; box-shadow:0 18px 40px #0004; }
.details-tags { display:flex; flex-wrap:wrap; gap:4px 8px; }
.details-tags a { display:inline-flex; align-items:center; min-height:36px; border:1px solid #ffffff38; padding:6px 11px; border-radius:5px; font-size:.72rem; }
.catalog-details .solo-app { border:1px solid var(--home-line); border-top:0; border-radius:0 0 12px 12px; scroll-margin-top:12px; }
.catalog-details .solo-app:has(#solo-setup:not([hidden])) { display:flex; flex-direction:column; color:var(--home-ink); background:#fff; font-family:inherit; }
.catalog-details .solo-app:has(#solo-setup:not([hidden])) .solo-toolbar { order:2; margin:0; padding:12px 28px; background:#f3f6fc; border-top:1px solid var(--home-line); justify-content:flex-start; gap:24px; }
.catalog-details .solo-app:has(#solo-setup:not([hidden])) #solo-settings { order:3; background:#f3f6fc; color:var(--home-ink); border-color:var(--home-line); margin:0; padding:18px 28px; }
.catalog-details .solo-app:has(#solo-setup:not([hidden])) .solo-app__workspace { height:auto; }
.catalog-details .solo-app:has(#solo-setup:not([hidden])) .solo-app__interaction { position:static; max-height:none; padding:28px; background:#fff; }
.catalog-details #solo-setup { display:grid; grid-template-columns:minmax(0,1fr) 180px; align-items:center; gap:32px; width:100%; }
.home .details-launch-copy h2 { font-size:calc(1.6rem * var(--player-text-scale, 1)); margin-bottom:14px; }
.home .details-launch-metadata { display:flex; flex-wrap:wrap; gap:8px 18px; font-size:calc(.85rem * var(--player-text-scale, 1)); margin-bottom:8px; }
.details-launch-actions { display:grid; gap:8px; }
.catalog-details #solo-setup button { justify-content:center; background:#fff; color:var(--home-accent); border:1px solid var(--home-line); border-radius:6px; font-size:calc(.88rem * var(--player-text-scale, 1)); }
.catalog-details #solo-setup .solo-app__primary { background:var(--home-accent); color:#fff; border-color:var(--home-accent); }
.catalog-details #solo-setup .solo-app__primary:hover { background:#214d9b; }
.catalog-details #solo-setup button:not(.solo-app__primary):hover { background:#edf2fc; }
.catalog-details .solo-app:has(#solo-setup:not([hidden])) .solo-toolbar button { border:0; min-height:44px; padding:8px 0; color:var(--home-accent); background:transparent; border-radius:4px; font-size:calc(.8rem * var(--player-text-scale, 1)); }
.catalog-details .solo-app:has(#solo-setup:not([hidden])) .solo-toolbar a { font-size:calc(.8rem * var(--player-text-scale, 1)); }
.catalog-details .solo-app:has(#solo-setup:not([hidden])) #solo-settings select { background:#fff; color:var(--home-ink); }
.catalog-details .solo-app:has(#solo-setup:not([hidden])) .solo-app__setup-error { grid-column:1/-1; background:#fff0f3; color:#7d1831; }
/* Free up the viewport for gameplay when setup closes. */
.catalog-details:has(#solo-setup[hidden]) .details-hero,.catalog-details:has(#solo-setup[hidden]) .details-breadcrumb { display:none; }
.catalog-details:has(#solo-setup[hidden]) .solo-app { border-radius:12px; border-top:1px solid var(--home-line); }
#main-content .catalog-details .solo-app:not(:has(#solo-setup:not([hidden]))) a { color:#a8d7ff; }
.catalog-details .solo-app:not(:has(#solo-setup:not([hidden]))) p { margin-bottom:.75rem; }
.details-columns { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr); gap:24px; margin-top:32px; align-items:start; }
.details-main-column,.details-side-column { display:grid; gap:24px; min-width:0; }
.details-panel { background:#fff; border:1px solid var(--home-line); border-radius:10px; padding:28px; }
.home .details-panel h2 { font-size:1.35rem; margin-bottom:12px; }
.home .details-panel p { font-size:.85rem; line-height:1.7; color:var(--home-muted); }
.home .details-note { font-size:.75rem; line-height:1.65; color:var(--home-muted); }
.details-note a { text-decoration:underline; text-underline-offset:3px; }
.details-samples { padding-left:24px; margin:20px 0; }
.details-samples li { padding:14px 0 14px 10px; font-size:1rem; line-height:1.65; border-bottom:1px solid #e8edf5; }
.details-samples li::marker { color:var(--home-accent); font-size:.8rem; font-weight:700; }
.details-samples li:last-child { border-bottom:0; }
.details-rounds { list-style:none; margin:20px 0 8px; padding:0; display:grid; gap:20px; }
.details-rounds li { display:flex; align-items:flex-start; gap:16px; font-size:.86rem; }
.details-rounds li>span { color:var(--home-accent); font-size:.75rem; padding-top:3px; }
.details-more { margin-top:16px; border-top:1px solid var(--home-line); }
.details-more summary { min-height:48px; padding:16px 0 8px; cursor:pointer; color:var(--home-accent); font-size:.82rem; font-weight:600; }
.home .details-rules-copy p { margin:12px 0; }
.details-section-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.details-count { background:#edf2fc; color:var(--home-accent); font-size:.7rem; padding:6px 10px; border-radius:4px; }
.details-show-list { margin:12px 0 0; padding-left:30px; }
.details-show-list li { padding-left:10px; border-bottom:1px solid #e8edf5; }
.details-show-list li::marker { font-size:.8rem; color:var(--home-muted); }
.details-show-list a { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:60px; font-size:.9rem; }
.details-show-list a>span { color:var(--home-accent); }
.details-video { display:block; width:100%; aspect-ratio:16/9; border:0; margin-top:16px; }
.details-share-actions { display:flex; gap:8px; flex-wrap:wrap; margin:16px 0 12px; }
.details-share-actions button { min-height:44px; background:#eef3ff; color:var(--home-accent); border:1px solid var(--home-line); border-radius:6px; padding:8px 14px; font-family:inherit; font-size:.8rem; font-weight:600; }
.details-share-actions button:hover { background:#dfe9fc; }
.details-social { display:flex; flex-wrap:wrap; gap:8px; }
.details-social a { display:grid; place-items:center; width:44px; min-height:44px; border:1px solid var(--home-line); border-radius:50%; }
.details-contribute { display:grid; margin-top:10px; }
.details-contribute a { display:flex; justify-content:space-between; align-items:center; min-height:44px; font-size:.85rem; }
#details-copy-fallback label { font-size:.8rem; margin-top:12px; }
#details-copy-text { width:100%; background:#fff; color:var(--home-ink); border:1px solid var(--home-line); padding:10px; font-size:.8rem; }
.details-related { margin:44px 0 16px; }
.details-empty { padding-block:64px; }
.details-empty p { margin:18px 0; }
#main-content .details-empty .home-button { color:#fff; }
@media(max-width:1000px) {
 .details-hero { grid-template-columns:minmax(0,1fr) 240px; gap:28px; padding:32px; }
 .details-columns { gap:18px; grid-template-columns:minmax(0,1.4fr) minmax(270px,1fr); }
 .details-panel { padding:22px; }
}
@media(max-width:767px) {
 .details-hero { grid-template-columns:minmax(0,1fr) 100px; align-items:start; padding:22px; gap:14px; }
 .details-cover { grid-column:2; grid-row:1; }
 .details-hero-copy { display:contents; }
 .details-hero-copy .home-eyebrow { grid-column:1; grid-row:1; align-self:start; padding-right:4px; line-height:1.6; }
 .home .details-hero h1 { grid-column:1/-1; font-size:2.8rem; }
 .details-channel { grid-column:1/-1; margin:0; }
 .home .details-description { grid-column:1/-1; margin:0; }
 .details-tags { grid-column:1/-1; }
 .catalog-details #solo-setup { grid-template-columns:1fr; gap:20px; }
 .catalog-details .solo-app:has(#solo-setup:not([hidden])) .solo-app__interaction { padding:24px; }
 .details-launch-actions { grid-template-columns:1fr 1fr; }
 .catalog-details .solo-app:has(#solo-setup:not([hidden])) .solo-toolbar { padding:8px 24px; gap:12px 24px; flex-wrap:wrap; }
 .details-columns { grid-template-columns:1fr; margin-top:24px; }
 .details-main-column,.details-side-column { gap:18px; }
 .details-related { margin-top:32px; }
}

.catalog-details #solo-setup .details-note { font-size:calc(.75rem * var(--player-text-scale, 1)); }
.catalog-details .solo-app:is([data-text-scale="150"],[data-text-scale="200"]) #solo-setup { grid-template-columns:1fr; }
.catalog-details .solo-app:is([data-text-scale="150"],[data-text-scale="200"]) .details-launch-actions { grid-template-columns:1fr; }
/* Undo the legacy solo-page article treatment on homepage-style related cards. */
#main-content .catalog-details .home-card { background:transparent; color:var(--home-ink); padding:0; border:0; }
