static/style.css

@font-face{font-family:BookInsanityRemake;src:url('./themes/fonts/5e/Bookinsanity.woff2');font-weight:normal;font-style:normal}
@font-face{font-family:BookInsanityRemake;src:url('./themes/fonts/5e/Bookinsanity Bold.woff2');font-weight:bold;font-style:normal}
@font-face{font-family:BookInsanityRemake;src:url('./themes/fonts/5e/Bookinsanity Italic.woff2');font-weight:normal;font-style:italic}
@font-face{font-family:BookInsanityRemake;src:url('./themes/fonts/5e/Bookinsanity Bold Italic.woff2');font-weight:bold;font-style:italic}
@font-face{font-family:ScalySansRemake;src:url('./themes/fonts/5e/Scaly Sans.woff2');font-weight:normal;font-style:normal}@font-face{font-family:ScalySansRemake;src:url('./themes/fonts/5e/Scaly Sans Bold.woff2');font-weight:bold;font-style:normal}
@font-face{font-family:ScalySansRemake;src:url('./themes/fonts/5e/Scaly Sans Italic.woff2');font-weight:normal;font-style:italic}
@font-face{font-family:ScalySansRemake;src:url('./themes/fonts/5e/Scaly Sans Bold Italic.woff2');font-weight:bold;font-style:italic}
@font-face{font-family:ScalySansSmallCapsRemake;src:url('./themes/fonts/5e/Scaly Sans Caps.woff2');font-weight:normal;font-style:normal}
@font-face{font-family:WalterTurncoat;src:url('./themes/fonts/5e/WalterTurncoat-Regular.woff2');font-weight:normal;font-style:normal}
@font-face{font-family:MrEavesRemake;src:url('./themes/fonts/5e/Mr Eaves Small Caps.woff2');font-weight:normal;font-style:normal}
@font-face{font-family:SolberaImitationRemake;src:url('./themes/fonts/5e/Solbera Imitation Tweak.woff2');font-weight:normal;font-style:normal}
@font-face{font-family:NodestoCapsCondensed;src:url('./themes/fonts/5e/Nodesto Caps Condensed.woff2');font-weight:normal;font-style:normal}
@font-face{font-family:NodestoCapsCondensed;src:url('./themes/fonts/5e/Nodesto Caps Condensed Bold.woff2');font-weight:bold;font-style:normal}
@font-face{font-family:NodestoCapsCondensed;src:url('./themes/fonts/5e/Nodesto Caps Condensed Italic.woff2');font-weight:normal;font-style:italic}
@font-face{font-family:NodestoCapsCondensed;src:url('./themes/fonts/5e/Nodesto Caps Condensed Bold Italic.woff2');font-weight:bold;font-style:italic}
@font-face{font-family:NodestoCapsWide;src:url('./themes/fonts/5e/Nodesto Caps Wide.woff2');font-weight:normal;font-style:normal}
@font-face{font-family:Overpass;src:url('./themes/fonts/5e/Overpass Medium.woff2');font-weight:500;font-style:normal}@font-face{font-family:Davek;src:url('./themes/fonts/5e/Davek.woff2');font-weight:500;font-style:normal}
@font-face{font-family:Iokharic;src:url('./themes/fonts/5e/Iokharic.woff2');font-weight:500;font-style:normal}
@font-face{font-family:Rellanic;src:url('./themes/fonts/5e/Rellanic.woff2');font-weight:500;font-style:normal}:root{--HB_Color_Background:#FFFFFF;--HB_Color_WatercolorStain:#000000}
@page {
    margin: 0;
}

body {
    counter-reset: phb-page-numbers;
}

* {
    -webkit-print-color-adjust: exact;
}

.page .block {
    break-inside: avoid;
    display: inline-block;
    width: 100%;
}

.page .block img {
    z-index: 0;
}

.page .inline-block {
    display: inline-block;
    text-indent: initial;
}

.columnWrapper {
    max-height: 100%;
    column-span: all;
    columns: inherit;
    column-gap: inherit;
    column-fill: inherit;
}

.page {
    column-fill: auto;
    column-count: 2;
    height: 279.4mm;
    width: 215.9mm;
    padding: 1.4cm 1.9cm 1.7cm;
    counter-increment: phb-page-numbers;
    background-color: var(--HB_Color_Background);
    position: relative;
    z-index: 15;
    box-sizing: border-box;
    overflow: hidden;
    text-rendering: optimizeLegibility;
    page-break-before: always;
    page-break-after: always;
    contain: size;
}

.page p {
    overflow-wrap: break-word;
    display: block;
}

.page strong {
    font-weight: bold;
}

.page em {
    font-style: italic;
}

.page sup {
    vertical-align: super;
    font-size: smaller;
    line-height: 0;
}

.page sub {
    vertical-align: sub;
    font-size: smaller;
    line-height: 0;
}

.page ul {
    list-style-position: outside;
    list-style-type: disc;
    padding-left: 1.4em;
}

.page ol {
    list-style-position: outside;
    list-style-type: decimal;
    padding-left: 1.4em;
}

.page img {
    z-index: -1;
}

.page h1,
.page h2,
.page h3,
.page h4,
.page h5,
.page h6 {
    font-weight: bold;
    line-height: 1.2em;
}

.page h1 {
    font-size: 2em;
}

.page h2 {
    font-size: 1.5em;
}

.page h3 {
    font-size: 1.17em;
}

.page h4 {
    font-size: 1em;
}

.page h5 {
    font-size: 0.83em;
}

.page table {
    width: 100%;
}

.page table thead {
    display: table-row-group;
    font-weight: bold;
}

.page div:not(.columnWrapper) > table + table {
    margin-top: 0;
}
.page .classTable th[colspan]:not([rowspan]) {
    white-space: nowrap;
  }
.page .classTable.frame {
    width: calc(100% + .2cm);
    margin-top: .7cm;
    margin-right: -0.1cm;
    margin-bottom: .9cm;
    margin-left: -0.1cm;
    border-collapse: separate;
    background-color: white;
    border: initial;
    border-style: solid;
    border-image-source: url('../../dependencies/assets/frameBorder.png');
    border-image-slice: 200;
    border-image-width: 47px;
    border-image-outset: .4cm .3cm;
    border-image-repeat: stretch;
  }

.page code {
    font-family: "Courier New", Courier, monospace;
    white-space: pre-wrap;
    overflow-wrap: break-word;
}

.page pre code {
    width: 100%;
    display: inline-block;
}

.page .columnSplit {
    visibility: hidden;
    -webkit-column-break-after: always;
    break-after: always;
    -moz-column-break-after: always;
    margin-top: 0;
}

.page .columnSplit + * {
    margin-top: 0;
}

.page blockquote,
.page table {
    z-index: 15;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}


.page ul ul,
.page ol ol,
.page ul ol,
.page ol ul {
    margin-bottom: 0px;
    margin-left: 1.5em;
}

.page li {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}

.page .watermark {
    display: grid !important;
    place-items: center;
    justify-content: center;
    position: absolute;
    margin: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    font-size: 120px;
    text-transform: uppercase;
    mix-blend-mode: overlay;
    opacity: 30%;
    transform: rotate(-45deg);
    z-index: 500;
}

.page .watermark p {
    margin-bottom: none;
}

.page [class*="watercolor"] {
    position: absolute;
    width: 2000px;
    height: 2000px;
    -webkit-mask-image: var(--wc);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-image: var(--wc);
    mask-size: contain;
    mask-repeat: no-repeat;
    background-size: cover;
    background-color: var(--HB_Color_WatercolorStain);
    --wc: url('/assets/watercolor/watercolor1.png');
    z-index: -2;
}

.page .watercolor1 {
    --wc: url('/assets/watercolor/watercolor1.png');
}

.page .watercolor2 {
    --wc: url('/assets/watercolor/watercolor2.png');
}

.page .watercolor3 {
    --wc: url('/assets/watercolor/watercolor3.png');
}

.page .watercolor4 {
    --wc: url('/assets/watercolor/watercolor4.png');
}

.page .watercolor5 {
    --wc: url('/assets/watercolor/watercolor5.png');
}

.page .watercolor6 {
    --wc: url('/assets/watercolor/watercolor6.png');
}

.page .watercolor7 {
    --wc: url('/assets/watercolor/watercolor7.png');
}

.page .watercolor8 {
    --wc: url('/assets/watercolor/watercolor8.png');
}

.page .watercolor9 {
    --wc: url('/assets/watercolor/watercolor9.png');
}

.page .watercolor10 {
    --wc: url('/assets/watercolor/watercolor10.png');
}

.page .watercolor11 {
    --wc: url('/assets/watercolor/watercolor11.png');
}

.page .watercolor12 {
    --wc: url('/assets/watercolor/watercolor12.png');
}

.page [class*="imageMask"] {
    position: absolute;
    height: 200%;
    width: 200%;
    left: 50%;
    bottom: 50%;
    --rotation: 0;
    --revealer: none;
    --checkerboard: none;
    --scaleX: 1;
    --scaleY: 1;
    -webkit-mask-image: var(--wc), var(--revealer);
    -webkit-mask-repeat: repeat-x;
    -webkit-mask-size: 50%;
    -webkit-mask-position: 50% calc(50% - var(--offset));
    mask-image: var(--wc);
    mask-repeat: repeat-x;
    mask-size: 50%;
    mask-position: 50% calc(50% - var(--offset));
    background-image: var(--checkerboard);
    background-size: 20px;
    z-index: -1;
    transform: translateY(50%) translateX(-50%) rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
}

.page [class*="imageMask"] > p:has(img) {
    position: absolute;
    width: 50%;
    height: 50%;
    bottom: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(50%) rotate(calc(-1deg * var(--rotation))) scaleX(calc(1 / var(--scaleX))) scaleY(calc(1 / var(--scaleY)));
}

.page [class*="imageMask"] img {
    position: absolute;
    display: block;
    bottom: 0;
}

.page [class*="imageMask"].bottom {
    --rotation: 0;
}

.page [class*="imageMask"].bottom img {
    bottom: 0;
}

.page [class*="imageMask"].top {
    --rotation: 180;
}

.page [class*="imageMask"].top img {
    top: 0;
}

.page [class*="imageMask"].left {
    --rotation: 90;
}

.page [class*="imageMask"].left img {
    left: 0;
}

.page [class*="imageMask"].right {
    --rotation: -90;
}

.page [class*="imageMask"].right img {
    right: 0;
}

.page [class*="imageMask"].revealImage {
    --revealer: linear-gradient(0deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2));
    --checkerboard: url(/assets/waterColorMasks/missingImage.png);
}

.page .imageMaskEdge1 {
    --wc: url(/assets/waterColorMasks/edge/0001.webp);
}

.page .imageMaskEdge2 {
    --wc: url(/assets/waterColorMasks/edge/0002.webp);
}

.page .imageMaskEdge3 {
    --wc: url(/assets/waterColorMasks/edge/0003.webp);
}

.page .imageMaskEdge4 {
    --wc: url(/assets/waterColorMasks/edge/0004.webp);
}

.page .imageMaskEdge5 {
    --wc: url(/assets/waterColorMasks/edge/0005.webp);
}

.page .imageMaskEdge6 {
    --wc: url(/assets/waterColorMasks/edge/0006.webp);
}

.page .imageMaskEdge7 {
    --wc: url(/assets/waterColorMasks/edge/0007.webp);
}

.page .imageMaskEdge8 {
    --wc: url(/assets/waterColorMasks/edge/0008.webp);
}

.page .imageMaskEdge9 {
    --wc: url(/assets/waterColorMasks/edge/0009.webp);
}

.page .imageMaskEdge10 {
    --wc: url(/assets/waterColorMasks/edge/0010.webp);
}

.page .imageMaskEdge11 {
    --wc: url(/assets/waterColorMasks/edge/0011.webp);
}

.page .imageMaskEdge12 {
    --wc: url(/assets/waterColorMasks/edge/0012.webp);
}

.page .imageMaskCorner1 {
    --wc: url(/assets/waterColorMasks/corner/0001.webp);
}

.page .imageMaskCorner2 {
    --wc: url(/assets/waterColorMasks/corner/0002.webp);
}

.page .imageMaskCorner3 {
    --wc: url(/assets/waterColorMasks/corner/0003.webp);
}

.page .imageMaskCorner4 {
    --wc: url(/assets/waterColorMasks/corner/0004.webp);
}

.page .imageMaskCorner5 {
    --wc: url(/assets/waterColorMasks/corner/0005.webp);
}

.page .imageMaskCorner6 {
    --wc: url(/assets/waterColorMasks/corner/0006.webp);
}

.page .imageMaskCorner7 {
    --wc: url(/assets/waterColorMasks/corner/0007.webp);
}

.page .imageMaskCorner8 {
    --wc: url(/assets/waterColorMasks/corner/0008.webp);
}

.page .imageMaskCorner9 {
    --wc: url(/assets/waterColorMasks/corner/0009.webp);
}

.page .imageMaskCorner10 {
    --wc: url(/assets/waterColorMasks/corner/0010.webp);
}

.page .imageMaskCorner11 {
    --wc: url(/assets/waterColorMasks/corner/0011.webp);
}

.page .imageMaskCorner12 {
    --wc: url(/assets/waterColorMasks/corner/0012.webp);
}

.page .imageMaskCorner13 {
    --wc: url(/assets/waterColorMasks/corner/0013.webp);
}

.page .imageMaskCorner14 {
    --wc: url(/assets/waterColorMasks/corner/0014.webp);
}

.page .imageMaskCorner15 {
    --wc: url(/assets/waterColorMasks/corner/0015.webp);
}

.page .imageMaskCorner16 {
    --wc: url(/assets/waterColorMasks/corner/0016.webp);
}

.page .imageMaskCorner17 {
    --wc: url(/assets/waterColorMasks/corner/0017.webp);
}

.page .imageMaskCorner18 {
    --wc: url(/assets/waterColorMasks/corner/0018.webp);
}

.page .imageMaskCorner19 {
    --wc: url(/assets/waterColorMasks/corner/0019.webp);
}

.page .imageMaskCorner20 {
    --wc: url(/assets/waterColorMasks/corner/0020.webp);
}

.page .imageMaskCorner21 {
    --wc: url(/assets/waterColorMasks/corner/0021.webp);
}

.page .imageMaskCorner22 {
    --wc: url(/assets/waterColorMasks/corner/0022.webp);
}

.page .imageMaskCorner23 {
    --wc: url(/assets/waterColorMasks/corner/0023.webp);
}

.page .imageMaskCorner24 {
    --wc: url(/assets/waterColorMasks/corner/0024.webp);
}

.page .imageMaskCorner25 {
    --wc: url(/assets/waterColorMasks/corner/0025.webp);
}

.page .imageMaskCorner26 {
    --wc: url(/assets/waterColorMasks/corner/0026.webp);
}

.page .imageMaskCorner27 {
    --wc: url(/assets/waterColorMasks/corner/0027.webp);
}

.page .imageMaskCorner28 {
    --wc: url(/assets/waterColorMasks/corner/0028.webp);
}

.page .imageMaskCorner29 {
    --wc: url(/assets/waterColorMasks/corner/0029.webp);
}

.page .imageMaskCorner30 {
    --wc: url(/assets/waterColorMasks/corner/0030.webp);
}

.page .imageMaskCorner31 {
    --wc: url(/assets/waterColorMasks/corner/0031.webp);
}

.page .imageMaskCorner32 {
    --wc: url(/assets/waterColorMasks/corner/0032.webp);
}

.page .imageMaskCorner33 {
    --wc: url(/assets/waterColorMasks/corner/0033.webp);
}

.page .imageMaskCorner34 {
    --wc: url(/assets/waterColorMasks/corner/0034.webp);
}

.page .imageMaskCorner35 {
    --wc: url(/assets/waterColorMasks/corner/0035.webp);
}

.page .imageMaskCorner36 {
    --wc: url(/assets/waterColorMasks/corner/0036.webp);
}

.page .imageMaskCorner37 {
    --wc: url(/assets/waterColorMasks/corner/0037.webp);
}

.page dl {
    padding-left: 1em;
    white-space: normal;
}

.page dt {
    display: inline;
    margin-right: 0.5ch;
    margin-left: -1em;
}

.page dd {
    display: inline;
    margin-left: 0;
    text-indent: 0;
}

.page .blank {
    height: 1em;
    margin-top: 0;
}

.page .blank + * {
    margin-top: 0;
}

.page .wide {
    column-span: all;
    display: block;
    margin-bottom: 1em;
}

.page .wide + * {
    margin-top: 0;
}