/* Mira & Bernd: full painted scenes and individually composed comic lettering. */
@font-face{font-family:'Mira Comic';src:url('../assets/fonts/KomikaText.ttf') format('truetype');font-display:swap}
.ne-comic{--bubble:#fffef9;--bubble-ink:#24211e}
.ne-hero{display:grid;grid-template-columns:1.2fr 1fr;gap:45px;align-items:center;margin-bottom:56px}
.ne-hero h1{font-size:clamp(55px,8vw,108px);line-height:.96;letter-spacing:-.05em;margin:20px 0 28px}
.ne-hero h1 em{font-style:normal;color:var(--accent-ink)}
.ne-hero .page-deck{font-size:clamp(18px,2vw,23px);line-height:1.55;max-width:620px}
.ne-credit{font-size:13px;color:var(--muted);margin:18px 0 0}
.ne-poster{aspect-ratio:3/2;background:url('bilder/szene-01-weit.webp') center/cover;border:2px solid var(--ink);transform:rotate(2deg)}
.ne-entry{display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;margin-top:26px}
.ne-start,.ne-end-link{display:inline-block;padding:13px 20px;background:var(--ink);color:var(--paper);font-weight:600;text-decoration:none;border:1px solid var(--ink)}
.ne-mode{font-size:15px;text-underline-offset:5px}
.ne-track{position:relative;width:calc(100vw - 24px);margin:0 0 60px calc(50% - 50vw + 12px);scroll-margin-top:8px}
.ne-stage{position:relative}
.ne-navigation{display:flex;gap:6px;align-items:center;margin:0;padding:0 2px 8px}
.ne-navigation a{display:flex;align-items:center;justify-content:center;gap:9px;flex:1;min-width:0;min-height:36px;padding:6px 8px;text-decoration:none;border-bottom:2px solid var(--line);font-size:12px;line-height:1.1}
.ne-navigation b{font:600 19px var(--serif);color:var(--accent-ink)}
.ne-navigation a[aria-current=true]{border-color:var(--accent);background:var(--paper-light)}
.ne-progress{height:3px;background:var(--line);margin-bottom:8px;overflow:hidden}
.ne-progress span{display:block;height:100%;background:var(--accent);transform-origin:left;transform:scaleX(0)}
.ne-scenes{position:relative;isolation:isolate}
.ne-scene{position:relative;margin:0 0 38px;scroll-margin-top:12px}
.ne-panel{position:relative;width:100%;aspect-ratio:3/2;isolation:isolate;container-type:inline-size;overflow:hidden;background:#8a6848;border:2px solid #24211e;box-sizing:border-box}
.ne-art{position:absolute;inset:0;overflow:hidden}
.ne-artwork{position:absolute;inset:0;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;transform-origin:50% 45%}
.ne-dialogue{position:absolute;z-index:4;right:16px;bottom:16px;pointer-events:none}
.ne-scene-number,.ne-scene h2,.ne-speaker{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%)}
.ne-caption{margin:0;padding:7px 12px;border:1.5px solid #24211e;background:#fff3ce;color:#24211e;font:16px/1.25 'Mira Comic',sans-serif;transform:rotate(-1deg);box-shadow:2px 2px 0 #24211e35}
.ne-lines{position:absolute;inset:0;z-index:3;pointer-events:none}
.ne-speech{position:absolute;left:calc(var(--x)*1%);top:calc(var(--y)*1%);width:calc(var(--w)*1%);padding:18px 24px;margin:0;box-sizing:border-box;text-align:center;color:var(--bubble-ink);background:var(--bubble);border:2px solid var(--bubble-ink);border-radius:48% 52% 46% 54% / 48% 45% 55% 52%;font:clamp(17px,1.8cqw,26px)/1.2 'Mira Comic',sans-serif;text-transform:uppercase;overflow-wrap:normal;hyphens:manual}
.ne-speech[data-emphasis]{font-size:clamp(19px,2.05cqw,30px)}
.ne-tails{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;overflow:visible}
.ne-tails path{fill:var(--bubble);stroke:var(--bubble-ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(2px 3px 0 #24211e30)}
.ne-scene.has-lettering .ne-speech{background:transparent;border-color:transparent}
.ne-title-moment,.ne-curtain{display:none}
.ne-status{font:11px/1.3 var(--mono);color:var(--muted);margin:7px 2px 0;text-align:right}
.ne-end{max-width:900px;margin:70px auto;padding:clamp(25px,5vw,60px);background:var(--paper-light);border:1px solid var(--line);text-align:center}
.ne-end h2{font-size:clamp(38px,5.8vw,70px);line-height:1.08;margin:18px 0 12px}
.ne-translation{font-size:23px;margin:0 0 24px}
.ne-recap{margin:44px 0 0;border-top:1px solid var(--line);padding-top:20px}
.ne-recap summary{font-family:var(--serif);font-size:24px}
.ne-recap-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.ne-recap-grid img{display:block;width:100%;height:auto}
.ne-footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:16px;margin-top:35px}
@media screen{
 .ne-comic.is-playing .ne-track{height:var(--track-height)}
 .ne-comic.is-playing .ne-stage{position:sticky;top:var(--stage-top)}
 .ne-comic.is-playing .ne-scenes{display:grid;grid-template-columns:100%}
 .ne-comic.is-playing .ne-scene{grid-area:1/1;opacity:0;pointer-events:none;margin:0;will-change:opacity}
 .ne-comic.is-playing .ne-scene[data-active]{pointer-events:auto}
 .ne-comic.is-playing .ne-panel{height:var(--panel-height);aspect-ratio:auto}
 .ne-comic.is-playing .ne-artwork{will-change:transform}
 .ne-comic.is-playing .ne-speech,.ne-comic.is-playing .ne-tails path{opacity:0;transition:opacity .18s ease-out}
 .ne-comic.is-playing .ne-speech[data-shown],.ne-comic.is-playing .ne-tails path[data-shown]{opacity:1}
 .ne-comic.is-playing .ne-caption{opacity:var(--caption-opacity,1);transition:opacity .15s}
}
@media(max-width:700px){
 .ne-hero{grid-template-columns:1fr;gap:20px;margin-bottom:34px}.ne-hero h1{font-size:clamp(51px,13vw,76px)}.ne-poster{display:none}
 .ne-track{width:100vw;margin-left:calc(50% - 50vw)}
 .ne-navigation{gap:2px;padding:0 5px 6px}.ne-navigation a{min-height:34px;padding:5px}.ne-navigation a span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .ne-progress{margin-bottom:5px}.ne-panel{aspect-ratio:3/4;border-width:1px}.ne-artwork{background-position:53% 50%}
 .ne-speech{left:calc(var(--mx)*1%);top:calc(var(--my)*1%);width:calc(var(--mw)*1%);font-size:clamp(16px,3.9cqw,20px);padding:13px 16px;line-height:1.18}
 .ne-speech[data-emphasis]{font-size:clamp(16px,4cqw,22px)}
 .ne-dialogue{right:10px;bottom:9px}.ne-caption{font-size:11px;padding:5px 8px}.ne-status{font-size:9px;margin-right:8px}
 .ne-recap-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.ne-comic *{animation:none!important;transition:none!important}.ne-poster{transform:none}}
@media print{.ne-hero{display:block}.ne-poster,.ne-navigation,.ne-progress,.ne-status,.ne-entry,.ne-footer,.ne-recap{display:none}.ne-track{width:100%;height:auto!important;margin:0}.ne-stage{position:static!important}.ne-scenes{display:block!important}.ne-scene{opacity:1!important;margin-bottom:24px!important;break-inside:avoid}.ne-panel{height:auto!important;aspect-ratio:3/2}.ne-artwork{transform:none!important}.ne-speech,.ne-tails path{opacity:1!important}.ne-caption{opacity:1!important}}