theme.css

@import url(../@vivliostyle/theme-base/theme-all.css);
@import url(../@vivliostyle/theme-academic/theme.css);
@import url(../@vivliostyle/theme-base/css/lib/prism/base.css);
@import url(../@vivliostyle/theme-base/css/lib/prism/theme-okaidia.css);

:root{
  
  /* h3以下におけるセクション番号が正しくないバグに対する暫定的な解決
  /~https://github.com/vivliostyle/themes/issues/138 */

  --vs-section--root-counter-reset:
    var(--vs-section--root-counter-sections,)
    var(--vs-section--root-counter-sec-h1,)
    var(--vs-section--root-counter-sec-h2,)
    var(--vs-section--root-counter-sec-h3,)
    var(--vs-section--root-counter-sec-h4,)
    var(--vs-section--root-counter-sec-h5,)
    var(--vs-section--root-counter-sec-h6,);

    widows: 1;
    orphans: 1;

    --vs--lists-margin-block: 0.5rem;
}

/* Colmun */

body[column="2"]{
  column-count: 2;
  column-gap: 2em;
  column-fill: balance;
}

h1, .author, .abstract, .keywords, .column-span, .author-list, .author-details{
  column-span: all;
}

/* Page Counter */

html[page-counter="false"]{
  --vs-page--mbox-content-bottom-center: none;
}

html[page-counter="right"]{
  --vs-page--mbox-content-bottom-center: none;
  --vs-page--mbox-content-bottom-right-corner: counter(page);
}

html[page-counter="left"]{
  --vs-page--mbox-content-bottom-center: none;
  --vs-page--mbox-content-bottom-left-corner: counter(page);
}

/* Pub Title */

html[pub-title="false"]{
  --vs-page--mbox-content-top-left: none;
}

html[pub-title="right"]{
  --vs-page--mbox-content-top-left: none;
  --vs-page--mbox-content-top-right: env(pub-title);
}

html[pub-title="center"]{
  --vs-page--mbox-content-top-left: none;
  --vs-page--mbox-content-top-center: env(pub-title);
}

/* Author */

.author-list ul {
  list-style: none;
  text-align: right;
  margin-block: var(--vs-spacing-rlh);
  padding: 0;
}

/* Abstract */

.abstract{
  margin: 1em auto;
  width: 90%;
}

.abstract::before{
  --vs-abstract-title: 'Abstract';
  content: var(--vs-abstract-title);
  display: block;
  font-size: 1.2em;
  font-weight: bold;
  text-align: center;
}

html[section-font="serif"] .abstract::before{
  --vs--section-font-family: var(--vs-font-family);
}

html[section-font="sans-serif"] .abstract::before{
  --vs--section-font-family: var(--vs--heading-font-family);
}

.abstract:lang(ja)::before{
  --vs-abstract-title: '概要';
}

html[abstract-title="false"] .abstract::before{
  --vs-abstract-title: '';
}

html[abstract-title="en"] .abstract::before{
  --vs-abstract-title: 'Abstract';
}

html[abstract-title="ja"] .abstract::before{
  --vs-abstract-title: '概要';
}

.abstract::before{
  content: var(--vs-abstract-title);
}

.abstract p{
  font-size: 9pt;
  line-height: 1.3em;
}

/* Keywords */

.keywords{
  margin: 1em auto;
  width: 83%;
}

.keywords p::before{
  --vs-keywords-title: 'KEY WORDS: ';
  content: var(--vs-keywords-title);
  display: inline;
  font-size: 9pt;
  font-weight: bold;
}

.keywords p{
  width: 100%;
  font-size: 9pt;
  text-indent: 0;
  line-height: 1.5em;
}

/* Image */

body:not([column="2"]) figure img,
body:not([column]) figure img{
  --vs-theme--figure-img-max-width: 100%;
}

body[column="2"] img{
  max-width: 95%;
  --vs--figure-item-padding-inline: 0;
}

body[column="2"] .image-row img{
  max-width: 100%;
}

/* Image Row */

.image-row{
  display: flex;
  justify-content: space-between;
  gap: 1em;
  margin: 22.8px 0;
}

.image-row figure{
  margin: 0;
}

.image-row img{
  width: 100%;
}

.image-row:has(> figure:nth-child(1)) figure{
  width: 100%;
}

.image-row:has(> figure:nth-child(n+2)) figure{
  width: calc((100% - 1em * (n - 1)) / n);
}

/* Section Font */
html[section-font="serif"] :is(h1, h2, h3, h4, h5, h6){
  --vs--section-font-family: var(--vs-font-family);
  font-family: var(--vs--section-font-family);
}

html[section-font="sans-serif"] :is(h1, h2, h3, h4, h5, h6){
  --vs--section-font-family: var(--vs--heading-font-family);
  font-family: var(--vs--section-font-family);
}

/* Compact Text */

html[compact-text="true"]{
  --vs-font-size: 9.5pt;
  line-height: 1.5;
  --vs--h2-font-size: 1.1em;
  --vs-h2-margin-block: 0.3rem 0.4rem;
  --vs--h3-font-size: 1em;
  --vs--h3-margin-block: 0.3rem 0.4rem;
  --vs--h4-font-size: 1em;
}