/* Science-Fiction UX prototype only. Uses the existing Weltbewegend tokens. */
.scifi-ux { --wb-accent:var(--wb-magenta); --wb-accent-light:var(--wb-magenta-light); }
.scifi-ux .stage { padding-top:var(--wb-space-3); }
.scifi-ux h1 { max-width:22ch; font-size:clamp(1.85rem,4vw,2.8rem); margin-bottom:var(--wb-space-3); }
.scifi-ux .ux-intro { display:grid; gap:var(--wb-space-3); margin-bottom:var(--wb-space-4); }
.scifi-ux .ux-intro-copy { min-width:0; align-self:center; }
.scifi-ux .ux-intro-copy .lead,.scifi-ux .ux-teaser { font-size:1.0625rem; line-height:1.55; margin-bottom:0; }
.scifi-ux .ux-image { aspect-ratio:16/9; margin:0; display:grid; place-items:center; padding:var(--wb-space-2); background:var(--wb-white); border:1px dashed var(--wb-accent); border-radius:var(--wb-radius); position:relative; min-width:0; }
.scifi-ux .ux-image::before { content:''; position:absolute; inset:.5rem; border-radius:var(--wb-radius-small); background:var(--wb-accent-light); opacity:.32; }
.scifi-ux .ux-image-label { position:relative; text-align:center; display:grid; gap:.35rem; max-width:30ch; }
.scifi-ux .ux-image-label strong { font-size:1.125rem; line-height:1.35; }
.scifi-ux .ux-image-label > span:last-child { font-size:.75rem; }
/* Replace a placeholder figure with <figure class="ux-image"><img ...></figure>. */
.scifi-ux .ux-image:has(img) { border:0; padding:0; overflow:hidden; }
.scifi-ux .ux-image:has(img)::before { display:none; }
.scifi-ux .ux-image > img { width:100%; height:100%; object-fit:cover; }
.scifi-ux .ux-discover { margin-block:var(--wb-space-4); }
.scifi-ux .ux-discover .deep { border-top:3px solid var(--wb-accent); display:flex; flex-direction:column; }
.scifi-ux .ux-discover .deep .cta { margin-top:auto; padding-top:var(--wb-space-2); min-height:44px; }
.scifi-ux .ux-disclosure { border-top:1px solid var(--wb-line); border-bottom:1px solid var(--wb-line); margin-block:var(--wb-space-3); }
.scifi-ux .ux-disclosure + .ux-disclosure { border-top:0; margin-top:calc(-1 * var(--wb-space-3)); }
.scifi-ux .ux-disclosure > summary { list-style:none; display:flex; align-items:center; justify-content:space-between; gap:var(--wb-space-2); min-height:56px; padding-block:var(--wb-space-2); font-weight:var(--wb-weight-bold); cursor:pointer; }
.scifi-ux .ux-disclosure > summary::-webkit-details-marker { display:none; }
.scifi-ux .ux-disclosure[open] > summary .faq-plus { transform:rotate(45deg); }
.scifi-ux .ux-disclosure-content { padding-block:var(--wb-space-2) var(--wb-space-3); }
.scifi-ux .ux-disclosure-content > .sectionline:last-child { display:none; }
.scifi-ux .ux-intro .ux-disclosure { margin-bottom:0; }
.scifi-ux .peterle-prompt { display:flex; gap:.75rem; align-items:flex-start; margin-block:var(--wb-space-3) var(--wb-space-2); }
.scifi-ux .peterle-prompt > img { width:64px; height:auto; flex:0 0 64px; margin-top:.6rem; }
.scifi-ux .peterle-speech { min-width:0; flex:1; position:relative; padding:.875rem 1rem; border-radius:var(--wb-radius); background:var(--wb-orange-light); }
.scifi-ux .peterle-speech::before { content:''; position:absolute; top:1.15rem; left:-9px; border-top:9px solid transparent; border-bottom:9px solid transparent; border-right:10px solid var(--wb-orange-light); }
.scifi-ux .peterle-speech :is(h2,p) { font-size:1.125rem; line-height:1.4; margin-bottom:0; }
.scifi-ux .peterle-speech .eyebrow { margin-bottom:.4rem; font-size:.7rem; }
.scifi-ux .choicebox:has(.peterle-prompt) { border:0; border-top:2px solid var(--wb-accent); border-radius:0; padding:var(--wb-space-2) 0; background:var(--wb-white); }
.scifi-ux .choicebox .peterle-prompt { margin-top:0; }
.scifi-ux .ux-estimate { padding-block:var(--wb-space-3); border-top:2px solid var(--wb-accent); }
.scifi-ux .ux-estimate > h2 { font-size:1.4rem; }
.scifi-ux .hyper-turn { margin-block:var(--wb-space-4); padding:var(--wb-space-4) var(--wb-space-3); border-left:4px solid var(--wb-accent); }
.scifi-ux #turn-heading { font-size:clamp(1.75rem,4vw,2.4rem); max-width:20ch; }
@media(min-width:60em) {
 .scifi-ux .shell { max-width:1040px; }
 .scifi-ux .stage { max-width:960px; margin-inline:auto; padding-top:var(--wb-space-4); }
 .scifi-ux h1 { max-width:30ch; }
 .scifi-ux .ux-discover .deepgrid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .scifi-ux .ux-intro { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:center; gap:var(--wb-space-4); }
 .scifi-ux main p { max-width:70ch; }
 .scifi-ux .peterle-prompt > img { width:76px; flex-basis:76px; }
 .scifi-ux .ux-disclosure-content { max-width:75ch; }
 .scifi-ux .ux-disclosure-content:has(.exhibition-block) { max-width:none; }
 .scifi-ux .hyper .mission { max-width:760px; margin-inline:auto; }
}

/* Local media: visible AI disclosure belongs to the figure, never inside the pixels. */
.scifi-ux .ux-media { margin:0; min-width:0; }
.scifi-ux .ux-media > img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:var(--wb-radius); }
.scifi-ux .ux-media > figcaption { font-size:.75rem; line-height:1.45; margin-top:.5rem; color:var(--wb-gray); }
.scifi-ux .ux-video { min-width:0; }
.scifi-ux .ux-video .video-shell { margin:0; background:var(--wb-white); }
.scifi-ux .ux-video video { border-radius:var(--wb-radius); }

/* Clear topic titles, one question per activity, optional background. */
.scifi-ux .stage > h1 { margin-bottom:1.25rem; }
.scifi-ux .ux-intro-copy h2 { font-size:clamp(1.35rem,2.5vw,1.8rem); line-height:1.3; margin-top:0; }
.scifi-ux .deep h2 { font-size:1.4rem; margin:0 0 .75rem; }
.scifi-ux .peterle-speech h2 { font-size:1.125rem; line-height:1.5; margin:0; }
.scifi-ux .peterle-speech p { margin:.75rem 0 0; }
.scifi-ux .choice-result:empty { display:none; }
.scifi-ux .ux-disclosure { margin-block:1rem; }
.scifi-ux #warp-explanation > details { margin-top:1rem; }