/* Modal Path Ethics v6.51 — orientation/about, search bridge, homepage books, light-mode SVG repair */

/* Search host must never paint over the blurred field. The iframe receives its
   own theme bridge in convergence-event.js, including open shadow roots. */
#sodo-search-root,
#sodo-search-root iframe,
html[data-mpe-search-open="true"] #sodo-search-root,
html[data-mpe-search-open="true"] #sodo-search-root iframe {
    background: transparent !important;
    background-color: transparent !important;
}

/* White-only recovered glyphs are readable in both schemes. Colored creature,
   game and event badges are intentionally left alone. */
html[data-color-scheme="light"] .mpe-badge--inner-apocalypse::before,
html[data-color-scheme="light"][data-inner-apocalypse-icons-active="true"] .gh-search::before {
    background-color: #17191d !important;
    filter: none !important;
}

html[data-color-scheme="light"] .mpe-badge--inner-apocalypse::after {
    border-color: rgba(23,25,29,.18) !important;
}

html[data-color-scheme="light"] .mpe-badge--glass-throne::before,
html[data-color-scheme="light"][data-glass-throne-active="true"] #gh-head .gh-burger::before,
html[data-color-scheme="light"][data-glass-throne-active="true"] #gh-head .nav-more-toggle::before,
html[data-color-scheme="light"][data-convergence-icons-active="true"] .gh-search::before,
html[data-color-scheme="light"][data-convergence-icons-active="true"] .gh-burger::before,
html[data-color-scheme="light"] .mpe-badge--convergence::before,
html[data-color-scheme="light"] .mpe-badge--convergence::after {
    filter: brightness(0) contrast(1.15) !important;
}


/* Mixed Convergence field art contains paper-white linework alongside gold and
   mint. Swap only that white linework to ink in light mode instead of filtering
   the entire multicolor field. */
html[data-color-scheme="light"].mpe-convergence-point-page {
    --cvg-field: url("convergence-field-light.svg");
}

/* Homepage book rows: the title remains the modal trigger; the public/free path
   stays one tap away and does not require opening the modal. */
.home-template .mpe-home-book-item {
    align-items: center;
    display: inline-flex;
    gap: .48rem;
    min-width: 0;
}

.home-template .mpe-home-book-item > button {
    align-items: flex-start;
    display: inline-flex;
    flex-direction: column;
    gap: .28rem;
    text-align: left;
}

.home-template .mpe-home-book-item > button small {
    color: var(--mpe-home-muted);
    font-size: 1.22rem;
    font-weight: 650;
    letter-spacing: .015em;
    line-height: 1.15;
}

.home-template .mpe-home-book-quick,
.home-template .mpe-ia-release-download {
    border: 1px solid color-mix(in srgb, var(--mpe-gold) 34%, var(--mpe-home-card-border));
    border-radius: 999px;
    color: var(--mpe-home-text);
    display: inline-flex;
    font-family: var(--gh-font-heading, var(--font-sans));
    font-size: 1.42rem;
    font-weight: 780;
    line-height: 1;
    padding: .9rem 1.15rem;
    text-decoration: none;
    white-space: nowrap;
}

.home-template .mpe-home-book-quick:hover,
.home-template .mpe-home-book-quick:focus-visible,
.home-template .mpe-ia-release-download:hover,
.home-template .mpe-ia-release-download:focus-visible {
    border-color: var(--mpe-green);
    color: var(--mpe-green);
    opacity: 1;
}

.home-template .mpe-ia-release {
    display: grid;
    gap: .72rem;
}

.home-template .mpe-ia-release-download {
    justify-self: end;
}


/* Legacy book-page controls; About and Orientation use guide-pages-v6-51.css. */
/* Large MPE route controls ---------------------------------------------- */
.mpe-path-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 1.25rem;
    margin: clamp(3.2rem, 5vw, 5.4rem) auto;
    max-width: 92rem;
}

.mpe-path-grid--primary {
    margin-top: clamp(3rem, 5vw, 5rem);
    margin-bottom: clamp(4rem, 6vw, 6.4rem);
}

.mpe-path-card {
    position: relative;
    display: grid;
    grid-template-columns: 2.5rem minmax(0,1fr);
    grid-template-rows: auto auto;
    column-gap: 1.45rem;
    row-gap: .55rem;
    min-height: 12.5rem;
    padding: 2.2rem 2.4rem;
    border: 2px solid var(--mpe-page-rule);
    border-radius: 1.1rem;
    background:
        linear-gradient(118deg, rgba(238,198,67,.12), transparent 55%),
        var(--mpe-page-panel);
    color: var(--mpe-page-ink) !important;
    box-shadow: 0 1.2rem 3.2rem rgba(0,0,0,.13);
    text-decoration: none !important;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background-color .16s ease;
}

.mpe-path-card--green {
    border-color: var(--mpe-page-rule-green);
    background:
        linear-gradient(118deg, rgba(152,251,152,.105), transparent 55%),
        var(--mpe-page-panel);
}

.mpe-path-card-mark {
    grid-row: 1 / span 2;
    align-self: start;
    justify-self: center;
    width: 1.7rem;
    height: 1.7rem;
    margin-top: .35rem;
    background: var(--mpe-page-gold);
    transform: rotate(45deg);
    box-shadow: 0 0 0 .35rem color-mix(in srgb, var(--mpe-page-gold) 16%, transparent);
}

.mpe-path-card--green .mpe-path-card-mark {
    background: var(--mpe-page-green);
    box-shadow: 0 0 0 .35rem color-mix(in srgb, var(--mpe-page-green) 15%, transparent);
}

.mpe-path-card strong {
    color: var(--mpe-page-ink);
    font-family: var(--gh-font-heading, var(--font-sans));
    font-size: clamp(2rem, 1.2vw + 1.3rem, 2.35rem);
    line-height: 1.12;
}

.mpe-path-card > span:last-child {
    color: var(--mpe-page-muted);
    font-size: clamp(1.62rem, .45vw + 1.38rem, 1.82rem);
    line-height: 1.42;
}

.mpe-path-card:hover,
.mpe-path-card:focus-visible {
    border-color: var(--mpe-page-gold);
    box-shadow: 0 1.6rem 4rem rgba(0,0,0,.20), 0 0 0 1px color-mix(in srgb, var(--mpe-page-gold) 32%, transparent);
    opacity: 1;
    transform: translateY(-3px);
}

.mpe-path-card--green:hover,
.mpe-path-card--green:focus-visible {
    border-color: var(--mpe-page-green);
    box-shadow: 0 1.6rem 4rem rgba(0,0,0,.20), 0 0 0 1px color-mix(in srgb, var(--mpe-page-green) 30%, transparent);
}

/* Constitutional maxims ------------------------------------------------- */
.mpe-maxim-stack {
    display: grid;
    gap: 1rem;
    margin-top: 3rem !important;
    margin-bottom: 4rem !important;
}

.mpe-maxim-stack p {
    display: grid;
    grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr);
    gap: 1.2rem;
    align-items: center;
    margin: 0;
    padding: 1.6rem 1.9rem;
    border-left: .55rem solid var(--mpe-page-gold);
    background: var(--mpe-page-panel);
}

.mpe-maxim-stack p:nth-child(even) { border-left-color: var(--mpe-page-green); }
.mpe-maxim-stack strong { font-family: var(--gh-font-heading, var(--font-sans)); font-size: 1.9rem; }
.mpe-maxim-stack span { color: var(--mpe-page-muted); font-size: 1.7rem; }

/* Books ----------------------------------------------------------------- */
.mpe-book-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 1.35rem;
    margin: 3rem auto 5rem;
    max-width: 92rem;
}

.mpe-book-card {
    display: flex;
    flex-direction: column;
    min-height: 28rem;
    padding: 2.5rem;
    border: 2px solid var(--mpe-page-rule);
    background: linear-gradient(145deg, rgba(238,198,67,.09), transparent 48%), var(--mpe-page-panel);
}

.mpe-book-card--green {
    border-color: var(--mpe-page-rule-green);
    background: linear-gradient(145deg, rgba(152,251,152,.085), transparent 48%), var(--mpe-page-panel);
}

.mpe-book-card-label {
    margin: 0 0 1.15rem !important;
    color: var(--mpe-page-gold) !important;
    font-family: var(--gh-font-heading, var(--font-sans));
    font-size: 1.45rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.mpe-book-card--green .mpe-book-card-label { color: var(--mpe-page-green) !important; }
.mpe-book-card h3 { margin: 0 0 1.3rem; color: var(--mpe-page-ink); font-size: clamp(2.25rem, 2vw, 3rem); line-height: 1.15; }
.mpe-book-card > p:not(.mpe-book-card-label) { margin: 0 0 2.2rem; color: var(--mpe-page-muted); font-size: 1.72rem; line-height: 1.5; }
.mpe-book-card nav { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: auto; }

.mpe-book-card nav a {
    display: inline-flex;
    align-items: center;
    min-height: 4.5rem;
    padding: .95rem 1.35rem;
    border: 2px solid var(--mpe-page-gold);
    border-radius: .75rem;
    background: color-mix(in srgb, var(--mpe-page-gold) 12%, var(--mpe-page-panel));
    color: var(--mpe-page-ink) !important;
    font-family: var(--gh-font-heading, var(--font-sans));
    font-size: 1.55rem;
    font-weight: 800;
    text-decoration: none !important;
}

.mpe-book-card--green nav a { border-color: var(--mpe-page-green); background: color-mix(in srgb, var(--mpe-page-green) 11%, var(--mpe-page-panel)); }
.mpe-book-card nav a:hover,
.mpe-book-card nav a:focus-visible { background: var(--mpe-page-gold); color: #111 !important; opacity: 1; }
.mpe-book-card--green nav a:hover,
.mpe-book-card--green nav a:focus-visible { background: var(--mpe-page-green); color: #111 !important; }

.mpe-final-line {
    margin-top: clamp(6rem, 10vw, 11rem) !important;
    padding-top: 3rem;
    border-top: .45rem solid var(--mpe-page-gold);
    font-family: var(--gh-font-heading, var(--font-sans));
    font-size: clamp(2.8rem, 3vw, 4.2rem);
    letter-spacing: -.03em;
}

@media (max-width: 767px) {
    .mpe-book-page-shell .mpe-path-grid { grid-template-columns: 1fr; }
    .home-template .mpe-home-book-item { display:flex; align-items:stretch; width:100%; }
    .home-template .mpe-home-book-item > button { flex:1 1 auto; }
    .home-template .mpe-home-book-quick { align-items:center; }
    .home-template .mpe-ia-release-download { justify-self:stretch; justify-content:center; }
}

@media (prefers-reduced-motion: reduce) {
    .mpe-path-card { transition: none; }
}

/* Extance book page uses the same strong MPE controls without borrowing the
   full Orientation page skin. */
.mpe-book-page-shell {
    --mpe-page-gold: #eec643;
    --mpe-page-green: #98fb98;
    --mpe-page-blue: #9cc4ff;
    --mpe-page-ink: #f3f4f7;
    --mpe-page-muted: #c9c1ae;
    --mpe-page-panel: #171a20;
    --mpe-page-panel-2: #11141a;
    --mpe-page-rule: rgba(238,198,67,.28);
    --mpe-page-rule-green: rgba(152,251,152,.26);
}
html[data-color-scheme="light"] .mpe-book-page-shell {
    --mpe-page-gold: #9b6a08;
    --mpe-page-green: #236e49;
    --mpe-page-blue: #265f9d;
    --mpe-page-ink: #17191d;
    --mpe-page-muted: #5f5748;
    --mpe-page-panel: #fffdf8;
    --mpe-page-panel-2: #f6f0df;
    --mpe-page-rule: rgba(155,106,8,.34);
    --mpe-page-rule-green: rgba(35,110,73,.30);
}
.mpe-book-page-shell .mpe-path-grid { max-width: 100%; }
.mpe-book-page-shell .mpe-rule-callout { max-width: 100%; }