/* Fonts: all SIL Open Font License, served from the theme (licenses in assets/fonts). */
@font-face { font-family: 'IM Fell English'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/im-fell-english-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'IM Fell English'; font-style: italic; font-weight: 400; font-display: swap; src: url('../fonts/im-fell-english-latin-400-italic.woff2') format('woff2'); }
@font-face { font-family: 'IM Fell English SC'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/im-fell-english-sc-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Kalam'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/kalam-latin-ext-400-normal.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; }
@font-face { font-family: 'Kalam'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/kalam-latin-400-normal.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; }
@font-face { font-family: 'Kalam'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/kalam-latin-ext-700-normal.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; }
@font-face { font-family: 'Kalam'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/kalam-latin-700-normal.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; }
@font-face { font-family: 'Crimson Pro'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/crimson-pro-latin-ext-400-normal.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; }
@font-face { font-family: 'Crimson Pro'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/crimson-pro-latin-400-normal.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; }
@font-face { font-family: 'Crimson Pro'; font-style: italic; font-weight: 400; font-display: swap; src: url('../fonts/crimson-pro-latin-ext-400-italic.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; }
@font-face { font-family: 'Crimson Pro'; font-style: italic; font-weight: 400; font-display: swap; src: url('../fonts/crimson-pro-latin-400-italic.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; }
@font-face { font-family: 'Crimson Pro'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/crimson-pro-latin-ext-600-normal.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; }
@font-face { font-family: 'Crimson Pro'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/crimson-pro-latin-600-normal.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; }
@font-face { font-family: 'Crimson Pro'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/crimson-pro-latin-ext-700-normal.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; }
@font-face { font-family: 'Crimson Pro'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/crimson-pro-latin-700-normal.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; }

/* ==========================================================================
   Mossworks theme
   An old, mysterious archive that nature is slowly reclaiming:
   torn pages, brass, candlelight and moss.

   Contents
   1. Tokens
   2. Base
   3. Backdrop, motes of light and page layout
   4. The lift (site menu)
   5. Paper sheet, headings and shared pieces
   6. Home masthead
   7. Floors: notes, story tags, film tins, specimen cards, frames, notice board
   8. Post: the scroll, prose, editor cards, pager, comments
   9. Pages: page, links page, errors, empty, pagination
   10. Footer
   11. Medium screens (lift folds into a bar)
   12. Phones
   13. Motion and print
   ========================================================================== */


/* 1. Tokens
   ========================================================================== */

:root {
    --night: #140d08;
    --ink: #2a2117;
    --ink-2: #271a0f;
    --ink-3: #3a2a1a;
    --ink-hand: #1a1007;
    --red: #5e1f12;
    --link: #7a2f1f;
    --link-hover: #4f1c12;
    --cream: #f3e4bf;
    --cream-2: #e2cf9f;
    --gold: #ffd27a;
    --gold-2: #e7b866;
    --rule: rgba(60, 40, 20, .35);

    --plaque-bg: linear-gradient(180deg, #2b1e12, #170f08);
    --plaque-ring: inset 0 0 0 1px rgba(255, 214, 140, .35), inset 0 2px 5px rgba(0, 0, 0, .7), 0 1px 0 rgba(255, 232, 170, .45);
    --plaque-glow: inset 0 0 0 1px rgba(255, 200, 110, .75), inset 0 2px 5px rgba(0, 0, 0, .7), 0 0 10px rgba(255, 190, 90, .35);
    --halo: 0 0 3px rgba(255, 242, 215, .9), 0 0 1px rgba(255, 242, 215, .9);

    --paper-aged: url('../images/paper-aged.webp');
    --paper-light: url('../images/paper-light.webp');

    --font-display: var(--gh-font-heading, 'IM Fell English', 'Iowan Old Style', Georgia, serif);
    --font-sc: 'IM Fell English SC', 'IM Fell English', Georgia, serif;
    --font-body: var(--gh-font-body, 'Crimson Pro', 'Iowan Old Style', Georgia, serif);
    --font-hand: 'Kalam', 'Segoe Print', 'Comic Sans MS', cursive;

    --column: 1036px;
    --sheet-pad: 64px;
}


/* 2. Base
   ========================================================================== */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    margin: 0;
    font-family: var(--font-body);
    font-size: 19px;
    line-height: 1.55;
    color: var(--ink);
    background: var(--night);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}

img,
svg,
video,
iframe {
    max-width: 100%;
}

img {
    height: auto;
}

a {
    color: var(--link);
    text-decoration-thickness: 1px;
    text-underline-offset: .15em;
}

a:hover {
    color: var(--link-hover);
}

:focus-visible {
    outline: 3px solid var(--link);
    outline-offset: 3px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-display);
    font-weight: 400;
    line-height: 1.12;
    color: var(--ink);
}

button,
input,
textarea {
    font: inherit;
}

.mw-skip {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 100;
    padding: 10px 16px;
    font-family: var(--font-sc);
    color: var(--cream);
    background: var(--plaque-bg);
    border-radius: 4px;
    transform: translateY(-200%);
}

.mw-skip:focus {
    color: var(--gold);
    transform: none;
}

.mw-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* Small caps label in the old engraved typeface: "Floor 1", "Just catalogued". */
.mw-kicker {
    margin: 0;
    font-family: var(--font-sc);
    font-size: 19px;
    font-weight: 700;
    letter-spacing: .12em;
    color: var(--red);
}

/* A whole card or note is clickable through its title link. */
.mw-stretch::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
}


/* 3. Backdrop, motes of light and page layout
   ========================================================================== */

.mw-backdrop {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: max(100vh, 860px);
    background: var(--night) var(--mw-photo) center top / cover no-repeat;
    pointer-events: none;
}

/* Fade the picture into the dark of the archive, and darken the edges like lamplight. */
.mw-backdrop::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(20, 13, 8, 0) 42%, rgba(20, 13, 8, .82) 78%, var(--night) 100%),
        radial-gradient(ellipse at 70% 20%, transparent 30%, rgba(10, 6, 3, .45) 90%);
}

.mw-motes {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: max(100vh, 860px);
    overflow: hidden;
    pointer-events: none;
}

.mw-motes span {
    position: absolute;
    top: var(--y);
    left: var(--x);
    width: var(--s);
    height: var(--s);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 226, 160, .95), rgba(255, 200, 110, .35) 40%, transparent 70%);
    opacity: 0;
    animation: mw-drift var(--d) linear var(--dl) infinite;
}

@keyframes mw-drift {
    0% { opacity: 0; transform: translate(0, 0); }
    15% { opacity: .9; }
    75% { opacity: .65; }
    100% { opacity: 0; transform: translate(var(--dx), -150px); }
}

.mw-shell {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 44px;
    max-width: calc(300px + 44px + var(--column) + 80px);
    margin: 0 auto;
    padding: clamp(150px, 30vh, 300px) 40px 40px;
}

.mw-column {
    flex: 1 1 auto;
    min-width: 0;
    max-width: var(--column);
}

.mw-main {
    outline: none;
}

.mw-shell--bare {
    justify-content: center;
}


/* 4. The lift (site menu)
   ========================================================================== */

.mw-lift {
    position: relative;
    isolation: isolate;
    flex: 0 0 300px;
    width: 300px;
    padding: 48px 26px 64px;
    filter: drop-shadow(0 24px 30px rgba(0, 0, 0, .7));
}

/* The brass plate itself, stretched to fit however many floors there are. */
.mw-lift::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: url('../images/plate.webp') center / 100% 100% no-repeat;
}

.mw-lift__vine {
    position: absolute;
    top: -36px;
    right: -22px;
    width: 96px;
    height: 144px;
    background: url('../images/vine.webp') center / contain no-repeat;
    pointer-events: none;
}

.mw-lift__moss {
    position: absolute;
    bottom: -40px;
    left: -30px;
    width: 160px;
    height: 160px;
    background: url('../images/moss.webp') center / contain no-repeat;
    pointer-events: none;
}

@media (min-width: 1100px) and (min-height: 980px) {
    .mw-lift {
        position: sticky;
        top: 28px;
    }
}

/* Dark enamel labels on the brass. */
.mw-label,
.mw-now {
    display: table;
    margin: 0 auto;
    padding: 4px 12px;
    font-family: var(--font-sc);
    font-size: 13px;
    letter-spacing: .3em;
    color: var(--cream);
    background: var(--plaque-bg);
    border-radius: 3px;
    box-shadow: inset 0 0 0 1px rgba(255, 214, 140, .35), 0 1px 0 rgba(255, 232, 170, .45);
}

.mw-lift__sign {
    margin-bottom: 8px;
}

/* The floor indicator: a brass half-dial with a needle. */
.mw-dial {
    --a: -80deg;
    position: relative;
    width: 236px;
    height: 147px;
    margin: 0 auto;
    background: url('../images/dial.webp') center / 100% 100% no-repeat;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, .45));
}

.mw-dial__num {
    position: absolute;
    z-index: 2;
    width: 20px;
    height: 20px;
    font-family: var(--font-sc);
    font-size: 13px;
    line-height: 20px;
    text-align: center;
    color: var(--cream);
    background: #1b120a;
    border-radius: 50%;
    box-shadow: 0 0 0 1px rgba(255, 214, 140, .45), 0 1px 2px rgba(0, 0, 0, .6);
}

.mw-dial__num.is-current {
    color: var(--gold);
    box-shadow: 0 0 0 1px rgba(255, 200, 110, .85), 0 0 6px rgba(255, 190, 90, .6);
}

.mw-dial__num--0 { top: 108.7px; left: 45.2px; }
.mw-dial__num--1 { top: 88.8px; left: 60.4px; }
.mw-dial__num--2 { top: 69px; left: 82.3px; }
.mw-dial__num--3 { top: 62.8px; left: 108.2px; }
.mw-dial__num--4 { top: 69px; left: 134.1px; }
.mw-dial__num--5 { top: 88.8px; left: 156px; }

.mw-dial__needle {
    position: absolute;
    top: 41.6px;
    left: 113.6px;
    z-index: 1;
    width: 9.2px;
    height: 92px;
    background: url('../images/needle.webp') center / 100% 100% no-repeat;
    filter: drop-shadow(1px 2px 1px rgba(0, 0, 0, .5));
    transform: rotate(var(--a));
    transform-origin: 50% 95%;
    transition: transform .7s cubic-bezier(.3, 1.45, .5, 1);
}

/* Point the needle at the floor you are on (the script also handles posts inside a floor). */
.mw-dial:has(.mw-dial__num--1.is-current) { --a: -57deg; }
.mw-dial:has(.mw-dial__num--2.is-current) { --a: -27deg; }
.mw-dial:has(.mw-dial__num--3.is-current) { --a: 0deg; }
.mw-dial:has(.mw-dial__num--4.is-current) { --a: 27deg; }
.mw-dial:has(.mw-dial__num--5.is-current) { --a: 57deg; }

.mw-now {
    max-width: 100%;
    margin-top: 12px;
    margin-bottom: 16px;
    font-size: 14px;
    letter-spacing: .14em;
    text-align: center;
}

.mw-now__label::after {
    content: "\00a0\00b7\00a0";
}

.mw-now__floor:empty,
.mw-now:has(.mw-now__floor:empty) {
    display: none;
}

.mw-lift__toggle {
    display: none;
}

/* Floor buttons: a porcelain push button and an enamel name plate. */
.mw-floors {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.mw-floors--extra {
    position: relative;
    margin-top: 30px;
}

.mw-floors--extra::before {
    content: "";
    position: absolute;
    top: -16px;
    right: 4px;
    left: 4px;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(36, 21, 10, .6), transparent);
}

.mw-floor {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 46px;
    color: var(--cream);
    text-decoration: none;
}

.mw-floor:hover {
    color: var(--gold);
}

.mw-floor:focus-visible,
.mw-pagebtn:focus-visible,
.mw-lift__toggle:focus-visible,
.mw-footer a:focus-visible {
    outline: 3px solid var(--gold);
    outline-offset: 2px;
    border-radius: 4px;
}

.mw-button-light {
    flex: none;
    width: 44px;
    height: 44px;
    background: url('../images/btn-off.webp') center / contain no-repeat;
    filter: drop-shadow(1px 3px 2px rgba(0, 0, 0, .55));
}

.mw-floors--extra .mw-button-light {
    width: 36px;
    height: 36px;
    margin: 0 4px;
}

.mw-floor.is-current .mw-button-light,
.mw-floor:hover .mw-button-light,
.mw-pagebtn:hover .mw-button-light,
.mw-lift__toggle[aria-expanded="true"] .mw-button-light {
    background-image: url('../images/btn-on.webp');
}

.mw-plaque {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 1;
    min-width: 0;
    padding: 6px 11px;
    font-family: var(--font-sc);
    font-size: 17px;
    line-height: 1.15;
    letter-spacing: .02em;
    color: var(--cream);
    background: var(--plaque-bg);
    border-radius: 3px;
    box-shadow: var(--plaque-ring);
}

.mw-plaque__num {
    flex: none;
    min-width: 12px;
    color: var(--gold-2);
}

.mw-floor.is-current .mw-plaque,
.mw-floor:hover .mw-plaque {
    color: var(--gold);
    box-shadow: var(--plaque-glow);
}

/* Search, typed into a brass-framed card slot. */
.mw-seek {
    margin-top: 22px;
}

.mw-seek__label {
    display: block;
    margin: 0 0 6px;
    font-size: 14px;
    letter-spacing: .22em;
}

.mw-seek__input {
    display: block;
    width: 100%;
    height: 42px;
    padding: 0 12px;
    font-family: var(--font-body);
    font-size: 18px;
    color: var(--ink);
    background: #efe1bd;
    border: 3px solid #5e4118;
    border-radius: 6px;
    box-shadow: inset 0 2px 5px rgba(60, 40, 15, .4);
    -webkit-appearance: none;
    appearance: none;
}

.mw-seek__input::placeholder {
    color: #6d5534;
    opacity: 1;
}

.mw-seek__input:focus-visible {
    outline: 3px solid var(--gold);
    outline-offset: 1px;
}

.mw-seek__status {
    display: table;
    margin: 8px 0 0;
    padding: 3px 10px;
    font-family: var(--font-sc);
    font-size: 15px;
    letter-spacing: .04em;
    color: var(--gold);
    background: var(--plaque-bg);
    border-radius: 3px;
    box-shadow: var(--plaque-ring);
}

.mw-seek__status:empty {
    display: none;
}

.mw-seek__results {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
}

.mw-seek__results:empty {
    display: none;
}

.mw-seek__results a {
    display: block;
    padding: 7px 11px;
    font-family: var(--font-body);
    font-size: 17px;
    font-weight: 600;
    line-height: 1.25;
    color: var(--cream);
    text-decoration: none;
    background: var(--plaque-bg);
    border-radius: 3px;
    box-shadow: var(--plaque-ring);
}

.mw-seek__results a:hover,
.mw-seek__results a:focus-visible {
    color: var(--gold);
    box-shadow: var(--plaque-glow);
    outline: none;
}


/* 5. Paper sheet, headings and shared pieces
   ========================================================================== */

/* A large sheet of aged parchment with torn top and bottom edges. */
.mw-sheet {
    position: relative;
    isolation: isolate;
    padding: var(--sheet-pad) var(--sheet-pad) calc(var(--sheet-pad) + 8px);
    filter: drop-shadow(0 18px 26px rgba(0, 0, 0, .65));
}

.mw-sheet::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: #ead8b0 var(--paper-aged) 0 0 / 720px;
    clip-path: polygon(0.00% 0.7px,1.43% 5.9px,2.86% 0.4px,4.29% 11.7px,5.71% 1.7px,7.14% 6.7px,8.57% 4.5px,10.00% 5.9px,11.43% 20.0px,12.86% 8.9px,14.29% 0.6px,15.71% 16.2px,17.14% 2.7px,18.57% 17.3px,20.00% 4.4px,21.43% 9.6px,22.86% 12.1px,24.29% 0.1px,25.71% 7.8px,27.14% 17.5px,28.57% 1.7px,30.00% 5.2px,31.43% 0.0px,32.86% 11.1px,34.29% 4.6px,35.71% 1.4px,37.14% 3.3px,38.57% 5.2px,40.00% 7.6px,41.43% 13.0px,42.86% 19.6px,44.29% 0.5px,45.71% 6.5px,47.14% 5.1px,48.57% 4.5px,50.00% 6.1px,51.43% 0.0px,52.86% 1.0px,54.29% 1.6px,55.71% 1.6px,57.14% 17.5px,58.57% 14.6px,60.00% 16.3px,61.43% 19.9px,62.86% 7.3px,64.29% 10.3px,65.71% 1.4px,67.14% 0.5px,68.57% 3.0px,70.00% 3.0px,71.43% 1.5px,72.86% 3.3px,74.29% 17.6px,75.71% 1.1px,77.14% 8.0px,78.57% 2.5px,80.00% 14.9px,81.43% 0.1px,82.86% 13.3px,84.29% 3.8px,85.71% 2.2px,87.14% 5.2px,88.57% 0.0px,90.00% 14.8px,91.43% 4.5px,92.86% 11.2px,94.29% 17.2px,95.71% 5.5px,97.14% 17.5px,98.57% 2.8px,100.00% 17.1px,100.00% calc(100% - 0.5px),98.57% calc(100% - 0.2px),97.14% calc(100% - 2.6px),95.71% calc(100% - 16.2px),94.29% calc(100% - 15.5px),92.86% calc(100% - 0.5px),91.43% calc(100% - 0.6px),90.00% calc(100% - 0.1px),88.57% calc(100% - 9.5px),87.14% calc(100% - 2.3px),85.71% calc(100% - 15.0px),84.29% calc(100% - 7.3px),82.86% calc(100% - 3.2px),81.43% calc(100% - 0.3px),80.00% calc(100% - 0.7px),78.57% calc(100% - 14.3px),77.14% calc(100% - 13.6px),75.71% calc(100% - 15.5px),74.29% calc(100% - 1.8px),72.86% calc(100% - 14.7px),71.43% calc(100% - 9.6px),70.00% calc(100% - 17.6px),68.57% calc(100% - 17.1px),67.14% calc(100% - 9.4px),65.71% calc(100% - 9.6px),64.29% calc(100% - 6.1px),62.86% calc(100% - 1.1px),61.43% calc(100% - 14.6px),60.00% calc(100% - 11.2px),58.57% calc(100% - 2.7px),57.14% calc(100% - 8.6px),55.71% calc(100% - 9.0px),54.29% calc(100% - 17.3px),52.86% calc(100% - 10.3px),51.43% calc(100% - 0.0px),50.00% calc(100% - 1.5px),48.57% calc(100% - 1.2px),47.14% calc(100% - 17.9px),45.71% calc(100% - 1.0px),44.29% calc(100% - 16.9px),42.86% calc(100% - 0.0px),41.43% calc(100% - 2.0px),40.00% calc(100% - 14.2px),38.57% calc(100% - 0.1px),37.14% calc(100% - 6.7px),35.71% calc(100% - 6.0px),34.29% calc(100% - 0.2px),32.86% calc(100% - 12.8px),31.43% calc(100% - 12.2px),30.00% calc(100% - 2.2px),28.57% calc(100% - 6.2px),27.14% calc(100% - 11.9px),25.71% calc(100% - 4.0px),24.29% calc(100% - 0.1px),22.86% calc(100% - 6.3px),21.43% calc(100% - 3.7px),20.00% calc(100% - 1.1px),18.57% calc(100% - 7.7px),17.14% calc(100% - 7.7px),15.71% calc(100% - 4.5px),14.29% calc(100% - 3.1px),12.86% calc(100% - 1.2px),11.43% calc(100% - 2.5px),10.00% calc(100% - 1.8px),8.57% calc(100% - 0.1px),7.14% calc(100% - 16.3px),5.71% calc(100% - 16.3px),4.29% calc(100% - 0.0px),2.86% calc(100% - 0.1px),1.43% calc(100% - 5.0px),0.00% calc(100% - 13.8px));
}

/* Section headings with a "more" link on the right. */
.mw-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 30px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--rule);
}

.mw-head__title {
    margin: 4px 0 0;
    font-size: 40px;
    line-height: 1.05;
}

.mw-head--page {
    display: block;
    margin-bottom: 40px;
    padding-bottom: 22px;
    border-bottom: 3px double rgba(60, 40, 20, .55);
}

.mw-head--page .mw-head__title {
    font-size: 56px;
}

.mw-head__desc {
    max-width: 40em;
    margin: 12px 0 0;
    font-size: 20px;
    font-style: italic;
    line-height: 1.5;
    color: var(--ink-2);
}

.mw-head--author {
    display: flex;
    align-items: center;
    gap: 28px;
}

.mw-head__portrait {
    flex: none;
    width: 120px;
    height: 120px;
    object-fit: cover;
    border: 6px solid #f8efd9;
    border-radius: 50%;
    box-shadow: 0 6px 12px rgba(0, 0, 0, .35);
}

.mw-more {
    flex: none;
    font-family: var(--font-sc);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: .06em;
    color: var(--red);
    text-decoration: none;
}

.mw-more:hover {
    color: var(--link-hover);
    text-decoration: underline;
}

.mw-section + .mw-section {
    margin-top: 70px;
}

/* A dark-red rubber stamp: the floor a note came from. */
.mw-stamp {
    display: inline-block;
    padding: 3px 10px;
    font-family: var(--font-sc);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: .06em;
    color: #fbf1da;
    background: var(--red);
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}

a.mw-stamp--link {
    text-decoration: none;
}

a.mw-stamp--link:hover {
    color: #fff;
    background: #3f140b;
}

/* Paper pieces drawn from the photographed kit. The torn edges keep their size
   (border-image) while the middle stretches to fit the words. */
.mw-paper {
    position: relative;
    isolation: isolate;
}

.mw-note::before,
.mw-notice::before,
.mw-pager__link::before,
.mw-specimen__card::before,
.mw-comments::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border-style: solid;
    border-width: 22px;
    border-image: var(--paper) 48 fill stretch;
    filter: drop-shadow(3px 7px 7px rgba(0, 0, 0, .45));
}


/* 6. Home masthead
   ========================================================================== */

.mw-masthead {
    display: flex;
    align-items: center;
    gap: 36px;
    margin-bottom: 46px;
    padding-bottom: 34px;
    border-bottom: 3px double rgba(60, 40, 20, .55);
}

.mw-masthead__logo {
    flex: none;
    width: clamp(120px, 12vw - 10px, 168px);
    height: auto;
    aspect-ratio: 1;
    object-fit: contain;
    filter: drop-shadow(3px 5px 4px rgba(40, 25, 10, .45));
}

.mw-masthead__title {
    margin: 6px 0 0;
    font-size: clamp(60px, 7vw - 10px, 92px);
    line-height: 1;
    letter-spacing: .01em;
}

.mw-masthead__tagline {
    margin: 10px 0 0;
    font-family: var(--font-display);
    font-size: 26px;
    font-style: italic;
    color: var(--ink-2);
}


/* 7. Floors
   ========================================================================== */

/* 7.1 Torn notes: Newly shelved, the whole archive, tag and author pages */

.mw-notes {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 28px 26px;
}

.mw-note {
    position: relative;
    isolation: isolate;
    padding: 40px 36px 40px;
    --paper: url('../images/notice1.webp');
    transform: rotate(-.6deg);
}

.mw-note:nth-child(3n + 2) {
    --paper: url('../images/notice3.webp');
    transform: rotate(.5deg);
}

.mw-note:nth-child(3n) {
    --paper: url('../images/notice2.webp');
    transform: rotate(-.3deg);
}

.mw-note__meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
}

.mw-note__date {
    font-family: var(--font-sc);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--ink-2);
}

.mw-note__title {
    margin: 14px 0 8px;
    font-size: 25px;
    line-height: 1.15;
}

.mw-note__title a {
    color: var(--ink);
    text-decoration: none;
}

.mw-note:hover .mw-note__title a,
.mw-note__title a:focus-visible {
    text-decoration: underline;
}

.mw-note__excerpt {
    margin: 0;
    font-size: 17px;
    line-height: 1.5;
    color: var(--ink-2);
    text-shadow: 0 0 2px rgba(255, 240, 210, .55);
}

/* 7.2 Stories: paper tags hanging from the scroll shelf.
   Every row starts with a full shelf drawn behind it; each tag hangs under a cubby. */

.mw-shelf {
    --cols: 4;
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
    row-gap: 34px;
}

.mw-story {
    position: relative;
    /* Height of the shelf in front of this row, minus the part the tags overlap. */
    padding-top: calc(var(--cols) * 100% * 647 / 1508 * .84);
}

.mw-story:nth-child(4n + 1)::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: calc(var(--cols) * 100%);
    aspect-ratio: 1508 / 647;
    background: url('../images/shelf.webp') center / 100% 100% no-repeat;
    filter: drop-shadow(0 16px 18px rgba(0, 0, 0, .55));
    pointer-events: none;
}

.mw-story__tag {
    --r: -1.5deg;
    position: relative;
    z-index: 1;
    display: block;
    width: 112px;
    height: 213px;
    margin: 0 auto;
    color: var(--ink-hand);
    text-decoration: none;
    background: url('../images/tag.webp') center / 100% 100% no-repeat;
    filter: drop-shadow(2px 6px 5px rgba(0, 0, 0, .5));
    transform: translateX(var(--nudge, 0)) rotate(var(--r));
    transform-origin: 50% 4%;
    transition: transform .4s ease;
}

.mw-story:nth-child(4n + 1) .mw-story__tag { --nudge: 10px; }
.mw-story:nth-child(4n + 2) .mw-story__tag { --r: 2deg; --nudge: 6px; }
.mw-story:nth-child(4n + 3) .mw-story__tag { --r: -1deg; --nudge: -8px; }
.mw-story:nth-child(4n) .mw-story__tag { --r: 1.5deg; --nudge: -12px; }

.mw-story__tag:hover {
    color: var(--ink-hand);
    transform: translateX(var(--nudge, 0)) rotate(calc(var(--r) * -2.2));
}

.mw-story__tag:focus-visible {
    outline: 3px solid var(--link);
    outline-offset: 2px;
}

.mw-story__title {
    position: absolute;
    top: 58px;
    right: 10px;
    left: 13px;
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    font-family: var(--font-hand);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.12;
    color: var(--ink-hand);
    text-shadow: var(--halo);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
}

.mw-story__date {
    position: absolute;
    right: 10px;
    bottom: 20px;
    left: 13px;
    font-family: var(--font-hand);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--ink-hand);
    text-shadow: var(--halo);
}

/* 7.3 Funny Videos: film tins with the title on tape */

.mw-reels {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 40px 34px;
    justify-items: center;
}

.mw-reel {
    width: 100%;
    max-width: 280px;
}

.mw-reel__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--ink);
    text-decoration: none;
}

.mw-tin {
    position: relative;
    display: block;
    width: min(262px, 100%);
    aspect-ratio: 468 / 457;
    background: url('../images/tin1.webp') center / contain no-repeat;
    filter: drop-shadow(0 14px 14px rgba(0, 0, 0, .5));
    transform: rotate(-4deg);
    transition: transform .4s ease;
}

.mw-reel:nth-child(3n + 2) .mw-tin {
    aspect-ratio: 458 / 467;
    background-image: url('../images/tin2.webp');
    transform: rotate(3deg);
}

.mw-reel:nth-child(3n) .mw-tin {
    background-image: url('../images/tin3.webp');
    transform: rotate(8deg);
}

.mw-reel__link:hover .mw-tin {
    transform: rotate(0deg) scale(1.03);
}

.mw-tin__tape {
    position: absolute;
    text-shadow: var(--halo);
    top: 47%;
    right: 19%;
    left: 21%;
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    font-family: var(--font-hand);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.02;
    text-align: center;
    color: var(--ink-hand);
    transform: translateY(-50%);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.mw-reel__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    font-family: var(--font-sc);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--ink-2);
}

.mw-reel__play {
    flex: none;
    fill: var(--link);
}

.mw-reel__link:hover .mw-reel__meta {
    color: var(--link-hover);
    text-decoration: underline;
}

/* 7.4 Character Designs: index cards pinned up, the drawing on each */

.mw-specimens {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 34px 28px;
    padding-top: 6px;
}

.mw-specimen__card {
    --paper: url('../images/card1.webp');
    position: relative;
    isolation: isolate;
    display: block;
    height: 100%;
    padding: 64px 22px 24px;
    color: var(--ink);
    text-decoration: none;
    transform: rotate(-1.4deg);
    transition: transform .4s ease;
}

.mw-specimen__card::before {
    border-width: 64px 18px 18px;
    border-image-slice: 132 36 36 fill;
}

.mw-specimen:nth-child(3n + 2) .mw-specimen__card { --paper: url('../images/card2.webp'); transform: rotate(1deg); }
.mw-specimen:nth-child(3n) .mw-specimen__card { --paper: url('../images/card3.webp'); transform: rotate(-.5deg); }
.mw-specimen:nth-child(4n) .mw-specimen__card { transform: rotate(1.6deg); }

.mw-specimen__card:hover {
    color: var(--ink);
    transform: rotate(0deg) translateY(-3px);
}

/* A brass pin pushed through the card; each one at its own angle. */
.mw-specimen__pin {
    --pr: -24deg;
    position: absolute;
    top: 14px;
    left: 46%;
    z-index: 3;
    width: 32px;
    height: 30px;
    margin-left: -16px;
    background: url('../images/pinhead.webp') center / contain no-repeat;
    filter: drop-shadow(3px 5px 3px rgba(0, 0, 0, .5));
    transform: rotate(var(--pr));
}

.mw-specimen:nth-child(4n + 2) .mw-specimen__pin { --pr: 18deg; left: 55%; }
.mw-specimen:nth-child(4n + 3) .mw-specimen__pin { --pr: -8deg; left: 49%; }
.mw-specimen:nth-child(4n) .mw-specimen__pin { --pr: 30deg; left: 53%; }

.mw-specimen__art {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 180px;
    overflow: hidden;
}

/* Drawings on white paper blend into the card. */
.mw-specimen__art img {
    max-height: 100%;
    width: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
}

.mw-specimen__blank,
.mw-frame__blank {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 12px;
    font-family: var(--font-hand);
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    color: #4e3b25;
    background: repeating-linear-gradient(135deg, rgba(120, 90, 50, .1) 0 10px, transparent 10px 20px), rgba(231, 215, 178, .7);
    border: 1px dashed rgba(90, 64, 35, .6);
}

.mw-specimen__label {
    display: block;
    margin-top: 14px;
    font-family: var(--font-sc);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--red);
}

.mw-specimen__name {
    margin: 2px 0 0;
    font-size: 23px;
    line-height: 1.15;
}

.mw-specimen__card:hover .mw-specimen__name {
    text-decoration: underline;
    text-decoration-thickness: 1px;
}

/* 7.5 Artwork: gilded frames overgrown with ivy, each on its own little ledge */

.mw-gallery {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: center;
    gap: 44px 28px;
    padding-top: 8px;
}

.mw-art {
    max-width: 100%;
}

.mw-art__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--ink);
    text-decoration: none;
}

.mw-frame {
    position: relative;
    display: block;
    max-width: 100%;
    border: 34px solid transparent;
    border-image: url('../images/frame.webp') 200 round;
    background: #1e140b;
    background-clip: padding-box;
    filter: drop-shadow(6px 12px 12px rgba(0, 0, 0, .55));
    transform: rotate(-2deg);
    transition: transform .4s ease;
}

.mw-art:nth-child(3n + 2) .mw-frame { transform: rotate(.6deg); }
.mw-art:nth-child(3n) .mw-frame { transform: rotate(2.4deg); }

.mw-art__link:hover .mw-frame {
    transform: rotate(0deg);
}

.mw-frame img {
    display: block;
    width: auto;
    max-width: min(100%, 420px);
    height: 190px;
    object-fit: cover;
}

.mw-frame__blank {
    width: 170px;
    height: 190px;
}

/* On a floor's own page the frames can be larger. */
.mw-sheet--section .mw-frame img {
    height: 250px;
}

.mw-sheet--section .mw-frame__blank {
    width: 210px;
    height: 250px;
}

/* The ledge the frame rests on. */
.mw-art__link::after {
    content: "";
    order: 2;
    display: block;
    width: calc(100% + 24px);
    height: 12px;
    margin-top: -6px;
    background: linear-gradient(180deg, #6b4627, #3b2412 60%, #241508);
    border-radius: 2px;
    box-shadow: 0 6px 8px rgba(0, 0, 0, .45);
}

.mw-art__caption {
    order: 3;
    max-width: 280px;
    margin: 14px 0 0;
    font-family: var(--font-hand);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    color: var(--ink-hand);
}

.mw-art__link:hover .mw-art__caption {
    text-decoration: underline;
}

/* 7.6 Updates: notices nailed to an old wooden board */

.mw-board {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 30px;
    padding: 40px 34px 44px;
    background: #3a2615 url('../images/wood.webp') 0 0 / 420px;
    border-radius: 4px;
    box-shadow: inset 0 0 40px rgba(0, 0, 0, .65), 0 10px 18px rgba(0, 0, 0, .45);
}

.mw-notice {
    --paper: url('../images/notice2.webp');
    position: relative;
    isolation: isolate;
    padding: 46px 34px 36px;
    transform: rotate(-1.5deg);
}

.mw-notice:nth-child(3n + 2) {
    --paper: url('../images/notice3.webp');
    transform: rotate(1deg);
}

.mw-notice:nth-child(3n) {
    --paper: url('../images/notice1.webp');
    transform: rotate(-.6deg);
}

.mw-notice__nail {
    position: absolute;
    top: 6px;
    left: 50%;
    z-index: 3;
    width: 34px;
    height: 22px;
    margin-left: -17px;
    background: url('../images/nail.webp') center / contain no-repeat;
    filter: drop-shadow(1px 2px 2px rgba(0, 0, 0, .6));
}

.mw-notice__date {
    font-family: var(--font-sc);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .04em;
    color: var(--red);
}

.mw-notice__title {
    margin: 6px 0;
    font-size: 23px;
    line-height: 1.15;
}

.mw-notice__title a {
    color: var(--ink);
    text-decoration: none;
}

.mw-notice:hover .mw-notice__title a,
.mw-notice__title a:focus-visible {
    text-decoration: underline;
}

.mw-notice__excerpt {
    margin: 0;
    font-size: 17px;
    line-height: 1.45;
    color: var(--ink-2);
    text-shadow: 0 0 2px rgba(255, 240, 210, .55);
}


/* 8. Post: the scroll
   ========================================================================== */

.mw-scroll {
    --rod: min(1000px, 100%);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.mw-scroll__rod {
    position: relative;
    z-index: 1;
    flex: none;
    width: var(--rod);
    aspect-ratio: 1464 / 207;
    background: url('../images/rod.webp') center / 100% 100% no-repeat;
    filter: drop-shadow(0 8px 8px rgba(0, 0, 0, .55));
}

/* The unrolled parchment, tucked between the rods' end caps. */
.mw-scroll__sheet {
    width: calc(var(--rod) * .64);
    margin: calc(var(--rod) * -.0707) 0;
    padding: calc(var(--rod) * .0707 + 40px) 52px calc(var(--rod) * .0707 + 44px);
    background: #ead8b0 var(--paper-aged) 0 0 / 720px;
    box-shadow:
        inset 0 18px 22px -14px rgba(60, 35, 10, .55),
        inset 0 -18px 22px -14px rgba(60, 35, 10, .55),
        inset 14px 0 18px -14px rgba(60, 35, 10, .4),
        inset -14px 0 18px -14px rgba(60, 35, 10, .4);
}

.mw-scroll__head {
    text-align: center;
}

.mw-scroll__head .mw-kicker {
    font-size: 20px;
    letter-spacing: .16em;
}

.mw-scroll__title {
    margin: 14px 0 0;
    font-size: 50px;
    line-height: 1.05;
    overflow-wrap: break-word;
}

.mw-scroll__meta {
    margin: 16px 0 0;
    font-family: var(--font-sc);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: .03em;
    color: var(--ink-3);
}

.mw-flourish {
    width: 220px;
    height: 14px;
    margin: 30px auto 34px;
    background:
        radial-gradient(circle, var(--link) 0 3px, transparent 4px) center / 14px 14px no-repeat,
        linear-gradient(#5b4630, #5b4630) center / 100% 1px no-repeat;
}

.mw-lede {
    margin: 0 0 1.4em;
    font-family: var(--font-display);
    font-size: 22px;
    font-style: italic;
    line-height: 1.5;
    color: var(--ink-2);
}

/* Feature images: tipped in like an old photo, pinned to a card, or framed. */
.mw-feature {
    margin: 0 0 2em;
    text-align: center;
}

.mw-feature figcaption,
.mw-prose figcaption {
    margin-top: 12px;
    font-family: var(--font-hand);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    color: var(--ink-2);
}

.mw-photo {
    display: inline-block;
    padding: 10px 10px 14px;
    background: #f6ecd3 var(--paper-light) 0 0 / 520px;
    box-shadow: 0 8px 16px rgba(40, 22, 8, .4);
    transform: rotate(-.8deg);
}

.mw-photo img {
    display: block;
}

.mw-pinned {
    position: relative;
    display: inline-block;
    padding: 36px 16px 18px;
    background: #f2e6c8 var(--paper-light) 0 0 / 520px;
    box-shadow: 0 8px 16px rgba(40, 22, 8, .4);
    transform: rotate(1deg);
}

.mw-pinned img {
    display: block;
    max-height: 70vh;
    width: auto;
    mix-blend-mode: multiply;
}

.mw-pinned .mw-specimen__pin {
    top: 6px;
    left: 50%;
}

.mw-frame--large {
    display: inline-block;
    transform: rotate(-.6deg);
}

.mw-frame--large img {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 72vh;
    object-fit: contain;
}

.mw-feature--side {
    float: right;
    width: min(300px, 42%);
    margin: 0 0 24px 32px;
}

/* 8.1 Prose */

.mw-prose {
    font-size: 21px;
    line-height: 1.7;
    color: var(--ink);
    overflow-wrap: break-word;
}

.mw-prose > * {
    margin-top: 0;
    margin-bottom: 0;
}

.mw-prose figure {
    margin-right: 0;
    margin-left: 0;
}

.mw-prose > * + * {
    margin-top: 1em;
}

.mw-prose > h2,
.mw-prose > h3,
.mw-prose > h4 {
    margin-top: 1.6em;
}

.mw-prose > h2 + *,
.mw-prose > h3 + *,
.mw-prose > h4 + * {
    margin-top: .5em;
}

.mw-prose h1 { font-size: 40px; }
.mw-prose h2 { font-size: 34px; }
.mw-prose h3 { font-size: 28px; }
.mw-prose h4 { font-size: 23px; }

.mw-prose h5,
.mw-prose h6 {
    font-family: var(--font-sc);
    font-size: 19px;
    font-weight: 700;
    letter-spacing: .08em;
    color: var(--red);
}

.mw-prose a {
    color: var(--link);
}

.mw-prose strong {
    font-weight: 700;
}

.mw-prose ul,
.mw-prose ol {
    padding-left: 1.3em;
}

.mw-prose li + li {
    margin-top: .35em;
}

.mw-prose li::marker {
    color: var(--link);
}

.mw-prose blockquote {
    margin-left: 0;
    padding: .1em 0 .1em 1em;
    font-style: italic;
    color: var(--ink-2);
    border-left: 3px solid var(--link);
}

.mw-prose blockquote.kg-blockquote-alt {
    padding: 0 1em;
    font-size: 1.25em;
    text-align: center;
    border-left: 0;
}

.mw-prose hr {
    height: 14px;
    margin: 2em auto;
    border: 0;
    background:
        radial-gradient(circle, var(--link) 0 3px, transparent 4px) center / 14px 14px no-repeat,
        linear-gradient(#5b4630, #5b4630) center / 60% 1px no-repeat;
}

.mw-prose code {
    padding: .1em .35em;
    font-family: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
    font-size: .8em;
    background: rgba(60, 40, 20, .1);
    border-radius: 3px;
}

.mw-prose pre {
    padding: 16px 18px;
    overflow-x: auto;
    font-size: 16px;
    line-height: 1.5;
    color: var(--cream);
    background: var(--plaque-bg);
    border-radius: 4px;
}

.mw-prose pre code {
    padding: 0;
    font-size: 1em;
    background: none;
}

.mw-prose table {
    width: 100%;
    border-collapse: collapse;
    font-size: 18px;
}

.mw-prose th,
.mw-prose td {
    padding: 8px 10px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--rule);
}

.mw-prose th {
    font-family: var(--font-sc);
    color: var(--red);
}

/* Stories open with a large first letter. */
.mw-floor-stories .mw-prose > p:first-child::first-letter {
    float: left;
    margin: 8px 12px 0 0;
    font-family: var(--font-display);
    font-size: 84px;
    line-height: .8;
    color: var(--link);
}

/* 8.2 Editor cards */

.kg-width-wide,
.mw-prose > .kg-width-wide {
    margin-right: -36px;
    margin-left: -36px;
}

.kg-width-full,
.mw-prose > .kg-width-full {
    margin-right: -52px;
    margin-left: -52px;
}

.mw-prose .kg-card + *,
.mw-prose * + .kg-card {
    margin-top: 1.6em;
}

.mw-prose .kg-image-card img,
.mw-prose .kg-gallery-image img {
    display: block;
    margin: 0 auto;
}

/* Pictures in a post are tipped in on a cream mat. */
.mw-prose .kg-image-card:not(.kg-width-full) img {
    padding: 8px 8px 12px;
    background: #f6ecd3 var(--paper-light) 0 0 / 520px;
    box-shadow: 0 6px 14px rgba(40, 22, 8, .38);
}

.mw-prose .kg-width-full img {
    width: 100%;
}

.mw-prose .kg-gallery-image img {
    padding: 5px;
    background: #f6ecd3;
    box-shadow: 0 4px 10px rgba(40, 22, 8, .35);
}

/* Videos and other embeds sit in a dark viewer. */
.mw-prose .kg-embed-card {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.mw-prose .kg-embed-card iframe,
.mw-prose .kg-video-card {
    display: block;
    max-width: 100%;
    background: #120b06;
    border: 6px solid #2b1e12;
    border-radius: 6px;
    box-shadow: 0 0 0 1px rgba(255, 214, 140, .3), 0 10px 20px rgba(30, 16, 6, .5);
}

.mw-prose .kg-video-card .kg-video-container,
.mw-prose .kg-video-card video {
    border-radius: 2px;
}

.mw-prose .kg-bookmark-card,
.mw-prose .kg-bookmark-card .kg-bookmark-container {
    width: 100%;
}

.mw-prose .kg-bookmark-card a.kg-bookmark-container,
.mw-prose .kg-bookmark-card .kg-bookmark-container {
    color: var(--ink);
    text-decoration: none;
    background: #f6ecd3 var(--paper-light) 0 0 / 520px;
    border: 1px solid rgba(60, 40, 20, .35);
    border-radius: 4px;
    box-shadow: 0 6px 12px rgba(40, 22, 8, .3);
}

.mw-prose .kg-bookmark-title {
    font-family: var(--font-display);
    font-size: 20px;
    color: var(--ink);
}

.mw-prose .kg-bookmark-description,
.mw-prose .kg-bookmark-metadata,
.mw-prose .kg-file-card-caption,
.mw-prose .kg-file-card-metadata,
.mw-prose .kg-product-card-description {
    font-size: 16px;
    color: var(--ink-2);
    opacity: 1;
}

.mw-prose .kg-bookmark-metadata > *:not(img),
.mw-prose .kg-file-card-filesize {
    opacity: 1;
}

.mw-prose .kg-callout-card {
    position: relative;
    padding: 1.1em 1.3em;
    color: var(--ink);
    background: #f6ecd3 var(--paper-light) 0 0 / 520px;
    border-radius: 3px;
    box-shadow: 0 6px 12px rgba(40, 22, 8, .3);
}

.mw-prose .kg-callout-card::before {
    content: "";
    position: absolute;
    top: -11px;
    left: 50%;
    width: 90px;
    height: 22px;
    background: rgba(214, 190, 140, .9);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .25);
    transform: translateX(-50%) rotate(-2deg);
}

.mw-prose .kg-callout-text {
    font-size: 19px;
    line-height: 1.6;
}

.mw-prose .kg-toggle-card {
    background: #f6ecd3 var(--paper-light) 0 0 / 520px;
    border: 1px solid rgba(60, 40, 20, .35);
    border-radius: 4px;
}

.mw-prose .kg-toggle-heading-text {
    font-family: var(--font-display);
    font-size: 22px;
}

.mw-prose .kg-button-card .kg-btn,
.mw-prose .kg-product-card .kg-product-card-button,
.mw-prose .kg-header-card .kg-header-card-button {
    min-height: 44px;
    padding: .6em 1.3em;
    font-family: var(--font-sc);
    font-size: 18px;
    letter-spacing: .06em;
    color: var(--cream);
    background: var(--plaque-bg);
    border-radius: 4px;
    box-shadow: var(--plaque-ring);
}

.mw-prose .kg-button-card .kg-btn:hover {
    color: var(--gold);
    box-shadow: var(--plaque-glow);
}

.mw-prose .kg-audio-card,
.mw-prose .kg-file-card .kg-file-card-container,
.mw-prose .kg-product-card .kg-product-card-container {
    color: var(--ink);
    background: #f6ecd3 var(--paper-light) 0 0 / 520px;
    border: 1px solid rgba(60, 40, 20, .35);
    border-radius: 4px;
    box-shadow: 0 6px 12px rgba(40, 22, 8, .3);
}

.mw-prose .kg-audio-title,
.mw-prose .kg-file-card-title,
.mw-prose .kg-product-card-title {
    font-family: var(--font-display);
    color: var(--ink);
}

.mw-prose .kg-audio-current-time,
.mw-prose .kg-audio-time {
    color: var(--ink-2);
}

.mw-prose .kg-audio-player-container input[type='range']:focus-visible {
    outline: 3px solid var(--link);
    outline-offset: 4px;
}

.mw-prose .kg-header-card,
.mw-prose .kg-signup-card,
.mw-prose .kg-cta-card {
    border-radius: 4px;
}

/* 8.3 The foot of the scroll */

.mw-seal {
    clear: both;
    width: 96px;
    height: 96px;
    margin: 34px auto 0;
    background: url('../images/seal.webp') center / contain no-repeat;
    filter: drop-shadow(2px 4px 4px rgba(0, 0, 0, .45));
}

.mw-also {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 26px 0 0;
}

.mw-also__label {
    font-family: var(--font-sc);
    font-size: 16px;
    font-weight: 700;
    color: var(--ink-2);
}

/* 8.4 Older and newer, on torn notices */

.mw-pager {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px;
    width: min(860px, 100%);
    margin: 48px auto 0;
}

.mw-pager:not(:has(a)) {
    display: none;
}

.mw-pager__link {
    --paper: url('../images/notice1.webp');
    position: relative;
    isolation: isolate;
    flex: 1 1 280px;
    max-width: 420px;
    padding: 34px 40px 36px;
    color: var(--ink);
    text-decoration: none;
    transform: rotate(-1deg);
}

.mw-pager__link--newer {
    --paper: url('../images/notice3.webp');
    text-align: right;
    transform: rotate(.8deg);
}

.mw-pager__link:hover {
    color: var(--ink);
}

.mw-pager__dir {
    display: block;
    font-family: var(--font-sc);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .04em;
    color: #4a160b;
    text-shadow: var(--halo);
}

.mw-pager__title {
    display: block;
    margin-top: 4px;
    font-family: var(--font-hand);
    font-size: 21px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--ink-hand);
    text-shadow: var(--halo);
}

.mw-pager__link:hover .mw-pager__title {
    text-decoration: underline;
}

/* 8.5 Comments (Comentario) on a lined ledger page */

.mw-comments {
    --paper: url('../images/ledger.webp');
    position: relative;
    isolation: isolate;
    width: min(860px, 100%);
    margin: 44px auto 0;
    padding: 48px 56px 52px 124px;
}

.mw-comments::before {
    border-width: 26px 26px 26px 100px;
    border-image-slice: 36 36 36 140 fill;
}

.mw-comments__title {
    margin: 0;
    font-size: 32px;
}

.mw-comments__note {
    margin: 6px 0 18px;
    font-size: 18px;
    color: var(--ink-2);
}

.mw-comments comentario-comments {
    --cmntr-bg: transparent;
    --cmntr-bg-shade: rgba(60, 40, 20, .07);
    --cmntr-color: var(--ink);
    --cmntr-input-bg: rgba(255, 250, 238, .85);
    --cmntr-input-color: var(--ink);
    --cmntr-input-ph-color: #6d5534;
    --cmntr-label-color: var(--ink-2);
    --cmntr-link-color: var(--link);
    --cmntr-link-hover-color: var(--link-hover);
    --cmntr-muted-color: #4e3b25;
    --cmntr-card-border: rgba(60, 40, 20, .25);
    --cmntr-dlg-border: var(--ink);
    --cmntr-table-border: rgba(60, 40, 20, .25);
    display: block;
    font-family: var(--font-body);
}

.mw-comments .comentario-root {
    font-family: var(--font-body);
    font-size: 18px;
}

.mw-comments .comentario-root textarea {
    font-family: var(--font-body);
    border: 1px solid #8c7350;
    border-radius: 3px;
}


/* 9. Pages
   ========================================================================== */

/* 9.1 A standalone page, such as About */

.mw-sheet--page .mw-prose,
.mw-page-head {
    max-width: 700px;
}

.mw-sheet--page::after {
    content: "";
    display: table;
    clear: both;
}

.mw-page-head {
    margin-bottom: 34px;
    padding-bottom: 22px;
    border-bottom: 3px double rgba(60, 40, 20, .55);
}

.mw-page-head__title {
    margin: 6px 0 0;
    font-size: 56px;
    line-height: 1.05;
}

.mw-page-head .mw-lede {
    margin: 14px 0 0;
}

/* 9.2 The Links page: a front door with paper tags hanging from a rod. */

.page-links .mw-lift {
    display: none;
}

.page-links .mw-shell {
    justify-content: center;
    padding-top: clamp(40px, 8vh, 80px);
}

.page-links .mw-column {
    max-width: 1100px;
}

.mw-links {
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow-x: clip;
    text-align: center;
}

.mw-links__logo {
    width: 190px;
    height: 190px;
    object-fit: contain;
    filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .6));
}

.mw-links__title {
    margin: 10px 0 0;
    font-size: 76px;
    line-height: 1;
    color: var(--cream);
    text-shadow: 0 3px 10px rgba(0, 0, 0, .7);
}

.mw-links__tagline {
    max-width: 34em;
    margin: 10px 0 0;
    font-family: var(--font-display);
    font-size: 24px;
    font-style: italic;
    color: var(--cream-2);
    text-shadow: 0 2px 6px rgba(0, 0, 0, .8);
}

.mw-links__rail {
    position: relative;
    width: min(900px, 100%);
    aspect-ratio: 1464 / 207;
    margin-top: 46px;
    background: url('../images/rod.webp') center / 100% 100% no-repeat;
    filter: drop-shadow(0 10px 10px rgba(0, 0, 0, .6));
}

.mw-links__rail::after {
    content: "";
    position: absolute;
    top: -46%;
    right: 1%;
    width: 13%;
    aspect-ratio: 1;
    background: url('../images/moss.webp') center / contain no-repeat;
}

.mw-links__body {
    width: min(900px, 100%);
}

.mw-links__body > p,
.mw-links__body > h2,
.mw-links__body > h3,
.mw-links__body > h4 {
    max-width: 36em;
    margin: 1.2em auto 0;
    color: var(--cream);
    text-shadow: 0 2px 6px rgba(0, 0, 0, .8);
}

.mw-links__body > p {
    font-size: 20px;
}

.mw-links__body > h2,
.mw-links__body > h3,
.mw-links__body > h4 {
    font-family: var(--font-sc);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .3em;
    color: #e8d3a2;
}

.mw-links__body > p a {
    color: var(--gold);
}

/* Each bullet is a tag on a string. */
.mw-links__body ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 34px 30px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.mw-links__rail + .mw-links__body > ul:first-child {
    margin-top: calc(min(900px, 100%) * -.075);
}

.mw-links__body li {
    --r: -4deg;
    position: relative;
    width: 132px;
    min-height: 285px;
    padding: 108px 14px 24px 18px;
    font-family: var(--font-hand);
    font-size: 21px;
    font-weight: 700;
    line-height: 1.15;
    text-align: left;
    color: var(--ink-hand);
    text-shadow: var(--halo);
    background: url('../images/tag.webp') 0 34px / 132px 251px no-repeat;
    filter: drop-shadow(3px 8px 6px rgba(0, 0, 0, .6));
    transform: rotate(var(--r));
    transform-origin: 50% 0;
    transition: transform .4s ease;
}

.mw-links__body li:nth-child(4n + 2) { --r: 3deg; }
.mw-links__body li:nth-child(4n + 3) { --r: -2deg; }
.mw-links__body li:nth-child(4n) { --r: 5deg; }

.mw-links__body li:hover {
    transform: rotate(calc(var(--r) * -1.5));
}

/* The string. */
.mw-links__body li::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 2px;
    height: 48px;
    margin-left: -1px;
    background: linear-gradient(#cdb48a, #8c7350);
}

.mw-links__body li strong {
    display: block;
    margin-bottom: 6px;
    font-family: var(--font-sc);
    font-size: 17px;
    font-weight: 700;
    letter-spacing: .02em;
    color: #4a160b;
}

.mw-links__body li a {
    color: var(--ink-hand);
    text-decoration: none;
}

.mw-links__body li a::after {
    content: "";
    position: absolute;
    inset: 34px 0 0;
}

.mw-links__body li a:focus-visible {
    outline: none;
}

.mw-links__body li:has(a:focus-visible) {
    outline: 3px solid var(--gold);
    outline-offset: 4px;
}

.mw-links__body li:hover a {
    text-decoration: underline;
}

.mw-links__enter {
    margin: 56px 0 0;
}

/* 9.3 Brass push-button links: pagination, links page, errors */

.mw-pagebtn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    color: var(--cream);
    text-decoration: none;
}

.mw-pagebtn .mw-plaque {
    flex: none;
    padding: 7px 14px;
}

.mw-pagebtn:hover .mw-plaque {
    color: var(--gold);
    box-shadow: var(--plaque-glow);
}

.mw-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 16px 24px;
    margin-top: 56px;
}

.mw-pagination__count {
    font-family: var(--font-sc);
    font-size: 17px;
    font-weight: 700;
    color: var(--ink-2);
}

/* 9.4 Empty floors and errors */

.mw-empty {
    padding: 40px 0 20px;
    text-align: center;
}

.mw-empty__line {
    margin: 0;
    font-family: var(--font-display);
    font-size: 30px;
    font-style: italic;
}

.mw-empty__hint {
    margin: 8px 0 0;
    font-size: 19px;
    color: var(--ink-2);
}

.mw-sheet--error {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
}

.mw-error__title {
    margin: 8px 0 0;
    font-size: 56px;
}

.mw-error__text {
    margin: 18px 0 0;
    font-size: 21px;
    color: var(--ink-2);
}


/* 10. Footer: the brass name plate
   ========================================================================== */

.mw-footer {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 20px;
    margin-top: 40px;
    padding: 24px 86px;
}

.mw-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border-style: solid;
    border-width: 18px 58px;
    border-image: url('../images/brassbar.webp') 52 170 fill stretch;
    filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .55));
}

.mw-footer p {
    margin: 0;
}

.mw-footer .mw-plaque {
    display: inline-flex;
    flex: none;
    padding: 5px 12px;
    font-size: 16px;
    letter-spacing: .06em;
    text-decoration: none;
}

.mw-footer a.mw-plaque:hover {
    color: var(--gold);
    box-shadow: var(--plaque-glow);
}


/* 11. Medium screens: the lift folds into a brass bar at the top
   ========================================================================== */

@media (max-width: 1099px) {
    .mw-shell {
        display: block;
        padding: 10px 24px 32px;
    }

    .mw-column {
        max-width: none;
        margin-top: clamp(120px, 26vh, 260px);
    }

    .page-links .mw-column {
        margin-top: 0;
    }

    .mw-lift {
        position: sticky;
        top: 8px;
        z-index: 30;
        width: auto;
        padding: 10px 14px;
        border-radius: 6px;
        filter: drop-shadow(0 12px 16px rgba(0, 0, 0, .65));
    }

    .mw-lift::before {
        background: url('../images/plate.webp') center 40% / 140% auto no-repeat;
        border-radius: 6px;
        box-shadow: inset 0 0 0 2px rgba(40, 25, 10, .6);
    }

    .mw-lift__vine,
    .mw-lift__moss,
    .mw-lift__sign,
    .mw-dial__num,
    .mw-now__label {
        display: none;
    }

    .mw-lift__head {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    /* A small copy of the dial, needle and all. */
    .mw-dial {
        flex: none;
        margin: 0 -152px -95px 0;
        transform: scale(.356);
        transform-origin: 0 0;
    }

    .mw-lift__head .mw-dial {
        align-self: flex-start;
    }

    .mw-now {
        display: block;
        flex: 0 1 auto;
        min-width: 0;
        margin: 0;
        padding: 6px 11px;
        font-size: 16px;
        line-height: 1.15;
        letter-spacing: .02em;
        box-shadow: var(--plaque-ring);
    }

    .js .mw-lift__toggle:not([hidden]) {
        display: flex;
        align-items: center;
        gap: 6px;
        min-height: 44px;
        margin-left: auto;
        padding: 0;
        color: var(--cream);
        background: transparent;
        border: 0;
        cursor: pointer;
    }

    .mw-lift__toggle .mw-button-light {
        width: 38px;
        height: 38px;
    }

    .mw-lift__toggle .mw-plaque {
        flex: none;
        font-size: 16px;
    }

    .mw-lift__panel {
        max-height: calc(100vh - 110px);
        margin-top: 12px;
        padding: 4px 2px 6px;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .js .mw-lift:not(.is-open) .mw-lift__panel {
        display: none;
    }

    .mw-floors--extra {
        margin-top: 26px;
    }
}


/* 12. Phones
   ========================================================================== */

@media (max-width: 699px) {
    :root {
        --sheet-pad: 22px;
    }

    body {
        font-size: 18px;
    }

    .mw-backdrop {
        height: max(100vh, 760px);
        background-image: var(--mw-photo-phone);
        background-position: 72% 50%;
    }

    .mw-motes {
        height: max(100vh, 760px);
    }

    .mw-shell {
        padding: 10px 12px 24px;
    }

    .mw-column {
        margin-top: clamp(140px, 30vh, 270px);
    }

    .mw-sheet {
        padding-top: 34px;
        padding-bottom: 40px;
    }

    .mw-masthead {
        flex-direction: column;
        gap: 6px;
        margin-bottom: 30px;
        padding-bottom: 22px;
        text-align: center;
    }

    .mw-masthead__logo {
        width: 104px;
    }

    .mw-masthead__title {
        font-size: 52px;
    }

    .mw-masthead__tagline {
        font-size: 19px;
    }

    .mw-kicker {
        font-size: 16px;
    }

    .mw-head {
        display: block;
        margin-bottom: 24px;
    }

    .mw-head__title {
        font-size: 32px;
    }

    .mw-head--page .mw-head__title,
    .mw-page-head__title,
    .mw-error__title {
        font-size: 40px;
    }

    .mw-head__desc {
        font-size: 18px;
    }

    .mw-head--author {
        display: block;
    }

    .mw-head__portrait {
        width: 96px;
        height: 96px;
        margin-bottom: 12px;
    }

    .mw-more {
        display: inline-block;
        margin-top: 8px;
        font-size: 17px;
    }

    .mw-section + .mw-section {
        margin-top: 48px;
    }

    .mw-notes {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
    }

    .mw-note {
        padding: 30px 34px 34px;
    }

    .mw-note__title {
        font-size: 23px;
    }

    /* Two tags under each shelf on a phone. */
    .mw-shelf {
        --cols: 2;
        row-gap: 26px;
    }

    .mw-story:nth-child(4n + 1)::before {
        filter: drop-shadow(0 10px 12px rgba(0, 0, 0, .55));
    }

    .mw-story:nth-child(4n + 3),
    .mw-story:nth-child(4n) {
        padding-top: 0;
    }

    .mw-story .mw-story__tag {
        --nudge: 0px;
        width: 128px;
        height: 243px;
    }

    .mw-story__title {
        top: 66px;
        right: 12px;
        left: 15px;
        font-size: 18px;
    }

    .mw-story__date {
        right: 12px;
        bottom: 18px;
        left: 15px;
        font-size: 16px;
    }

    .mw-reels {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
    }

    .mw-tin {
        width: min(230px, 100%);
    }

    .mw-tin__tape {
        font-size: 15px;
    }

    .mw-specimens {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 26px 14px;
    }

    .mw-specimen__card {
        padding: 54px 14px 18px;
    }

    .mw-specimen__card::before {
        border-width: 54px 14px 14px;
    }

    .mw-specimen__art {
        height: 130px;
    }

    .mw-specimen__label {
        font-size: 13px;
    }

    .mw-specimen__name {
        font-size: 19px;
    }

    .mw-gallery {
        gap: 34px;
    }

    .mw-frame {
        border-width: 26px;
    }

    .mw-frame img {
        height: 190px;
    }

    .mw-board {
        grid-template-columns: minmax(0, 1fr);
        gap: 22px;
        padding: 26px 18px 30px;
    }

    /* The scroll: the rods run off both edges of the screen so the parchment can use the full width. */
    .mw-scroll {
        --rod: 122%;
        margin: 0 -12px;
        overflow-x: clip;
    }

    /* The parchment sits between the end caps, which peek in at the screen edges. */
    .mw-scroll__sheet {
        width: 79%;
        margin: calc(122% * -.0707) 0;
        padding: calc(122% * .0707 + 24px) 18px calc(122% * .0707 + 30px);
    }

    .mw-scroll__head .mw-kicker {
        font-size: 16px;
    }

    .mw-scroll__title {
        font-size: 36px;
    }

    .mw-scroll__meta {
        font-size: 16px;
    }

    .mw-flourish {
        margin: 22px auto 26px;
    }

    .mw-prose {
        font-size: 19px;
        line-height: 1.65;
    }

    .mw-prose h2 { font-size: 28px; }
    .mw-prose h3 { font-size: 24px; }

    .kg-width-wide,
    .mw-prose > .kg-width-wide,
    .kg-width-full,
    .mw-prose > .kg-width-full {
        margin-right: -20px;
        margin-left: -20px;
    }

    .mw-floor-stories .mw-prose > p:first-child::first-letter {
        font-size: 64px;
    }

    .mw-feature--side {
        float: none;
        width: auto;
        margin: 0 0 24px;
    }

    .mw-pager {
        gap: 20px;
        margin-top: 34px;
    }

    .mw-pager__link {
        padding: 26px 28px 28px;
    }

    .mw-comments {
        margin-top: 30px;
        padding: 34px 26px 36px 66px;
    }

    .mw-comments::before {
        border-width: 18px 18px 18px 52px;
    }

    .mw-comments__title {
        font-size: 26px;
    }

    .mw-links__logo {
        width: 130px;
        height: 130px;
    }

    .mw-links__title {
        font-size: 50px;
    }

    .mw-links__tagline {
        font-size: 20px;
    }

    .mw-links__rail {
        width: 112%;
        margin-top: 34px;
    }

    .mw-links__body ul {
        gap: 26px 18px;
    }

    .mw-links__body li {
        width: 128px;
    }

    .mw-footer {
        flex-direction: column;
        justify-content: center;
        padding: 22px 50px;
        text-align: center;
    }

    .mw-footer::before {
        border-width: 14px 40px;
    }

    .mw-footer .mw-plaque {
        justify-content: center;
        font-size: 15px;
    }
}


/* Very narrow phones: the mini dial steps aside to make room for the floor name. */
@media (max-width: 379px) {
    .mw-lift__head .mw-dial {
        display: none;
    }
}


/* 13. Motion and print
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    .mw-motes span {
        opacity: .6;
        animation: none;
    }

    .mw-dial__needle,
    .mw-story__tag,
    .mw-tin,
    .mw-specimen__card,
    .mw-frame,
    .mw-links__body li {
        transition: none;
    }
}

@media print {
    body {
        color: #000;
        background: #fff;
    }

    .mw-backdrop,
    .mw-motes,
    .mw-lift,
    .mw-footer,
    .mw-pager,
    .mw-comments,
    .mw-scroll__rod,
    .mw-seal {
        display: none;
    }

    .mw-shell {
        display: block;
        padding: 0;
    }

    .mw-column {
        margin: 0;
    }

    .mw-sheet,
    .mw-scroll__sheet {
        width: auto;
        margin: 0;
        padding: 0;
        background: none;
        box-shadow: none;
        filter: none;
    }

    .mw-sheet::before {
        display: none;
    }
}