@charset "UTF-8";  /*************//* VARIABLES *//*************/ :root {    /*  Does not get inverted, so should not be in colors.css.     */    --GW-iframe-background-color: #fff;     --GW-sidenotes-max-width: 550px;     --GW-popups-popup-max-width: 640px;    --GW-popups-popup-max-height: 480px;    --GW-popups-popup-with-footer-min-width: 480px;    --GW-popups-popup-with-footer-max-height: 540px;    --GW-popups-popup-with-full-title-bar-min-width: 360px;    --GW-popups-popup-with-full-title-bar-min-height: 120px;    --GW-popups-annotation-popup-min-width: 480px;    --GW-popups-annotation-popup-min-height: 120px;    --GW-popups-wikipedia-entry-popup-min-width: 480px;    --GW-popups-wikipedia-entry-popup-min-height: 120px;    --GW-popups-tweet-popup-min-height: 120px;    --GW-popups-tweet-avatar-size: 75px;    --GW-popups-aux-links-popup-min-width: 360px;    --GW-popups-aux-links-popup-min-height: 120px;    --GW-popups-local-page-popup-min-width: 360px;    --GW-popups-local-page-popup-min-height: 120px;    --GW-popups-popup-border-width: 3px;    --GW-popups-popup-title-bar-height: calc(1.5rem + 1px);    --GW-popups-popup-mini-title-bar-height: calc(1rem + 1px);    --GW-popups-video-popup-min-width: 360px;    --GW-popups-video-popup-min-height: 204px;    --GW-popups-video-youtube-iframe-width: 495px;    --GW-popups-video-youtube-iframe-height: 310px;    --GW-popups-video-vimeo-iframe-width: 495px;    --GW-popups-video-vimeo-iframe-height: 278px;    --GW-popups-audio-popup-min-width: 360px;    --GW-popups-audio-popup-min-height: 87px;    --GW-popups-image-popup-min-size: 70px;     --GW-popins-popin-max-height: 75vh;    --GW-popins-popin-min-height: 120px;    --GW-popins-popin-border-width: 3px;    --GW-popins-popin-title-bar-height: calc(1rem * 16/9);    --GW-popins-popin-footer-bar-height: calc(1rem * 16/9);     --GW-page-toolbar-minimum-width: 46px;    --GW-page-toolbar-collapse-duration: 0.25s;    --GW-page-toolbar-slow-collapse-duration: 1s;    --GW-page-toolbar-fade-after-collapse-duration: 0.25s;    --GW-page-toolbar-widget-flash-rise-duration: 1s;    --GW-page-toolbar-widget-flash-fall-duration: 1s;    --GW-page-toolbar-widget-flash-filter: invert(0.7) brightness(1.5) contrast(1.5);    --GW-page-toolbar-widget-flash-filter-inverse: invert(0.7) brightness(1.33) contrast(1.33);     --GW-floating-header-scroll-indicator-thickness: 3px;     --GW-search-iframe-height: 128px;}@supports (-moz-appearance: none) {    :root {        --GW-popups-audio-popup-min-height: 75px;    }}  /********************//* GENERIC ELEMENTS *//********************/ button {    appearance: none;    border: none;    background-color: transparent;    line-height: 1;    font-family: var(--GW-sans-serif-font-stack);    font-size: inherit;    font-weight: normal;    font-style: normal;    text-align: center;    color: inherit;    display: flex;    align-items: stretch;    justify-content: stretch;    padding: 0;    margin: 0;    cursor: pointer;}  /************//* SECTIONS *//************/ .heading {    pointer-events: none;}.heading > * {    pointer-events: auto;} /*=----------------------------=*//*= Section heading self-links =*//*=----------------------------=*/ .heading a::after {    content: "\00B6"; /* Pilcrow sign: ¶ */    font-size: 0.75em;    position: absolute;    bottom: 0.15em;    right: 0;    visibility: hidden;    opacity: 0;    transition: opacity 0s ease 0.1s;}.heading a:hover::after,section.highlighted > .heading a::after,section:target > .heading a::after {    visibility: visible;}.heading a:hover::after,section.highlighted > .heading a::after {    opacity: 0.8;}section:target > .heading a::after {    opacity: 0.5;} /*  Pilcrow in H1. */section.level1 > .heading a::after {    right: unset;    left: 0;} /*  Pilcrow in H3, H4, H5, H6. */section.level3 > .heading a,section.level4 > .heading a,section.level5 > .heading a,section.level6 > .heading a {    position: relative;}section.level3 > .heading a::after,section.level4 > .heading a::after,section.level5 > .heading a::after,section.level6 > .heading a::after {    right: -2.75em;}section.level3 > .heading a::after,section.level4 > .heading a::after {    bottom: 0.4em;}section.level5 > .heading a::after,section.level6 > .heading a::after {    bottom: 0.3em;} /*=-----------------------------------=*//*= Section heading copy link buttons =*//*=-----------------------------------=*/ .heading .copy-section-link-button {    display: inline-flex;    width: 1em;    height: 1em;    color: var(--GW-body-link-color);    transform: rotateZ(-45deg);    opacity: 0;} @media all and (hover: hover) {    .heading .copy-section-link-button::after {        content: "";        position: absolute;        left: -0.1em;        right: -0.1em;        top: -0.1em;        bottom: -0.1em;        display: none;    }    .heading .copy-section-link-button:hover::after {        display: initial;    }} .heading .copy-section-link-button:hover {    color: var(--GW-body-link-hover-color);}.heading .copy-section-link-button:hover,.heading:hover .copy-section-link-button {    opacity: 1;} .heading .copy-section-link-button:active {    transform: rotateZ(45deg);    transition:        transform 0.05s ease;}.heading .copy-section-link-button.clicked {    transform: rotateZ(135deg);    transition:        transform 0.15s ease;}.heading .copy-section-link-button:focus {    outline: none;} @media all and (max-width: 649px) {    section > .heading .copy-section-link-button {        position: relative;        padding: 0.15em;        margin-left: 0.25em;        display: none;    }    section > .heading:hover .copy-section-link-button {        display: inline-flex;    }    section.level1 > .heading .copy-section-link-button {        top: 2px;    }}@media all and (min-width: 650px) {    section.level1 > .heading .copy-section-link-button {        position: absolute;        padding: 0.22em;        right: -1em;        top: 3px;    }    section.level2 > .heading .copy-section-link-button,    section.level3 > .heading .copy-section-link-button,    section.level4 > .heading .copy-section-link-button,    section.level5 > .heading .copy-section-link-button,    section.level6 > .heading .copy-section-link-button {        position: relative;        padding: 0.15em;        margin-left: 0.25em;    }    section.level2 > .heading .copy-section-link-button {        top: 1px;    }    section.level3 > .heading .copy-section-link-button,    section.level4 > .heading .copy-section-link-button,    section.level5 > .heading .copy-section-link-button,    section.level6 > .heading .copy-section-link-button {        top: 0    }} /*  Special positioning on /index. */body.page-index section.level1 > .heading .copy-section-link-button {    position: relative;    right: -0.2em;}@media all and (max-width: 649px) {    body.page-index section.level1 > .heading .copy-section-link-button {        top: 1px;    }}@media all and (min-width: 650px) {    body.page-index section.level1 > .heading .copy-section-link-button {        top: 0;    }} /**********************************************************//*  Highlighted sections. (Due to extract popups, usually.) */ section.highlighted {    position: relative;}section.highlighted::before {    content: "";    display: block;    position: absolute;    top: -0.5em;    left: -1.25em;    width: calc(100% + 2em);    height: calc(100% + 1.25em);    outline: 3px double var(--GW-section-highlighted-border-color);    z-index: -1;    transition:        outline 0.15s ease 0.05s;}section.highlight-fading::before {    outline: 3px double transparent;}  /*******************//* COLLAPSE BLOCKS *//*******************//*  Use: annotate collapsible section headers with '{.collapse}' (in the Markdown);    for sections where I want a summary/abstract of that (eg. in /note/note.page),    one annotate summaries to keep uncollapsed with '<div class="abstract-collapse">summary</div>'.    (Pandoc Markdown does support a native div syntax, but it's long and ugly.) */ .collapse-block {    --collapse-toggle-top-height: calc(3.0 * var(--base-font-size));    --collapse-toggle-bottom-height: calc(2.0 * var(--base-font-size));    --collapse-toggle-left-width: calc(0.45 * var(--base-font-size));    --collapse-left-offset: calc(1.0 * var(--base-font-size));     --collapse-toggle-top-icon-size: var(--collapse-toggle-top-height);    --collapse-toggle-bottom-icon-size: var(--collapse-toggle-bottom-height);     position: relative;    padding-top: var(--collapse-toggle-top-height);    padding-bottom: var(--collapse-toggle-bottom-height);} /*  Offset block left when expanded, so the contents are the same width as the    enclosing content column. */.collapse-block.expanded {    margin-left: calc(-1 * var(--collapse-left-offset));    padding-left: var(--collapse-left-offset);} /*  Collapse blocks with no abstract show some of their contents when collapsed. */.collapse-block.no-abstract.expanded-not {    min-height: calc(  var(--collapse-toggle-top-height)                     + var(--collapse-toggle-bottom-height));    padding-top: 0;    padding-bottom: 0;} /************************************//*  Collapse block component z-order. */ .collapse-block > .abstract-collapse,.collapse-block > .abstract-collapse-only {    position: relative;} .collapse-block.expanded-not > .abstract-collapse,.collapse-block.expanded-not > .abstract-collapse-only {    position: relative;} .collapse-block > .disclosure-button {    z-index: 10;}.collapse-block > .disclosure-button:hover {    z-index: 11;} .collapse-block.expanded::before {    z-index: 12;} section.collapse > .heading {    z-index: 13;}.collapse-block.expanded > .abstract-collapse {    z-index: 13;}.collapse-block.expanded > .collapse-content-wrapper {    z-index: 13;}  /***************************//*  Collapse block contents. */ /*  Block (any state). */.collapse-block > .collapse-content-wrapper {    position: relative;    box-sizing: border-box;} /*  Block (collapsed). */ .collapse-block.expanded-not > .collapse-content-wrapper {    overflow: hidden;    contain: content;}.collapse-block.has-abstract.expanded-not > .collapse-content-wrapper {    max-height: 0;}.collapse-block.no-abstract.expanded-not > .collapse-content-wrapper {    max-height: calc(  var(--collapse-toggle-top-height)                     + var(--collapse-toggle-bottom-height));} /*  Inline (collapsed). */.collapse-inline.expanded-not > .collapse-content-outer-wrapper {    display: inline-block;}.collapse-inline.expanded-not > .collapse-content-outer-wrapper > .collapse-content-wrapper {    display: inline-block;    max-width: 0;    max-height: 0;    overflow: hidden;    contain: content;} /*****************************//*  Collapse block background. */ .collapse-block::before {    content: "";    position: absolute;    left: var(--collapse-toggle-left-width);    top: var(--collapse-toggle-top-height);    bottom: var(--collapse-toggle-bottom-height);    right: 0;    background-color: var(--background-color);} /*  Fix for NoScript users. */.collapse-block:not(.expanded):not(.expanded-not)::before {    display: none;} /*********************//*  Disclosure button. */ .collapse > .disclosure-button {    --collapse-button-background-color: var(--GW-collapse-disclosure-button-color);    --collapse-button-text-color: var(--GW-collapse-disclosure-button-text-color);     appearance: none;    border: none;    background-color: transparent;    margin: 0;    padding: 0;    font-weight: inherit;    font-style: inherit;    font-size: inherit;    color: var(--collapse-button-text-color);    transition:        color 0.1s ease;    cursor: pointer;}.collapse > .disclosure-button:hover {    --collapse-button-background-color: var(--GW-collapse-disclosure-button-hover-color);    --collapse-button-text-color: var(--GW-collapse-disclosure-button-text-hover-color);}.collapse > .disclosure-button:focus {    outline: none;} .collapse-block > .disclosure-button {    position: absolute;    top: 0;    right: 0;    width: 100%;    height: 100%;    font-size: 0.875em;    font-family: var(--GW-sans-serif-font-stack);    box-shadow:        var(--collapse-toggle-left-width) 0 0 0 var(--collapse-button-background-color) inset;}@media all and (max-width: 649px) {    .collapse-block > .disclosure-button {        font-size: 1em;    }} /*  Top and bottom parts of disclosure button. */.collapse-block > .disclosure-button .part {    position: absolute;    right: 0;    width: 100%;    box-sizing: border-box;    display: flex;    align-items: stretch;    text-decoration: underline;    text-underline-offset: 3px;} .collapse-block > .disclosure-button .part::before {    content: "";    position: absolute;    width: 100%;    height: 100%;    z-index: -1;    background-color: var(--collapse-button-background-color);    transition:        background-color 0.1s ease;} .collapse-block > .disclosure-button .part > span {

Lines 1–500 of 7558. Load more