/* ===================================================================== Page skin: Applied Case: The Secret Applies only when has .mpe-secret-page. URLs activated in default.hbs: - /p/5b9bfd9a-7a48-47d7-8005-c0fd941af2ce/ - /applied-case-the-secret/ ===================================================================== */ html.mpe-secret-page { --secret-black: #070406; --secret-black-2: #11070b; --secret-red: #3e0e13; --secret-red-2: #6e1d21; --secret-gold: #f2cf63; --secret-gold-2: #b8872f; --secret-gold-soft: rgba(242, 207, 99, 0.18); --secret-paper: #f3e2bd; --secret-text: #efe7d3; --secret-muted: #c7b99d; --secret-panel: rgba(12, 6, 8, 0.76); --secret-panel-strong: rgba(12, 6, 8, 0.88); --secret-panel-border: rgba(242, 207, 99, 0.22); --secret-pattern-opacity: 0.32; } html.mpe-secret-page[data-color-scheme="light"] { --secret-black: #f4e5c4; --secret-black-2: #ead2a2; --secret-red: #f6e1b6; --secret-red-2: #b14532; --secret-gold: #8b5e16; --secret-gold-2: #c7932f; --secret-gold-soft: rgba(139, 94, 22, 0.16); --secret-paper: #fff4d6; --secret-text: #26170f; --secret-muted: #6c4d2c; --secret-panel: rgba(255, 247, 224, 0.84); --secret-panel-strong: rgba(255, 249, 232, 0.92); --secret-panel-border: rgba(139, 94, 22, 0.26); --secret-pattern-opacity: 0.26; } /* Make sure the Entropy Debt layer wins over any one-off page backgrounds. */ .edw-substrate { z-index: 2147482000; } .edw-rollback-flash { z-index: 2147483000; } html.mpe-secret-page, html.mpe-secret-page body { min-height: 100%; } html.mpe-secret-page body { position: relative; overflow-x: hidden; background: var(--secret-black) !important; color: var(--secret-text); } html.mpe-secret-page body::before, html.mpe-secret-page body::after { content: ""; position: fixed; inset: 0; pointer-events: none; } html.mpe-secret-page body::before { z-index: 0; background: radial-gradient(circle at 50% 11%, rgba(242, 207, 99, 0.15), transparent 18rem), radial-gradient(circle at 15% 24%, rgba(184, 135, 47, 0.23), transparent 20rem), radial-gradient(circle at 84% 18%, rgba(110, 29, 33, 0.48), transparent 22rem), radial-gradient(circle at 78% 84%, rgba(242, 207, 99, 0.13), transparent 18rem), linear-gradient(180deg, var(--secret-black-2) 0%, var(--secret-black) 42%, #050406 100%); } html.mpe-secret-page[data-color-scheme="light"] body::before { background: radial-gradient(circle at 50% 9%, rgba(255, 236, 169, 0.62), transparent 19rem), radial-gradient(circle at 14% 24%, rgba(183, 127, 38, 0.24), transparent 22rem), radial-gradient(circle at 86% 18%, rgba(177, 69, 50, 0.18), transparent 21rem), radial-gradient(circle at 78% 84%, rgba(139, 94, 22, 0.12), transparent 18rem), linear-gradient(180deg, #f4e4bd 0%, #f7eed7 45%, #ecd6a8 100%); } /* MPE-safe homage texture: red lacquer, gold dust, concentric field seals, Penrose/Chirality geometry. */ html.mpe-secret-page body::after { z-index: 0; opacity: var(--secret-pattern-opacity); background-image: radial-gradient(circle at 10% 19%, transparent 0 3.2rem, rgba(242, 207, 99, 0.42) 3.3rem 3.45rem, transparent 3.56rem), radial-gradient(circle at 92% 28%, transparent 0 4.4rem, rgba(242, 207, 99, 0.36) 4.5rem 4.7rem, transparent 4.82rem), radial-gradient(circle at 7% 78%, transparent 0 5.2rem, rgba(242, 207, 99, 0.28) 5.32rem 5.56rem, transparent 5.72rem), radial-gradient(circle at 94% 82%, transparent 0 3.7rem, rgba(242, 207, 99, 0.24) 3.82rem 4rem, transparent 4.12rem), url("../images/penrose-pattern.svg"), repeating-conic-gradient(from 18deg, rgba(242, 207, 99, 0.13) 0 7deg, transparent 7deg 20deg), linear-gradient(90deg, rgba(110, 29, 33, 0.48), transparent 22%, transparent 78%, rgba(110, 29, 33, 0.48)); background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 36rem auto, 18rem 18rem, 100% 100%; background-position: center, center, center, center, center top, center, center; background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat, repeat, no-repeat; filter: sepia(0.15) saturate(1.18) contrast(1.05); mix-blend-mode: screen; } html.mpe-secret-page[data-color-scheme="light"] body::after { mix-blend-mode: multiply; filter: sepia(0.18) saturate(1.05) contrast(0.98); } @media (min-width: 1100px) { html.mpe-secret-page body::after { --secret-center-width: 1000px; --secret-gutter: calc((100vw - var(--secret-center-width)) / 2); -webkit-mask-image: linear-gradient( 90deg, #000 0, #000 calc(var(--secret-gutter) + 2rem), rgba(0, 0, 0, 0.25) calc(var(--secret-gutter) + 8rem), transparent calc(var(--secret-gutter) + 13rem), transparent calc(100% - var(--secret-gutter) - 13rem), rgba(0, 0, 0, 0.25) calc(100% - var(--secret-gutter) - 8rem), #000 calc(100% - var(--secret-gutter) - 2rem), #000 100% ); mask-image: linear-gradient( 90deg, #000 0, #000 calc(var(--secret-gutter) + 2rem), rgba(0, 0, 0, 0.25) calc(var(--secret-gutter) + 8rem), transparent calc(var(--secret-gutter) + 13rem), transparent calc(100% - var(--secret-gutter) - 13rem), rgba(0, 0, 0, 0.25) calc(100% - var(--secret-gutter) - 8rem), #000 calc(100% - var(--secret-gutter) - 2rem), #000 100% ); } } html.mpe-secret-page .gh-site, html.mpe-secret-page .gh-main { position: relative; z-index: 1; background: transparent !important; } html.mpe-secret-page .gh-head { background: linear-gradient(180deg, rgba(12, 6, 8, 0.92), rgba(12, 6, 8, 0.78)) !important; border-bottom: 1px solid rgba(242, 207, 99, 0.14); box-shadow: 0 1px 0 rgba(242, 207, 99, 0.08), 0 18px 60px rgba(0, 0, 0, 0.12); backdrop-filter: blur(7px); } html.mpe-secret-page[data-color-scheme="light"] .gh-head { background: linear-gradient(180deg, rgba(255, 247, 224, 0.94), rgba(245, 226, 184, 0.82)) !important; } html.mpe-secret-page body.is-head-stacked .gh-head-menu::before, html.mpe-secret-page body.is-head-stacked .gh-head-menu::after, html.mpe-secret-page .gh-head-inner, html.mpe-secret-page .gh-topic-header, html.mpe-secret-page .gh-topic-footer, html.mpe-secret-page .gh-read-next .gh-pagehead-title::after, html.mpe-secret-page .gh-comments .gh-pagehead-title::after { background-color: rgba(242, 207, 99, 0.18) !important; border-color: rgba(242, 207, 99, 0.18) !important; } html.mpe-secret-page .gh-head a, html.mpe-secret-page .gh-search, html.mpe-secret-page .nav-more-toggle, html.mpe-secret-page .mpe-theme-toggle, html.mpe-secret-page .mpe-profanity-toggle, html.mpe-secret-page .gh-burger { color: var(--secret-paper) !important; } html.mpe-secret-page[data-color-scheme="light"] .gh-head a, html.mpe-secret-page[data-color-scheme="light"] .gh-search, html.mpe-secret-page[data-color-scheme="light"] .nav-more-toggle, html.mpe-secret-page[data-color-scheme="light"] .mpe-theme-toggle, html.mpe-secret-page[data-color-scheme="light"] .mpe-profanity-toggle, html.mpe-secret-page[data-color-scheme="light"] .gh-burger { color: #2a150e !important; } html.mpe-secret-page .gh-burger::before, html.mpe-secret-page .gh-burger::after { background-color: currentColor !important; } html.mpe-secret-page .edw-event { position: relative; z-index: 3; } html.mpe-secret-page .gh-article { position: relative; isolation: isolate; padding-top: 1rem; } html.mpe-secret-page .gh-article::before { content: ""; position: absolute; z-index: 0; top: -3rem; bottom: -6rem; left: 50%; width: min(calc(100% - var(--gap) * 1.2), 92rem); transform: translateX(-50%); border: 1px solid var(--secret-panel-border); border-radius: 28px; background: radial-gradient(circle at 50% 0%, rgba(242, 207, 99, 0.12), transparent 22rem), linear-gradient(180deg, var(--secret-panel), var(--secret-panel-strong)); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.02) inset, 0 28px 80px rgba(0, 0, 0, 0.20); } html.mpe-secret-page[data-color-scheme="light"] .gh-article::before { box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.36) inset, 0 26px 72px rgba(80, 41, 7, 0.10); } html.mpe-secret-page .gh-article > *, html.mpe-secret-page .gh-content > * { position: relative; z-index: 1; } html.mpe-secret-page .gh-article-header { padding-top: 2rem; } html.mpe-secret-page .gh-article-title, html.mpe-secret-page .gh-content h1, html.mpe-secret-page .gh-content h2, html.mpe-secret-page .gh-content h3, html.mpe-secret-page .gh-content h4 { color: var(--secret-gold); text-shadow: 0 1px 0 rgba(255, 246, 204, 0.10), 0 3px 16px rgba(0, 0, 0, 0.28), 0 0 26px rgba(242, 207, 99, 0.12); } @supports ((-webkit-background-clip: text) or (background-clip: text)) { html.mpe-secret-page .gh-article-title, html.mpe-secret-page .gh-content h1, html.mpe-secret-page .gh-content h2, html.mpe-secret-page .gh-content h3, html.mpe-secret-page .gh-content h4 { background-image: radial-gradient(circle at 12% 35%, #fff6c8 0 0.08em, transparent 0.09em), radial-gradient(circle at 62% 18%, #ffe48d 0 0.07em, transparent 0.08em), radial-gradient(circle at 86% 72%, #c58b2f 0 0.08em, transparent 0.09em), linear-gradient(115deg, #fff3b0 0%, var(--secret-gold) 34%, #9b641b 58%, #f8dc79 84%, #fff6cf 100%); background-size: 0.72em 0.72em, 0.88em 0.88em, 1.1em 1.1em, 100% 100%; background-position: 0 0, 0.2em 0.1em, 0.45em 0.28em, center; -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; } } html.mpe-secret-page .gh-article-excerpt, html.mpe-secret-page .gh-content, html.mpe-secret-page .gh-content p, html.mpe-secret-page .gh-content li { color: var(--secret-text) !important; } html.mpe-secret-page .gh-article-excerpt { font-size: clamp(2rem, 1.6rem + 0.5vw, 2.5rem); text-shadow: 0 2px 12px rgba(0, 0, 0, 0.34); } html.mpe-secret-page[data-color-scheme="light"] .gh-article-excerpt { text-shadow: 0 1px 0 rgba(255, 255, 255, 0.58); } html.mpe-secret-page .gh-content { font-size: clamp(1.9rem, 1.72rem + 0.22vw, 2.08rem); line-height: 1.74; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.22); } html.mpe-secret-page[data-color-scheme="light"] .gh-content { text-shadow: 0 1px 0 rgba(255, 255, 255, 0.64); } html.mpe-secret-page .gh-content a:not(.kg-bookmark-container), html.mpe-secret-page .gh-article-tag { color: var(--secret-gold) !important; text-decoration-color: rgba(242, 207, 99, 0.52); text-underline-offset: 0.18em; } html.mpe-secret-page .gh-article-meta, html.mpe-secret-page figcaption, html.mpe-secret-page .gh-card-footer, html.mpe-secret-page .gh-copyright { color: var(--secret-muted) !important; } html.mpe-secret-page .gh-content blockquote:not([class]) { border-left-color: var(--secret-gold); background: linear-gradient(90deg, var(--secret-gold-soft), transparent 88%); color: var(--secret-text); padding-block: 1.15rem; padding-right: 1.2rem; border-radius: 0 12px 12px 0; } html.mpe-secret-page .gh-content hr { background: linear-gradient(90deg, transparent, rgba(242, 207, 99, 0.42), transparent); } html.mpe-secret-page .gh-content :not(pre) > code, html.mpe-secret-page .gh-content pre { border: 1px solid var(--secret-panel-border); background: rgba(0, 0, 0, 0.36); color: var(--secret-paper); } html.mpe-secret-page[data-color-scheme="light"] .gh-content :not(pre) > code, html.mpe-secret-page[data-color-scheme="light"] .gh-content pre { background: rgba(255, 247, 224, 0.78); color: #3a220f; } html.mpe-secret-page .gh-content figure.kg-image-card img, html.mpe-secret-page .kg-bookmark-card a.kg-bookmark-container, html.mpe-secret-page .kg-bookmark-card .kg-bookmark-container, html.mpe-secret-page .kg-card.kg-callout-card { border-color: var(--secret-panel-border) !important; box-shadow: 0 0 0 1px rgba(242, 207, 99, 0.10), 0 18px 50px rgba(0, 0, 0, 0.24); } html.mpe-secret-page .kg-bookmark-card a.kg-bookmark-container, html.mpe-secret-page .kg-bookmark-card .kg-bookmark-container { background: #fff9e8 !important; } html.mpe-secret-page .gh-read-next, html.mpe-secret-page .mpe-article-tags-panel, html.mpe-secret-page .mpe-post-routes, html.mpe-secret-page .gh-comments, html.mpe-secret-page .mpe-book-widget { position: relative; z-index: 1; } html.mpe-secret-page .gh-foot { position: relative; z-index: 1; background: radial-gradient(circle at 50% 0%, rgba(242, 207, 99, 0.12), transparent 20rem), linear-gradient(180deg, rgba(12, 6, 8, 0.82), rgba(5, 4, 6, 0.96)) !important; border-top: 1px solid rgba(242, 207, 99, 0.16); } html.mpe-secret-page[data-color-scheme="light"] .gh-foot { background: radial-gradient(circle at 50% 0%, rgba(139, 94, 22, 0.14), transparent 20rem), linear-gradient(180deg, rgba(240, 218, 177, 0.88), rgba(225, 196, 139, 0.96)) !important; } @media (max-width: 1099px) { html.mpe-secret-page body::after { opacity: calc(var(--secret-pattern-opacity) * 0.56); background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 28rem auto, 15rem 15rem, 100% 100%; } html.mpe-secret-page .gh-article::before { width: min(calc(100% - 2.2rem), 78rem); border-radius: 22px; } } @media (max-width: 767px) { html.mpe-secret-page .gh-article { padding-top: 0; } html.mpe-secret-page .gh-article::before { top: -1.2rem; bottom: -3.2rem; width: calc(100% - 1.4rem); border-radius: 18px; background: radial-gradient(circle at 50% 0%, rgba(242, 207, 99, 0.10), transparent 18rem), linear-gradient(180deg, var(--secret-panel-strong), var(--secret-panel)); } html.mpe-secret-page .gh-article-header { padding-top: 1rem; } html.mpe-secret-page .gh-article-title { font-size: clamp(3.6rem, 12vw, 5.4rem); } html.mpe-secret-page .gh-content { font-size: 1.9rem; line-height: 1.72; } } /* ===================================================================== Secret skin revision: remove visible tile seams / MPE-brand color bleed. Keeps the homage in red-lacquer/gold-paper language and makes the page feel like one continuous Secret-specific field rather than a repeated Penrose wallpaper behind it. ===================================================================== */ html.mpe-secret-page { --secret-pattern-opacity: 0.18; } html.mpe-secret-page[data-color-scheme="light"] { --secret-pattern-opacity: 0.12; } /* Local page field: no repeated Penrose color tile, no hard seams. */ html.mpe-secret-page body::before { background: radial-gradient(ellipse at 50% -8%, rgba(242, 207, 99, 0.18), transparent 32rem), radial-gradient(ellipse at 16% 23%, rgba(177, 61, 45, 0.33), transparent 30rem), radial-gradient(ellipse at 88% 18%, rgba(120, 27, 30, 0.42), transparent 32rem), radial-gradient(ellipse at 52% 82%, rgba(242, 207, 99, 0.09), transparent 36rem), linear-gradient(90deg, rgba(82, 18, 23, 0.30), transparent 22%, transparent 78%, rgba(82, 18, 23, 0.30)), linear-gradient(180deg, #17080c 0%, #0d0508 45%, #050405 100%) !important; } html.mpe-secret-page[data-color-scheme="light"] body::before { background: radial-gradient(ellipse at 50% -8%, rgba(255, 238, 182, 0.62), transparent 33rem), radial-gradient(ellipse at 16% 23%, rgba(177, 69, 50, 0.18), transparent 31rem), radial-gradient(ellipse at 88% 18%, rgba(177, 69, 50, 0.14), transparent 31rem), radial-gradient(ellipse at 52% 82%, rgba(139, 94, 22, 0.10), transparent 36rem), linear-gradient(90deg, rgba(139, 41, 32, 0.08), transparent 22%, transparent 78%, rgba(139, 41, 32, 0.08)), linear-gradient(180deg, #f4e3c0 0%, #f8edd5 45%, #e8cca0 100%) !important; } html.mpe-secret-page body::after { opacity: 1 !important; background-image: radial-gradient(circle at 12% 20%, transparent 0 3.2rem, rgba(242, 207, 99, 0.18) 3.32rem 3.46rem, transparent 3.62rem), radial-gradient(circle at 88% 26%, transparent 0 4.6rem, rgba(177, 69, 50, 0.18) 4.72rem 4.92rem, transparent 5.12rem), radial-gradient(circle at 11% 78%, transparent 0 5.0rem, rgba(242, 207, 99, 0.12) 5.14rem 5.34rem, transparent 5.55rem), radial-gradient(circle at 90% 82%, transparent 0 3.9rem, rgba(177, 69, 50, 0.16) 4.03rem 4.20rem, transparent 4.36rem), repeating-linear-gradient(24deg, transparent 0 22px, rgba(242, 207, 99, 0.030) 22px 23px, transparent 23px 46px), repeating-linear-gradient(96deg, transparent 0 18px, rgba(0, 0, 0, 0.060) 18px 19px, transparent 19px 39px), linear-gradient(90deg, rgba(110, 29, 33, 0.24), transparent 24%, transparent 76%, rgba(110, 29, 33, 0.24)) !important; background-size: 100% 100% !important; background-position: center !important; background-repeat: no-repeat !important; filter: none !important; mix-blend-mode: screen !important; -webkit-mask-image: none !important; mask-image: none !important; } html.mpe-secret-page[data-color-scheme="light"] body::after { background-image: radial-gradient(circle at 12% 20%, transparent 0 3.2rem, rgba(139, 94, 22, 0.13) 3.32rem 3.46rem, transparent 3.62rem), radial-gradient(circle at 88% 26%, transparent 0 4.6rem, rgba(177, 69, 50, 0.10) 4.72rem 4.92rem, transparent 5.12rem), radial-gradient(circle at 11% 78%, transparent 0 5.0rem, rgba(139, 94, 22, 0.09) 5.14rem 5.34rem, transparent 5.55rem), radial-gradient(circle at 90% 82%, transparent 0 3.9rem, rgba(177, 69, 50, 0.10) 4.03rem 4.20rem, transparent 4.36rem), repeating-linear-gradient(24deg, transparent 0 22px, rgba(139, 94, 22, 0.020) 22px 23px, transparent 23px 46px), repeating-linear-gradient(96deg, transparent 0 18px, rgba(110, 29, 33, 0.025) 18px 19px, transparent 19px 39px), linear-gradient(90deg, rgba(177, 69, 50, 0.10), transparent 24%, transparent 76%, rgba(177, 69, 50, 0.10)) !important; mix-blend-mode: multiply !important; } /* Kill inherited full-width frame bands on Secret too. */ html.mpe-secret-page .gh-site, html.mpe-secret-page .gh-main, html.mpe-secret-page .gh-outer, html.mpe-secret-page .gh-inner, html.mpe-secret-page .gh-canvas, html.mpe-secret-page .gh-content, html.mpe-secret-page .gh-read-next, html.mpe-secret-page .gh-comments, html.mpe-secret-page .mpe-post-routes, html.mpe-secret-page .mpe-book-widget-panel, html.mpe-secret-page .gh-topic-footer, html.mpe-secret-page .gh-topic-header { background: transparent !important; box-shadow: none !important; } html.mpe-secret-page .gh-article::before { background: radial-gradient(ellipse at 50% 0%, rgba(242, 207, 99, 0.11), transparent 22rem), linear-gradient(180deg, rgba(20, 8, 10, 0.78), rgba(10, 5, 7, 0.88)) !important; } html.mpe-secret-page[data-color-scheme="light"] .gh-article::before { background: radial-gradient(ellipse at 50% 0%, rgba(255, 235, 166, 0.34), transparent 22rem), linear-gradient(180deg, rgba(255, 247, 226, 0.84), rgba(235, 211, 170, 0.90)) !important; } html.mpe-secret-page .mpe-article-tags-inner, html.mpe-secret-page .mpe-book-widget-inner, html.mpe-secret-page .gh-comments > div { background: radial-gradient(ellipse at 50% 0%, rgba(242, 207, 99, 0.10), transparent 20rem), linear-gradient(180deg, var(--secret-panel), var(--secret-panel-strong)) !important; border: 1px solid var(--secret-panel-border) !important; border-radius: 18px; padding: 2rem; } html.mpe-secret-page .gh-head, html.mpe-secret-page .edw-event__panel, html.mpe-secret-page .gh-foot { background: radial-gradient(ellipse at 50% 0%, rgba(242, 207, 99, 0.10), transparent 20rem), linear-gradient(180deg, rgba(19, 7, 10, 0.94), rgba(9, 5, 6, 0.90)) !important; } html.mpe-secret-page[data-color-scheme="light"] .gh-head, html.mpe-secret-page[data-color-scheme="light"] .edw-event__panel, html.mpe-secret-page[data-color-scheme="light"] .gh-foot { background: radial-gradient(ellipse at 50% 0%, rgba(139, 94, 22, 0.10), transparent 20rem), linear-gradient(180deg, rgba(255, 247, 224, 0.94), rgba(239, 218, 181, 0.88)) !important; } @media (max-width: 767px) { html.mpe-secret-page body::after { opacity: 0.72 !important; } } /* ===================================================================== Mobile custom-skin overflow/zoom guard. Keeps the red/gold theatrical background decorative instead of widening the page, and pans it subtly with scroll via --mpe-skin-pan-x. ===================================================================== */ @media (max-width: 767px) { html.mpe-secret-page, html.mpe-secret-page body { width: 100% !important; max-width: 100vw !important; overflow-x: hidden !important; } html.mpe-secret-page .gh-site, html.mpe-secret-page .gh-main, html.mpe-secret-page .gh-outer, html.mpe-secret-page .gh-inner, html.mpe-secret-page main, html.mpe-secret-page .gh-article, html.mpe-secret-page .gh-content { max-width: 100vw !important; overflow-x: clip !important; } html.mpe-secret-page body::before, html.mpe-secret-page body::after { position: fixed !important; top: 0 !important; bottom: 0 !important; left: -10vw !important; right: auto !important; width: 120vw !important; height: 100vh !important; max-width: none !important; transform: translate3d(var(--mpe-skin-pan-x, 0px), 0, 0) !important; will-change: transform; contain: strict; } html.mpe-secret-page .gh-article::before { left: 0.6rem !important; right: 0.6rem !important; width: auto !important; max-width: none !important; transform: none !important; } } /* Match the temporary Entropy Debt banner frame to the Secret page skin. */ html.mpe-secret-page .edw-event { background: linear-gradient(180deg, rgba(18, 7, 10, 0.96), rgba(9, 5, 6, 0.92)) !important; border-top: 1px solid rgba(242, 207, 99, 0.18) !important; border-bottom: 1px solid rgba(242, 207, 99, 0.18) !important; box-shadow: inset 0 1px 0 rgba(242, 207, 99, 0.07), inset 0 -1px 0 rgba(242, 207, 99, 0.09) !important; } html.mpe-secret-page[data-color-scheme="light"] .edw-event { background: linear-gradient(180deg, rgba(255, 247, 224, 0.96), rgba(239, 218, 181, 0.90)) !important; border-top-color: rgba(139, 94, 22, 0.22) !important; border-bottom-color: rgba(139, 94, 22, 0.22) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.30), inset 0 -1px 0 rgba(139, 94, 22, 0.10) !important; }