/* --------------------------------------------------------------------------------
  GLOBAL CONTEXT FOR WIKI.JS THEME OVERRIDES:
  Current Wiki.js version: 2.5.308 (verified on 2025-12-25)

  Notes for style overrides:
  - Restrict overrides to content, preserving nav-header (implemented via hacks)
    Reason: Wiki.js does not yet provide official theme customization support,
            and nav-header is used across different pages

  - The !important declaration is required in some cases with native CSS
    Reason: Some Wiki.js' native styles have !important/high specificity

    Solutions:
    - Lists some high specificity requirement alongside the selector,
      which is minimal to override the styles

    - Uses #root/#app id selector when necessary with its DOM:
      <div id="root"><div id="app" class="v-application theme--light/theme--dark">
      Where almost everything of Wiki.js' content is placed</div></div>

  - Targets with some auto-generated classes, verify on version update

  Long-term plan: (Waiting the publish of Wiki.js 3)
  - Replace style overrides with official theme customization
-------------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------------
  Font Family Overrides (for Simplified Chinese/Traditional Chinese/English):
  Define prioritized font stacks with cross-platform fallback mechanisms,
  to ensure consistent typography for Chinese content

  Notes:
  - Traditional Chinese (zh-TW) Pages: The CDN-merged Sarasa font-family
    defaults to simplified glyphs for Han-unified codepoints

  - English Pages: Simplified Chinese font stacks are retained for English content,
    since simplified Chinese is the primary language used on our website,
    also enabling consistent theming across different languages
-------------------------------------------------------------------------------- */

  :root {

    /* ----- Font Family Fallbacks ------------------------------ */

      /* Font family fallback: for simplified chinese */
      --font-fallback--zh-cn:
        "SF Pro", "PingFang SC", "Noto Sans CJK SC",
        "Microsoft YaHei UI", "Microsoft YaHei", "SimHei";

      /* Font family fallback: for traditional chinese */
      --font-fallback--zh-tw:
        "SF Pro", "PingFang TC", "Noto Sans CJK TC",
        "Microsoft JhengHei UI", "Microsoft JhengHei";

      /* Font family fallback: for all languages */
      --font-fallback--universal:
        "Roboto", "Helvetica", "Arial", sans-serif;

      /* Font family fallback: for simplified chinese coding */
      --font-fallback--zh-cn-code:
        "Noto Sans Mono CJK SC";

      /* Font family fallback: for traditional chinese coding */
      --font-fallback--zh-tw-code:
        "Noto Sans Mono CJK TC";

      /* Font family fallback: for all languages coding */
      --font-fallback--universal-code:
        "SF Mono", "Roboto Mono", monospace;

    /* ----- Font Family Sets ------------------------------ */

      /* Font family set: for simplified chinese */
      --font-set--zh-cn: "Sarasa UI SC",
        var(--font-fallback--zh-cn),
        var(--font-fallback--universal);

      /* Font family set: for traditional chinese */
      --font-set--zh-tw: "Sarasa UI SC",
        var(--font-fallback--zh-tw),
        var(--font-fallback--universal);

      /* Font family set: for coding simplified chinese */
      --font-set--zh-cn-code: "Sarasa Mono SC",
        var(--font-fallback--zh-cn-code),
        var(--font-fallback--universal-code);

      /* Font family set: for coding traditional chinese */
      --font-set--zh-tw-code: "Sarasa Mono SC",
        var(--font-fallback--zh-tw-code),
        var(--font-fallback--universal-code);
  }

  /* ----- Font Overrides (simplified chinese and english part) ------------------------------ */

    /* Overrides major content's font */
    html:where([lang^="zh"], [lang^="en"]):not([lang="zh-TW"]) .v-application :where(
      .v-main__wrap, .v-navigation-drawer) {
      font-family: var(--font-set--zh-cn);
    }

    /* Overrides main content, sidebar navigation and footer's font */
    html:where([lang^="zh"], [lang^="en"]):not([lang="zh-TW"]) .v-application :where(
      .v-main__wrap .headline, .v-main__wrap .caption,
      .v-main__wrap .overline, .v-main__wrap .body-1,
      .v-main__wrap .body-2, .v-main__wrap .subtitle-1,

      .v-navigation-drawer .body-2, .v-navigation-drawer .subtitle-1,
      .v-footer .caption) {
      /* (font-family) required: (0,2,0) !important */
      font-family: var(--font-set--zh-cn) !important;
    }

    /* Overrides inline coding and coding block's font */
    html:where([lang^="zh"], [lang^="en"]):not([lang="zh-TW"]) #app :where(
      .contents code, .contents kbd) {
      /* (font-family) required: (0,3,1) */
      font-family: var(--font-set--zh-cn-code);
    }

  /* ----- Font Overrides (traditional chinese part) ------------------------------ */

    /* Overrides major content's font */
    html[lang="zh-TW"] .v-application :where(
      .v-main__wrap, .v-navigation-drawer) {
      font-family: var(--font-set--zh-tw);
    }

    /* Overrides main content, sidebar navigation and footer's font */
    html[lang="zh-TW"] .v-application :where(
      .v-main__wrap .headline, .v-main__wrap .caption,
      .v-main__wrap .overline, .v-main__wrap .body-1,
      .v-main__wrap .body-2, .v-main__wrap .subtitle-1,

      .v-navigation-drawer .body-2, .v-navigation-drawer .subtitle-1,
      .v-footer .caption) {
      /* (font-family) required: (0,2,0) !important */
      font-family: var(--font-set--zh-tw) !important;
    }

    /* Overrides inline coding and coding block's font */
    html[lang="zh-TW"] #app :where(
      .contents code, .contents kbd) {
      /* (font-family) required: (0,3,1) */
      font-family: var(--font-set--zh-tw-code);
    }

/* --------------------------------------------------------------------------------
  Global Variables:
  Centralizes core variables for consistent styling across the application
-------------------------------------------------------------------------------- */

  :root {

    /* ----- Time Variables ------------------------------ */

      /* Base transition duration: for most animations */
      --transition-duration--universal: 300ms;

    /* ----- Size Variables ------------------------------ */

      /* Base margin: for most content */
      --margin--universal: 1rem;

      /* Base padding: for most content */
      --padding--universal: 1rem;

      /* Base gap: for most content */
      --gap--universal: 1rem;
      --gap--small: 0.5rem;
      --gap--x-small: 0.25rem;

      /* Base gap: for most columns */
      --gap--column: 2rem;

      /* Base border-radius: for most borders */
      --border-radius--universal: 0.5rem;

      /* Base line weight: for decorative lines, borders */
      --line-weight--universal: 0.0625rem;

      /* Base font-size: for most content */
      --font-size--small: 0.9rem;

    /* ----- Specific Variables ------------------------------ */

      /* Dimension: for constraining main contents */
      --max-width--contents: 45rem;

      /* Dimension: for lyric columns */
      --max-width--lyric-column: 45rem;
      
      /* Maximum resolution height: for bilibili embed player */
      --max-height--bilibili: 480px;
      
      /* Dimension: for media */
      --max-width--image: 25%;
      --max-width--cover: 15rem;

      /* Dimension: for key-value columns */
      --max-width--key-value-column: 28rem;
      /* Matches lyric column max-width for visual alignment
      when nested in .media-text-column */
  }

/* --------------------------------------------------------------------------------
  Theme Variables:
  Centralizes color variables (RGB/RGBA format) for consistent theming
-------------------------------------------------------------------------------- */

  /* ----- Light Theme Variables ------------------------------ */

    .theme--light.v-application {

      /* ----- Main Theme Variables ------------------------------ */

        /* Primary color scheme: for primary elements */
        --color-primary-background: 245, 245, 245;
        --color-primary-icon: 51, 51, 51;

        /* Primary color scheme: for primary content */
        --color-primary-text--universal: 66, 66, 66;
        --color-primary-text--weak: 98, 98, 98;

      /* ----- Specific Theme Variables ------------------------------ */

        /* Background color: for sidebar mapping mode button */
        --color-mapping-mode-button: 255, 255, 255;

        /* Scrollbar color: for sidebar */
        --color-sidebar-scrollbar: 128, 128, 128;

        /* Subtitle color (semi-transparent): for sidebar */
        --color-rgba-sidebar-subtitle: 0, 0, 0, 0.7;
        /* Matches Wiki.js' native dark theme sidebar subtitle opacity */

        /* Separator color (semi-transparent): for subtle separators */
        --color-rgba-separator: 0, 0, 0, 0.12;

        /* Background colors: for content's blockquotes */
        --color-blockquote-background--default: 240, 240, 240;
        --color-blockquote-background--info: 225, 240, 240;
        --color-blockquote-background--success: 220, 240, 230;
        --color-blockquote-background--warning: 255, 240, 220;
        --color-blockquote-background--danger: 255, 230, 230;

        /* Code color scheme: for content's inline code */
        --color-inline-code-background--default: 235, 235, 250;
        --color-inline-code-text--default: 70, 100, 150;

        /* Code color scheme: for blockquotes' inline code */
        --color-inline-code-background--info: 235, 245, 250;
        --color-inline-code-text--info: 35, 108, 165;

        --color-inline-code-background--success: 232, 245, 233;
        --color-inline-code-text--success: 30, 118, 50;

        --color-inline-code-background--warning: 255, 247, 230;
        --color-inline-code-text--warning: 187, 66, 0;

        --color-inline-code-background--danger: 255, 237, 240;
        --color-inline-code-text--danger: 195, 30, 40;

        /* Reserved for future blockquote styling */
        /* --color-blockquote-background--list: 240, 235, 250; */

        /* Border color: for lyric paragraphs */
        --color-rgba-lyric-border: 185, 180, 203, 0.5;

        /* Lyric colors: for english/chinese lyrics */
        --color-lyric--english: 43, 74, 75;
        --color-lyric--chinese: 92, 61, 58;

        --color-lyric--narration-chinese: 98, 98, 98;
    }

  /* ----- Dark Theme Variables ------------------------------ */

    .theme--dark.v-application {

      /* ----- Main Theme Variables ------------------------------ */

        /* Primary color scheme: for primary content */
        --color-primary-text--universal: 224, 224, 224;
        --color-primary-text--weak: 192, 192, 192;

      /* ----- Specific Theme Variables ------------------------------ */

        /* Background colors: for content's blockquotes */
        --color-blockquote-background--default: 40, 40, 40;
        --color-blockquote-background--info: 39, 40, 44;
        --color-blockquote-background--success: 28, 42, 32;
        --color-blockquote-background--warning: 42, 41, 28;
        --color-blockquote-background--danger: 60, 40, 40;

        /* Code color scheme: for content's inline code */
        --color-inline-code-background--default: 43, 44, 50;
        --color-inline-code-text--default: 136, 156, 199;

        /* Code color scheme: for blockquotes' inline code */
        --color-inline-code-background--info: 40, 44, 52;
        --color-inline-code-text--info: 87, 162, 218;

        --color-inline-code-background--success: 28, 47, 37;
        --color-inline-code-text--success: 100, 169, 120;

        --color-inline-code-background--warning: 46, 46, 25;
        --color-inline-code-text--warning: 221, 135, 89;

        --color-inline-code-background--danger: 77, 37, 37;
        --color-inline-code-text--danger: 252, 127, 121;

        /* Border color: for lyric paragraphs */
        --color-rgba-lyric-border: 92, 82, 112, 0.5;

        /* Lyric colors: for english/chinese lyrics */
        --color-lyric--english: 193, 214, 214;
        --color-lyric--chinese: 226, 205, 205;
        
        --color-lyric--narration-chinese: 192, 192, 192;
    }

/* --------------------------------------------------------------------------------
  Theme Overrides:
  Targets specific components to override Wiki.js native variables
-------------------------------------------------------------------------------- */

  /* ----- Main Content Constraining Styles ------------------------------ */

    .contents, .comments-container {
      margin: 0 auto;
      max-width: var(--max-width--contents);
    }

  /* ----- Primary Element Styles ------------------------------ */

    /* Overrides primary elements' border, background and text color */
    .theme--light.v-application .primary {
      /* (border-color) required: (0,2,0) !important */
      border-color: rgb(var(--color-primary-background)) !important;
      /* (background-color) required: (0,2,0) !important */
      background-color: rgb(var(--color-primary-background)) !important;
    }
    .theme--light#app .primary {
      /* (color) required: (0,3,0) */
      color: rgb(var(--color-primary-icon));
    }

  /* ----- Sidebar Navigation Styles ------------------------------ */

    /* Overrides sidebar mapping mode button slot's color
    (without available semantic class for targeting) */
    .theme--light.v-application div.__view > div > div:not(.v-list) {
      /* (border-color) required: (0,2,0) !important */
      border-color: rgb(var(--color-primary-background)) !important;
      /* (background-color) required: (0,2,0) !important */
      background-color: rgb(var(--color-primary-background)) !important;
    }

    /* Overrides sidebar mapping mode button's color
    (without available semantic class for targeting) */
    .theme--light.v-application div.__view > div > div:not(.v-list) > button {
      /* Fixes Wiki.js native null border values */
      border-style: solid;
      border-width: var(--line-weight--universal);
      /* (border-color) required: (0,2,0) !important */
      border-color: rgba(var(--color-rgba-separator)) !important;
      /* (background-color) required: (0,2,0) !important */
      background-color: rgb(var(--color-mapping-mode-button)) !important;
    }

    /* Overrides sidebar mapping mode button text's color */
    .theme--light.v-application div.__view .text-none {
      /* (color) required: (0,2,0) !important */
      color: rgb(var(--color-primary-text--universal)) !important;
    }

    /* Overrides sidebar scrollbar's color */
    .theme--light.v-application .v-navigation-drawer .__bar-is-vertical {
      /* (background-color) required: !important; native is inline */
      background-color: rgb(var(--color-sidebar-scrollbar)) !important;
    }

    /* Overrides sidebar subheader's color */
    .theme--light.v-application .v-navigation-drawer .v-subheader {
      color: rgba(var(--color-rgba-sidebar-subtitle));
    }

    /* Overrides sidebar link text's color */
    .theme--light.v-application .v-navigation-drawer .v-list .v-list-item {
      /* (color) required: (0,4,0) !important */
      color: rgb(var(--color-primary-text--universal)) !important;
    }

    /* Overrides sidebar link icons' color */
    .theme--light.v-application .v-navigation-drawer .v-icon {
      color: rgb(var(--color-primary-icon));
    }

    /* Overrides sidebar separator's color */
    .theme--light.v-application .v-navigation-drawer .v-divider {
      /* (border-color) required: (0,3,0) */
      border-color: rgba(var(--color-rgba-separator));
    }
    .theme--light#app .v-navigation-drawer > .v-navigation-drawer__border {
      /* (background-color) required: (0,4,0) */
      background-color: rgba(var(--color-rgba-separator));
      /* Matches Wiki.js' native method with background-color */
    }

  /* ----- Blockquote Styles ------------------------------ */

    /* Overrides blockquote background's color */
    #app .contents blockquote {
      /* (background-color) required: (0,2,1) */
      background-color: rgb(var(--color-blockquote-background--default));
    }
    #app .contents blockquote.is-info {
      /* (background-color) required: (0,3,1) */
      background-color: rgb(var(--color-blockquote-background--info));
    }
    #app .contents blockquote.is-success {
      /* (background-color) required: (0,3,1) */
      background-color: rgb(var(--color-blockquote-background--success));
    }
    #app .contents blockquote.is-warning {
      /* (background-color) required: (0,3,1) */
      background-color: rgb(var(--color-blockquote-background--warning));
    }
    #app .contents blockquote.is-danger {
      /* (background-color) required: (0,3,1) */
      background-color: rgb(var(--color-blockquote-background--danger));
    }

    /* Overrides blockquote text's color */
    #app .contents blockquote {
      /* (color) required: (0,3,1) */
      color: rgb(var(--color-primary-text--universal));
    }

    /* Removes Wiki.js' native blockquote border marks */
    #app .contents blockquote {
      /* (border) required: (0,3,1) */
      border: unset;
    }
    #app .contents blockquote::before {
      /* (content) required: (0,3,2) */
      content: none;
    }

  /* ----- Inline Code Styles ------------------------------ */

    /* Overrides default inline code's color */
    #app .contents code {
      /* (background-color) required: (0,3,1) */
      background-color: rgb(var(--color-inline-code-background--default));
      /* (color) required: (0,3,1) */
      color: rgb(var(--color-inline-code-text--default))
    }

    /* Overrides blockquote inline code's color */
    #app .contents blockquote.is-info code {
      /* (background-color) required: (0,4,2) */
      background-color: rgb(var(--color-inline-code-background--info));
      /* (color) required: (0,4,2) */
      color: rgb(var(--color-inline-code-text--info))
    }
    #app .contents blockquote.is-success code {
      /* (background-color) required: (0,4,2) */
      background-color: rgb(var(--color-inline-code-background--success));
      /* (color) required: (0,4,2) */
      color: rgb(var(--color-inline-code-text--success))
    }
    #app .contents blockquote.is-warning code {
      /* (background-color) required: (0,4,2) */
      background-color: rgb(var(--color-inline-code-background--warning));
      /* (color) required: (0,4,2) */
      color: rgb(var(--color-inline-code-text--warning))
    }
    #app .contents blockquote.is-danger code {
      /* (background-color) required: (0,4,2) */
      background-color: rgb(var(--color-inline-code-background--danger));
      /* (color) required: (0,4,2) */
      color: rgb(var(--color-inline-code-text--danger))
    }

/* --------------------------------------------------------------------------------
  Anchor Styles with Animated Underline:
  Applies animated underline to <a> with class "animated-underline"

  Notes:
  - Wrap content in <span> to avoid transitions redefinition:
    <a class="animated-underline"><span>contents</span></a>

  - Using background-image/background-size
    for native support for multi-line text underlines
-------------------------------------------------------------------------------- */

  /* ----- Anchor Styles ------------------------------ */

    a.animated-underline {
      /* Removes default browser underline */
      text-decoration: none;
    }

  /* ----- Exit Styles ------------------------------ */

    a.animated-underline > span {
      /* Solid line (via gradient) */
      background-image: linear-gradient(
        currentColor, currentColor
      );

      /* Base position: for enter/exit */
      background-position: left bottom;

      /* Base state: underline shrinks with few width */
      background-size: 0 var(--line-weight--universal);
      background-repeat: no-repeat;

      transition: background-size
        var(--transition-duration--universal);
    }

  /* ----- Enter Styles ------------------------------ */

    a.animated-underline:hover > span,
    a.animated-underline:focus-visible > span {
      /* Hover state: underline expands to full width */
      background-size: 100% var(--line-weight--universal);
    }

/* --------------------------------------------------------------------------------
  Text Tool Styles:
  Centralizes commonly used writing tool styles 
--------------------------------------------------------------------------------*/

  /* ----- Margin Vertical Styles ------------------------------ */
    
    .margin-vertical--universal {
      margin-block: var(--margin--universal);
    }

  /* ----- Typography Styles ------------------------------ */

    .text--supplement {
      color: rgb(var(--color-primary-text--weak));
      font-size: 0.9em;
    }

    .text--strong {
      font-weight: 700;	
    }

    .text--weak {
      color: rgb(var(--color-primary-text--weak));
    }

    .text--large {
      font-size: 1.1em;
    }

    .text--small {
      font-size: 0.9em;
    }

    .text--italic {
      font-style: italic;	
    }

    .text--footer {
      font-size: var(--font-size--small);
    }

    .text--retrieved {
      color: rgb(var(--color-primary-text--weak));
      font-size: 0.9em;
    }

  /* ----- Citation Styles ------------------------------ */

    /* Removes default browser underline:
    for cite-link and return-link */
    a.cite-link, a.return-link {
      text-decoration: none;
    }

    /* Auto add square brackets (half-width):
    for content's cite-link */
    a.cite-link::before {
      content: "[";
    }
    a.cite-link::after {
      content: "]";
    }

  /* ----- Other Styles ------------------------------ */

    ol.leading-zero {
      list-style: decimal-leading-zero;
    }

/* --------------------------------------------------------------------------------
  Embed Asset Styles:
  Centralizes commonly used embedding styles 
--------------------------------------------------------------------------------*/

  /* ----- Universal Asset Styles ------------------------------ */

    .asset {
      border-radius: var(--border-radius--universal);
    }

    /* Dimension: for images */
    .asset.image {
      width: 100%;
      max-width: var(--max-width--image);
    }

    /* Dimension: for covers */
    .asset.image.cover {
      /* (max-width) required: (0,2,1) */
      max-width: var(--max-width--cover);
    }

  /* ----- <iframe> Styles ------------------------------ */

    /* Dimension: for bilibili embed player;
    leaving aspect-ratio inline for adaptive ratio */
    .bilibili-embed-player {
      max-height: var(--max-height--bilibili);
      overflow: hidden;
    }

/* --------------------------------------------------------------------------------
  Left-Right Column Styles:
  Centralizes responsive left-right column for diverse content
--------------------------------------------------------------------------------*/

  /* ----- Column Style Template ------------------------------

    .left-right-column {
        display: grid;
        row-gap: var(--gap--small);
      }

    @media (min-width: 640px) {
      .left-right-column {
        column-gap: var(--gap--column);
        grid-template-areas: "left right";
        grid-template-columns: auto 1fr;
      }

      .left-right-column .left {
        grid-area: left;
      }
      .left-right-column .right {
        grid-area: right;
      }
    }
      
  */

  /* ----- Key-Value Column Styles ------------------------------ */

    /* Assumes .key and .value elements in alternating order */
    .key-value-column {
      display: grid;
      max-width: var(--max-width--key-value-column);

      border-width: var(--line-weight--universal);
      border-style: solid;
      border-color: rgba(var(--color-rgba-lyric-border));
      border-radius: var(--border-radius--universal);

      padding: var(--padding--universal);

      font-size: var(--font-size--small);
    }

    .key-value-column .key {
      align-self: center;
      white-space: nowrap;
    }

    .key-value-column .value {
      overflow-wrap: break-word;
    }

    @media (max-width: 319px) {
      .key-value-column .key {
        font-weight: bold;
      }

      /* Margin-bottom visually separates each key-value pair */
      .key-value-column .value:not(:last-child) {
        margin-bottom: var(--gap--universal);
      }
    }

    @media (min-width: 320px) {
      /* Row-gap controls space between key-value pairs */
      .key-value-column {
        row-gap: var(--gap--small);
        column-gap: var(--gap--small);
        grid-template-columns: auto 1fr;
      }
    }

  /* ----- Media-Text Column Styles ------------------------------ */

    /* Uses flexbox for unequal heights */
    @media (min-width: 640px) {
      /* Split media and text into two columns */
      .media-text-column {
        display: flex;
        align-items: flex-start;
        gap: var(--gap--column);
      }
      .media-text-column .media {
        flex-shrink: 0;
      }
      .media-text-column .text {
        flex: 1;
      }
    }

  /* ----- Lyric Column Styles ------------------------------ */

    .lyric-column {
      display: grid;
      max-width: var(--max-width--lyric-column);

      /* Space between lyric-paragraph */
      row-gap: var(--gap--universal);
    }

    /* Shared padding keeps lyrics and source aligned */
    .lyric-paragraph,
    .lyric-source {
      display: grid;

      /* Space between lyric-pair */
      row-gap: var(--gap--x-small);

      padding: var(--padding--universal);
    }

    /* Only .lyric-paragraph has a visible border */
    .lyric-paragraph {
      border-width: var(--line-weight--universal);
      border-style: solid;
      border-color: rgba(var(--color-rgba-lyric-border));
      border-radius: var(--border-radius--universal);
    }
    
    .lyric-pair {
      display: grid;
    }

    .lyric {
      text-align: left;
      font-size: var(--font-size--small);
    }

    .lyric.english {
      color: rgb(var(--color-lyric--english));
    }
    .lyric.chinese {
      color: rgb(var(--color-lyric--chinese));
    }

    /* Harmonize color with english lyric */
    .narration--long .lyric.chinese {
      color: rgb(var(--color-lyric--narration-chinese));
    }

    @media (min-width: 640px) {
      /* Split non-long-narration lyrics into two columns */
      .lyric-paragraph:not(.narration--long) .lyric-pair,
      .lyric-source .lyric-pair {
        grid-template-areas: "english chinese";
        grid-template-columns: 1.5fr 1fr;
        column-gap: var(--gap--column);
      }
      .lyric-paragraph:not(.narration--long) .lyric.english,
      .lyric-source .lyric.english {
        grid-area: english;
      }
      .lyric-paragraph:not(.narration--long) .lyric.chinese,
      .lyric-source .lyric.chinese {
        grid-area: chinese;
      }
    }

  /* ----- Citation Column Styles ------------------------------ */

    @media (min-width: 1080px) {
      /* Split citations into two columns */
      ol.cite-column {
        column-count: 2;
        column-gap: var(--gap--column);
      }

      /* Avoid breaking <li> inside cite-column */
      ol.cite-column li {
        break-inside: avoid;
      }
    }