
    .sc-placeholder{background:rgba(255,255,255,.3);border:1px solid rgba(0,0,0,.5);
      border-radius:2px;box-sizing:border-box;overflow:hidden}
    @keyframes sc-shine{0%{background-position:100% 50%}100%{background-position:0% 50%}}
    html.sc-dc-streaming .sc-placeholder,
    html.sc-dc-streaming .sc-interp.sc-missing{position:relative;
      background:color-mix(in srgb,currentColor 5%,transparent);
      border-color:transparent}
    html.sc-dc-streaming .sc-placeholder::before,
    html.sc-dc-streaming .sc-interp.sc-missing::before{content:'';
      position:absolute;inset:0;pointer-events:none;
      background:linear-gradient(90deg,rgba(217,119,87,0) 25%,rgba(247,225,211,.95) 37%,rgba(217,119,87,0) 63%);
      background-size:400% 100%;animation:sc-shine 1.4s ease infinite}
    html.sc-dc-streaming .sc-placeholder:nth-child(n+9 of .sc-placeholder)::before,
    html.sc-dc-streaming .sc-interp.sc-missing:nth-child(n+9 of .sc-interp.sc-missing)::before{animation:none;
      background:color-mix(in srgb,currentColor 8%,transparent)}
    .sc-placeholder-error{padding:4px 8px;font:11px/1.4 ui-monospace,monospace;
      color:rgba(0,0,0,.7);word-break:break-word}
    .sc-interp.sc-missing{display:inline-block;width:2em;height:1em;overflow:hidden;
      vertical-align:text-bottom;background:rgba(255,255,255,.3);border:1px solid rgba(0,0,0,.5);
      border-radius:2px;box-sizing:border-box;color:transparent;
      user-select:none}
    .sc-interp.sc-unresolved{font-family:ui-monospace,monospace;font-size:.85em;
      color:rgba(0,0,0,.5);background:rgba(0,0,0,.05);border-radius:3px;
      padding:0 3px}
    .sc-host.sc-has-error{position:relative}
    .sc-logic-error{position:absolute;top:8px;left:8px;z-index:2147483647;max-width:60ch;
      padding:6px 10px;background:#b00020;color:#fff;font:12px/1.4 ui-monospace,monospace;
      border-radius:4px;white-space:pre-wrap;pointer-events:none}
    /* Mirrors PRINT_BASELINE_CSS in apps/web deck-stage-export.ts; keep both
       in sync until dc-runtime regains a build step. */
    @media print {
      @page { margin: 0.5cm; }
      figure, table { break-inside: avoid; }
      #dc-root, #dc-root > .sc-host { height: auto; }
      *, *::before, *::after {
        print-color-adjust: exact; -webkit-print-color-adjust: exact;
        backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
        animation-delay: -99s !important; animation-duration: .001s !important;
        animation-iteration-count: 1 !important; animation-fill-mode: both !important;
        animation-play-state: running !important; transition-duration: 0s !important;
      }
    }
  
x-dc{display:none!important}

/* latin-ext */
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/421a8cc5-bf81-4833-a504-11cb21d9a368-bd11c74f54.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/7b56f2d4-840b-4162-9513-2111b3349c21-ef95296c77.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/421a8cc5-bf81-4833-a504-11cb21d9a368-bd11c74f54.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/7b56f2d4-840b-4162-9513-2111b3349c21-ef95296c77.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/421a8cc5-bf81-4833-a504-11cb21d9a368-bd11c74f54.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/7b56f2d4-840b-4162-9513-2111b3349c21-ef95296c77.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/421a8cc5-bf81-4833-a504-11cb21d9a368-bd11c74f54.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/7b56f2d4-840b-4162-9513-2111b3349c21-ef95296c77.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/0faf3edb-3a1a-4d2c-ba15-c60950daa942-7fe8df01e5.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/cc2065d2-eb13-4c32-bac0-41dbe9bf828a-c592587dd7.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/59b26bfc-14f1-47e5-b169-848b0d2a9716-6286c9bd09.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/ecbe7bb5-0941-4c96-b13f-02ae4a23fa04-8d0d6e40c1.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/1d10f20b-3ea3-48a5-a682-ddd8147c32c7-ee63cf6e5b.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/d82f5a26-0535-478e-9825-95bdba90e4d4-1c67f2cbcc.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/2e300803-8591-4ef4-af99-be78b8d27794-877ee7495b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/0faf3edb-3a1a-4d2c-ba15-c60950daa942-7fe8df01e5.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/cc2065d2-eb13-4c32-bac0-41dbe9bf828a-c592587dd7.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/59b26bfc-14f1-47e5-b169-848b0d2a9716-6286c9bd09.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/ecbe7bb5-0941-4c96-b13f-02ae4a23fa04-8d0d6e40c1.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/1d10f20b-3ea3-48a5-a682-ddd8147c32c7-ee63cf6e5b.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/d82f5a26-0535-478e-9825-95bdba90e4d4-1c67f2cbcc.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/2e300803-8591-4ef4-af99-be78b8d27794-877ee7495b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/fbac05be-a6d4-414c-a5b2-0acd5b6fd73d-1b3540179d.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/dfce659d-d57a-4fef-83de-587c1c56381d-998940754a.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/0b7dfc76-a80c-44b8-8729-38c02f9ee12c-2b316a8422.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/e34fd9c7-2d97-4b35-b10f-11b93e67dadc-b12a6f0d97.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/202170e2-c2f7-4d2d-a149-be0f7d5b3b14-cd0a82f0cf.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/1526f3a6-3360-478e-a53e-be2f8965160a-5e3fe3bc99.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/5190563c-96a2-48a3-bd2e-8d533f8e15b5-79d17b5236.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/fbac05be-a6d4-414c-a5b2-0acd5b6fd73d-1b3540179d.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/dfce659d-d57a-4fef-83de-587c1c56381d-998940754a.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/0b7dfc76-a80c-44b8-8729-38c02f9ee12c-2b316a8422.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/e34fd9c7-2d97-4b35-b10f-11b93e67dadc-b12a6f0d97.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/202170e2-c2f7-4d2d-a149-be0f7d5b3b14-cd0a82f0cf.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/1526f3a6-3360-478e-a53e-be2f8965160a-5e3fe3bc99.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/5190563c-96a2-48a3-bd2e-8d533f8e15b5-79d17b5236.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/fbac05be-a6d4-414c-a5b2-0acd5b6fd73d-1b3540179d.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/dfce659d-d57a-4fef-83de-587c1c56381d-998940754a.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/0b7dfc76-a80c-44b8-8729-38c02f9ee12c-2b316a8422.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/e34fd9c7-2d97-4b35-b10f-11b93e67dadc-b12a6f0d97.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/202170e2-c2f7-4d2d-a149-be0f7d5b3b14-cd0a82f0cf.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/1526f3a6-3360-478e-a53e-be2f8965160a-5e3fe3bc99.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/theme/assets/BlogDetails/5190563c-96a2-48a3-bd2e-8d533f8e15b5-79d17b5236.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { margin: 0; }
  ::selection { background: rgba(200,146,46,0.28); }
  
  [data-dsk] { display:flex; align-items:center; gap:24px; flex-wrap:nowrap; }
  [data-hbg] { display:none; width:34px; height:34px; border:1px solid rgba(42,36,24,0.22); border-radius:4px; background:transparent; cursor:pointer; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:0; flex:none; }
  [data-hbg] span { display:block; width:16px; height:1.5px; background:currentColor; border-radius:1px; transition:all .25s; }
  [data-mob] { display:none; position:absolute; top:100%; left:0; right:0; flex-direction:column; z-index:100; }
  [data-mob][data-o="1"] { display:flex !important; }
  @media (max-width:860px) {
    [data-dsk] { display:none !important; }
    [data-hbg] { display:flex !important; }
  }

  @keyframes fadeUp { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
  @keyframes scaleIn { from { opacity:0; transform:scale(.97); } to { opacity:1; transform:scale(1); } }

  .blog-scroll-top {
    position: fixed;
    right: clamp(18px, 3vw, 34px);
    bottom: clamp(18px, 3vw, 34px);
    z-index: 80;
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border-radius: 50%;
    border: 1px solid color-mix(in srgb,var(--gold,#C8922E) 56%, transparent);
    background: color-mix(in srgb,var(--bg,#EDE3C7) 84%, transparent);
    color: var(--ink,#2A2418) !important;
    font-family: Cinzel, serif;
    font-size: 19px;
    line-height: 1;
    box-shadow: rgba(20,15,8,.24) 0 18px 40px -24px;
    backdrop-filter: blur(10px);
    transition: transform .22s ease, background .22s ease, color .22s ease, border-color .22s ease;
  }

  .blog-scroll-top:hover,
  .blog-scroll-top:focus-visible {
    transform: translateY(-3px);
    background: var(--ink,#2A2418) !important;
    color: var(--bg,#EDE3C7) !important;
    border-color: var(--gold,#C8922E) !important;
  }

  .blog-detail-side {
    position: relative;
    align-self: start;
  }

  @media (min-width: 761px) {
    [data-blog-detail-layout] {
      grid-template-columns: minmax(0, 860px) minmax(220px, 1fr) !important;
      position: relative;
    }

    .blog-detail-side-left {
      left: -44px;
      padding-right: 0 !important;
      position: absolute !important;
      top: 0;
      width: 34px;
    }

    .meridian-article {
      grid-column: 1;
      max-width: 860px;
    }

    .blog-detail-side-right {
      grid-column: 2;
    }
  }

  @media (min-width: 961px) {
    .blog-detail-side-right {
      position: sticky;
      top: 92px;
    }
  }

  @media (max-width: 960px) {
    .blog-detail-side {
      transform: none !important;
    }
  }

  .blog-detail-bot-cta:hover,
  .blog-detail-bot-cta:focus-visible {
    background: var(--ink,#2A2418) !important;
    color: var(--bg,#EDE3C7) !important;
  }

  .meridian-article h2,
  .meridian-article h3 {
    color: var(--gold,#C8922E);
    font-family: Cinzel, serif;
    font-weight: 600;
    letter-spacing: .08em;
    line-height: 1.18;
    text-transform: uppercase;
  }

  .meridian-article h2 {
    font-size: clamp(24px, 3.3vw, 34px);
    margin: 46px 0 18px;
  }

  .meridian-article h3 {
    font-size: clamp(17px, 2.2vw, 22px);
    margin: 34px 0 14px;
  }

  .meridian-article h2:first-child,
  .meridian-article h3:first-child {
    margin-top: 0;
  }

  .meridian-article ul,
  .meridian-article ol {
    color: var(--ink2,#5C5238);
    font-size: 19px;
    line-height: 1.75;
    margin: 18px 0 28px;
    padding-left: 1.35em;
  }

  .meridian-article li + li {
    margin-top: 8px;
  }

  .meridian-article .meridian-lede {
    color: var(--ink,#2A2418);
    font-size: clamp(23px, 3vw, 31px);
    font-style: italic;
    line-height: 1.45;
    margin: 0 0 34px;
    padding-bottom: 24px;
    border-bottom: 1px solid color-mix(in srgb,var(--gold,#C8922E) 34%, transparent);
  }

  .meridian-article .meridian-callout,
  .meridian-article .meridian-note {
    margin: 34px 0;
    padding: 24px 28px;
    border: 1px solid color-mix(in srgb,var(--gold,#C8922E) 32%, transparent);
    border-radius: 2px;
    background:
      linear-gradient(180deg, color-mix(in srgb,var(--gold,#C8922E) 8%, transparent), transparent 80%),
      color-mix(in srgb,var(--plate,#E4D8B6) 68%, transparent);
    box-shadow:
      inset 0 3px 0 color-mix(in srgb,var(--gold,#C8922E) 72%, transparent),
      rgba(20,15,8,.12) 0 24px 44px -34px;
  }

  .meridian-article .meridian-note {
    background: color-mix(in srgb,var(--bg2,#F4ECD6) 76%, transparent);
    border-color: color-mix(in srgb,var(--line,rgba(42,36,24,.18)) 86%, transparent);
    box-shadow: rgba(20,15,8,.09) 0 18px 36px -30px;
  }

  .meridian-article .meridian-callout-label,
  .meridian-article .meridian-note-label,
  .meridian-article .meridian-stat-label,
  .meridian-article .meridian-step-label {
    display: block;
    margin: 0 0 10px;
    color: var(--gold,#C8922E);
    font-family: Cinzel, serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .2em;
    line-height: 1.35;
    text-transform: uppercase;
  }

  .meridian-article .meridian-callout p,
  .meridian-article .meridian-note p {
    margin: 0;
  }

  .meridian-article .meridian-thesis {
    margin: 38px 0;
    padding: 30px 0;
    border-top: 2px solid var(--gold,#C8922E);
    border-bottom: 2px solid var(--gold,#C8922E);
    color: var(--ink,#2A2418);
    font-family: "EB Garamond", serif;
    font-size: clamp(28px, 4.4vw, 46px);
    font-style: italic;
    line-height: 1.15;
  }

  .meridian-article .meridian-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 34px 0;
  }

  .meridian-article .meridian-stat {
    min-width: 0;
    padding: 20px;
    border: 1px solid color-mix(in srgb,var(--gold,#C8922E) 28%, transparent);
    border-radius: 2px;
    background: color-mix(in srgb,var(--plate,#E4D8B6) 74%, transparent);
  }

  .meridian-article .meridian-stat strong {
    display: block;
    color: var(--ink,#2A2418);
    font-family: "EB Garamond", serif;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1;
    text-transform: none;
  }

  .meridian-article .meridian-stat span:last-child {
    display: block;
    margin-top: 8px;
    color: var(--ink3,#8A7E60);
    font-size: 14px;
    line-height: 1.35;
  }

  .meridian-article .meridian-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, .72fr);
    gap: 24px;
    align-items: start;
    margin: 36px 0;
    padding: 26px 0;
    border-top: 1px solid var(--line,rgba(42,36,24,.18));
    border-bottom: 1px solid var(--line,rgba(42,36,24,.18));
  }

  .meridian-article .meridian-split > * {
    min-width: 0;
  }

  .meridian-article .meridian-split-aside {
    padding: 18px;
    border-left: 2px solid color-mix(in srgb,var(--gold,#C8922E) 70%, transparent);
    color: var(--ink2,#5C5238);
    background: color-mix(in srgb,var(--gold,#C8922E) 7%, transparent);
  }

  .meridian-article .meridian-timeline {
    display: grid;
    gap: 16px;
    margin: 34px 0;
    padding-left: 18px;
    border-left: 1px solid color-mix(in srgb,var(--gold,#C8922E) 42%, transparent);
  }

  .meridian-article .meridian-step {
    position: relative;
    padding: 4px 0 4px 18px;
  }

  .meridian-article .meridian-step::before {
    content: "";
    position: absolute;
    left: -24px;
    top: 12px;
    width: 10px;
    height: 10px;
    border: 1px solid var(--gold,#C8922E);
    border-radius: 50%;
    background: var(--bg,#EDE3C7);
    box-shadow: 0 0 0 4px color-mix(in srgb,var(--gold,#C8922E) 12%, transparent);
  }

  .meridian-article .meridian-step p {
    margin: 0;
  }

  .meridian-article .meridian-rule {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 42px 0;
    color: var(--gold,#C8922E);
    font-family: Cinzel, serif;
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
  }

  .meridian-article .meridian-rule::before,
  .meridian-article .meridian-rule::after {
    content: "";
    height: 1px;
    flex: 1 1 0;
    background: color-mix(in srgb,var(--gold,#C8922E) 38%, transparent);
  }

  .meridian-article .meridian-table {
    width: 100%;
    margin: 34px 0;
    overflow-x: auto;
  }

  .meridian-article .meridian-table table {
    width: 100%;
    border-collapse: collapse;
    color: var(--ink2,#5C5238);
    font-size: 16px;
    line-height: 1.45;
  }

  .meridian-article .meridian-table th,
  .meridian-article .meridian-table td {
    padding: 13px 12px;
    border-bottom: 1px solid var(--line,rgba(42,36,24,.18));
    text-align: left;
    vertical-align: top;
  }

  .meridian-article .meridian-table th {
    color: var(--ink,#2A2418);
    font-family: Cinzel, serif;
    font-size: 10px;
    letter-spacing: .16em;
    text-transform: uppercase;
  }

  @media (max-width: 760px) {
    #dc-root nav > div {
      gap: 14px !important;
      padding: 12px 18px !important;
      flex-wrap: wrap !important;
    }

    #dc-root nav > div > a:first-child {
      flex: 1 1 auto !important;
      min-width: 190px !important;
    }

    #dc-root nav > div > div[style*="flex: 1 1 0%"] {
      display: none !important;
    }

    #dc-root nav .scp0,
    #dc-root nav .scp2,
    #dc-root nav a[style*="Writing"] {
      font-size: 11px !important;
      letter-spacing: .1em !important;
    }

    #dc-root nav .scp2 {
      padding: 7px 10px !important;
    }

    #dc-root div[style*="max-width: 1180px"],
    [data-blog-detail-layout],
    #newsletter > div,
    footer > div,
    footer > div > div {
      padding-left: 20px !important;
      padding-right: 20px !important;
    }

    header h1 {
      font-size: clamp(34px, 12vw, 56px) !important;
      overflow-wrap: anywhere !important;
    }

    header[style*="max-width: 860px"] {
      padding-top: 22px !important;
      padding-bottom: 28px !important;
    }

    [data-blog-detail-layout] {
      grid-template-columns: 1fr !important;
      gap: 0 !important;
    }

    .blog-detail-side {
      padding: 22px 0 0 !important;
      text-align: left !important;
      width: 100% !important;
    }

    .blog-detail-side-left {
      display: none !important;
    }

    .meridian-article {
      order: 2 !important;
      padding: 34px 0 28px !important;
      min-width: 0 !important;
      width: 100% !important;
    }

    .blog-detail-side-right {
      order: 1 !important;
      padding-top: 26px !important;
      padding-bottom: 8px !important;
    }

    /* The compact author note becomes a signed editorial plate on mobile. */
    .blog-detail-author {
      position: relative;
      display: grid !important;
      grid-template-columns: 76px minmax(0, 1fr);
      gap: 16px !important;
      align-items: center !important;
      margin-top: 28px !important;
      padding: 20px !important;
      overflow: hidden;
      border: 1px solid color-mix(in srgb,var(--gold,#C8922E) 34%,transparent) !important;
      background:
        radial-gradient(circle at 92% 8%, color-mix(in srgb,var(--gold,#C8922E) 20%,transparent), transparent 38%),
        linear-gradient(145deg, color-mix(in srgb,var(--plate,#E4D8B6) 88%,transparent), color-mix(in srgb,var(--bg2,#F4ECD6) 72%,transparent));
      box-shadow: rgba(20,15,8,.18) 0 20px 34px -30px;
    }

    .blog-detail-author::before {
      content: "";
      position: absolute;
      top: 0;
      left: 20px;
      width: 44px;
      height: 2px;
      background: var(--gold,#C8922E);
    }

    .blog-detail-author-avatar {
      width: 76px !important;
      height: 76px !important;
      box-shadow: 0 0 0 5px color-mix(in srgb,var(--gold,#C8922E) 18%,transparent) !important;
    }

    .blog-detail-author-copy {
      min-width: 0;
    }

    .blog-detail-author-copy > div:first-child {
      font-size: 9px !important;
      letter-spacing: .18em !important;
      margin-bottom: 5px !important;
    }

    .blog-detail-author-copy > div:nth-child(2) {
      font-size: 18px !important;
      margin-bottom: 4px !important;
    }

    .blog-detail-author-role {
      margin: 0 0 10px !important;
      color: var(--ink2,#5C5238);
      font-size: 15px;
      font-style: italic;
      line-height: 1.35;
    }

    .blog-detail-author-link {
      padding: 7px 10px !important;
      border: 1px solid color-mix(in srgb,var(--gold,#C8922E) 48%,transparent) !important;
      background: color-mix(in srgb,var(--bg,#EDE3C7) 68%,transparent);
      font-size: 9px !important;
      letter-spacing: .12em !important;
    }

    .blog-detail-aside-stack {
      display: grid !important;
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      gap: 10px !important;
      width: 100% !important;
    }

    .blog-detail-related-card,
    .blog-detail-back-link {
      grid-column: 1 / -1 !important;
    }

    .blog-detail-mobile-card {
      min-width: 0 !important;
      padding: 14px 10px !important;
    }

    .blog-detail-mobile-card > div:first-child {
      font-size: 8.5px !important;
      letter-spacing: .14em !important;
      margin-bottom: 8px !important;
      overflow-wrap: anywhere !important;
    }

    .blog-detail-mobile-card > div:nth-child(2) {
      font-size: 20px !important;
      line-height: 1.05 !important;
    }

    .blog-detail-mobile-card > div:nth-child(3) {
      font-size: 11px !important;
      line-height: 1.25 !important;
      overflow-wrap: anywhere !important;
    }

    .blog-detail-share-card .scp0 {
      align-items: flex-start !important;
      font-size: 11px !important;
      gap: 5px !important;
      line-height: 1.2 !important;
      margin-bottom: 8px !important;
      min-width: 0 !important;
      overflow-wrap: anywhere !important;
    }

    .blog-detail-share-card .scp0:last-child {
      margin-bottom: 0 !important;
    }

    .blog-detail-share-card img {
      flex: 0 0 auto !important;
      margin-top: 1px !important;
    }

    .meridian-article p {
      font-size: 18px !important;
      line-height: 1.68 !important;
      overflow-wrap: anywhere !important;
    }

    .meridian-article blockquote {
      padding: 22px 20px !important;
      font-size: clamp(22px, 7vw, 30px) !important;
    }

    .meridian-article .meridian-lede {
      font-size: clamp(21px, 7vw, 28px) !important;
      margin-bottom: 28px !important;
    }

    .meridian-article .meridian-callout,
    .meridian-article .meridian-note {
      padding: 20px !important;
      margin: 28px 0 !important;
    }

    .meridian-article .meridian-thesis {
      font-size: clamp(25px, 8vw, 34px) !important;
      padding: 24px 0 !important;
    }

    .meridian-article .meridian-stat-grid,
    .meridian-article .meridian-split {
      grid-template-columns: 1fr !important;
    }

    .meridian-article .meridian-stat {
      padding: 18px !important;
    }

    .meridian-article .meridian-split {
      gap: 18px !important;
      margin: 30px 0 !important;
      padding: 22px 0 !important;
    }

    .meridian-article .meridian-timeline {
      padding-left: 14px !important;
    }

    .meridian-article :where(pre, table, figure) {
      max-width: 100% !important;
      overflow-x: auto !important;
    }

    .meridian-article img {
      max-width: 100% !important;
      height: auto !important;
    }

    div[style*="display: inline-block"][style*="var(--plate"] {
      width: 100% !important;
    }

    section[style*="background: var(--bg2"] div[style*="grid-template-columns"] {
      grid-template-columns: 1fr !important;
    }

    #newsletter > div {
      gap: 30px !important;
      padding-top: 46px !important;
      padding-bottom: 46px !important;
    }

    #newsletter > div > div {
      min-width: 0 !important;
      flex-basis: 100% !important;
    }

    #newsletter form {
      flex-direction: column !important;
    }

    #newsletter form input,
    #newsletter form button {
      width: 100% !important;
      flex-basis: auto !important;
    }

    [data-newsletter-bot-card] {
      align-items: flex-start !important;
    }

    footer blockquote {
      font-size: clamp(21px, 7vw, 30px) !important;
    }

    footer > div:nth-of-type(2) {
      grid-template-columns: 1fr 1fr !important;
      gap: 34px 24px !important;
    }

    footer > div:nth-of-type(2) > div:first-child {
      grid-column: 1 / -1 !important;
      text-align: center !important;
    }

    footer > div:nth-of-type(2) > div:first-child > a:first-child {
      justify-content: center !important;
    }

    footer > div:nth-of-type(2) > div:first-child > a.scp2 {
      justify-content: center !important;
      margin-left: auto !important;
      margin-right: auto !important;
    }

    footer > div:nth-of-type(2) > div:nth-child(3) > a.scp2 {
      margin-top: 18px !important;
    }

    footer > div:last-child > div {
      align-items: flex-start !important;
      flex-direction: column !important;
    }
  }

  @media (max-width: 430px) {
    #dc-root nav > div {
      gap: 10px 12px !important;
    }

    #dc-root nav .scp2 {
      flex: 1 1 100% !important;
      justify-content: center !important;
    }

    #dc-root nav .scp1 {
      margin-left: auto !important;
    }

    .blog-scroll-top {
      width: 40px;
      height: 40px;
      right: 14px;
      bottom: 14px;
    }
  }

/* Related-project logo: in dark mode the tinted tile went nearly black and the
   grayscale/multiply logo disappeared. Keep the tile light so the mark reads. */
:root[data-theme="dark"] .blog-detail-related-logo {
  background: rgb(236, 227, 199);
  border-color: color-mix(in srgb, var(--gold, #C8922E) 32%, transparent);
}
:root[data-theme="dark"] .blog-detail-related-logo span {
  color: #5C5238;
}
:root[data-theme="dark"] .blog-detail-related-logo img {
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
}

/* DeFi series navigation: shared by the 17 admin-managed lesson bodies. */
.meridian-article #defi-series-navigation {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 40px 0 28px;
  padding: 22px;
  border: 1px solid var(--line, rgba(42, 36, 24, .18));
  border-radius: 8px;
  background: var(--bg2, #F4ECD6);
  font-size: 16px;
  line-height: 1.5;
}
.meridian-article #defi-series-navigation > div:first-child {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
  color: var(--ink2, #5C5238);
  font-size: 14px;
}
.meridian-article #defi-series-navigation > div:not(:first-child) {
  display: flex;
  min-width: 0;
}
.meridian-article #defi-series-navigation > div:nth-child(2):last-child {
  grid-column: 1 / -1;
}
.meridian-article #defi-series-navigation a {
  box-sizing: border-box;
  text-decoration: none;
  border-radius: 5px;
  transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.meridian-article #defi-series-navigation > div:first-child a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 9px 16px;
  border: 1px solid var(--gold, #C8922E);
  background: var(--gold, #C8922E);
  color: #211b10;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}
.meridian-article #defi-series-navigation a[rel="prev"],
.meridian-article #defi-series-navigation a[rel="next"] {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 88px;
  padding: 16px 18px;
  border: 1px solid var(--line, rgba(42, 36, 24, .18));
  background: var(--bg, #EDE3C7);
  color: var(--ink, #2A2418);
  font-size: 16px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.meridian-article #defi-series-navigation a[rel="next"] {
  border-color: var(--gold, #C8922E);
}
.meridian-article #defi-series-navigation a:hover {
  border-color: var(--gold, #C8922E);
  box-shadow: 0 2px 8px rgba(42, 36, 24, .12);
  background: var(--plate, #E4D8B6);
  color: var(--ink, #2A2418);
}
.meridian-article #defi-series-navigation a:focus-visible {
  outline: 2px solid var(--gold, #C8922E);
  outline-offset: 4px;
}
@media (max-width: 640px) {
  .meridian-article #defi-series-navigation {
    grid-template-columns: minmax(0, 1fr);
    padding: 16px;
    gap: 10px;
  }
  .meridian-article #defi-series-navigation a[rel="prev"],
  .meridian-article #defi-series-navigation a[rel="next"] {
    min-height: 72px;
    padding: 14px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .meridian-article #defi-series-navigation a { transition: none; }
}

/* Featured DeFi course guide: scoped to its admin-managed article body. */
.meridian-article .course-hub {
    --course-gold: var(--gold, #c8922e);
    --course-ink: var(--ink, #2a2418);
    --course-muted: var(--ink2, #5c5238);
    --course-soft: var(--ink3, #8a7e60);
    --course-line: var(--line, rgba(42, 36, 24, .2));
    color: var(--course-ink);
  }

  .meridian-article .course-hub * {
    box-sizing: border-box;
  }

  .meridian-article .course-hub__intro {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    margin: 0 0 34px;
    padding: clamp(28px, 5vw, 52px);
    border: 1px solid color-mix(in srgb, var(--course-gold) 42%, transparent);
    background:
      radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--course-gold) 19%, transparent) 0 16%, transparent 17%),
      linear-gradient(145deg, color-mix(in srgb, var(--course-gold) 12%, transparent), transparent 58%),
      color-mix(in srgb, var(--plate, #e4d8b6) 74%, transparent);
    box-shadow: inset 0 4px 0 color-mix(in srgb, var(--course-gold) 84%, transparent), 0 24px 70px -56px rgba(24, 17, 7, .7);
  }

  .meridian-article .course-hub__intro::after {
    content: "17";
    position: absolute;
    z-index: -1;
    right: -4px;
    bottom: -42px;
    color: color-mix(in srgb, var(--course-gold) 11%, transparent);
    font-family: Cinzel, serif;
    font-size: clamp(150px, 28vw, 260px);
    font-weight: 700;
    line-height: 1;
  }

  .meridian-article .course-hub__eyebrow,
  .meridian-article .course-module__kicker,
  .meridian-article .course-card__meta,
  .meridian-article .course-hub__microcopy {
    display: block;
    font-family: Cinzel, serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .18em;
    line-height: 1.4;
    text-transform: uppercase;
  }

  .meridian-article .course-hub__eyebrow,
  .meridian-article .course-module__kicker,
  .meridian-article .course-card__meta {
    color: var(--course-gold);
  }

  .meridian-article .course-hub__intro h2 {
    max-width: 690px;
    margin: 16px 0 16px;
    color: var(--course-ink);
    font-family: "EB Garamond", serif;
    font-size: clamp(38px, 6.5vw, 64px);
    font-weight: 500;
    letter-spacing: -.025em;
    line-height: .98;
    text-transform: none;
  }

  .meridian-article .course-hub__lead {
    max-width: 660px;
    margin: 0;
    color: var(--course-muted);
    font-size: clamp(19px, 2.5vw, 23px);
    line-height: 1.55;
  }

  .meridian-article .course-hub__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 26px 0 0;
  }

  .meridian-article .course-hub__fact {
    padding: 8px 11px;
    border: 1px solid color-mix(in srgb, var(--course-gold) 34%, transparent);
    background: color-mix(in srgb, var(--bg, #ede3c7) 74%, transparent);
    color: var(--course-muted);
    font-family: Cinzel, serif;
    font-size: 10px;
    letter-spacing: .1em;
    line-height: 1.3;
    text-transform: uppercase;
  }

  .meridian-article .course-hub__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
  }

  .meridian-article .course-hub__button,
  .meridian-article .course-hub__button:visited {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 13px 18px;
    border: 1px solid var(--course-ink);
    color: var(--bg, #ede3c7);
    background: var(--course-ink);
    font-family: Cinzel, serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .13em;
    line-height: 1.25;
    text-decoration: none;
    text-transform: uppercase;
    transition: transform .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
  }

  .meridian-article .course-hub__button--ghost,
  .meridian-article .course-hub__button--ghost:visited {
    border-color: color-mix(in srgb, var(--course-ink) 30%, transparent);
    color: var(--course-ink);
    background: transparent;
  }

  .meridian-article .course-hub__button:hover,
  .meridian-article .course-hub__button:focus-visible {
    transform: translateY(-2px);
    border-color: var(--course-gold);
    color: var(--course-ink);
    background: var(--course-gold);
  }

  .meridian-article .course-hub__microcopy {
    margin: 15px 0 0;
    color: var(--course-soft);
    letter-spacing: .08em;
    text-transform: none;
  }

  .meridian-article .course-paths {
    margin: 0 0 54px;
    padding: 20px;
    border-block: 1px solid var(--course-line);
  }

  .meridian-article .course-paths__label {
    margin: 0 0 13px;
    color: var(--course-soft);
    font-family: Cinzel, serif;
    font-size: 10px;
    letter-spacing: .18em;
    text-transform: uppercase;
  }

  .meridian-article .course-paths__links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
  }

  .meridian-article .course-paths a,
  .meridian-article .course-paths a:visited {
    display: flex;
    min-height: 66px;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--course-line);
    color: var(--course-ink);
    background: color-mix(in srgb, var(--plate, #e4d8b6) 48%, transparent);
    font-size: 14px;
    line-height: 1.25;
    text-decoration: none;
    transition: border-color .2s ease, transform .2s ease, background .2s ease;
  }

  .meridian-article .course-paths a:hover,
  .meridian-article .course-paths a:focus-visible {
    transform: translateY(-2px);
    border-color: var(--course-gold);
    background: color-mix(in srgb, var(--course-gold) 12%, transparent);
  }

  .meridian-article .course-paths strong {
    flex: 0 0 auto;
    color: var(--course-gold);
    font-family: Cinzel, serif;
    font-size: 11px;
  }

  .meridian-article .course-module {
    scroll-margin-top: 96px;
    margin: 0 0 64px;
  }

  .meridian-article .course-module__header {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 20px;
    align-items: start;
    margin-bottom: 22px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--course-line);
  }

  .meridian-article .course-module__number {
    color: color-mix(in srgb, var(--course-gold) 68%, var(--course-ink));
    font-family: "EB Garamond", serif;
    font-size: 60px;
    line-height: .8;
  }

  .meridian-article .course-module h2 {
    margin: 5px 0 7px;
    color: var(--course-ink);
    font-family: "EB Garamond", serif;
    font-size: clamp(30px, 4.5vw, 44px);
    font-weight: 500;
    letter-spacing: -.015em;
    line-height: 1.05;
    text-transform: none;
  }

  .meridian-article .course-module__summary {
    margin: 0;
    color: var(--course-muted);
    font-size: 17px;
    line-height: 1.5;
  }

  .meridian-article .course-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .meridian-article .course-card,
  .meridian-article .course-card:visited {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 215px;
    flex-direction: column;
    padding: 23px 22px 20px;
    overflow: hidden;
    border: 1px solid var(--course-line);
    color: var(--course-ink);
    background: color-mix(in srgb, var(--bg2, #f4ecd6) 78%, transparent);
    box-shadow: 0 22px 46px -44px rgba(24, 17, 7, .82);
    text-decoration: none;
    transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
  }

  .meridian-article .course-card::after {
    content: "";
    position: absolute;
    right: -28px;
    bottom: -28px;
    width: 80px;
    height: 80px;
    border: 1px solid color-mix(in srgb, var(--course-gold) 18%, transparent);
    border-radius: 50%;
    transition: transform .25s ease, border-color .25s ease;
  }

  .meridian-article .course-card:hover,
  .meridian-article .course-card:focus-visible {
    transform: translateY(-4px);
    border-color: var(--course-gold);
    box-shadow: 0 26px 48px -38px color-mix(in srgb, var(--course-gold) 54%, transparent);
  }

  .meridian-article .course-card:hover::after,
  .meridian-article .course-card:focus-visible::after {
    transform: scale(1.25);
    border-color: color-mix(in srgb, var(--course-gold) 50%, transparent);
  }

  .meridian-article .course-card h3 {
    margin: 12px 0 10px;
    color: var(--course-ink);
    font-family: "EB Garamond", serif;
    font-size: clamp(23px, 3.1vw, 29px);
    font-weight: 600;
    letter-spacing: -.012em;
    line-height: 1.08;
    text-transform: none;
  }

  .meridian-article .course-card p {
    margin: 0 0 18px;
    color: var(--course-muted);
    font-size: 15.5px;
    line-height: 1.48;
  }

  .meridian-article .course-card__cta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    color: var(--course-gold);
    font-family: Cinzel, serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
  }

  .meridian-article .course-finish {
    position: relative;
    overflow: hidden;
    margin: 8px 0 4px;
    padding: clamp(28px, 5vw, 48px);
    border: 1px solid color-mix(in srgb, var(--course-gold) 52%, transparent);
    background: var(--course-ink);
    color: var(--bg, #ede3c7);
    text-align: center;
  }

  .meridian-article .course-finish::before,
  .meridian-article .course-finish::after {
    content: "✦";
    position: absolute;
    color: color-mix(in srgb, var(--course-gold) 48%, transparent);
    font-size: 56px;
    line-height: 1;
  }

  .meridian-article .course-finish::before { top: -11px; left: -8px; }
  .meridian-article .course-finish::after { right: -8px; bottom: -11px; }

  .meridian-article .course-finish h2 {
    margin: 12px auto;
    color: var(--bg, #ede3c7);
    font-family: "EB Garamond", serif;
    font-size: clamp(34px, 5.5vw, 52px);
    font-weight: 500;
    letter-spacing: -.02em;
    line-height: 1;
    text-transform: none;
  }

  .meridian-article .course-finish p {
    max-width: 580px;
    margin: 0 auto 24px;
    color: color-mix(in srgb, var(--bg, #ede3c7) 78%, transparent);
    font-size: 18px;
    line-height: 1.55;
  }

  .meridian-article .course-finish .course-hub__eyebrow { color: var(--course-gold); }
  .meridian-article .course-finish .course-hub__button { border-color: var(--course-gold); background: var(--course-gold); color: var(--course-ink); }
  .meridian-article .course-finish .course-hub__button:hover,
  .meridian-article .course-finish .course-hub__button:focus-visible { background: var(--bg, #ede3c7); }

  @media (max-width: 700px) {
    .meridian-article .course-hub__intro { padding: 28px 22px; }
    .meridian-article .course-hub__intro::after { right: -14px; bottom: -20px; font-size: 150px; }
    .meridian-article .course-hub__intro h2 { font-size: clamp(35px, 11vw, 48px); }
    .meridian-article .course-hub__actions { display: grid; }
    .meridian-article .course-hub__button { width: 100%; }
    .meridian-article .course-paths { padding: 18px 0; }
    .meridian-article .course-paths__links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .meridian-article .course-module__header { grid-template-columns: 52px minmax(0, 1fr); gap: 12px; }
    .meridian-article .course-module__number { font-size: 47px; }
    .meridian-article .course-grid { grid-template-columns: 1fr; }
    .meridian-article .course-card { min-height: 0; padding: 21px 19px 19px; }
  }

  @media (max-width: 960px) {
    #dc-root header h1 { font-size: clamp(32px, 9vw, 46px) !important; }
    [data-blog-detail-layout] .meridian-article { order: 1 !important; }
    [data-blog-detail-layout] .blog-detail-side-right { order: 2 !important; }
  }

  @media (prefers-reduced-motion: reduce) {
    .meridian-article .course-hub__button,
    .meridian-article .course-paths a,
    .meridian-article .course-card,
    .meridian-article .course-card::after { transition: none; }
  }

/* DeFi series opening navigation: shared by the 17 lesson articles. */
.meridian-article .defi-series-intro-nav {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 0 0 38px;
  padding: 24px;
  border: 1px solid color-mix(in srgb, var(--gold, #C8922E) 40%, transparent);
  border-radius: 4px;
  background:
    radial-gradient(circle at 96% 0, color-mix(in srgb, var(--gold, #C8922E) 16%, transparent) 0 20%, transparent 21%),
    linear-gradient(145deg, color-mix(in srgb, var(--gold, #C8922E) 9%, transparent), transparent 62%),
    var(--bg2, #F4ECD6);
  box-shadow: inset 0 3px 0 color-mix(in srgb, var(--gold, #C8922E) 78%, transparent), 0 22px 48px -42px rgba(20, 15, 8, .72);
}

.meridian-article .defi-series-intro-nav__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
}

.meridian-article .defi-series-intro-nav__kicker,
.meridian-article .defi-series-intro-nav__label {
  display: block;
  color: var(--gold, #C8922E);
  font-family: Cinzel, serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .18em;
  line-height: 1.4;
  text-transform: uppercase;
}

.meridian-article .defi-series-intro-nav__title {
  margin: 7px 0 0;
  color: var(--ink, #2A2418);
  font-family: "EB Garamond", serif;
  font-size: clamp(21px, 2.8vw, 27px);
  font-weight: 500;
  line-height: 1.16;
}

.meridian-article .defi-series-intro-nav__count {
  display: flex;
  width: 72px;
  height: 72px;
  flex: 0 0 auto;
  align-items: baseline;
  justify-content: center;
  padding-top: 14px;
  border: 1px solid color-mix(in srgb, var(--gold, #C8922E) 50%, transparent);
  border-radius: 50%;
  color: var(--ink, #2A2418);
  background: color-mix(in srgb, var(--bg, #EDE3C7) 74%, transparent);
  font-family: "EB Garamond", serif;
  font-size: 29px;
  line-height: 1;
}

.meridian-article .defi-series-intro-nav__count small {
  margin-left: 3px;
  color: var(--ink3, #8A7E60);
  font-family: Cinzel, serif;
  font-size: 9px;
  letter-spacing: .05em;
}

.meridian-article .defi-series-intro-nav__links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--line, rgba(42, 36, 24, .18));
}

.meridian-article .defi-series-intro-nav__links--edge {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.meridian-article .defi-series-intro-nav__link,
.meridian-article .defi-series-intro-nav__link:visited {
  display: flex;
  min-width: 0;
  min-height: 72px;
  flex-direction: column;
  justify-content: center;
  padding: 12px 14px;
  border: 1px solid var(--line, rgba(42, 36, 24, .18));
  border-radius: 3px;
  color: var(--ink, #2A2418);
  background: color-mix(in srgb, var(--bg, #EDE3C7) 70%, transparent);
  line-height: 1.25;
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.meridian-article .defi-series-intro-nav__link strong {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
  color: inherit;
  font-family: "EB Garamond", serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.22;
  text-transform: none;
}

.meridian-article .defi-series-intro-nav__link--all,
.meridian-article .defi-series-intro-nav__link--all:visited {
  border-color: var(--gold, #C8922E);
  color: var(--bg, #EDE3C7);
  background: var(--ink, #2A2418);
  text-align: center;
}

.meridian-article .defi-series-intro-nav__link--all .defi-series-intro-nav__label {
  color: color-mix(in srgb, var(--gold, #C8922E) 86%, white);
}

.meridian-article .defi-series-intro-nav__link:hover,
.meridian-article .defi-series-intro-nav__link:focus-visible {
  transform: translateY(-2px);
  border-color: var(--gold, #C8922E);
  background: var(--plate, #E4D8B6);
  color: var(--ink, #2A2418);
  box-shadow: 0 10px 24px -20px rgba(20, 15, 8, .8);
}

.meridian-article .defi-series-intro-nav__link:focus-visible {
  outline: 2px solid var(--gold, #C8922E);
  outline-offset: 3px;
}

@media (max-width: 700px) {
  .meridian-article .defi-series-intro-nav {
    margin-bottom: 30px;
    padding: 20px;
  }

  .meridian-article .defi-series-intro-nav__head {
    grid-template-columns: minmax(0, 1fr) 60px;
    gap: 13px;
  }

  .meridian-article .defi-series-intro-nav__count {
    width: 60px;
    height: 60px;
    padding-top: 12px;
    font-size: 24px;
  }

  .meridian-article .defi-series-intro-nav__title {
    font-size: 21px;
  }

  .meridian-article .defi-series-intro-nav__links,
  .meridian-article .defi-series-intro-nav__links--edge {
    grid-template-columns: 1fr;
  }

  .meridian-article .defi-series-intro-nav__link {
    min-height: 62px;
  }

  .meridian-article .defi-series-intro-nav__link--all {
    order: -1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .meridian-article .defi-series-intro-nav__link { transition: none; }
}

/* Interactive layout for DeFi Education Series Part 01. */
.meridian-article .defi-fundamentals-guide {
  --df-gold: var(--gold, #C8922E);
  --df-ink: var(--ink, #2A2418);
  --df-muted: var(--ink2, #5C5238);
  --df-soft: var(--ink3, #8A7E60);
  --df-line: var(--line, rgba(42, 36, 24, .18));
  color: var(--df-ink);
}

/* The global page reveal treats direct article children as short blocks. This
   guide is the full lesson, so it must remain visible when an anchor opens it. */
.meridian-article .defi-fundamentals-guide.pc-reveal {
  opacity: 1 !important;
  transform: none !important;
}

.meridian-article .defi-fundamentals-guide * { box-sizing: border-box; }

.meridian-article .df-reading-progress {
  position: fixed;
  z-index: 90;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  pointer-events: none;
  background: color-mix(in srgb, var(--df-line) 50%, transparent);
}

.meridian-article .df-reading-progress span {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left center;
  background: var(--df-gold);
  box-shadow: 0 0 12px color-mix(in srgb, var(--df-gold) 70%, transparent);
  transition: transform .08s linear;
}

.meridian-article .df-opening {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 8px 0 28px;
  padding: clamp(28px, 5vw, 48px);
  border: 1px solid color-mix(in srgb, var(--df-gold) 42%, transparent);
  border-radius: 4px;
  background:
    radial-gradient(circle at 96% 4%, color-mix(in srgb, var(--df-gold) 17%, transparent) 0 17%, transparent 18%),
    linear-gradient(145deg, color-mix(in srgb, var(--df-gold) 11%, transparent), transparent 60%),
    var(--bg2, #F4ECD6);
  box-shadow: inset 0 4px 0 color-mix(in srgb, var(--df-gold) 82%, transparent), 0 30px 60px -54px rgba(20, 15, 8, .82);
}

.meridian-article .df-opening::after {
  content: "01";
  position: absolute;
  z-index: -1;
  right: -12px;
  bottom: -58px;
  color: color-mix(in srgb, var(--df-gold) 9%, transparent);
  font-family: Cinzel, serif;
  font-size: clamp(160px, 29vw, 250px);
  font-weight: 700;
  line-height: 1;
}

.meridian-article .df-opening__kicker,
.meridian-article .df-section__header > span,
.meridian-article .df-lesson-map summary small,
.meridian-article .df-next-lesson span {
  display: block;
  color: var(--df-gold);
  font-family: Cinzel, serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  line-height: 1.4;
  text-transform: uppercase;
}

.meridian-article .df-opening h2 {
  max-width: 680px;
  margin: 15px 0 18px;
  color: var(--df-ink);
  font-family: "EB Garamond", serif;
  font-size: clamp(38px, 6vw, 60px);
  font-weight: 500;
  letter-spacing: -.025em;
  line-height: .98;
  text-transform: none;
}

.meridian-article .df-opening__lede {
  max-width: 660px;
  margin: 0 0 24px;
  color: var(--df-muted);
  font-size: clamp(20px, 2.6vw, 25px);
  font-style: italic;
  line-height: 1.48;
}

.meridian-article .df-opening__outcomes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 26px;
}

.meridian-article .df-opening__outcomes span {
  padding: 8px 11px;
  border: 1px solid color-mix(in srgb, var(--df-gold) 32%, transparent);
  background: color-mix(in srgb, var(--bg, #EDE3C7) 72%, transparent);
  color: var(--df-muted);
  font-family: Cinzel, serif;
  font-size: 9px;
  letter-spacing: .1em;
  line-height: 1.35;
  text-transform: uppercase;
}

.meridian-article .df-purpose {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 20px;
  margin: 0 0 26px;
  padding: 14px 16px;
  border-left: 3px solid var(--df-gold);
  background: color-mix(in srgb, var(--df-gold) 7%, transparent);
}

.meridian-article .df-purpose p {
  margin: 0;
  color: var(--df-muted);
  font-size: 16px;
  line-height: 1.45;
}

.meridian-article .df-opening__context {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 0 0 28px;
}

.meridian-article .df-opening__context > div {
  min-width: 0;
  padding: 17px;
  border: 1px solid color-mix(in srgb, var(--df-gold) 24%, transparent);
  background: color-mix(in srgb, var(--bg, #EDE3C7) 58%, transparent);
}

.meridian-article .df-opening__context span {
  display: block;
  margin-bottom: 7px;
  color: var(--df-gold);
  font-family: Cinzel, serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.meridian-article .df-opening__context p {
  margin: 0;
  color: var(--df-muted);
  font-size: 16px;
  line-height: 1.5;
}

.meridian-article .df-opening > p:not(.df-opening__lede):not(.df-opening__key):not(.df-opening__shift) {
  max-width: 700px;
  margin-bottom: 17px;
  font-size: 18px;
  line-height: 1.62;
}

.meridian-article .df-opening__key {
  max-width: 680px;
  margin: 28px 0 0;
  padding: 22px 0;
  border-top: 1px solid color-mix(in srgb, var(--df-gold) 45%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--df-gold) 45%, transparent);
  color: var(--df-ink);
  font-size: clamp(23px, 3.2vw, 31px);
  font-style: italic;
  line-height: 1.35;
}

.meridian-article .df-opening__shift {
  display: inline-block;
  margin: 20px 0 10px;
  padding: 7px 10px;
  color: var(--bg, #EDE3C7);
  background: var(--df-ink);
  font-family: Cinzel, serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .13em;
  line-height: 1.35;
  text-transform: uppercase;
}

.meridian-article .df-lesson-map {
  scroll-margin-top: 92px;
  margin: 0 0 58px;
  border-block: 1px solid var(--df-line);
}

.meridian-article .df-lesson-map summary {
  display: flex;
  min-height: 76px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 15px 4px;
  cursor: pointer;
  color: var(--df-ink);
  font-family: "EB Garamond", serif;
  font-size: 25px;
  font-weight: 600;
  list-style: none;
}

.meridian-article .df-lesson-map summary::-webkit-details-marker { display: none; }
.meridian-article .df-lesson-map summary::after { content: "+"; color: var(--df-gold); font-size: 28px; font-weight: 400; }
.meridian-article .df-lesson-map[open] summary::after { content: "−"; }

.meridian-article .df-lesson-map summary b {
  color: var(--df-soft);
  font-family: Cinzel, serif;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.meridian-article .df-lesson-map__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 4px 0 24px;
}

.meridian-article .df-lesson-map__grid > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
  padding: 16px;
  border: 1px solid var(--df-line);
  background: color-mix(in srgb, var(--plate, #E4D8B6) 48%, transparent);
}

.meridian-article .df-lesson-map__grid > div > span {
  margin-bottom: 7px;
  color: var(--df-gold);
  font-family: Cinzel, serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.meridian-article .df-lesson-map a,
.meridian-article .df-lesson-map a:visited {
  padding: 6px 0;
  color: var(--df-muted);
  font-size: 15px;
  line-height: 1.3;
  text-decoration: none;
  transition: color .18s ease, transform .18s ease;
}

.meridian-article .df-lesson-map a::before { content: "→"; margin-right: 8px; color: var(--df-gold); }
.meridian-article .df-lesson-map a:hover,
.meridian-article .df-lesson-map a:focus-visible,
.meridian-article .df-lesson-map a.is-active { color: var(--df-gold); transform: translateX(3px); }

.meridian-article .df-section {
  scroll-margin-top: 92px;
  margin: 0 0 62px;
  padding: 0 0 10px;
}

.meridian-article .df-section__header {
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  margin-bottom: 24px;
  padding-bottom: 17px;
  border-bottom: 1px solid var(--df-line);
}

.meridian-article .df-section__header > span {
  padding-top: 8px;
  color: color-mix(in srgb, var(--df-gold) 80%, var(--df-ink));
  font-family: "EB Garamond", serif;
  font-size: 27px;
  font-weight: 500;
  letter-spacing: 0;
}

.meridian-article .df-section__header h2 {
  margin: 0;
  color: var(--df-ink);
  font-family: "EB Garamond", serif;
  font-size: clamp(30px, 4.4vw, 43px);
  font-weight: 500;
  letter-spacing: -.015em;
  line-height: 1.06;
  text-transform: none;
}

.meridian-article .df-section__body > p {
  max-width: 36em;
  margin: 0 0 20px;
  color: var(--df-muted);
  font-size: 19px;
  line-height: 1.7;
}

.meridian-article .df-section__body > p:first-child { color: var(--df-ink); font-size: 21px; }

.meridian-article .df-back-to-map,
.meridian-article .df-back-to-map:visited {
  display: inline-flex;
  margin-top: 10px;
  padding-bottom: 3px;
  border-bottom: 1px solid color-mix(in srgb, var(--df-gold) 45%, transparent);
  color: var(--df-soft);
  font-family: Cinzel, serif;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .13em;
  text-decoration: none;
  text-transform: uppercase;
}

.meridian-article .df-back-to-map:hover,
.meridian-article .df-back-to-map:focus-visible { color: var(--df-gold); }

.meridian-article .df-anchor-grid,
.meridian-article .df-example-grid,
.meridian-article .df-protocol-grid,
.meridian-article .df-yield-grid,
.meridian-article .df-risk-grid,
.meridian-article .df-choice-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px;
  margin: 26px 0;
  padding: 0;
  list-style: none;
}

.meridian-article .df-anchor-grid li,
.meridian-article .df-example-grid p,
.meridian-article .df-protocol-grid p,
.meridian-article .df-yield-grid p,
.meridian-article .df-risk-grid p,
.meridian-article .df-choice-grid p {
  position: relative;
  min-width: 0;
  margin: 0;
  padding: 20px 17px;
  border: 1px solid var(--df-line);
  background: var(--bg2, #F4ECD6);
  color: var(--df-muted);
  font-size: 16px;
  line-height: 1.45;
}

.meridian-article .df-anchor-grid { counter-reset: anchors; }
.meridian-article .df-anchor-grid li { counter-increment: anchors; padding-top: 48px; color: var(--df-ink); font-size: 18px; }
.meridian-article .df-anchor-grid li::before {
  content: "0" counter(anchors);
  position: absolute;
  top: 16px;
  left: 17px;
  color: var(--df-gold);
  font-family: Cinzel, serif;
  font-size: 10px;
  letter-spacing: .15em;
}

.meridian-article .df-insight,
.meridian-article .df-caution {
  margin: 28px 0;
  padding: 24px 26px;
  border: 1px solid color-mix(in srgb, var(--df-gold) 36%, transparent);
  border-left: 4px solid var(--df-gold);
  background: color-mix(in srgb, var(--df-gold) 8%, transparent);
}

.meridian-article .df-insight p,
.meridian-article .df-caution p { margin: 0 0 7px; color: var(--df-ink); font-size: 20px; line-height: 1.45; }
.meridian-article .df-insight p:last-child,
.meridian-article .df-caution p:last-child { margin-bottom: 0; }

.meridian-article .df-warning-line {
  margin: 10px 0 !important;
  padding: 13px 16px;
  border-left: 3px solid var(--df-gold);
  background: color-mix(in srgb, var(--df-gold) 7%, transparent);
  color: var(--df-ink) !important;
}

.meridian-article .df-key-line,
.meridian-article .df-key-statement {
  margin: 28px 0 !important;
  padding: 22px 0;
  border-block: 2px solid var(--df-gold);
  color: var(--df-ink) !important;
  font-family: "EB Garamond", serif;
  font-size: clamp(25px, 3.5vw, 34px) !important;
  font-style: italic;
  line-height: 1.3 !important;
}

.meridian-article .df-comparison,
.meridian-article .df-risk-compare,
.meridian-article .df-transparency-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 28px 0;
}

.meridian-article .df-comparison__card,
.meridian-article .df-risk-card,
.meridian-article .df-transparency-card {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--df-line);
  background: color-mix(in srgb, var(--plate, #E4D8B6) 48%, transparent);
}

.meridian-article .df-comparison__card--accent { border-color: var(--df-gold); background: color-mix(in srgb, var(--df-gold) 9%, transparent); }
.meridian-article .df-comparison__card p,
.meridian-article .df-risk-card p,
.meridian-article .df-transparency-card p { margin: 0 0 10px; color: var(--df-muted); font-size: 16px; line-height: 1.5; }
.meridian-article .df-comparison__card p:first-child,
.meridian-article .df-risk-card > p,
.meridian-article .df-transparency-card > strong {
  display: block;
  margin-bottom: 15px;
  color: var(--df-gold);
  font-family: Cinzel, serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.meridian-article .df-risk-card ul { margin: 0; padding-left: 20px; color: var(--df-muted); font-size: 16px; line-height: 1.6; }
.meridian-article .df-transparency-card p::before { content: "✓"; margin-right: 8px; color: var(--df-gold); }
.meridian-article .df-transparency-card--warning p::before { content: "×"; }

.meridian-article .df-benefit-cloud,
.meridian-article .df-loss-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 25px 0;
}

.meridian-article .df-benefit-cloud span,
.meridian-article .df-loss-tags span {
  padding: 10px 13px;
  border: 1px solid color-mix(in srgb, var(--df-gold) 38%, transparent);
  background: var(--bg2, #F4ECD6);
  color: var(--df-ink);
  font-family: Cinzel, serif;
  font-size: 10px;
  letter-spacing: .1em;
  line-height: 1.35;
  text-transform: uppercase;
}

.meridian-article .df-thesis {
  margin: 10px 0 28px;
  padding: 28px;
  border: 1px solid color-mix(in srgb, var(--df-gold) 45%, transparent);
  border-block-width: 2px;
  background: color-mix(in srgb, var(--df-gold) 7%, transparent);
}

.meridian-article .df-thesis p { margin: 0 0 8px; color: var(--df-ink); font-size: clamp(21px, 3vw, 29px); line-height: 1.35; }
.meridian-article .df-thesis p:nth-child(2) { color: var(--df-gold); font-style: italic; }

.meridian-article .df-layer-model,
.meridian-article .df-composability {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin: 30px 0;
}

.meridian-article .df-layer-model > div,
.meridian-article .df-composability span {
  padding: 20px;
  border: 1px solid var(--df-line);
  background: var(--bg2, #F4ECD6);
  text-align: center;
}

.meridian-article .df-layer-model span,
.meridian-article .df-layer-model small { display: block; color: var(--df-soft); font-size: 13px; }
.meridian-article .df-layer-model strong { display: block; margin: 4px 0; color: var(--df-ink); font-family: "EB Garamond", serif; font-size: 27px; text-transform: none; }
.meridian-article .df-layer-model > i,
.meridian-article .df-composability i { color: var(--df-gold); font-size: 22px; font-style: normal; }
.meridian-article .df-composability span { color: var(--df-ink); font-family: Cinzel, serif; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }

.meridian-article .df-signal-stack { display: grid; gap: 8px; margin: 24px 0; }
.meridian-article .df-signal-stack p { margin: 0; padding: 13px 15px; border-left: 3px solid var(--df-gold); background: color-mix(in srgb, var(--df-gold) 7%, transparent); color: var(--df-muted); font-size: 17px; }

.meridian-article .df-not-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin: 25px 0; }
.meridian-article .df-not-grid p { margin: 0; padding: 16px; border: 1px solid var(--df-line); background: var(--bg2, #F4ECD6); color: var(--df-ink); font-size: 17px; }
.meridian-article .df-not-grid p::before { content: "×"; margin-right: 9px; color: var(--df-gold); font-family: Cinzel, serif; }

.meridian-article .df-logic {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin: 24px 0;
  padding: 22px;
  border: 1px solid var(--df-gold);
  background: var(--df-ink);
  color: var(--bg, #EDE3C7);
  font-family: Cinzel, serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .11em;
}

.meridian-article .df-logic i { color: var(--df-gold); font-size: 22px; font-style: normal; }
.meridian-article .df-section--warning { padding: 28px; border: 1px solid color-mix(in srgb, var(--df-gold) 40%, transparent); background: color-mix(in srgb, var(--df-gold) 5%, transparent); }

.meridian-article .df-flow-list {
  counter-reset: flow;
  display: grid;
  gap: 10px;
  margin: 26px 0;
  padding: 0;
  list-style: none;
}

.meridian-article .df-flow-list li {
  counter-increment: flow;
  position: relative;
  margin: 0;
  padding: 16px 18px 16px 58px;
  border: 1px solid var(--df-line);
  background: var(--bg2, #F4ECD6);
  color: var(--df-muted);
  font-size: 17px;
  line-height: 1.45;
}

.meridian-article .df-flow-list li::before {
  content: counter(flow);
  position: absolute;
  top: 12px;
  left: 14px;
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid var(--df-gold);
  border-radius: 50%;
  color: var(--df-gold);
  font-family: Cinzel, serif;
  font-size: 10px;
}

.meridian-article .df-details { margin: 25px 0; border: 1px solid var(--df-line); background: var(--bg2, #F4ECD6); }
.meridian-article .df-details summary { padding: 16px 18px; cursor: pointer; color: var(--df-ink); font-family: Cinzel, serif; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.meridian-article .df-details p { margin: 0; padding: 0 18px 12px; color: var(--df-muted); font-size: 16px; line-height: 1.5; }

.meridian-article .df-risk-grid p,
.meridian-article .df-choice-grid p { display: flex; flex-direction: column; gap: 8px; }
.meridian-article .df-risk-grid strong,
.meridian-article .df-choice-grid strong { color: var(--df-gold); font-family: Cinzel, serif; font-size: 10px; letter-spacing: .1em; }
.meridian-article .df-risk-grid span,
.meridian-article .df-choice-grid span { color: var(--df-muted); }

.meridian-article .df-loss-tags span { border-color: color-mix(in srgb, var(--df-gold) 52%, transparent); }

.meridian-article .df-checklist {
  display: grid;
  gap: 9px;
  margin: 26px 0 12px;
}

.meridian-article .df-checklist label {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 15px 16px;
  border: 1px solid var(--df-line);
  background: var(--bg2, #F4ECD6);
  color: var(--df-muted);
  cursor: pointer;
  font-size: 17px;
  line-height: 1.4;
  transition: opacity .18s ease, border-color .18s ease, background .18s ease;
}

.meridian-article .df-checklist input {
  width: 19px;
  height: 19px;
  margin: 2px 0 0;
  accent-color: var(--df-gold);
}

.meridian-article .df-checklist label:has(input:checked) { opacity: .65; border-color: color-mix(in srgb, var(--df-gold) 38%, transparent); }
.meridian-article .df-checklist label:has(input:checked) span { text-decoration: line-through; text-decoration-thickness: 1px; }
.meridian-article .df-checklist__status { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--df-soft); font-family: Cinzel, serif; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.meridian-article .df-checklist__status button { padding: 7px 11px; border: 1px solid var(--df-line); color: var(--df-muted); background: transparent; font: inherit; letter-spacing: inherit; cursor: pointer; text-transform: uppercase; }
.meridian-article .df-checklist__status button:hover,
.meridian-article .df-checklist__status button:focus-visible { border-color: var(--df-gold); color: var(--df-gold); }

.meridian-article .df-section--finish {
  padding: clamp(28px, 5vw, 46px);
  border: 1px solid var(--df-gold);
  background: var(--df-ink);
}

.meridian-article .df-section--finish .df-section__header { border-color: color-mix(in srgb, var(--df-gold) 45%, transparent); }
.meridian-article .df-section--finish .df-section__header h2,
.meridian-article .df-section--finish .df-section__body > p { color: var(--bg, #EDE3C7); }
.meridian-article .df-section--finish .df-section__body > p { opacity: .82; }
.meridian-article .df-section--finish .df-back-to-map { display: none; }

.meridian-article .df-next-lesson,
.meridian-article .df-next-lesson:visited {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 26px;
  padding: 17px 18px;
  border: 1px solid var(--df-gold);
  color: var(--df-ink);
  background: var(--df-gold);
  text-decoration: none;
  transition: transform .18s ease, background .18s ease;
}

.meridian-article .df-next-lesson span { color: color-mix(in srgb, var(--df-ink) 72%, transparent); }
.meridian-article .df-next-lesson strong { color: var(--df-ink); font-family: "EB Garamond", serif; font-size: 19px; letter-spacing: 0; text-transform: none; }
.meridian-article .df-next-lesson:hover,
.meridian-article .df-next-lesson:focus-visible { transform: translateY(-2px); background: var(--bg, #EDE3C7); }

.meridian-article .df-figure { margin: 34px 0; padding: 9px; border: 1px solid var(--df-line); background: var(--plate, #E4D8B6); }
.meridian-article .df-figure img { display: block; width: 100%; border: 0; }
.meridian-article .df-figure figcaption { padding: 10px 5px 2px; color: var(--df-soft); font-family: Cinzel, serif; font-size: 9px; letter-spacing: .12em; line-height: 1.4; text-transform: uppercase; }

@media (max-width: 760px) {
  .meridian-article .df-opening { padding: 28px 21px; }
  .meridian-article .df-opening h2 { font-size: clamp(36px, 11vw, 48px); }
  .meridian-article .df-lesson-map summary { font-size: 22px; }
  .meridian-article .df-lesson-map summary b { display: none; }
  .meridian-article .df-lesson-map__grid,
  .meridian-article .df-opening__context,
  .meridian-article .df-comparison,
  .meridian-article .df-risk-compare,
  .meridian-article .df-transparency-grid,
  .meridian-article .df-not-grid { grid-template-columns: 1fr; }
  .meridian-article .df-anchor-grid,
  .meridian-article .df-example-grid,
  .meridian-article .df-protocol-grid,
  .meridian-article .df-yield-grid,
  .meridian-article .df-risk-grid,
  .meridian-article .df-choice-grid { grid-template-columns: 1fr; }
  .meridian-article .df-section__header { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; }
  .meridian-article .df-section__header > span { font-size: 22px; }
  .meridian-article .df-section__header h2 { font-size: clamp(28px, 9vw, 37px); }
  .meridian-article .df-section__body > p { font-size: 18px; }
  .meridian-article .df-layer-model,
  .meridian-article .df-composability { grid-template-columns: 1fr; }
  .meridian-article .df-layer-model > i,
  .meridian-article .df-composability i { transform: rotate(90deg); text-align: center; }
  .meridian-article .df-section--warning,
  .meridian-article .df-section--finish { padding: 24px 20px; }
  .meridian-article .df-next-lesson { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .meridian-article .df-reading-progress span,
  .meridian-article .df-lesson-map a,
  .meridian-article .df-checklist label,
  .meridian-article .df-next-lesson { transition: none; }
}

/* Interactive layout for DeFi Education Series Part 02. */
.meridian-article .wallet-ownership-guide {
  --wo-accent: var(--gold, #C8922E);
  --wo-ink: var(--ink, #2A2418);
  --wo-muted: var(--ink2, #5C5238);
  --wo-soft: var(--ink3, #8A7E60);
  --wo-line: var(--line, rgba(42, 36, 24, .18));
  --wo-plate: var(--plate, #E4D8B6);
}

.meridian-article .wo-opening__topic {
  margin: 24px 0 8px;
  color: var(--wo-accent);
  font-family: Cinzel, serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.meridian-article .wo-opening .df-thesis {
  margin: 24px 0 0;
}

.meridian-article .wo-control-table {
  display: grid;
  gap: 8px;
  margin: 26px 0;
}

.meridian-article .wo-control-table > div {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) 150px;
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  border: 1px solid var(--wo-line);
  background: color-mix(in srgb, var(--wo-plate) 45%, transparent);
}

.meridian-article .wo-control-table span:first-child,
.meridian-article .wo-control-table b {
  font-family: Cinzel, serif;
  font-size: 10px;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.meridian-article .wo-control-table b { color: var(--wo-accent); }

.meridian-article .wo-control-chain,
.meridian-article .wo-alice-flow,
.meridian-article .wo-hardware-flow,
.meridian-article .wo-plan-chain {
  display: grid;
  grid-template-columns: repeat(5, auto);
  align-items: stretch;
  gap: 10px;
  margin: 26px 0;
}

.meridian-article .wo-control-chain > div {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  padding: 17px;
  border: 1px solid var(--wo-line);
}

.meridian-article .wo-control-chain small,
.meridian-article .wo-control-chain span {
  color: var(--wo-soft);
  font-family: Cinzel, serif;
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.meridian-article .wo-control-chain strong {
  margin: 7px 0 4px;
  color: var(--wo-ink);
  font-family: "EB Garamond", serif;
  font-size: 24px;
}

.meridian-article .wo-control-chain > i,
.meridian-article .wo-alice-flow > i,
.meridian-article .wo-hardware-flow > i,
.meridian-article .wo-plan-chain > i {
  align-self: center;
  color: var(--wo-accent);
  font-style: normal;
}

.meridian-article .wo-key-stack {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  margin: 24px 0;
}

.meridian-article .wo-key-stack > span {
  padding: 17px 12px;
  border: 1px solid var(--wo-line);
  color: var(--wo-ink);
  font-family: Cinzel, serif;
  font-size: 11px;
  letter-spacing: .1em;
  text-align: center;
}

.meridian-article .wo-key-stack small { display: block; margin-top: 5px; color: var(--wo-soft); font-size: 8px; }
.meridian-article .wo-key-stack i { color: var(--wo-accent); font: 9px Cinzel, serif; text-align: center; }

.meridian-article .wo-alice-flow,
.meridian-article .wo-hardware-flow,
.meridian-article .wo-plan-chain {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
}

.meridian-article .wo-alice-flow > span,
.meridian-article .wo-hardware-flow > span,
.meridian-article .wo-hardware-flow > strong,
.meridian-article .wo-plan-chain > span {
  display: grid;
  place-items: center;
  min-height: 88px;
  padding: 15px;
  border: 1px solid var(--wo-line);
  color: var(--wo-muted);
  text-align: center;
}

.meridian-article .wo-hardware-flow > strong { border-color: var(--wo-accent); color: var(--wo-ink); }

.meridian-article .wo-seed-tree {
  margin: 26px 0;
  padding: 23px;
  border: 1px solid var(--wo-line);
  text-align: center;
}

.meridian-article .wo-seed-tree > strong {
  display: inline-block;
  padding: 10px 15px;
  color: var(--wo-ink);
  background: var(--wo-accent);
  font-family: Cinzel, serif;
  font-size: 10px;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.meridian-article .wo-seed-tree > div {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 26px;
  border-top: 1px solid var(--wo-line);
  padding-top: 18px;
}

.meridian-article .wo-seed-tree span { color: var(--wo-muted); font-family: Cinzel, serif; font-size: 10px; letter-spacing: .07em; }
.meridian-article .wo-seed-tree small { color: var(--wo-soft); font-size: 9px; }

.meridian-article .wo-table-wrap {
  max-width: 100%;
  margin: 26px 0;
  overflow-x: auto;
  border: 1px solid var(--wo-line);
}

.meridian-article .wo-table {
  width: 100%;
  min-width: 620px;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  color: var(--wo-muted);
  font-size: 16px;
}

.meridian-article .wo-table caption {
  padding: 14px 16px;
  border-bottom: 1px solid var(--wo-line);
  color: var(--wo-accent);
  font-family: Cinzel, serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-align: left;
  text-transform: uppercase;
}

.meridian-article .wo-table th,
.meridian-article .wo-table td {
  padding: 13px 16px;
  border-right: 1px solid var(--wo-line);
  border-bottom: 1px solid var(--wo-line);
  text-align: left;
  vertical-align: top;
}

.meridian-article .wo-table th { color: var(--wo-ink); font-family: Cinzel, serif; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.meridian-article .wo-table tr:last-child > * { border-bottom: 0; }
.meridian-article .wo-table tr > *:last-child { border-right: 0; }

.meridian-article .wo-derivation,
.meridian-article .wo-equation,
.meridian-article .wo-identity {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 25px 0;
  padding: 20px;
  border: 1px solid var(--wo-line);
}

.meridian-article .wo-derivation b,
.meridian-article .wo-equation > span,
.meridian-article .wo-identity > span,
.meridian-article .wo-identity > strong {
  padding: 10px 12px;
  border: 1px solid var(--wo-line);
  color: var(--wo-ink);
  font-family: Cinzel, serif;
  font-size: 10px;
  letter-spacing: .08em;
  text-align: center;
  text-transform: uppercase;
}

.meridian-article .wo-derivation > span,
.meridian-article .wo-equation > b,
.meridian-article .wo-identity > i { color: var(--wo-accent); font: 9px Cinzel, serif; }
.meridian-article .wo-equation small { display: block; max-width: 220px; margin-top: 6px; color: var(--wo-soft); font-size: 8px; }

.meridian-article .wo-glossary > p:has(strong:first-child) {
  padding: 16px 18px;
  border-left: 2px solid var(--wo-accent);
  background: color-mix(in srgb, var(--wo-plate) 38%, transparent);
}

.meridian-article .wo-permission-compare {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin: 25px 0;
}

.meridian-article .wo-permission-compare > div {
  display: flex;
  flex-direction: column;
  padding: 22px;
  border: 1px solid var(--wo-line);
}

.meridian-article .wo-permission-compare > div:last-child { border-color: var(--wo-accent); }
.meridian-article .wo-permission-compare small { color: var(--wo-accent); font: 9px Cinzel, serif; letter-spacing: .12em; }
.meridian-article .wo-permission-compare strong { margin: 8px 0; color: var(--wo-ink); font: 28px "EB Garamond", serif; }
.meridian-article .wo-permission-compare span { color: var(--wo-soft); }

.meridian-article .wo-sign-flow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin: 25px 0;
  padding: 0;
  list-style: none;
  counter-reset: sign-step;
}

.meridian-article .wo-sign-flow li {
  min-height: 130px;
  padding: 17px;
  border: 1px solid var(--wo-line);
  counter-increment: sign-step;
}

.meridian-article .wo-sign-flow li::before { display: block; margin-bottom: 20px; color: var(--wo-accent); content: "0" counter(sign-step); font: 11px Cinzel, serif; }

.meridian-article .wo-action-grid,
.meridian-article .wo-principles,
.meridian-article .wo-red-flags {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
  margin: 24px 0;
  padding: 0;
  list-style: none;
}

.meridian-article .wo-action-grid li,
.meridian-article .wo-principles li,
.meridian-article .wo-red-flags li {
  padding: 14px 16px;
  border: 1px solid var(--wo-line);
}

.meridian-article .wo-red-flags li { border-left: 2px solid #a44; }

.meridian-article .wo-risk-matrix {
  display: grid;
  margin: 25px 0;
  border: 1px solid var(--wo-line);
}

.meridian-article .wo-risk-matrix > div {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.meridian-article .wo-risk-matrix > div > * { padding: 13px 15px; border-right: 1px solid var(--wo-line); border-bottom: 1px solid var(--wo-line); }
.meridian-article .wo-risk-matrix > div:first-child { color: var(--wo-accent); font: 9px Cinzel, serif; letter-spacing: .08em; text-transform: uppercase; }
.meridian-article .wo-risk-matrix > div:last-child > * { border-bottom: 0; }
.meridian-article .wo-risk-matrix > div > *:last-child { border-right: 0; }

.meridian-article .wo-allowance-tool,
.meridian-article .wo-setup-explorer {
  margin: 25px 0;
  padding: 22px;
  border: 1px solid var(--wo-accent);
  background: color-mix(in srgb, var(--wo-plate) 40%, transparent);
}

.meridian-article .wo-allowance-tool > span,
.meridian-article .wo-setup-explorer > span { color: var(--wo-accent); font: 10px Cinzel, serif; letter-spacing: .11em; text-transform: uppercase; }
.meridian-article .wo-allowance-tool > div,
.meridian-article .wo-setup-explorer > div { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; }
.meridian-article .wo-allowance-tool button,
.meridian-article .wo-setup-explorer button {
  padding: 10px 13px;
  border: 1px solid var(--wo-line);
  color: var(--wo-muted);
  background: transparent;
  font: 9px Cinzel, serif;
  letter-spacing: .08em;
  cursor: pointer;
  text-transform: uppercase;
}
.meridian-article .wo-allowance-tool button:hover,
.meridian-article .wo-allowance-tool button:focus-visible,
.meridian-article .wo-allowance-tool button.is-active,
.meridian-article .wo-setup-explorer button:hover,
.meridian-article .wo-setup-explorer button:focus-visible,
.meridian-article .wo-setup-explorer button.is-active { border-color: var(--wo-accent); color: var(--wo-ink); background: var(--wo-accent); }
.meridian-article .wo-allowance-tool p,
.meridian-article .wo-setup-explorer p { margin: 0; padding-top: 15px; border-top: 1px solid var(--wo-line); }
.meridian-article .wo-allowance-tool p b,
.meridian-article .wo-setup-explorer p small { display: block; color: var(--wo-ink); font: 11px Cinzel, serif; letter-spacing: .06em; text-transform: uppercase; }
.meridian-article .wo-allowance-tool p span,
.meridian-article .wo-setup-explorer p strong { display: block; margin-top: 8px; color: var(--wo-muted); font-size: 17px; font-weight: 400; }
.meridian-article .wo-allowance-tool[data-level="unlimited"] { border-color: #a44; }

.meridian-article .wo-multisig {
  display: grid;
  justify-items: center;
  gap: 12px;
  margin: 25px 0;
  padding: 24px;
  border: 1px solid var(--wo-line);
}
.meridian-article .wo-multisig > div { display: flex; gap: 10px; }
.meridian-article .wo-multisig span { padding: 9px 14px; border: 1px solid var(--wo-line); font: 9px Cinzel, serif; }
.meridian-article .wo-multisig strong { color: var(--wo-accent); font: 10px Cinzel, serif; letter-spacing: .12em; }
.meridian-article .wo-multisig i { color: var(--wo-accent); font-style: normal; }
.meridian-article .wo-multisig b { padding: 10px 16px; color: var(--wo-ink); background: var(--wo-accent); font: 9px Cinzel, serif; letter-spacing: .08em; }

.meridian-article .wo-storage-methods > h3 { color: var(--wo-accent); font-family: Cinzel, serif; font-size: 12px; letter-spacing: .08em; }

.meridian-article .wo-finality {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
  margin: 25px 0;
}
.meridian-article .wo-finality span { padding: 17px; border: 1px solid var(--wo-line); color: var(--wo-soft); font: 9px Cinzel, serif; letter-spacing: .08em; text-align: center; }
.meridian-article .wo-finality b { display: block; margin-top: 8px; color: var(--wo-ink); }

.meridian-article .wo-checklist { display: grid; margin-bottom: 12px; padding: 0; list-style: none; }
.meridian-article .wo-checklist li { margin: 0; }
.meridian-article .wo-checklist label { display: grid; }

.meridian-article .wo-identity-layer {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin: 25px 0;
}
.meridian-article .wo-identity-layer span { padding: 16px 10px; border: 1px solid var(--wo-accent); color: var(--wo-ink); font: 9px Cinzel, serif; letter-spacing: .08em; text-align: center; }

@media (max-width: 760px) {
  .meridian-article .wo-control-table > div { grid-template-columns: 1fr; gap: 7px; }
  .meridian-article .wo-control-chain,
  .meridian-article .wo-key-stack,
  .meridian-article .wo-alice-flow,
  .meridian-article .wo-hardware-flow,
  .meridian-article .wo-plan-chain { grid-template-columns: 1fr; }
  .meridian-article .wo-control-chain > i,
  .meridian-article .wo-key-stack i,
  .meridian-article .wo-alice-flow > i,
  .meridian-article .wo-hardware-flow > i,
  .meridian-article .wo-plan-chain > i { transform: rotate(90deg); }
  .meridian-article .wo-seed-tree > div,
  .meridian-article .wo-permission-compare,
  .meridian-article .wo-sign-flow,
  .meridian-article .wo-action-grid,
  .meridian-article .wo-principles,
  .meridian-article .wo-red-flags,
  .meridian-article .wo-finality,
  .meridian-article .wo-identity-layer { grid-template-columns: 1fr; }
  .meridian-article .wo-risk-matrix { overflow-x: auto; }
  .meridian-article .wo-risk-matrix > div { min-width: 560px; }
  .meridian-article .wo-derivation,
  .meridian-article .wo-equation,
  .meridian-article .wo-identity { align-items: stretch; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .meridian-article .wo-allowance-tool button,
  .meridian-article .wo-setup-explorer button { transition: none; }
}

/* Shared interactive layout for DeFi Education Series Parts 03-17. */
.meridian-article .series-interactive-guide {
  --si-gold: var(--gold, #C8922E);
  --si-ink: var(--ink, #2A2418);
  --si-muted: var(--ink2, #5C5238);
  --si-soft: var(--ink3, #8A7E60);
  --si-line: var(--line, rgba(42, 36, 24, .18));
  --si-plate: var(--plate, #E4D8B6);
}

.meridian-article .si-opening {
  margin-bottom: 28px;
}

.meridian-article .si-opening > p:not(.df-opening__lede),
.meridian-article .si-opening > blockquote {
  max-width: 720px;
}

.meridian-article .si-overview {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px;
  margin: 34px 0 54px;
  padding: clamp(22px, 4vw, 36px);
  border: 1px solid var(--si-gold);
  background: color-mix(in srgb, var(--si-plate) 42%, transparent);
}

.meridian-article .si-overview > header {
  grid-column: 1 / -1;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--si-line);
}

.meridian-article .si-overview > header > span,
.meridian-article .si-flow > small,
.meridian-article .si-explorer > small,
.meridian-article .si-knowledge-check > span {
  color: var(--si-gold);
  font-family: Cinzel, serif;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.meridian-article .si-overview > header h2,
.meridian-article .si-knowledge-check h2 {
  margin: 7px 0 6px;
  color: var(--si-ink);
  font-family: "EB Garamond", serif;
  font-size: clamp(30px, 5vw, 45px);
  font-weight: 500;
  line-height: 1.04;
}

.meridian-article .si-overview > header p {
  margin: 0;
  color: var(--si-muted);
  font-size: 17px;
}

.meridian-article .si-flow,
.meridian-article .si-explorer {
  padding: 20px;
  border: 1px solid var(--si-line);
  background: color-mix(in srgb, var(--bg, #EDE3C7) 54%, transparent);
}

.meridian-article .si-flow ol {
  display: grid;
  gap: 0;
  margin: 15px 0 0;
  padding: 0;
  list-style: none;
  counter-reset: none;
}

.meridian-article .si-flow li {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  position: relative;
  min-height: 47px;
  padding: 7px 0;
  border-bottom: 1px solid var(--si-line);
}

.meridian-article .si-flow li:last-child { border-bottom: 0; }
.meridian-article .si-flow li span { display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid var(--si-gold); color: var(--si-gold); font: 8px Cinzel, serif; }
.meridian-article .si-flow li b { color: var(--si-ink); font-size: 16px; font-weight: 500; }

.meridian-article .si-table-wrap {
  grid-column: 1 / -1;
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--si-line);
  background: color-mix(in srgb, var(--bg, #EDE3C7) 54%, transparent);
}

.meridian-article .si-table {
  width: 100%;
  min-width: 670px;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  color: var(--si-muted);
  font-size: 15px;
}

.meridian-article .si-table caption {
  padding: 14px 16px;
  border-bottom: 1px solid var(--si-line);
  color: var(--si-gold);
  font: 700 9px Cinzel, serif;
  letter-spacing: .12em;
  text-align: left;
  text-transform: uppercase;
}

.meridian-article .si-table th,
.meridian-article .si-table td {
  padding: 13px 15px;
  border-right: 1px solid var(--si-line);
  border-bottom: 1px solid var(--si-line);
  text-align: left;
  vertical-align: top;
}

.meridian-article .si-table th { color: var(--si-ink); font: 9px Cinzel, serif; letter-spacing: .08em; text-transform: uppercase; }
.meridian-article .si-table tr:last-child td { border-bottom: 0; }
.meridian-article .si-table tr > *:last-child { border-right: 0; }

.meridian-article .si-explorer > div {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 15px 0;
}

.meridian-article .si-explorer button {
  padding: 9px 11px;
  border: 1px solid var(--si-line);
  color: var(--si-muted);
  background: transparent;
  font: 8px Cinzel, serif;
  letter-spacing: .07em;
  cursor: pointer;
  text-transform: uppercase;
}

.meridian-article .si-explorer button:hover,
.meridian-article .si-explorer button:focus-visible,
.meridian-article .si-explorer button.is-active {
  border-color: var(--si-gold);
  color: var(--si-ink);
  background: var(--si-gold);
}

.meridian-article .si-explorer p {
  margin: 0;
  padding-top: 14px;
  border-top: 1px solid var(--si-line);
}

.meridian-article .si-explorer p b,
.meridian-article .si-explorer p span { display: block; }
.meridian-article .si-explorer p b { color: var(--si-ink); font: 10px Cinzel, serif; letter-spacing: .06em; text-transform: uppercase; }
.meridian-article .si-explorer p span { margin-top: 7px; color: var(--si-muted); font-size: 16px; line-height: 1.45; }

.meridian-article .si-section .si-card-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 22px 0;
  padding: 0;
  list-style: none;
}

.meridian-article .si-section .si-card-list > li {
  position: relative;
  margin: 0;
  padding: 14px 16px 14px 35px;
  border: 1px solid var(--si-line);
  color: var(--si-muted);
}

.meridian-article .si-section .si-card-list > li::before {
  position: absolute;
  top: 16px;
  left: 14px;
  color: var(--si-gold);
  content: "↳";
}

.meridian-article .si-section blockquote {
  margin: 25px 0;
  padding: 20px 22px;
  border: 1px solid var(--si-gold);
  border-left-width: 3px;
  color: var(--si-ink);
  background: color-mix(in srgb, var(--si-plate) 45%, transparent);
}

.meridian-article .si-section h3,
.meridian-article .si-section h4 {
  margin-top: 30px;
  color: var(--si-ink);
  font-family: "EB Garamond", serif;
  line-height: 1.12;
}

.meridian-article .si-checklist {
  display: grid;
  gap: 9px;
  margin: 22px 0 12px;
  padding: 0;
  list-style: none;
}

.meridian-article .si-checklist li { margin: 0; }
.meridian-article .si-checklist label {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: start;
  gap: 11px;
  padding: 14px 15px;
  border: 1px solid var(--si-line);
  cursor: pointer;
}

.meridian-article .si-checklist label:hover,
.meridian-article .si-checklist label:focus-within { border-color: var(--si-gold); }
.meridian-article .si-checklist input { width: 17px; height: 17px; margin: 3px 0 0; accent-color: var(--si-gold); }
.meridian-article .si-checklist label:has(input:checked) { opacity: .65; border-color: color-mix(in srgb, var(--si-gold) 40%, transparent); }
.meridian-article .si-checklist label:has(input:checked) span { text-decoration: line-through; }

.meridian-article .si-checklist-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--si-soft);
  font: 9px Cinzel, serif;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.meridian-article .si-checklist-status button {
  padding: 7px 10px;
  border: 1px solid var(--si-line);
  color: var(--si-muted);
  background: transparent;
  font: inherit;
  letter-spacing: inherit;
  cursor: pointer;
  text-transform: uppercase;
}

.meridian-article .si-checklist-status button:hover,
.meridian-article .si-checklist-status button:focus-visible { border-color: var(--si-gold); color: var(--si-gold); }

.meridian-article .si-knowledge-check {
  margin: 48px 0;
  padding: clamp(23px, 4vw, 36px);
  border: 1px solid var(--si-gold);
  background: var(--si-ink);
}

.meridian-article .si-knowledge-check h2 { color: var(--bg, #EDE3C7); }
.meridian-article .si-knowledge-check details { border-top: 1px solid color-mix(in srgb, var(--si-gold) 40%, transparent); }
.meridian-article .si-knowledge-check details:last-child { border-bottom: 1px solid color-mix(in srgb, var(--si-gold) 40%, transparent); }
.meridian-article .si-knowledge-check summary {
  padding: 16px 28px 16px 0;
  color: var(--bg, #EDE3C7);
  cursor: pointer;
  font-size: 17px;
  list-style: none;
}
.meridian-article .si-knowledge-check summary::-webkit-details-marker { display: none; }
.meridian-article .si-knowledge-check summary::after { float: right; color: var(--si-gold); content: "+"; }
.meridian-article .si-knowledge-check details[open] summary::after { content: "−"; }
.meridian-article .si-knowledge-check details p { margin: 0 0 17px; color: color-mix(in srgb, var(--bg, #EDE3C7) 80%, transparent); font-size: 16px; }

.meridian-article .series-interactive-guide .df-section--finish .df-next-lesson { margin-bottom: 10px; }

@media (max-width: 760px) {
  .meridian-article .si-overview { grid-template-columns: 1fr; padding: 20px; }
  .meridian-article .si-overview > header,
  .meridian-article .si-table-wrap { grid-column: 1; }
  .meridian-article .si-section .si-card-list { grid-template-columns: 1fr; }
  .meridian-article .si-table { min-width: 620px; }
  .meridian-article .si-knowledge-check { padding: 22px 19px; }
}

@media (prefers-reduced-motion: reduce) {
  .meridian-article .si-explorer button,
  .meridian-article .si-checklist label { transition: none; }
}

/* Bespoke transaction lifecycle for DeFi Education Series Part 03. */
.meridian-article #series-interactive-guide-part-03 .si-overview > .si-explorer { grid-column: 1 / -1; }

.meridian-article #series-interactive-guide-part-03 .tx-lifecycle {
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--si-line);
  background: var(--si-ink);
}

.meridian-article #series-interactive-guide-part-03 .tx-lifecycle > small {
  color: var(--si-gold);
  font: 9px Cinzel, serif;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.meridian-article #series-interactive-guide-part-03 .tx-lifecycle__steps {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 4px;
  margin: 15px 0;
}

.meridian-article #series-interactive-guide-part-03 .tx-lifecycle button {
  min-height: 47px;
  padding: 8px 5px;
  border: 1px solid color-mix(in srgb, var(--si-gold) 38%, transparent);
  color: color-mix(in srgb, var(--bg, #EDE3C7) 76%, transparent);
  background: transparent;
  font: 8px Cinzel, serif;
  letter-spacing: .06em;
  cursor: pointer;
  text-transform: uppercase;
}

.meridian-article #series-interactive-guide-part-03 .tx-lifecycle button:hover,
.meridian-article #series-interactive-guide-part-03 .tx-lifecycle button:focus-visible,
.meridian-article #series-interactive-guide-part-03 .tx-lifecycle button.is-active {
  border-color: var(--si-gold);
  color: var(--si-ink);
  background: var(--si-gold);
}

.meridian-article #series-interactive-guide-part-03 .tx-lifecycle__display {
  padding-top: 14px;
  border-top: 1px solid color-mix(in srgb, var(--si-gold) 35%, transparent);
}

.meridian-article #series-interactive-guide-part-03 .tx-lifecycle__display span {
  display: block;
  color: var(--si-gold);
  font: 9px Cinzel, serif;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.meridian-article #series-interactive-guide-part-03 .tx-lifecycle__display strong {
  display: block;
  margin: 7px 0;
  color: var(--bg, #EDE3C7);
  font: 24px "EB Garamond", serif;
  line-height: 1.05;
}

.meridian-article #series-interactive-guide-part-03 .tx-lifecycle__display p {
  margin: 0;
  color: color-mix(in srgb, var(--bg, #EDE3C7) 78%, transparent);
  font-size: 15px;
  line-height: 1.45;
}

@media (max-width: 760px) {
  .meridian-article #series-interactive-guide-part-03 .tx-lifecycle__steps { grid-template-columns: repeat(3, 1fr); }
}

/* Topic-specific interactive explainers for DeFi Education Series Parts 04–06. */
.meridian-article .series-interactive-guide .si-overview > .topic-explorer { grid-column: 1 / -1; }
.meridian-article .series-interactive-guide .topic-explorer { min-width: 0; padding: 20px; border: 1px solid var(--si-line); background: var(--si-ink); }
.meridian-article .series-interactive-guide .topic-explorer > small { color: var(--si-gold); font: 9px Cinzel, serif; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.meridian-article .series-interactive-guide .topic-explorer__controls { display: grid; grid-template-columns: repeat(var(--topic-columns, 3), 1fr); gap: 5px; margin: 15px 0; }
.meridian-article #series-interactive-guide-part-06 .topic-explorer__controls { --topic-columns: 4; }
.meridian-article .series-interactive-guide .topic-explorer button { min-height: 52px; padding: 8px; border: 1px solid color-mix(in srgb, var(--si-gold) 38%, transparent); color: color-mix(in srgb, var(--bg, #EDE3C7) 78%, transparent); background: transparent; font: 9px Cinzel, serif; letter-spacing: .05em; line-height: 1.25; cursor: pointer; text-transform: uppercase; }
.meridian-article .series-interactive-guide .topic-explorer button span { display: block; margin-bottom: 4px; color: var(--si-gold); font-size: 8px; }
.meridian-article .series-interactive-guide .topic-explorer button:hover, .meridian-article .series-interactive-guide .topic-explorer button:focus-visible, .meridian-article .series-interactive-guide .topic-explorer button.is-active { border-color: var(--si-gold); color: var(--si-ink); background: var(--si-gold); }
.meridian-article .series-interactive-guide .topic-explorer button.is-active span { color: var(--si-ink); }
.meridian-article .series-interactive-guide .topic-explorer__display { padding-top: 14px; border-top: 1px solid color-mix(in srgb, var(--si-gold) 35%, transparent); }
.meridian-article .series-interactive-guide .topic-explorer__display span { display: block; color: var(--si-gold); font: 9px Cinzel, serif; letter-spacing: .1em; }
.meridian-article .series-interactive-guide .topic-explorer__display strong { display: block; margin: 7px 0; color: var(--bg, #EDE3C7); font: 24px "EB Garamond", serif; line-height: 1.05; }
.meridian-article .series-interactive-guide .topic-explorer__display p { margin: 0; color: color-mix(in srgb, var(--bg, #EDE3C7) 78%, transparent); font-size: 15px; line-height: 1.45; }
@media (max-width: 760px) { .meridian-article .series-interactive-guide .topic-explorer__controls, .meridian-article #series-interactive-guide-part-06 .topic-explorer__controls { grid-template-columns: repeat(2, 1fr); } }

/* Bespoke swap quote explorer for DeFi Education Series Part 07. */
.meridian-article #series-interactive-guide-part-07 .si-overview > .swap-quote-lab { grid-column: 1 / -1; }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab { min-width:0; padding:20px; border:1px solid var(--si-line); background:var(--si-ink); }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab > small { color:var(--si-gold); font:700 9px Cinzel,serif; letter-spacing:.12em; text-transform:uppercase; }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab__controls { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; margin:15px 0; }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab button { min-height:58px; padding:8px; border:1px solid color-mix(in srgb,var(--si-gold) 38%,transparent); color:color-mix(in srgb,var(--bg,#EDE3C7) 78%,transparent); background:transparent; font:9px Cinzel,serif; letter-spacing:.05em; cursor:pointer; text-transform:uppercase; }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab button span { display:block; margin-bottom:4px; color:var(--si-gold); font-size:8px; }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab button:hover, .meridian-article #series-interactive-guide-part-07 .swap-quote-lab button:focus-visible, .meridian-article #series-interactive-guide-part-07 .swap-quote-lab button.is-active { border-color:var(--si-gold); color:var(--si-ink); background:var(--si-gold); }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab button.is-active span { color:var(--si-ink); }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab__display { padding-top:14px; border-top:1px solid color-mix(in srgb,var(--si-gold) 35%,transparent); }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab__display span, .meridian-article #series-interactive-guide-part-07 .swap-quote-lab__display b { display:block; color:var(--si-gold); font:9px Cinzel,serif; letter-spacing:.1em; text-transform:uppercase; }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab__display b { margin-top:5px; color:color-mix(in srgb,var(--si-gold) 78%,white); }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab__display strong { display:block; margin:7px 0; color:var(--bg,#EDE3C7); font:24px "EB Garamond",serif; line-height:1.05; }
.meridian-article #series-interactive-guide-part-07 .swap-quote-lab__display p { margin:0; color:color-mix(in srgb,var(--bg,#EDE3C7) 78%,transparent); font-size:15px; line-height:1.45; }
@media(max-width:760px){.meridian-article #series-interactive-guide-part-07 .swap-quote-lab__controls{grid-template-columns:1fr;}}

/* DeFi Education Series readability pass + shared interactive components (2026-09). */

/* Everything here is scoped to .defi-fundamentals-guide, the class every one of
   the 17 lesson bodies carries. Parts 01-02 additionally use .wallet-ownership-
   guide and a large set of bespoke df- and wo- blocks, so the rules below only
   touch prose and shared scaffolding — never the inside of those blocks. */

/* 0. The --si-* palette was previously declared only on .series-interactive-
   guide, so it was undefined on Parts 01-02. Declare it on the class all
   seventeen lessons share; for Parts 03-17 this simply restates the same
   values. */
.meridian-article .defi-fundamentals-guide {
  --si-gold: var(--gold, #C8922E);
  --si-ink: var(--ink, #2A2418);
  --si-muted: var(--ink2, #5C5238);
  --si-soft: var(--ink3, #8A7E60);
  --si-line: var(--line, rgba(42, 36, 24, .18));
  --si-plate: var(--plate, #E4D8B6);
}

/* 1. Remove repeated scaffolding that added noise rather than orientation.
   The fixed reading-progress bar and the collapsible lesson map already cover
   "where am I", so the per-section "back to lesson map" links and the second
   bottom navigation block (a duplicate of the top nav) are retired. Hiding them
   here clears every lesson immediately; the markup is then stripped per part. */
.meridian-article .defi-fundamentals-guide .df-back-to-map { display: none !important; }
.meridian-article #defi-series-navigation { display: none !important; }

/* 2. Reading measure. Body prose, lists, quotes and figures now share one
   comfortable column instead of running the full content width. */
.meridian-article .defi-fundamentals-guide .df-section__body > ul,
.meridian-article .defi-fundamentals-guide .df-section__body > ol,
.meridian-article .defi-fundamentals-guide .df-section__body > p {
  max-width: 38em;
}
.meridian-article .defi-fundamentals-guide .df-section__body > figure.df-figure {
  max-width: 44em;
}

/* 3. Calmer lists. The card treatment on every <ul> made simple enumerations
   look like data tables. Keep a light rule and the gold marker; drop the box. */
.meridian-article .si-section .si-card-list {
  display: block;
  margin: 20px 0;
  border-left: 1px solid color-mix(in srgb, var(--si-gold) 34%, transparent);
}
.meridian-article .si-section .si-card-list > li {
  padding: 7px 0 7px 20px;
  border: 0;
}
.meridian-article .si-section .si-card-list > li::before {
  top: 7px;
  left: 4px;
  content: "·";
  font-weight: 700;
}
/* Opt back in to the two-column card grid only where a comparison earns it. */
.meridian-article .si-section .si-card-list--grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  border-left: 0;
}
.meridian-article .si-section .si-card-list--grid > li {
  padding: 14px 16px 14px 35px;
  border: 1px solid var(--si-line);
}
.meridian-article .si-section .si-card-list--grid > li::before {
  top: 16px;
  left: 14px;
  content: "\21b3";
  font-weight: 400;
}

/* 4. Lesson map opens closed by default and reads as a quiet utility. */
.meridian-article .defi-fundamentals-guide .df-lesson-map summary { min-height: 62px; font-size: 22px; }
.meridian-article .defi-fundamentals-guide .df-lesson-map:not([open]) summary { color: var(--df-muted); }

@media (max-width: 760px) {
  .meridian-article .defi-fundamentals-guide .df-section__body,
  .meridian-article .defi-fundamentals-guide .df-section__body > ul,
  .meridian-article .defi-fundamentals-guide .df-section__body > ol,
  .meridian-article .defi-fundamentals-guide .df-section__body > p { max-width: none; }
}

/* ------------------------------------------------------------------ */
/* Constant-product pool explorer — DeFi Education Series Part 09.     */
/* ------------------------------------------------------------------ */
.meridian-article .cp-amm {
  margin: 26px 0 6px;
  padding: clamp(18px, 3.4vw, 26px);
  border: 1px solid var(--si-gold);
  background: color-mix(in srgb, var(--si-plate) 40%, transparent);
}
.meridian-article .cp-amm figcaption {
  margin-bottom: 16px;
  padding-bottom: 13px;
  border-bottom: 1px solid var(--si-line);
}
.meridian-article .cp-amm figcaption small {
  display: block;
  color: var(--si-gold);
  font: 700 9px Cinzel, serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.meridian-article .cp-amm figcaption span {
  display: block;
  margin-top: 5px;
  color: var(--si-muted);
  font-size: 16px;
}
.meridian-article .cp-amm__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 14px 22px;
  margin-bottom: 18px;
}
.meridian-article .cp-amm__group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.meridian-article .cp-amm__group > span {
  color: var(--si-soft);
  font: 700 9px Cinzel, serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.meridian-article .cp-amm__depth,
.meridian-article .cp-amm__dir {
  display: flex;
  gap: 6px;
}
.meridian-article .cp-amm__size output {
  color: var(--si-ink);
  font-family: "EB Garamond", serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
.meridian-article .cp-amm__controls button {
  padding: 8px 12px;
  border: 1px solid var(--si-line);
  color: var(--si-muted);
  background: transparent;
  font: 8px Cinzel, serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}
.meridian-article .cp-amm__controls button:hover,
.meridian-article .cp-amm__controls button:focus-visible {
  border-color: var(--si-gold);
  color: var(--si-ink);
}
.meridian-article .cp-amm__controls button[aria-pressed="true"] {
  border-color: var(--si-gold);
  color: var(--bg, #EDE3C7);
  background: var(--si-gold);
}
.meridian-article .cp-amm__size {
  display: flex;
  min-width: 210px;
  flex: 1;
  flex-direction: column;
  gap: 6px;
}
.meridian-article .cp-amm__size span {
  color: var(--si-soft);
  font: 700 9px Cinzel, serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.meridian-article .cp-amm__size input {
  width: 100%;
  accent-color: var(--si-gold);
}
.meridian-article .cp-amm__stage {
  border: 1px solid var(--si-line);
  background: color-mix(in srgb, var(--bg, #EDE3C7) 60%, transparent);
}
.meridian-article .cp-amm__stage svg { display: block; width: 100%; height: auto; }
.meridian-article .cp-amm__axis { stroke: var(--si-line); stroke-width: 1; }
.meridian-article .cp-amm__axis-label { fill: var(--si-soft); font: 9px Cinzel, serif; letter-spacing: .08em; text-transform: uppercase; }
.meridian-article .cp-amm__curve { fill: none; stroke: var(--si-ink); stroke-width: 1.6; }
.meridian-article .cp-amm__chord { fill: none; stroke: var(--si-gold); stroke-width: 1.4; stroke-dasharray: 5 4; }
.meridian-article .cp-amm__drop { stroke: color-mix(in srgb, var(--si-ink) 30%, transparent); stroke-width: 1; stroke-dasharray: 2 3; }
.meridian-article .cp-amm__drop--now { stroke: color-mix(in srgb, var(--si-gold) 65%, transparent); }
.meridian-article .cp-amm__dot--start { fill: var(--si-ink); }
.meridian-article .cp-amm__dot--now { fill: var(--si-gold); }
.meridian-article .cp-amm__pt { fill: var(--si-soft); font: 9px Cinzel, serif; letter-spacing: .06em; text-transform: uppercase; }
.meridian-article .cp-amm__pt--now { fill: color-mix(in srgb, var(--si-gold) 85%, var(--si-ink)); }
.meridian-article .cp-amm__readout {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 14px 0 0;
  border: 1px solid var(--si-line);
  background: var(--si-line);
}
.meridian-article .cp-amm__readout > div {
  padding: 12px 14px;
  background: color-mix(in srgb, var(--bg, #EDE3C7) 62%, transparent);
}
.meridian-article .cp-amm__readout dt {
  color: var(--si-soft);
  font: 700 8px Cinzel, serif;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.meridian-article .cp-amm__readout dd {
  margin: 5px 0 0;
  color: var(--si-ink);
  font-size: 17px;
}
.meridian-article .cp-amm__note {
  margin: 12px 0 0;
  color: var(--si-muted);
  font-size: 15px;
  line-height: 1.5;
}
@media (max-width: 620px) {
  .meridian-article .cp-amm__readout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .meridian-article .cp-amm__size { min-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .meridian-article .cp-amm__controls button { transition: none; }
}

/* ------------------------------------------------------------------ */
/* Shared "lab" skeleton — bespoke explainers for Parts 08, 10-17.    */
/* ------------------------------------------------------------------ */
.meridian-article .lab {
  margin: 26px 0 6px;
  padding: clamp(18px, 3.4vw, 26px);
  border: 1px solid var(--si-gold);
  background: color-mix(in srgb, var(--si-plate) 40%, transparent);
}
.meridian-article .lab figcaption { margin-bottom: 16px; padding-bottom: 13px; border-bottom: 1px solid var(--si-line); }
.meridian-article .lab figcaption small { display: block; color: var(--si-gold); font: 700 9px Cinzel, serif; letter-spacing: .14em; text-transform: uppercase; }
.meridian-article .lab figcaption span { display: block; margin-top: 5px; color: var(--si-muted); font-size: 16px; }
.meridian-article .lab__controls { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px 22px; margin-bottom: 18px; }
.meridian-article .lab__group { display: flex; flex-direction: column; gap: 6px; }
.meridian-article .lab__group > span { color: var(--si-soft); font: 700 9px Cinzel, serif; letter-spacing: .12em; text-transform: uppercase; }
.meridian-article .lab__buttons { display: flex; flex-wrap: wrap; gap: 6px; }
.meridian-article .lab__controls button {
  padding: 8px 12px; border: 1px solid var(--si-line); color: var(--si-muted);
  background: transparent; font: 8px Cinzel, serif; letter-spacing: .08em; text-transform: uppercase; cursor: pointer;
}
.meridian-article .lab__controls button:hover,
.meridian-article .lab__controls button:focus-visible { border-color: var(--si-gold); color: var(--si-ink); }
.meridian-article .lab__controls button[aria-pressed="true"] { border-color: var(--si-gold); color: var(--bg, #EDE3C7); background: var(--si-gold); }
.meridian-article .lab__range { display: flex; min-width: 220px; flex: 1; flex-direction: column; gap: 6px; }
.meridian-article .lab__range span { color: var(--si-soft); font: 700 9px Cinzel, serif; letter-spacing: .12em; text-transform: uppercase; }
.meridian-article .lab__range input { width: 100%; accent-color: var(--si-gold); }
.meridian-article .lab__stage { border: 1px solid var(--si-line); background: color-mix(in srgb, var(--bg, #EDE3C7) 60%, transparent); padding: 6px; }
.meridian-article .lab__stage svg { display: block; width: 100%; height: auto; }
.meridian-article .lab__readout {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)); gap: 1px;
  margin: 14px 0 0; border: 1px solid var(--si-line); background: var(--si-line);
}
.meridian-article .lab__readout > div { padding: 12px 14px; background: color-mix(in srgb, var(--bg, #EDE3C7) 62%, transparent); }
.meridian-article .lab__readout dt { color: var(--si-soft); font: 700 8px Cinzel, serif; letter-spacing: .1em; text-transform: uppercase; }
.meridian-article .lab__readout dd { margin: 5px 0 0; color: var(--si-ink); font-size: 17px; }
.meridian-article .lab__note { margin: 12px 0 0; color: var(--si-muted); font-size: 15px; line-height: 1.5; }

/* lab SVG primitives */
.meridian-article .lab-bar__label { fill: var(--si-muted); font-size: 13px; }
.meridian-article .lab-bar__track { fill: color-mix(in srgb, var(--si-ink) 8%, transparent); }
.meridian-article .lab-bar__fill { fill: color-mix(in srgb, var(--si-ink) 42%, transparent); }
.meridian-article .lab-bar__fill--accent { fill: var(--si-gold); }
.meridian-article .lab-bar__value { fill: var(--si-ink); font: 12px Cinzel, serif; }
.meridian-article .lab-axis { stroke: var(--si-line); stroke-width: 1; }
.meridian-article .lab-axis-label { fill: var(--si-soft); font: 9px Cinzel, serif; letter-spacing: .06em; text-transform: uppercase; }
.meridian-article .lab-guide { stroke: color-mix(in srgb, var(--si-ink) 20%, transparent); stroke-width: 1; stroke-dasharray: 3 3; }
.meridian-article .lab-curve { fill: none; stroke: var(--si-ink); stroke-width: 1.6; }
.meridian-article .lab-curve--soft { stroke: color-mix(in srgb, var(--si-gold) 70%, transparent); stroke-width: 1.4; }
.meridian-article .lab-drop--now { stroke: color-mix(in srgb, var(--si-gold) 65%, transparent); stroke-width: 1; stroke-dasharray: 2 3; }
.meridian-article .lab-dot--now { fill: var(--si-gold); }
.meridian-article .lab-step { padding: 20px; }
.meridian-article .lab-step span { color: var(--si-gold); font: 700 10px Cinzel, serif; letter-spacing: .12em; }
.meridian-article .lab-step strong { display: block; margin: 4px 0 8px; color: var(--si-ink); font-family: "EB Garamond", serif; font-size: 24px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.meridian-article .lab-step p { margin: 0; color: var(--si-muted); font-size: 16px; line-height: 1.55; }
.meridian-article .lab-node { fill: color-mix(in srgb, var(--bg, #EDE3C7) 70%, transparent); stroke: var(--si-line); }
.meridian-article .lab-node__t { fill: var(--si-ink); font: 12px Cinzel, serif; letter-spacing: .06em; text-transform: uppercase; }
.meridian-article .lab-node__s { fill: var(--si-soft); font-size: 11px; }
.meridian-article .lab-flow { stroke: color-mix(in srgb, var(--si-ink) 26%, transparent); stroke-width: 1.4; }
.meridian-article .lab-flow.is-active { stroke: var(--si-gold); stroke-width: 2; }
.meridian-article .lab-flow__head { fill: color-mix(in srgb, var(--si-ink) 40%, transparent); }
.meridian-article .lab-flow__label { fill: var(--si-muted); font-size: 11px; }
.meridian-article .lab-gauge { fill: none; stroke-width: 14; }
.meridian-article .lab-gauge--safe { stroke: color-mix(in srgb, #4f7a3a 70%, var(--si-plate)); }
.meridian-article .lab-gauge--caution { stroke: var(--si-gold); }
.meridian-article .lab-gauge--danger { stroke: color-mix(in srgb, #a8432b 78%, var(--si-plate)); }
.meridian-article .lab-gauge__needle { stroke: var(--si-ink); stroke-width: 3; }
.meridian-article .lab-gauge__hub { fill: var(--si-ink); }
.meridian-article .lab-gauge__val { fill: var(--si-ink); font: 22px "EB Garamond", serif; }
@media (max-width: 620px) {
  .meridian-article .lab__readout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .meridian-article .lab__range { min-width: 100%; }
}

/* ------------------------------------------------------------------ */
/* Body typography — Parts 03-17 lesson sections.                      */
/* The imported prose used bold paragraphs as sub-headings, lead-ins   */
/* and assertions at once, and the site renders every <strong> as      */
/* uppercase Cinzel. Inside a lesson body each job now gets its own    */
/* voice, and inline emphasis stops shouting mid-sentence.             */
/* ------------------------------------------------------------------ */
.meridian-article .defi-fundamentals-guide .df-section__body > p strong,
.meridian-article .defi-fundamentals-guide .df-section__body > ul > li strong,
.meridian-article .defi-fundamentals-guide .df-section__body > ol > li strong,
.meridian-article .defi-fundamentals-guide .df-section__body > blockquote strong {
  font-family: inherit;
  font-size: inherit;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--si-ink);
}

/* Sub-heading: the level the source articles never had. */
.meridian-article .defi-fundamentals-guide .df-section__body h3 {
  margin: 42px 0 14px;
  color: var(--si-ink);
  font-family: "EB Garamond", serif;
  font-size: clamp(22px, 2.4vw, 27px);
  font-weight: 500;
  letter-spacing: -.008em;
  line-height: 1.18;
  text-transform: none;
}
.meridian-article .defi-fundamentals-guide .df-section__body > h3:first-child { margin-top: 4px; }
.meridian-article .defi-fundamentals-guide .df-section__body h3::before {
  display: block;
  width: 26px;
  margin-bottom: 11px;
  border-top: 1px solid color-mix(in srgb, var(--si-gold) 70%, transparent);
  content: "";
}

/* Lead-in line that introduces the list or example directly below it. */
.meridian-article .defi-fundamentals-guide .df-section__body p.si-lead {
  margin-bottom: 9px;
  color: var(--si-ink);
  font-weight: 500;
}

/* Small editorial label: "Example", "Practical tip", "Mental model". */
.meridian-article .defi-fundamentals-guide .df-section__body p.si-label {
  margin: 26px 0 7px;
  color: var(--si-gold);
  font: 700 9px Cinzel, serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}

/* A standalone claim the lesson wants to land. */
.meridian-article .defi-fundamentals-guide .df-section__body p.si-assert {
  max-width: 38em;
  margin: 26px 0;
  padding: 17px 22px;
  border-left: 2px solid var(--si-gold);
  color: var(--si-ink);
  background: color-mix(in srgb, var(--si-plate) 46%, transparent);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.45;
}

/* Definition list: term above, explanation below, hairline between. */
.meridian-article .defi-fundamentals-guide .df-section__body ul.si-terms,
.meridian-article .defi-fundamentals-guide .df-section__body ol.si-terms {
  display: block;
  max-width: 40em;
  margin: 22px 0;
  padding: 0;
  border: 0;
  border-top: 1px solid var(--si-line);
  list-style: none;
}
.meridian-article .defi-fundamentals-guide .df-section__body .si-terms > li {
  margin: 0;
  padding: 13px 0;
  border: 0;
  border-bottom: 1px solid var(--si-line);
  color: var(--si-muted);
  font-size: 17px;
  line-height: 1.55;
}
.meridian-article .defi-fundamentals-guide .df-section__body .si-terms > li::before { content: none; }
.meridian-article .defi-fundamentals-guide .df-section__body .si-terms > li strong {
  display: block;
  margin-bottom: 3px;
  color: var(--si-gold);
  font: 700 10px Cinzel, serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}

/* Procedure: an ordered list read as steps, numbered in gold. */
.meridian-article .defi-fundamentals-guide .df-section__body ol.si-procedure {
  display: block;
  max-width: 40em;
  margin: 22px 0;
  padding: 0;
  border: 0;
  counter-reset: si-step;
  list-style: none;
}
/* Kept as a block, not a grid: these list items often mix <strong>, <br> and
   text, and grid would turn each of those into its own cell. */
.meridian-article .defi-fundamentals-guide .df-section__body ol.si-procedure > li {
  position: relative;
  margin: 0;
  padding: 11px 0 11px 43px;
  border: 0;
  border-bottom: 1px solid var(--si-line);
  color: var(--si-muted);
  font-size: 17px;
  line-height: 1.55;
  counter-increment: si-step;
}
.meridian-article .defi-fundamentals-guide .df-section__body ol.si-procedure > li:last-child { border-bottom: 0; }
.meridian-article .defi-fundamentals-guide .df-section__body ol.si-procedure > li::before {
  position: absolute;
  top: 13px;
  left: 0;
  display: grid;
  width: 26px;
  height: 26px;
  border: 1px solid color-mix(in srgb, var(--si-gold) 62%, transparent);
  color: var(--si-gold);
  content: counter(si-step, decimal-leading-zero);
  font: 9px Cinzel, serif;
  place-items: center;
}

/* A list that immediately follows its lead-in should sit close to it. */
.meridian-article .defi-fundamentals-guide .df-section__body p.si-lead + ul,
.meridian-article .defi-fundamentals-guide .df-section__body p.si-lead + ol { margin-top: 0; }
.meridian-article .defi-fundamentals-guide .df-section__body p.si-label + p { margin-top: 0; }

/* Figures read as plates, not inline images. */
.meridian-article .defi-fundamentals-guide .df-figure { margin: 30px 0; }
.meridian-article .defi-fundamentals-guide .df-figure figcaption {
  margin-top: 9px;
  color: var(--si-soft);
  font: 700 9px Cinzel, serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}

/* ------------------------------------------------------------------ */
/* Illustrative app interfaces embedded in the lesson body.            */
/* These are mock screens, never live apps. They deliberately use a    */
/* system sans against the article's serif so a reader can tell at a   */
/* glance that they are looking at software, not prose.                */
/* ------------------------------------------------------------------ */
.meridian-article .ui-stage {
  display: grid;
  gap: 16px;
  padding: 16px;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-variant-numeric: tabular-nums;
}
.meridian-article .ui-stage--pair { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }

.meridian-article .ui-app,
.meridian-article .ui-sheet {
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--si-ink) 22%, transparent);
  background: var(--bg2, #F4ECD6);
  box-shadow: 0 14px 30px -26px rgba(20, 15, 8, .8);
}
.meridian-article .ui-app__bar,
.meridian-article .ui-sheet__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--si-ink) 14%, transparent);
  background: color-mix(in srgb, var(--si-ink) 6%, transparent);
  color: var(--si-soft);
  font-size: 11px;
  letter-spacing: .02em;
}
.meridian-article .ui-app__bar em { font-style: normal; color: var(--si-muted); }
.meridian-article .ui-sheet__bar { color: var(--si-muted); font-weight: 600; }
.meridian-article .ui-app__body { padding: 14px; }
.meridian-article .ui-app__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.meridian-article .ui-app__head strong {
  color: var(--si-ink);
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.meridian-article .ui-chip {
  padding: 4px 8px;
  border: 1px solid color-mix(in srgb, var(--si-ink) 16%, transparent);
  color: var(--si-soft);
  font-size: 11px;
}
.meridian-article .ui-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 10px;
  padding: 12px 13px;
  border: 1px solid color-mix(in srgb, var(--si-ink) 13%, transparent);
  background: color-mix(in srgb, var(--bg, #EDE3C7) 55%, #fff 45%);
}
.meridian-article .ui-field > span { grid-column: 1; color: var(--si-soft); font-size: 11px; }
.meridian-article .ui-field > div { grid-column: 1; display: flex; align-items: baseline; gap: 7px; }
.meridian-article .ui-field b { color: var(--si-ink); font-size: 25px; font-weight: 600; line-height: 1.1; }
.meridian-article .ui-field i {
  padding: 3px 8px;
  border: 1px solid color-mix(in srgb, var(--si-gold) 55%, transparent);
  color: var(--si-ink);
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
}
.meridian-article .ui-field small { grid-column: 2; grid-row: 1 / 3; align-self: center; color: var(--si-soft); font-size: 11px; }
.meridian-article .ui-swapline { display: grid; height: 22px; place-items: center; }
.meridian-article .ui-swapline span {
  display: grid;
  width: 24px;
  height: 24px;
  border: 1px solid color-mix(in srgb, var(--si-ink) 16%, transparent);
  background: var(--bg2, #F4ECD6);
  color: var(--si-muted);
  font-size: 13px;
  place-items: center;
}
.meridian-article .ui-details {
  margin: 12px 0 0;
  padding: 10px 12px;
  border: 1px dashed color-mix(in srgb, var(--si-ink) 16%, transparent);
}
.meridian-article .ui-details > div,
.meridian-article .ui-sheet__rows > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 0;
}
.meridian-article .ui-details dt,
.meridian-article .ui-sheet__rows dt { color: var(--si-soft); font-size: 11.5px; }
.meridian-article .ui-details dd,
.meridian-article .ui-sheet__rows dd {
  margin: 0;
  color: var(--si-ink);
  font-size: 12.5px;
  font-weight: 600;
  text-align: right;
}
.meridian-article .ui-details dd.is-good { color: color-mix(in srgb, #4f7a3a 82%, var(--si-ink)); }
.meridian-article .ui-sheet__rows { margin: 0; padding: 12px 13px; }
.meridian-article .ui-sheet__rows dd em { color: var(--si-soft); font-style: normal; font-weight: 400; }
.meridian-article .ui-sheet__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 0 13px 13px;
}
.meridian-article .ui-btn {
  display: block;
  width: 100%;
  margin-top: 12px;
  padding: 11px 12px;
  border: 1px solid transparent;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
}
.meridian-article .ui-sheet__actions .ui-btn { margin-top: 0; }
.meridian-article .ui-btn--primary { border-color: var(--si-gold); color: var(--bg, #EDE3C7); background: var(--si-gold); }
.meridian-article .ui-btn--muted {
  border-color: color-mix(in srgb, var(--si-ink) 18%, transparent);
  color: var(--si-soft);
  background: transparent;
}
.meridian-article .ui-hint { margin: 9px 0 0; color: var(--si-soft); font-size: 11.5px; line-height: 1.45; }
.meridian-article .ui-banner {
  margin: 12px 0 0;
  padding: 9px 12px;
  border-left: 2px solid color-mix(in srgb, #4f7a3a 70%, var(--si-plate));
  background: color-mix(in srgb, #4f7a3a 10%, transparent);
  color: var(--si-ink);
  font-size: 12.5px;
  font-weight: 600;
}
@media (max-width: 720px) {
  .meridian-article .ui-stage--pair { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  /* Narrow screens: let the balance drop under the amount instead of colliding
     with the token chip. */
  .meridian-article .ui-field { grid-template-columns: minmax(0, 1fr); }
  .meridian-article .ui-field small { grid-column: 1; grid-row: auto; align-self: start; margin-top: 4px; }
  .meridian-article .ui-field b { font-size: 22px; }
  .meridian-article .ui-stage { padding: 12px; }
}

/* Mock-interface primitives shared by the embedded app screens. */
.meridian-article .ui-details dd.is-warn,
.meridian-article .ui-sheet__rows dd.is-warn,
.meridian-article .lab__readout dd.is-warn { color: color-mix(in srgb, #a8432b 84%, var(--si-ink)); }
.meridian-article .ui-details dd.is-good,
.meridian-article .ui-sheet__rows dd.is-good,
.meridian-article .lab__readout dd.is-good { color: color-mix(in srgb, #4f7a3a 82%, var(--si-ink)); }
.meridian-article .ui-chip.is-warn { border-color: color-mix(in srgb, #a8432b 55%, transparent); color: color-mix(in srgb, #a8432b 84%, var(--si-ink)); }
.meridian-article .ui-hint.is-warn { color: color-mix(in srgb, #a8432b 84%, var(--si-ink)); }
.meridian-article .ui-banner.is-warn {
  border-left-color: color-mix(in srgb, #a8432b 70%, var(--si-plate));
  background: color-mix(in srgb, #a8432b 10%, transparent);
}

/* Labelled progress bar. */
.meridian-article .ui-meter {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 10px;
  margin-top: 12px;
}
.meridian-article .ui-meter > span { grid-column: 1; grid-row: 1; color: var(--si-soft); font-size: 11px; }
.meridian-article .ui-meter > b { grid-column: 2; grid-row: 1 / 3; align-self: center; color: var(--si-ink); font-size: 14px; font-weight: 700; text-align: right; }
.meridian-article .ui-meter > div {
  grid-column: 1;
  grid-row: 2;
  height: 8px;
  background: color-mix(in srgb, var(--si-ink) 10%, transparent);
}
.meridian-article .ui-meter i { display: block; height: 100%; background: var(--si-gold); }
.meridian-article .ui-meter i.is-warn { background: color-mix(in srgb, #a8432b 78%, var(--si-plate)); }

/* Data table inside a mock screen. */
.meridian-article .ui-table { border: 1px solid color-mix(in srgb, var(--si-ink) 13%, transparent); }
.meridian-article .ui-table__head,
.meridian-article .ui-table__row {
  display: grid;
  grid-template-columns: 1.4fr repeat(4, 1fr);
  gap: 8px;
  padding: 9px 11px;
  font-size: 12px;
}
.meridian-article .ui-table--4 .ui-table__head,
.meridian-article .ui-table--4 .ui-table__row { grid-template-columns: .7fr repeat(3, 1fr); }
.meridian-article .ui-table__head {
  border-bottom: 1px solid color-mix(in srgb, var(--si-ink) 13%, transparent);
  background: color-mix(in srgb, var(--si-ink) 5%, transparent);
  color: var(--si-soft);
  font-size: 11px;
}
.meridian-article .ui-table__row { border-bottom: 1px solid color-mix(in srgb, var(--si-ink) 8%, transparent); color: var(--si-muted); }
.meridian-article .ui-table__row:last-child { border-bottom: 0; }
.meridian-article .ui-table__row > span:first-child { color: var(--si-ink); font-weight: 600; }
.meridian-article .ui-table__row.is-active {
  background: color-mix(in srgb, var(--si-gold) 15%, transparent);
  box-shadow: inset 2px 0 0 var(--si-gold);
}

/* Selectable list rows (token pickers, block contents, network lists). */
.meridian-article .ui-pick { border: 1px solid color-mix(in srgb, var(--si-ink) 13%, transparent); }
.meridian-article .ui-pick__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 12px;
  padding: 11px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--si-ink) 8%, transparent);
}
.meridian-article .ui-pick__row:last-child { border-bottom: 0; }
.meridian-article .ui-pick__row b { color: var(--si-ink); font-size: 13px; font-weight: 700; }
.meridian-article .ui-pick__row span { grid-column: 1; color: var(--si-soft); font-size: 11.5px; line-height: 1.4; }
.meridian-article .ui-pick__row em { grid-row: 1 / 3; align-self: center; color: var(--si-muted); font-size: 12px; font-style: normal; text-align: right; }
.meridian-article .ui-pick__row.is-active {
  background: color-mix(in srgb, var(--si-gold) 15%, transparent);
  box-shadow: inset 2px 0 0 var(--si-gold);
}

/* Token identity header. */
.meridian-article .ui-token { display: flex; align-items: center; gap: 11px; margin-bottom: 12px; }
.meridian-article .ui-token__mark {
  display: grid;
  width: 34px;
  height: 34px;
  border: 1px solid color-mix(in srgb, #4f7a3a 60%, transparent);
  color: color-mix(in srgb, #4f7a3a 82%, var(--si-ink));
  font-size: 16px;
  font-weight: 700;
  place-items: center;
}
.meridian-article .ui-token__mark.is-warn {
  border-color: color-mix(in srgb, #a8432b 60%, transparent);
  color: color-mix(in srgb, #a8432b 84%, var(--si-ink));
}
.meridian-article .ui-token strong { color: var(--si-ink); font-family: inherit; font-size: 16px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.meridian-article .ui-token span { display: block; color: var(--si-soft); font-size: 11.5px; }

/* Paired comparison cards. */
.meridian-article .ui-card {
  border: 1px solid color-mix(in srgb, var(--si-ink) 18%, transparent);
  background: var(--bg2, #F4ECD6);
}
.meridian-article .ui-card__head {
  padding: 9px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--si-ink) 12%, transparent);
  background: color-mix(in srgb, var(--si-ink) 5%, transparent);
  color: var(--si-muted);
  font-size: 11.5px;
  font-weight: 600;
}
.meridian-article .ui-card.is-down { border-color: color-mix(in srgb, #a8432b 45%, transparent); }

/* Aggregator route legs. */
.meridian-article .ui-legs { display: grid; gap: 8px; }
.meridian-article .ui-leg { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; }
.meridian-article .ui-leg > span { color: var(--si-muted); font-size: 12px; }
.meridian-article .ui-leg > b { grid-row: 1 / 3; align-self: center; color: var(--si-ink); font-size: 13px; font-weight: 700; }
.meridian-article .ui-leg > div { grid-column: 1; height: 7px; background: color-mix(in srgb, var(--si-ink) 10%, transparent); }
.meridian-article .ui-leg i { display: block; height: 100%; background: var(--si-gold); }

@media (max-width: 640px) {
  .meridian-article .ui-table__head { display: none; }
  .meridian-article .ui-table__row,
  .meridian-article .ui-table--4 .ui-table__row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px 8px; }
}

/* Recovery-phrase illustration (Part 02). Click-only by design: this component
   contains no input field, and the words are a fixed example. */
.meridian-article .ui-seed {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin: 0 0 12px;
  padding: 0;
  border: 0;
  list-style: none;
  counter-reset: none;
}
.meridian-article .ui-seed > li {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0;
  padding: 9px 10px;
  border: 1px solid color-mix(in srgb, var(--si-ink) 14%, transparent);
  background: color-mix(in srgb, var(--bg, #EDE3C7) 55%, #fff 45%);
  color: var(--si-ink);
  font-size: 13px;
  font-weight: 600;
}
.meridian-article .ui-seed > li::before { content: none; }
.meridian-article .ui-seed > li span { color: var(--si-soft); font-size: 10px; font-weight: 400; }

.meridian-article .ui-quiz__q { margin: 0 0 9px; color: var(--si-muted); font-size: 12.5px; }
.meridian-article .ui-quiz__q b { color: var(--si-ink); }
.meridian-article .ui-quiz { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.meridian-article .ui-quiz__opt {
  padding: 9px 14px;
  border: 1px solid color-mix(in srgb, var(--si-ink) 16%, transparent);
  color: var(--si-muted);
  font-size: 13px;
  font-weight: 600;
}
.meridian-article .ui-quiz__opt.is-right {
  border-color: color-mix(in srgb, #4f7a3a 60%, transparent);
  color: color-mix(in srgb, #4f7a3a 82%, var(--si-ink));
  background: color-mix(in srgb, #4f7a3a 10%, transparent);
}

/* Standing-approval list (Part 02). */
.meridian-article .ui-revoke {
  color: color-mix(in srgb, #a8432b 84%, var(--si-ink));
  font-weight: 600;
  text-align: right;
}
.meridian-article .ui-table__row.is-risk { background: color-mix(in srgb, #a8432b 7%, transparent); }
.meridian-article .ui-table__row.is-risk > span:nth-child(3) { color: color-mix(in srgb, #a8432b 84%, var(--si-ink)); font-weight: 600; }

@media (max-width: 560px) {
  .meridian-article .ui-seed { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* The article's own responsive rules reach inside the mock screens: at <=760px
   the site sets `.meridian-article p { font-size:18px !important }` (plus
   line-height and overflow-wrap). That predates these components, so the
   interface chrome has to reclaim its own scale with the same weight. */
.meridian-article .ui-stage p,
.meridian-article .ui-stage li,
.meridian-article .ui-stage dd,
.meridian-article .ui-stage dt {
  line-height: 1.45 !important;
  overflow-wrap: normal !important;
}
.meridian-article .ui-stage .ui-hint { font-size: 11.5px !important; }
.meridian-article .ui-stage .ui-banner { font-size: 12.5px !important; }
.meridian-article .ui-stage .ui-quiz__q { font-size: 12.5px !important; }
.meridian-article .ui-stage .ui-details dt,
.meridian-article .ui-stage .ui-sheet__rows dt { font-size: 11.5px !important; }
.meridian-article .ui-stage .ui-details dd,
.meridian-article .ui-stage .ui-sheet__rows dd { font-size: 12.5px !important; }
.meridian-article .ui-stage .ui-seed > li { font-size: 13px !important; }
.meridian-article .ui-stage .ui-table__head,
.meridian-article .ui-stage .ui-table__row { font-size: 12px !important; }
.meridian-article .ui-stage .ui-pick__row b { font-size: 13px !important; }
.meridian-article .ui-stage .ui-pick__row span { font-size: 11.5px !important; }
.meridian-article .ui-stage .ui-leg > span { font-size: 12px !important; }
.meridian-article .ui-stage .ui-field b { font-size: 25px !important; }
.meridian-article .ui-stage .ui-field span,
.meridian-article .ui-stage .ui-field small { font-size: 11px !important; }
