/* Declare the layer order so consumers can override us deterministically:
 *
 *   @layer mejiro.base, mejiro.chrome, mejiro.print, app;
 *
 * Anything in the `app` layer (or unlayered) wins over mejiro automatically.
 * Re-declaring later with the same names is harmless. */
@layer mejiro.base, mejiro.chrome, mejiro.print;

@layer mejiro.base {
  .mejiro-page {
    writing-mode: vertical-rl;
    width: 100%;
  }

  .mejiro-paragraph {
    writing-mode: vertical-rl;
    display: inline-block;
    margin-right: 0.4em;
    white-space: nowrap;
  }

  .mejiro-paragraph:first-child {
    margin-right: 0;
  }

  /* Heading defaults — applies to all heading levels unless overridden */
  .mejiro-paragraph--heading {
    font-weight: 700;
    font-size: 1.4em;
    height: 100%;
  }

  .mejiro-paragraph--heading + .mejiro-paragraph {
    margin-right: 1.2em;
  }

  /* Per-level heading styles */
  .mejiro-paragraph--h1 {
    font-weight: 700;
    font-size: 1.6em;
    height: 100%;
  }

  .mejiro-paragraph--h1 + .mejiro-paragraph {
    margin-right: 1.4em;
  }

  .mejiro-paragraph--h2 {
    font-weight: 700;
    font-size: 1.4em;
    height: 100%;
  }

  .mejiro-paragraph--h2 + .mejiro-paragraph {
    margin-right: 1.2em;
  }

  .mejiro-paragraph--h3 {
    font-weight: 700;
    font-size: 1.2em;
    height: 100%;
  }

  .mejiro-paragraph--h3 + .mejiro-paragraph {
    margin-right: 1em;
  }

  .mejiro-paragraph--h4 {
    font-weight: 700;
    font-size: 1.1em;
    height: 100%;
  }

  .mejiro-paragraph--h4 + .mejiro-paragraph {
    margin-right: 0.8em;
  }

  .mejiro-paragraph--h5 {
    font-weight: 700;
    font-size: 1em;
    height: 100%;
  }

  .mejiro-paragraph--h5 + .mejiro-paragraph {
    margin-right: 0.6em;
  }

  .mejiro-paragraph--h6 {
    font-weight: 700;
    font-size: 1em;
    height: 100%;
  }

  .mejiro-paragraph--h6 + .mejiro-paragraph {
    margin-right: 0.6em;
  }

  .mejiro-paragraph--blockquote {
    font-style: italic;
    opacity: 0.92;
    margin-right: 0.8em;
  }

  .mejiro-paragraph--blockquote + .mejiro-paragraph {
    margin-right: 1em;
  }

  .mejiro-paragraph--scene-break {
    letter-spacing: 0.2em;
    text-align: center;
    margin-right: 1.2em;
  }

  .mejiro-paragraph--pre {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    white-space: pre;
  }

  .mejiro-paragraph--figure {
    text-align: center;
    margin-right: 1em;
  }

  .mejiro-emphasis {
    -webkit-text-emphasis-position: over right;
    text-emphasis-position: over right;
  }

  .mejiro-emphasis--sesame {
    -webkit-text-emphasis: sesame;
    text-emphasis: sesame;
  }

  .mejiro-emphasis--dot {
    -webkit-text-emphasis: dot;
    text-emphasis: dot;
  }

  .mejiro-emphasis--circle {
    -webkit-text-emphasis: circle;
    text-emphasis: circle;
  }

  .mejiro-tcy {
    -webkit-text-combine: horizontal;
    text-combine-upright: all;
  }

  .mejiro-page ruby {
    ruby-align: center;
  }

  .mejiro-page rt {
    font-size: 0.5em;
    font-weight: 400;
  }
} /* end @layer mejiro.base */