/* Modal Path Ethics · Batman paper and unannounced divider interactions · 6.41 */
html.mpe-batman-page {
    --bat-paper: #191b1c;
    --bat-ink: #e6e3dc;
    --bat-muted: #aaa9a5;
    --bat-edge: rgba(221,219,210,.10);
    --bat-dot-alpha: .14;
    background: #000 !important;
    overflow-x: clip;
}
html.mpe-batman-page[data-color-scheme="light"] {
    --bat-paper: #f2efe7;
    --bat-ink: #242527;
    --bat-muted: #646568;
    --bat-edge: rgba(239,233,215,.30);
    --bat-dot-alpha: .15;
}
html.mpe-batman-page body,
html.mpe-batman-page .gh-site,
html.mpe-batman-page .gh-main,
html.mpe-batman-page #gh-head,
html.mpe-batman-page .gh-foot { background: #000 !important; background-image: none !important; }
html.mpe-batman-page body { overflow-x: clip; }
html.mpe-batman-page body::before,
html.mpe-batman-page body::after,
html.mpe-batman-page .gh-site::before { background: none !important; }
html.mpe-batman-page .gh-article { position: relative; isolation: isolate; }
html.mpe-batman-page .gh-article-header,
html.mpe-batman-page .gh-article-header :is(h1,p,a,time,span),
html.mpe-batman-page .gh-article-sidebar,
html.mpe-batman-page .gh-article-sidebar :is(h4,a,span,time),
html.mpe-batman-page #gh-head,
html.mpe-batman-page #gh-head :is(a,button),
html.mpe-batman-page .gh-foot,
html.mpe-batman-page .gh-foot :is(a,button) { color: #dddcd6; }
html.mpe-batman-page .gh-article-header .gh-article-tag { color: #c4b893; }
html.mpe-batman-page .gh-burger::before,
html.mpe-batman-page .gh-burger::after { background: #e6e3dc; }
html.mpe-batman-page .gh-article > .gh-content {
    color: var(--bat-ink);
    background-color: var(--bat-paper);
}
html.mpe-batman-page .gh-article.bat-paper-ready > .gh-content { background: transparent !important; }
html.mpe-batman-page .gh-content :is(h1,h2,h3,h4,h5,h6,strong) { color: inherit; }
html.mpe-batman-page .gh-content :is(figcaption,.kg-bookmark-description,.kg-bookmark-metadata) { color: var(--bat-muted); }
html.mpe-batman-page .gh-content :is(pre,.kg-bookmark-container,.kg-file-card-container) {
    color: var(--bat-ink); background-color: var(--bat-paper);
}
html.mpe-batman-page .gh-content a { color: #bed2d7; }
html.mpe-batman-page[data-color-scheme="light"] .gh-content a { color: #355666; }
html.mpe-batman-page .gh-content blockquote.kg-blockquote-alt { color: var(--bat-muted); }
html.mpe-batman-page .gh-content hr { background-image: none !important; }
.mpe-bat-paper-layer {
    position: absolute; inset: 0; z-index: -1; pointer-events: none;
    user-select: none; margin: 0 !important; padding: 0 !important; overflow: visible;
}
.mpe-bat-sheet {
    position: absolute; background-color: var(--bat-paper);
    background-image: radial-gradient(circle,rgba(var(--bat-dot,108,130,146),var(--bat-dot-alpha)) .65px,transparent .9px);
    background-size: 4.5px 4.5px;
    border: 1px solid var(--bat-edge); border-radius: 2px;
    box-shadow: 0 2px 0 #000, 0 5px 18px #0003;
}
/* A divider keeps its original flow footprint; its metal projects from the seam. */
html.mpe-batman-page .mpe-bat-divider {
    position: relative; height: 2.7rem; width: min(100%,21rem); max-width: 21rem;
    margin: 4.2rem auto; overflow: visible; z-index: 2; perspective: 650px;
}
html.mpe-batman-page .mpe-bat-divider > hr {
    margin: 0 !important; height: 100% !important; width: 100%; opacity: 0;
    border: 0; background: none !important;
}
.mpe-batarang {
    appearance: none; -webkit-appearance: none; position: absolute;
    left: 50%; top: 50%; transform: translate(-50%,-50%);
    width: 174px; max-width: 88%; height: 64px; padding: 0; margin: 0;
    border: 0; background: none; color: #bec3c3; cursor: grab;
    touch-action: none; user-select: none; -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent; perspective: 560px;
}
.mpe-batarang:active { cursor: grabbing; }
.mpe-batarang:focus-visible { outline: 1px solid #b5bebc; outline-offset: 8px; border-radius: 50%; }
.mpe-batarang::before {
    content: ""; position: absolute; left: 40%; top: 61%; width: 20%; height: 3px;
    border-radius: 50%; background: #050505; opacity: 0;
    transform: rotate(var(--bat-land,0deg));
    box-shadow: 0 1px 0 #b1aca36b, 1px 3px 6px #000b;
}
.mpe-batarang.is-embedded::before { opacity: 1; }
.mpe-bat-metal {
    display: block; overflow: visible; width: 100%; height: 100%; pointer-events: none;
    transform-origin: 50% 61%; transform-style: preserve-3d;
    transform: var(--bat-rest,rotateX(12deg) rotateY(-8deg) rotateZ(-3deg));
    filter: drop-shadow(0 4px 2px #000b) drop-shadow(0 1px 0 #aaa9a557);
}
.mpe-batarang.is-embedded .mpe-bat-metal { filter: drop-shadow(4px 12px 5px #000b) drop-shadow(0 1px 0 #c9c6b951); }
.mpe-batarang.is-away .mpe-bat-metal { visibility: hidden; }
.mpe-bat-flight {
    position: fixed; left: 0; top: 0; width: 174px; height: 64px; z-index: 2147483000;
    pointer-events: none; contain: layout style; transform-origin: 50% 50%;
    will-change: transform; perspective: 560px;
}
.mpe-bat-flight .mpe-bat-metal { transform: rotateX(12deg); filter: drop-shadow(0 9px 4px #000b); }
@media (max-width:700px) {
    .mpe-batarang { width: 146px; height: 58px; }
    .mpe-bat-sheet { border-radius: 1px; }
}
@media (prefers-reduced-motion:reduce) {
    .mpe-bat-flight { display: none !important; }
}
@media print {
    html.mpe-batman-page,html.mpe-batman-page body,html.mpe-batman-page .gh-site,
    html.mpe-batman-page .gh-main { background: #fff !important; color: #111 !important; }
    .mpe-bat-paper-layer,.mpe-bat-flight,.mpe-batarang { display: none !important; }
    html.mpe-batman-page .gh-content { color:#111 !important; background:transparent !important; }
    html.mpe-batman-page .mpe-bat-divider { height:1px; margin:2rem auto; }
    html.mpe-batman-page .mpe-bat-divider > hr { opacity:1; border-top:1px solid #777; }
}
