/* ===================================================================== Modal Path Ethics — Patch Notes article skin Applies when has .mpe-patch-notes-page. URLs: - /p/f62ae4b5-4371-4490-8518-27f49e0d5dec/ - /patch-notes-*/ Light mode: whiteboard. Dark mode: chalkboard. ===================================================================== */ html.mpe-patch-notes-page { --patch-board-bg: #112722; --patch-board-bg-2: #0a1815; --patch-board-ink: #edf6ec; --patch-board-muted: rgba(235, 246, 232, 0.78); --patch-board-faint: rgba(235, 246, 232, 0.16); --patch-board-line: rgba(230, 244, 222, 0.13); --patch-board-line-strong: rgba(244, 255, 237, 0.28); --patch-accent: #e7d57c; --patch-accent-2: #93e0b4; --patch-accent-blue: #9dc4ff; --patch-paper: #fff9dc; --patch-paper-ink: #152027; --patch-paper-muted: rgba(21, 32, 39, 0.72); --patch-paper-line: rgba(57, 119, 184, 0.16); --patch-card-shadow: 0 1.35rem 3.5rem rgba(0, 0, 0, 0.28); --patch-max: 760px; background: var(--patch-board-bg); overflow-x: clip; } html.mpe-patch-notes-page[data-color-scheme="light"] { --patch-board-bg: #f7faf5; --patch-board-bg-2: #e8f0ea; --patch-board-ink: #172226; --patch-board-muted: rgba(23, 34, 38, 0.74); --patch-board-faint: rgba(27, 49, 54, 0.12); --patch-board-line: rgba(27, 49, 54, 0.09); --patch-board-line-strong: rgba(27, 49, 54, 0.24); --patch-accent: #d39a11; --patch-accent-2: #1a8760; --patch-accent-blue: #1266b2; --patch-paper: #fff9db; --patch-paper-ink: #111b20; --patch-paper-muted: rgba(17, 27, 32, 0.72); --patch-paper-line: rgba(37, 116, 187, 0.16); --patch-card-shadow: 0 1.2rem 3rem rgba(42, 54, 49, 0.16); background: var(--patch-board-bg); } html.mpe-patch-notes-page, html.mpe-patch-notes-page body { min-width: 0; max-width: 100vw; } html.mpe-patch-notes-page body { color: var(--patch-board-ink); background: radial-gradient(circle at 16% 12%, rgba(255, 255, 255, 0.055), transparent 18rem), radial-gradient(circle at 88% 18%, rgba(151, 224, 180, 0.07), transparent 22rem), radial-gradient(circle at 70% 82%, rgba(231, 213, 124, 0.05), transparent 24rem), linear-gradient(135deg, var(--patch-board-bg), var(--patch-board-bg-2)); overflow-x: clip; } html.mpe-patch-notes-page[data-color-scheme="light"] body { background: radial-gradient(circle at 10% 8%, rgba(104, 150, 120, 0.16), transparent 19rem), radial-gradient(circle at 86% 16%, rgba(211, 154, 17, 0.10), transparent 24rem), radial-gradient(circle at 65% 86%, rgba(48, 100, 170, 0.09), transparent 28rem), linear-gradient(135deg, var(--patch-board-bg), var(--patch-board-bg-2)); } html.mpe-patch-notes-page body::before, html.mpe-patch-notes-page body::after { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0; } /* Board surface: smudges + faint marker/chalk wipe marks. */ html.mpe-patch-notes-page body::before { opacity: 0.78; background: linear-gradient(0deg, transparent 0 23px, var(--patch-board-line) 24px, transparent 25px), linear-gradient(90deg, transparent 0 31px, rgba(255,255,255,0.035) 32px, transparent 33px), radial-gradient(ellipse at 22% 32%, rgba(255,255,255,0.055), transparent 28%), radial-gradient(ellipse at 82% 68%, rgba(255,255,255,0.045), transparent 32%), repeating-linear-gradient(176deg, transparent 0 19px, rgba(255,255,255,0.026) 20px, transparent 22px); mix-blend-mode: screen; } html.mpe-patch-notes-page[data-color-scheme="light"] body::before { opacity: 0.9; background: linear-gradient(0deg, transparent 0 23px, var(--patch-board-line) 24px, transparent 25px), linear-gradient(90deg, transparent 0 31px, rgba(16, 42, 48, 0.025) 32px, transparent 33px), radial-gradient(ellipse at 22% 32%, rgba(48, 86, 92, 0.055), transparent 28%), radial-gradient(ellipse at 82% 68%, rgba(211, 154, 17, 0.055), transparent 32%), repeating-linear-gradient(176deg, transparent 0 19px, rgba(48, 86, 92, 0.026) 20px, transparent 22px); mix-blend-mode: multiply; } /* Outer board falloff and tray line. */ html.mpe-patch-notes-page body::after { background: linear-gradient(90deg, rgba(0,0,0,0.42), transparent 13%, transparent 87%, rgba(0,0,0,0.42)), linear-gradient(180deg, transparent calc(100% - 11px), rgba(255,255,255,0.20) calc(100% - 10px), transparent calc(100% - 8px)); opacity: 0.75; } html.mpe-patch-notes-page[data-color-scheme="light"] body::after { background: linear-gradient(90deg, rgba(186, 198, 188, 0.55), transparent 12%, transparent 88%, rgba(186, 198, 188, 0.55)), linear-gradient(180deg, transparent calc(100% - 11px), rgba(68, 92, 92, 0.22) calc(100% - 10px), transparent calc(100% - 8px)); opacity: 0.82; } /* Keep global Entropy Debt effects above the board skin. */ html.mpe-patch-notes-page .edw-substrate, html.mpe-patch-notes-page .edw-hole-field, html.mpe-patch-notes-page .edw-rollback-flash { z-index: 2147483000; } html.mpe-patch-notes-page .gh-site, html.mpe-patch-notes-page .gh-main, html.mpe-patch-notes-page .gh-outer, html.mpe-patch-notes-page main { position: relative; z-index: 1; background: transparent !important; max-width: 100vw; overflow-x: clip; } html.mpe-patch-notes-page .gh-head { position: relative; z-index: 50; background: linear-gradient(180deg, rgba(13, 36, 31, 0.94), rgba(5, 18, 15, 0.92)) !important; border-color: var(--patch-board-line-strong) !important; box-shadow: 0 0.6rem 1.6rem rgba(0,0,0,0.16); } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-head { background: linear-gradient(180deg, rgba(253, 255, 249, 0.96), rgba(230, 241, 233, 0.95)) !important; border-color: rgba(33, 70, 71, 0.18) !important; } html.mpe-patch-notes-page body.is-head-stacked .gh-head-menu::before, html.mpe-patch-notes-page body.is-head-stacked .gh-head-menu::after, html.mpe-patch-notes-page .gh-head-inner, html.mpe-patch-notes-page .gh-topic-header, html.mpe-patch-notes-page .gh-topic-footer, html.mpe-patch-notes-page .gh-read-next .gh-pagehead-title::after, html.mpe-patch-notes-page .gh-comments .gh-pagehead-title::after { background-color: var(--patch-board-line-strong) !important; } html.mpe-patch-notes-page .gh-head a, html.mpe-patch-notes-page .gh-search, html.mpe-patch-notes-page .nav-more-toggle, html.mpe-patch-notes-page .mpe-theme-toggle, html.mpe-patch-notes-page .mpe-profanity-toggle, html.mpe-patch-notes-page .gh-burger { color: var(--patch-board-ink) !important; } html.mpe-patch-notes-page .gh-burger::before, html.mpe-patch-notes-page .gh-burger::after { background-color: var(--patch-board-ink) !important; } /* Event banner: allow global EDW event, but make it feel clipped to the board. */ html.mpe-patch-notes-page .edw-event__panel { border-color: var(--patch-board-line-strong) !important; box-shadow: 0 0.7rem 2rem rgba(0,0,0,0.18); } html.mpe-patch-notes-page .gh-article { --patch-article-pad: clamp(1.4rem, 2.4vw, 2.4rem); position: relative; width: min(100% - 32px, calc(var(--patch-max) + 2 * var(--patch-article-pad))); margin: clamp(2rem, 4vw, 4.5rem) auto; padding: var(--patch-article-pad); border-radius: 18px; border: 1px solid rgba(238, 247, 236, 0.20); background: linear-gradient(0deg, transparent 0 31px, rgba(255,255,255,0.035) 32px, transparent 33px), linear-gradient(90deg, rgba(255,255,255,0.045), transparent 24%, transparent 76%, rgba(255,255,255,0.035)), rgba(7, 27, 23, 0.60); box-shadow: 0 1.4rem 5rem rgba(0,0,0,0.30); backdrop-filter: blur(2px); } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-article { border-color: rgba(18, 42, 45, 0.12); background: linear-gradient(0deg, transparent 0 31px, rgba(18, 42, 45, 0.028) 32px, transparent 33px), linear-gradient(90deg, rgba(255,255,255,0.58), rgba(255,255,255,0.18) 24%, rgba(255,255,255,0.18) 76%, rgba(255,255,255,0.50)), rgba(251, 255, 250, 0.70); box-shadow: 0 1.2rem 4rem rgba(50, 63, 58, 0.14); } html.mpe-patch-notes-page .gh-article > *, html.mpe-patch-notes-page .gh-content > * { position: relative; z-index: 1; } html.mpe-patch-notes-page .gh-article-header, html.mpe-patch-notes-page .gh-content, html.mpe-patch-notes-page .mpe-post-routes { max-width: var(--patch-max); margin-left: auto; margin-right: auto; } html.mpe-patch-notes-page .gh-article-title { color: var(--patch-board-ink); letter-spacing: -0.035em; text-shadow: 0 0 1px rgba(255,255,255,0.22), 0 0 0.65rem rgba(255,255,255,0.05); } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-article-title { text-shadow: 0 1px 0 rgba(255,255,255,0.9); } html.mpe-patch-notes-page .gh-article-tag, html.mpe-patch-notes-page .gh-article-meta, html.mpe-patch-notes-page .gh-article-date, html.mpe-patch-notes-page .gh-article-length { color: var(--patch-accent) !important; } html.mpe-patch-notes-page .gh-article-excerpt, html.mpe-patch-notes-page .gh-content, html.mpe-patch-notes-page .gh-content p, html.mpe-patch-notes-page .gh-content li { color: var(--patch-board-ink); } html.mpe-patch-notes-page .gh-article-excerpt { color: var(--patch-board-muted); font-style: italic; } html.mpe-patch-notes-page .gh-content a:not(.kg-bookmark-container) { color: var(--patch-accent-blue); text-decoration-color: color-mix(in srgb, var(--patch-accent-blue), transparent 35%); text-decoration-thickness: 0.08em; text-underline-offset: 0.14em; } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-content a:not(.kg-bookmark-container) { color: #0b5f8f; } html.mpe-patch-notes-page .gh-content h2, html.mpe-patch-notes-page .gh-content h3, html.mpe-patch-notes-page .gh-content h4 { color: var(--patch-board-ink); display: inline-block; padding-bottom: 0.14em; background-image: linear-gradient(90deg, var(--patch-accent), transparent 90%); background-size: 100% 0.08em; background-position: 0 100%; background-repeat: no-repeat; } html.mpe-patch-notes-page .gh-content hr { width: min(82%, 540px); height: 0.18rem; margin: 2.8rem auto; border: 0; border-radius: 999px; background: linear-gradient(90deg, transparent, var(--patch-board-line-strong), var(--patch-accent), var(--patch-board-line-strong), transparent); opacity: 0.88; } /* Notebook-paper cards for quote / ticket fragments. */ html.mpe-patch-notes-page .gh-content blockquote, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt { position: relative; width: min(100%, 620px); margin: 2.1rem auto; padding: 1.65rem 1.75rem 1.45rem; border: 0; border-radius: 4px 16px 6px 13px; color: var(--patch-paper-ink); background: linear-gradient(90deg, rgba(221, 82, 66, 0.28) 0 2px, transparent 2px 100%) 2.2rem 0 / 100% 100%, repeating-linear-gradient(180deg, transparent 0 1.58rem, var(--patch-paper-line) 1.62rem, transparent 1.70rem), linear-gradient(135deg, rgba(255,255,255,0.88), rgba(255, 250, 218, 0.95) 46%, rgba(246, 232, 184, 0.95)); box-shadow: var(--patch-card-shadow), inset 0 0 0 1px rgba(64, 38, 10, 0.08), inset 0 -0.7rem 1.7rem rgba(99, 65, 15, 0.08); transform: rotate(-0.55deg); text-align: center; font-size: 0.98em; } html.mpe-patch-notes-page .gh-content blockquote:nth-of-type(2n), html.mpe-patch-notes-page .gh-content .kg-blockquote-alt:nth-of-type(2n) { transform: rotate(0.45deg); } html.mpe-patch-notes-page .gh-content blockquote:nth-of-type(3n), html.mpe-patch-notes-page .gh-content .kg-blockquote-alt:nth-of-type(3n) { transform: rotate(-0.18deg); } html.mpe-patch-notes-page .gh-content blockquote::before, html.mpe-patch-notes-page .gh-content blockquote::after, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::before, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::after { content: ""; position: absolute; top: -0.62rem; width: 1.18rem; height: 1.18rem; border-radius: 999px; background: radial-gradient(circle at 34% 30%, rgba(255,255,255,0.92), transparent 0.22rem), radial-gradient(circle at 50% 55%, #e43737, #9b1010 70%); box-shadow: 0 0.3rem 0.7rem rgba(0,0,0,0.24), inset 0 0 0 1px rgba(40,0,0,0.22); } html.mpe-patch-notes-page .gh-content blockquote::before, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::before { left: 1.3rem; } html.mpe-patch-notes-page .gh-content blockquote::after, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::after { right: 1.25rem; background: radial-gradient(circle at 34% 30%, rgba(255,255,255,0.92), transparent 0.22rem), radial-gradient(circle at 50% 55%, #2e9cff, #1157a8 72%); } html.mpe-patch-notes-page .gh-content blockquote p, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt p { margin: 0.42rem 0; color: var(--patch-paper-ink) !important; line-height: 1.55; text-shadow: none; } html.mpe-patch-notes-page .gh-content blockquote strong, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt strong { color: #0e2430; } /* Feature/inline images become board attachments. */ html.mpe-patch-notes-page .gh-article-image, html.mpe-patch-notes-page .gh-content figure.kg-image-card, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card .kg-gallery-image, html.mpe-patch-notes-page .kg-card.kg-bookmark-card { border-radius: 12px; border: 1px solid var(--patch-board-line-strong); box-shadow: 0 1rem 2.8rem rgba(0,0,0,0.20); overflow: hidden; } html.mpe-patch-notes-page .gh-article-image img, html.mpe-patch-notes-page .kg-image-card img, html.mpe-patch-notes-page .kg-gallery-image img { filter: saturate(0.82) contrast(1.05); } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-article-image img, html.mpe-patch-notes-page[data-color-scheme="light"] .kg-image-card img, html.mpe-patch-notes-page[data-color-scheme="light"] .kg-gallery-image img { filter: saturate(0.94) contrast(1.02); } /* Minimal print controls inherit board colors. */ html.mpe-patch-notes-page .mpe-print-tools, html.mpe-patch-notes-page .mpe-article-tags-inner, html.mpe-patch-notes-page .mpe-book-widget-inner, html.mpe-patch-notes-page .gh-read-next:not(.gh-comments), html.mpe-patch-notes-page .gh-comments > div { border-color: var(--patch-board-line-strong) !important; background: rgba(5, 18, 15, 0.34) !important; box-shadow: 0 1rem 2.5rem rgba(0,0,0,0.14); } html.mpe-patch-notes-page[data-color-scheme="light"] .mpe-print-tools, html.mpe-patch-notes-page[data-color-scheme="light"] .mpe-article-tags-inner, html.mpe-patch-notes-page[data-color-scheme="light"] .mpe-book-widget-inner, html.mpe-patch-notes-page[data-color-scheme="light"] .gh-read-next:not(.gh-comments), html.mpe-patch-notes-page[data-color-scheme="light"] .gh-comments > div { background: rgba(252, 255, 250, 0.72) !important; } html.mpe-patch-notes-page .mpe-article-tags-title, html.mpe-patch-notes-page .gh-pagehead-title, html.mpe-patch-notes-page .mpe-book-widget-title { color: var(--patch-board-ink) !important; } html.mpe-patch-notes-page .mpe-article-tag-link, html.mpe-patch-notes-page .mpe-post-route-link, html.mpe-patch-notes-page .mpe-print-tools button, html.mpe-patch-notes-page .mpe-print-tools a { border-color: var(--patch-board-line-strong) !important; color: var(--patch-board-ink) !important; background: rgba(255,255,255,0.04) !important; } html.mpe-patch-notes-page[data-color-scheme="light"] .mpe-article-tag-link, html.mpe-patch-notes-page[data-color-scheme="light"] .mpe-post-route-link, html.mpe-patch-notes-page[data-color-scheme="light"] .mpe-print-tools button, html.mpe-patch-notes-page[data-color-scheme="light"] .mpe-print-tools a { background: rgba(255,255,255,0.58) !important; } html.mpe-patch-notes-page .mpe-article-tag-link:hover, html.mpe-patch-notes-page .mpe-post-route-link:hover, html.mpe-patch-notes-page .mpe-print-tools button:hover, html.mpe-patch-notes-page .mpe-print-tools a:hover { color: #071b17 !important; background: var(--patch-accent) !important; } /* Ghost bookmark cards stay legible on board skins. */ html.mpe-patch-notes-page .kg-bookmark-container, html.mpe-patch-notes-page .kg-bookmark-content, html.mpe-patch-notes-page .kg-bookmark-title, html.mpe-patch-notes-page .kg-bookmark-description, html.mpe-patch-notes-page .kg-bookmark-metadata { color: #111820 !important; } html.mpe-patch-notes-page .gh-foot { position: relative; z-index: 2; background: rgba(4, 16, 14, 0.58) !important; border-color: var(--patch-board-line-strong) !important; } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-foot { background: rgba(244, 251, 246, 0.72) !important; } @media (max-width: 767px) { html.mpe-patch-notes-page, html.mpe-patch-notes-page body { width: 100%; max-width: 100vw; overflow-x: hidden; } html.mpe-patch-notes-page .gh-article { width: min(100% - 18px, calc(var(--patch-max) + 1rem)); margin-top: 1.25rem; padding: 0.72rem; border-radius: 13px; } html.mpe-patch-notes-page .gh-article-header, html.mpe-patch-notes-page .gh-content, html.mpe-patch-notes-page .mpe-post-routes { max-width: 100%; } html.mpe-patch-notes-page .gh-content blockquote, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt { width: calc(100% - 0.25rem); padding: 1.45rem 1.0rem 1.18rem; margin: 1.9rem auto; border-radius: 4px 13px 6px 11px; transform: rotate(-0.32deg); } html.mpe-patch-notes-page .gh-content blockquote::before, html.mpe-patch-notes-page .gh-content blockquote::after, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::before, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::after { width: 0.94rem; height: 0.94rem; top: -0.48rem; } html.mpe-patch-notes-page .gh-content blockquote::before, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::before { left: 0.78rem; } html.mpe-patch-notes-page .gh-content blockquote::after, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::after { right: 0.78rem; } } @media (prefers-reduced-motion: reduce) { html.mpe-patch-notes-page *, html.mpe-patch-notes-page *::before, html.mpe-patch-notes-page *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; } } /* ===================================================================== Patch Notes board pass — full-board surface, pinned notes, pinned images ===================================================================== */ html.mpe-patch-notes-page { --patch-board-wood: #231812; --patch-frame-line: rgba(236, 231, 209, 0.28); --patch-max: 760px; } html.mpe-patch-notes-page[data-color-scheme="light"] { --patch-board-wood: #d8ded8; --patch-frame-line: rgba(26, 45, 47, 0.18); } html.mpe-patch-notes-page body { background: linear-gradient(rgba(9, 28, 24, 0.58), rgba(7, 18, 17, 0.62)), url('../mpe/patch-chalkboard.jpg') center center / cover fixed no-repeat, #071411 !important; } html.mpe-patch-notes-page[data-color-scheme="light"] body { background: radial-gradient(circle at 18% 12%, rgba(35, 64, 58, 0.045), transparent 22rem), radial-gradient(circle at 84% 20%, rgba(206, 174, 84, 0.075), transparent 28rem), linear-gradient(0deg, rgba(34, 57, 58, 0.035) 0 1px, transparent 1px 31px), linear-gradient(90deg, rgba(34, 57, 58, 0.025) 0 1px, transparent 1px 31px), linear-gradient(135deg, #f9fdf8, #eff7f1 54%, #f8fdf8) !important; } html.mpe-patch-notes-page body::before { background: radial-gradient(ellipse at 12% 8%, rgba(255,255,255,0.10), transparent 24rem), radial-gradient(ellipse at 78% 30%, rgba(255,255,255,0.06), transparent 20rem), radial-gradient(ellipse at 34% 78%, rgba(255,255,255,0.055), transparent 26rem), repeating-linear-gradient(178deg, transparent 0 33px, rgba(255,255,255,0.018) 34px, transparent 36px) !important; opacity: 0.48 !important; mix-blend-mode: screen !important; } html.mpe-patch-notes-page[data-color-scheme="light"] body::before { background: radial-gradient(ellipse at 10% 10%, rgba(64, 94, 92, 0.065), transparent 22rem), radial-gradient(ellipse at 82% 34%, rgba(20, 70, 72, 0.04), transparent 25rem), repeating-linear-gradient(178deg, transparent 0 33px, rgba(41, 62, 62, 0.018) 34px, transparent 36px) !important; opacity: 0.78 !important; mix-blend-mode: multiply !important; } html.mpe-patch-notes-page body::after { background: linear-gradient(90deg, rgba(0,0,0,0.30), transparent 9%, transparent 91%, rgba(0,0,0,0.30)), linear-gradient(180deg, rgba(0,0,0,0.20), transparent 8rem, transparent calc(100% - 8rem), rgba(0,0,0,0.22)) !important; opacity: 0.48 !important; } html.mpe-patch-notes-page[data-color-scheme="light"] body::after { background: linear-gradient(90deg, rgba(185, 196, 190, 0.38), transparent 8%, transparent 92%, rgba(185, 196, 190, 0.38)), linear-gradient(180deg, rgba(210, 220, 214, 0.45), transparent 7rem, transparent calc(100% - 7rem), rgba(210, 220, 214, 0.45)) !important; opacity: 0.70 !important; } /* Header/footer become board frames instead of generic theme bars. */ html.mpe-patch-notes-page .gh-head { background: linear-gradient(180deg, rgba(38, 26, 17, 0.98), rgba(13, 31, 26, 0.96)) !important; border-bottom: 1px solid var(--patch-frame-line) !important; box-shadow: inset 0 -1px 0 rgba(255,255,255,0.06), 0 0.7rem 1.9rem rgba(0,0,0,0.20) !important; } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-head { background: linear-gradient(180deg, rgba(226, 233, 228, 0.97), rgba(247, 252, 248, 0.96)) !important; border-bottom: 1px solid rgba(38, 58, 60, 0.16) !important; box-shadow: inset 0 -4px 0 rgba(177, 187, 181, 0.36), 0 0.65rem 1.7rem rgba(42, 55, 54, 0.10) !important; } html.mpe-patch-notes-page body.is-head-stacked .gh-head-menu::before, html.mpe-patch-notes-page body.is-head-stacked .gh-head-menu::after, html.mpe-patch-notes-page .gh-head-inner, html.mpe-patch-notes-page .gh-topic-header, html.mpe-patch-notes-page .gh-topic-footer, html.mpe-patch-notes-page .gh-read-next .gh-pagehead-title::after, html.mpe-patch-notes-page .gh-comments .gh-pagehead-title::after { background-color: var(--patch-frame-line) !important; } html.mpe-patch-notes-page .gh-foot { background: linear-gradient(180deg, rgba(9, 26, 22, 0.90), rgba(34, 23, 16, 0.98)) !important; border-top: 1px solid var(--patch-frame-line) !important; box-shadow: inset 0 4px 0 rgba(255,255,255,0.035) !important; } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-foot { background: linear-gradient(180deg, rgba(247, 252, 248, 0.96), rgba(221, 229, 224, 0.97)) !important; border-top: 1px solid rgba(38, 58, 60, 0.16) !important; } /* Let the board be the page. Content is placed on it; no opaque mega-frame. */ html.mpe-patch-notes-page .gh-article { width: 100% !important; max-width: none !important; margin: clamp(2rem, 4vw, 4.5rem) auto !important; padding: clamp(1.4rem, 2.6vw, 2.6rem) 0 clamp(2.4rem, 4.4vw, 4.6rem) !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; backdrop-filter: none !important; } html.mpe-patch-notes-page .gh-article::before, html.mpe-patch-notes-page .gh-article::after { content: none !important; } html.mpe-patch-notes-page .gh-article-header, html.mpe-patch-notes-page .gh-content, html.mpe-patch-notes-page .mpe-post-routes { width: min(100% - 32px, var(--patch-max)) !important; max-width: var(--patch-max) !important; margin-left: auto !important; margin-right: auto !important; } html.mpe-patch-notes-page .gh-article-title, html.mpe-patch-notes-page .gh-content h2, html.mpe-patch-notes-page .gh-content h3, html.mpe-patch-notes-page .gh-content h4 { text-shadow: 0 0 1px rgba(255,255,255,0.35), 0 0 0.55rem rgba(255,255,255,0.05) !important; } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-article-title, html.mpe-patch-notes-page[data-color-scheme="light"] .gh-content h2, html.mpe-patch-notes-page[data-color-scheme="light"] .gh-content h3, html.mpe-patch-notes-page[data-color-scheme="light"] .gh-content h4 { text-shadow: 0 1px 0 rgba(255,255,255,0.88) !important; } /* Related/Latest should match Concepts & Topics globally, not fill the board. */ html.mpe-patch-notes-page .gh-read-next:not(.gh-comments) { width: min(100% - 32px, var(--patch-max)) !important; max-width: var(--patch-max) !important; margin-left: auto !important; margin-right: auto !important; padding: 1.25rem 1.35rem 1.45rem !important; border: 1px solid var(--patch-board-line-strong) !important; border-radius: 16px !important; background: rgba(4, 17, 15, 0.26) !important; box-shadow: 0 1rem 2.6rem rgba(0,0,0,0.12) !important; } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-read-next:not(.gh-comments) { background: rgba(252, 255, 250, 0.54) !important; box-shadow: 0 1rem 2.6rem rgba(42, 54, 49, 0.09) !important; } /* Notebook paper: robust card background in both modes. */ html.mpe-patch-notes-page .gh-content blockquote, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt { width: min(100%, 620px) !important; margin: 2.35rem auto !important; padding: 1.55rem 1.55rem 1.35rem 3.05rem !important; border: 0 !important; border-radius: 9px 14px 10px 12px !important; background-color: #fff8da !important; background-image: linear-gradient(90deg, transparent 0 2.0rem, rgba(212, 73, 60, 0.42) 2.06rem 2.12rem, transparent 2.18rem), repeating-linear-gradient(180deg, transparent 0 1.54rem, rgba(42, 115, 190, 0.18) 1.58rem, transparent 1.67rem), linear-gradient(135deg, rgba(255,255,255,0.92), rgba(255, 250, 220, 0.96) 50%, rgba(244, 230, 182, 0.96)) !important; color: #142128 !important; box-shadow: 0 1.25rem 3.2rem rgba(0,0,0,0.24), inset 0 0 0 1px rgba(64, 38, 10, 0.10), inset 0 -0.7rem 1.7rem rgba(99, 65, 15, 0.08) !important; text-align: center !important; transform: rotate(-0.45deg) !important; clip-path: polygon(0.5% 3%, 3% 1.4%, 8% 2.4%, 14% 1.2%, 21% 2.7%, 28% 1.1%, 35% 2.1%, 43% 1.4%, 51% 2.8%, 59% 1.2%, 67% 2.2%, 75% 1.4%, 83% 2.4%, 91% 1.1%, 99.2% 2.2%, 99.5% 96%, 95% 97.7%, 89% 96.2%, 82% 98.1%, 75% 96.6%, 68% 97.8%, 61% 96.2%, 54% 98%, 47% 96.6%, 40% 97.8%, 33% 96.2%, 26% 98%, 19% 96.6%, 12% 97.8%, 5% 96.2%, 0.6% 98%) !important; } html.mpe-patch-notes-page .gh-content blockquote:nth-of-type(2n), html.mpe-patch-notes-page .gh-content .kg-blockquote-alt:nth-of-type(2n) { transform: rotate(0.35deg) !important; } html.mpe-patch-notes-page .gh-content blockquote p, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt p { color: #142128 !important; text-shadow: none !important; } /* Pins sit above clipped paper as magnets. */ html.mpe-patch-notes-page .gh-content blockquote::before, html.mpe-patch-notes-page .gh-content blockquote::after, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::before, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::after { z-index: 3 !important; clip-path: none !important; } /* Pinned images: tight frames, not full-width slabs. */ html.mpe-patch-notes-page .gh-article-image, html.mpe-patch-notes-page .gh-content figure.kg-image-card, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card, html.mpe-patch-notes-page .kg-card.kg-bookmark-card { position: relative !important; width: fit-content !important; max-width: min(100%, var(--patch-max)) !important; margin: 2.4rem auto !important; padding: 0.55rem !important; border-radius: 13px !important; border: 1px solid var(--patch-board-line-strong) !important; background: rgba(4, 17, 15, 0.28) !important; box-shadow: 0 1rem 2.5rem rgba(0,0,0,0.20) !important; overflow: visible !important; } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-article-image, html.mpe-patch-notes-page[data-color-scheme="light"] .gh-content figure.kg-image-card, html.mpe-patch-notes-page[data-color-scheme="light"] .gh-content figure.kg-gallery-card, html.mpe-patch-notes-page[data-color-scheme="light"] .kg-card.kg-bookmark-card { background: rgba(253, 255, 250, 0.62) !important; box-shadow: 0 1rem 2.4rem rgba(42, 54, 49, 0.12) !important; } html.mpe-patch-notes-page .gh-article-image img, html.mpe-patch-notes-page .kg-image-card img, html.mpe-patch-notes-page .kg-gallery-image img { display: block !important; width: auto !important; max-width: 100% !important; margin: 0 auto !important; border-radius: 9px !important; } html.mpe-patch-notes-page .gh-article-image::before, html.mpe-patch-notes-page .gh-article-image::after, html.mpe-patch-notes-page .gh-content figure.kg-image-card::before, html.mpe-patch-notes-page .gh-content figure.kg-image-card::after, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card::before, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card::after { content: ""; position: absolute; top: -0.62rem; width: 1.05rem; height: 1.05rem; border-radius: 999px; background: radial-gradient(circle at 33% 30%, rgba(255,255,255,0.92), transparent 0.20rem), radial-gradient(circle at 50% 55%, #e43737, #911010 72%); box-shadow: 0 0.28rem 0.62rem rgba(0,0,0,0.25), inset 0 0 0 1px rgba(40,0,0,0.22); z-index: 5; } html.mpe-patch-notes-page .gh-article-image::before, html.mpe-patch-notes-page .gh-content figure.kg-image-card::before, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card::before { left: 1rem; } html.mpe-patch-notes-page .gh-article-image::after, html.mpe-patch-notes-page .gh-content figure.kg-image-card::after, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card::after { right: 1rem; background: radial-gradient(circle at 33% 30%, rgba(255,255,255,0.92), transparent 0.20rem), radial-gradient(circle at 50% 55%, #2e9cff, #1157a8 72%); } /* Topic/book sections sit as small board trays, not full-width slabs. */ html.mpe-patch-notes-page .mpe-article-tags-inner, html.mpe-patch-notes-page .mpe-book-widget-inner, html.mpe-patch-notes-page .gh-comments > div { width: min(100% - 32px, var(--patch-max)) !important; max-width: var(--patch-max) !important; margin-left: auto !important; margin-right: auto !important; } @media (max-width: 767px) { html.mpe-patch-notes-page .gh-article { width: 100% !important; margin-top: 1rem !important; padding: 0 0 2.5rem !important; } html.mpe-patch-notes-page .gh-article-header, html.mpe-patch-notes-page .gh-content, html.mpe-patch-notes-page .mpe-post-routes, html.mpe-patch-notes-page .gh-read-next:not(.gh-comments), html.mpe-patch-notes-page .mpe-article-tags-inner, html.mpe-patch-notes-page .mpe-book-widget-inner { width: min(100% - 22px, var(--patch-max)) !important; max-width: calc(100vw - 22px) !important; } html.mpe-patch-notes-page .gh-content blockquote, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt { width: min(100%, calc(100vw - 30px)) !important; padding: 1.35rem 0.9rem 1.08rem 2.55rem !important; margin: 1.95rem auto !important; } html.mpe-patch-notes-page .gh-article-image, html.mpe-patch-notes-page .gh-content figure.kg-image-card, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card, html.mpe-patch-notes-page .kg-card.kg-bookmark-card { max-width: calc(100vw - 26px) !important; padding: 0.42rem !important; } } /* ===================================================================== Patch Notes board correction pass — author layout, magnets, header frame, chalk/marker details. ===================================================================== */ /* The base theme expects an off-to-the-left author sidebar. On the board skin it must be a normal pinned header row, otherwise it overlaps the title/body. */ html.mpe-patch-notes-page .gh-article-header { display: block !important; width: min(100% - 32px, var(--patch-max)) !important; max-width: var(--patch-max) !important; margin-left: auto !important; margin-right: auto !important; justify-items: initial !important; } html.mpe-patch-notes-page .gh-article-header > * { grid-column: auto !important; } html.mpe-patch-notes-page .gh-article-sidebar { position: relative !important; left: auto !important; top: auto !important; grid-column: auto !important; display: grid !important; grid-template-columns: auto auto 1fr !important; align-items: center !important; column-gap: 0.85rem !important; margin: 1.35rem 0 1.8rem !important; padding: 0 !important; width: 100% !important; max-width: none !important; } html.mpe-patch-notes-page .gh-article-sidebar .gh-author-image-list { grid-row: 1 / 3 !important; margin: 0 !important; } html.mpe-patch-notes-page .gh-article-sidebar .gh-author-name-list { align-self: end !important; } html.mpe-patch-notes-page .gh-article-sidebar .gh-article-meta { align-self: start !important; margin-top: 0 !important; } html.mpe-patch-notes-page .gh-article-sidebar .gh-button-share { grid-column: 3 !important; grid-row: 1 / 3 !important; justify-self: end !important; align-self: center !important; margin: 0 !important; } html.mpe-patch-notes-page .gh-author-image-list .gh-author-image:only-child, html.mpe-patch-notes-page .gh-article-sidebar .gh-author-image { width: 46px !important; height: 46px !important; margin: 0 !important; } /* Remove accidental gray/light panels from the stacked header. */ html.mpe-patch-notes-page .gh-head-inner, html.mpe-patch-notes-page .gh-head-brand, html.mpe-patch-notes-page .gh-head-menu, html.mpe-patch-notes-page .gh-head-actions { background: transparent !important; background-color: transparent !important; } html.mpe-patch-notes-page .gh-head { background: linear-gradient(180deg, rgba(30, 22, 16, 0.96), rgba(7, 24, 20, 0.96)) !important; } html.mpe-patch-notes-page[data-color-scheme="light"] .gh-head { background: linear-gradient(180deg, rgba(228, 235, 230, 0.98), rgba(248, 253, 249, 0.98)) !important; } /* Notebook cards: stop clipping the magnets; keep the paper readable. */ html.mpe-patch-notes-page .gh-content blockquote, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt { overflow: visible !important; clip-path: none !important; border-radius: 8px 15px 7px 14px !important; } html.mpe-patch-notes-page .gh-content blockquote::before, html.mpe-patch-notes-page .gh-content blockquote::after, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::before, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::after { top: -0.38rem !important; width: 1.42rem !important; height: 1.42rem !important; background: radial-gradient(circle at 34% 28%, rgba(255,255,255,0.92), transparent 0.25rem), radial-gradient(circle at 50% 56%, #f4d84a, #b28406 72%) !important; box-shadow: 0 0.28rem 0.7rem rgba(0,0,0,0.30), inset 0 0 0 1px rgba(52, 37, 0, 0.28), inset 0 -0.16rem 0.28rem rgba(36, 23, 0, 0.18) !important; } html.mpe-patch-notes-page .gh-content blockquote::before, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::before { left: 1.05rem !important; } html.mpe-patch-notes-page .gh-content blockquote::after, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::after { right: 1.05rem !important; background: radial-gradient(circle at 34% 28%, rgba(255,255,255,0.92), transparent 0.25rem), radial-gradient(circle at 50% 56%, #8ff0a7, #248a50 72%) !important; } /* Images are physical attachments on the board. Give chalk mode the same compact white/paper frame as light mode, then pin it. */ html.mpe-patch-notes-page .gh-article-image, html.mpe-patch-notes-page .gh-content figure.kg-image-card, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card, html.mpe-patch-notes-page .kg-card.kg-bookmark-card { padding: 0.58rem !important; border: 1px solid rgba(24, 41, 39, 0.18) !important; background: linear-gradient(135deg, rgba(255,255,255,0.96), rgba(243, 248, 241, 0.92)) !important; box-shadow: 0 1rem 2.6rem rgba(0,0,0,0.22), inset 0 0 0 1px rgba(255,255,255,0.60) !important; } html.mpe-patch-notes-page .gh-article-image::before, html.mpe-patch-notes-page .gh-article-image::after, html.mpe-patch-notes-page .gh-content figure.kg-image-card::before, html.mpe-patch-notes-page .gh-content figure.kg-image-card::after, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card::before, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card::after { top: -0.36rem !important; width: 1.46rem !important; height: 1.46rem !important; background: radial-gradient(circle at 34% 28%, rgba(255,255,255,0.92), transparent 0.25rem), radial-gradient(circle at 50% 56%, #f4d84a, #ae8105 72%) !important; box-shadow: 0 0.30rem 0.72rem rgba(0,0,0,0.32), inset 0 0 0 1px rgba(52, 37, 0, 0.30), inset 0 -0.16rem 0.28rem rgba(36, 23, 0, 0.18) !important; } html.mpe-patch-notes-page .gh-article-image::before, html.mpe-patch-notes-page .gh-content figure.kg-image-card::before, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card::before { left: 1.05rem !important; } html.mpe-patch-notes-page .gh-article-image::after, html.mpe-patch-notes-page .gh-content figure.kg-image-card::after, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card::after { right: 1.05rem !important; background: radial-gradient(circle at 34% 28%, rgba(255,255,255,0.92), transparent 0.25rem), radial-gradient(circle at 50% 56%, #8ff0a7, #248a50 72%) !important; } /* Chalk/marker treatment for body text and custom tile bullets. */ html.mpe-patch-notes-page[data-color-scheme="dark"] .gh-content p, html.mpe-patch-notes-page[data-color-scheme="dark"] .gh-content li { text-shadow: 0 0 1px rgba(255,255,255,0.18), 0 0 0.28rem rgba(255,255,255,0.045) !important; } html.mpe-patch-notes-page[data-color-scheme="dark"] ul.mpe-tilelist > li::before { filter: grayscale(1) brightness(2.3) contrast(0.55) drop-shadow(0 0 0.05rem rgba(255,255,255,0.55)) !important; opacity: 0.78 !important; } html.mpe-patch-notes-page[data-color-scheme="light"] ul.mpe-tilelist > li::before { filter: saturate(1.15) contrast(0.92) drop-shadow(0 0.03rem 0 rgba(255,255,255,0.70)) !important; opacity: 0.88 !important; } /* Related/latest should use the same centered compact tray as topics. */ html.mpe-patch-notes-page .gh-read-next:not(.gh-comments) { display: block !important; } html.mpe-patch-notes-page .gh-read-next:not(.gh-comments) .gh-pagehead, html.mpe-patch-notes-page .gh-read-next:not(.gh-comments) .gh-topic, html.mpe-patch-notes-page .gh-read-next:not(.gh-comments) .gh-topic-content { max-width: 100% !important; width: 100% !important; margin-left: auto !important; margin-right: auto !important; } @media (max-width: 767px) { html.mpe-patch-notes-page .gh-article-header { width: min(100% - 22px, var(--patch-max)) !important; max-width: calc(100vw - 22px) !important; } html.mpe-patch-notes-page .gh-article-sidebar { margin: 1rem 0 1.35rem !important; column-gap: 0.7rem !important; } html.mpe-patch-notes-page .gh-article-sidebar .gh-button-share { font-size: 0.92em !important; padding-inline: 0.95rem !important; } html.mpe-patch-notes-page .gh-content blockquote::before, html.mpe-patch-notes-page .gh-content blockquote::after, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::before, html.mpe-patch-notes-page .gh-content .kg-blockquote-alt::after, html.mpe-patch-notes-page .gh-article-image::before, html.mpe-patch-notes-page .gh-article-image::after, html.mpe-patch-notes-page .gh-content figure.kg-image-card::before, html.mpe-patch-notes-page .gh-content figure.kg-image-card::after, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card::before, html.mpe-patch-notes-page .gh-content figure.kg-gallery-card::after { width: 1.18rem !important; height: 1.18rem !important; top: -0.28rem !important; } }