/* ==========================================================
   NOTEBOOK — THURBER 2

   Simplified TomBeaverBooks-compatible Notebook style.

   Goals:
   - visually belong with standard inner pages
   - use Mist background
   - standard editorial page header
   - intro copy limited to roughly 3/5 width
   - restrained controls
   - preserve two-column Notebook browser / reader

   Thurber2 formats:

   single
   - Instrument Serif title
   - Source Serif 4 body
   - single-column article

   times2col
   - Fraunces title
   - Merriweather body
   - two-column article
   ========================================================== */


/* ==========================================================
   VARIABLES
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"] {
    --tb-thurber2-bg:
            var(
                    --tb-bg,
                    #f4f5f5
            );

    --tb-thurber2-ink:
            #222526;

    --tb-thurber2-muted:
            #747776;

    --tb-thurber2-faint:
            #a8aaa8;

    --tb-thurber2-rule:
            rgba(
                    34,
                    37,
                    38,
                    0.16
            );

    --tb-thurber2-rule-strong:
            rgba(
                    34,
                    37,
                    38,
                    0.28
            );

    --tb-thurber2-accent:
            var(
                    --tb-accent-dark,
                    #41698a
            );

    --tb-thurber2-accent-pale:
            color-mix(
                    in srgb,
                    var(--tb-thurber2-accent) 9%,
                    var(--tb-thurber2-bg)
            );

    --tb-thurber2-serif:
            "Iowan Old Style",
            Georgia,
            "Times New Roman",
            serif;

    --tb-thurber2-sans:
            -apple-system,
            BlinkMacSystemFont,
            "Segoe UI",
            Helvetica,
            Arial,
            sans-serif;

    color:
            var(--tb-thurber2-ink);

    background:
            var(--tb-thurber2-bg);

    font-family:
            var(--tb-thurber2-serif);
}


/* ==========================================================
   PAGE BACKGROUND
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"],
.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__intro,
.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__workspace,
.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__slider,
.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list,
.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader {
    background:
            var(--tb-thurber2-bg);
}


/* ==========================================================
   REMOVE DECORATIVE TEXTURES
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]::before,
.tb-notebook[data-notebook-style="thurber2"]::after,
.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__intro::before,
.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__intro::after,
.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__workspace::before,
.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__workspace::after {
    display: none;

    content: none;
}


/* ==========================================================
   PAGE INTRO
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__intro {
    padding:
            5.2rem
            0
            3.7rem;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__introInner {
    width:
            min(
                    118rem,
                    calc(100% - 7rem)
            );

    margin:
            0
            auto;
}


/* ==========================================================
   INTRO COPY
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__introCopy {
    width: 60%;

    max-width: 72rem;
}


/* ==========================================================
   PAGE TITLE
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__heading {
    position: relative;

    display: inline-block;

    margin:
            0
            0
            1.8rem;

    color:
            var(--tb-thurber2-ink);

    font-family:
            var(--tb-thurber2-serif);

    font-size:
            clamp(
                    4.7rem,
                    5.3vw,
                    7rem
            );

    font-weight: 400;
    line-height: 0.98;

    letter-spacing: -0.045em;
}


/* ==========================================================
   TITLE ACCENT
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__heading::after {
    content: "";

    position: absolute;

    left: 0;

    bottom: -0.75rem;

    width: 6.5rem;
    height: 2px;

    background:
            var(--tb-thurber2-accent);
}


/* ==========================================================
   INTRO DECK
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__deck {
    max-width: 68rem;

    margin: 0;

    color:
            #676967;

    font-family:
            var(--tb-thurber2-serif);

    font-size: 1.8rem;
    font-style: italic;
    font-weight: 400;
    line-height: 1.45;
}


/* ==========================================================
   REMOVE LEGACY INTRO PERSONALITY PIECES
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__breadcrumb,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__personality,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__vignette,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__motto {
    display: none !important;
}


/* ==========================================================
   WORKSPACE
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__workspace {
    width:
            min(
                    118rem,
                    calc(100% - 7rem)
            );

    margin:
            0
            auto;

    border-top:
            1px solid
            var(--tb-thurber2-rule-strong);
}


/* ==========================================================
   TWO-COLUMN APP FRAME
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook__slider {
    display: grid;

    grid-template-columns:
            minmax(28rem, 34rem)
            minmax(0, 1fr);

    align-items: stretch;

    min-height: 68rem;
}


/* ==========================================================
   LEFT LIST
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list {
    box-sizing: border-box;

    padding:
            3rem
            3rem
            5rem
            0;

    border-right:
            1px solid
            var(--tb-thurber2-rule);
}


/* ==========================================================
   LIST HEADING
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__headingRow {
    display: flex;

    align-items: baseline;

    gap: 1rem;

    margin-bottom: 2rem;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__heading {
    margin: 0;

    color:
            var(--tb-thurber2-ink);

    font-family:
            var(--tb-thurber2-serif);

    font-size: 2.75rem;
    font-weight: 700;
    line-height: 1;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__count {
    color:
            var(--tb-thurber2-muted);

    font-family:
            var(--tb-thurber2-serif);

    font-size: 1.2rem;
    font-style: italic;
    line-height: 1;
}


/* ==========================================================
   SEARCH
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__search {
    display: flex;

    align-items: center;

    gap: 0.7rem;

    box-sizing: border-box;

    width: 100%;

    height: 4.2rem;

    margin:
            0
            0
            1.4rem;

    padding:
            0
            1.2rem;

    border:
            1px solid
            var(--tb-thurber2-rule-strong);

    border-radius: 2.1rem;

    background: transparent;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__search:focus-within {
    border-color:
            var(--tb-thurber2-accent);
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__searchIcon {
    color:
            var(--tb-thurber2-accent);

    font-family:
            var(--tb-thurber2-sans);

    font-size: 1.15rem;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__searchInput {
    width: 100%;

    margin: 0;
    padding: 0;

    border: 0;
    outline: 0;

    background: transparent;

    color:
            var(--tb-thurber2-ink);

    font-family:
            var(--tb-thurber2-sans);

    font-size: 1.3rem;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__searchInput::placeholder {
    color:
            var(--tb-thurber2-faint);
}


/* ==========================================================
   FILTERS
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__filters {
    display: flex;

    flex-direction: column;

    gap: 1rem;

    margin:
            0
            0
            2rem;
}


/* ==========================================================
   FILTER GROUP
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__filterGroup {
    display: grid;

    grid-template-columns:
            4.4rem
            minmax(0, 1fr);

    align-items: center;

    gap: 0.6rem;

    margin: 0;
}


/* ==========================================================
   FILTER LABEL
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__filterLabel {
    color:
            var(--tb-thurber2-muted);

    font-family:
            var(--tb-thurber2-serif);

    font-size: 1.25rem;
    line-height: 1;
}


/* ==========================================================
   FILTER SELECT
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__filterSelect {
    appearance: none;
    -webkit-appearance: none;

    box-sizing: border-box;

    width: 100%;
    height: 3.7rem;

    margin: 0;

    padding:
            0
            3.2rem
            0
            1.1rem;

    border:
            1px solid
            var(--tb-thurber2-rule-strong);

    border-radius: 0.45rem;

    outline: 0;

    background:
            linear-gradient(
                    45deg,
                    transparent 50%,
                    var(--tb-thurber2-muted) 50%
            )
            calc(100% - 1.35rem)
            1.55rem
            /
            0.42rem
            0.42rem
            no-repeat,

            linear-gradient(
                    135deg,
                    var(--tb-thurber2-muted) 50%,
                    transparent 50%
            )
            calc(100% - 1.08rem)
            1.55rem
            /
            0.42rem
            0.42rem
            no-repeat,

            transparent;

    color:
            var(--tb-thurber2-ink);

    font-family:
            var(--tb-thurber2-sans);

    font-size: 1.2rem;

    cursor: pointer;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__filterSelect:focus {
    border-color:
            var(--tb-thurber2-accent);
}


/* ==========================================================
   LEGACY VIEW CONTROLS
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__viewControls,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__segmented {
    display: none !important;
}


/* ==========================================================
   ENTRY LIST
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__entries {
    display: flex;

    flex-direction: column;

    gap: 0;
}


/* ==========================================================
   ENTRY
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-entry {
    appearance: none;
    -webkit-appearance: none;

    position: relative;

    display: grid;

    grid-template-columns:
            minmax(0, 1fr)
            auto;

    grid-template-areas:
            "date arrow"
            "title arrow"
            "excerpt excerpt";

    align-items: center;

    gap:
            0.25rem
            1rem;

    width: 100%;

    margin: 0;

    padding:
            1.15rem
            1.2rem;

    border: 0;
    border-bottom:
            1px solid
            var(--tb-thurber2-rule);

    border-radius: 0;

    outline: 0;

    background: transparent;

    color:
            var(--tb-thurber2-ink);

    text-align: left;

    cursor: pointer;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-entry:hover {
    background:
            color-mix(
                    in srgb,
                    var(--tb-thurber2-accent) 5%,
                    transparent
            );
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-entry.is-active {
    background:
            var(--tb-thurber2-accent-pale);

    box-shadow:
            inset
            3px
            0
            0
            var(--tb-thurber2-accent);
}


/* ==========================================================
   ENTRY DATE
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-entry__date {
    grid-area: date;

    color:
            var(--tb-thurber2-muted);

    font-family:
            var(--tb-thurber2-sans);

    font-size: 1rem;
    font-weight: 400;
    line-height: 1.2;
}


/* ==========================================================
   ENTRY TITLE
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-entry__title {
    grid-area: title;

    color:
            var(--tb-thurber2-ink);

    font-family:
            var(--tb-thurber2-serif);

    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.12;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-entry.is-active
.tb-notebook-entry__title {
    color:
            var(--tb-thurber2-accent);
}


/* ==========================================================
   ENTRY EXCERPT
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-entry__excerpt {
    display: none;
}


/* ==========================================================
   ENTRY ARROW
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-entry__arrow {
    grid-area: arrow;

    color:
            var(--tb-thurber2-faint);

    font-family:
            var(--tb-thurber2-sans);

    font-size: 1.35rem;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-entry.is-active
.tb-notebook-entry__arrow {
    color:
            var(--tb-thurber2-accent);
}


/* ==========================================================
   SIDEBAR EPIGRAM
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__epigram {
    display: none;
}


/* ==========================================================
   READER
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader {
    box-sizing: border-box;

    min-width: 0;

    padding:
            3rem
            0
            7rem
            3.5rem;
}


/* ==========================================================
   READER HEADER
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__header {
    margin:
            0
            0
            2.8rem;

    padding:
            0
            0
            1.4rem;

    border-bottom:
            1px solid
            var(--tb-thurber2-rule);
}


/* ==========================================================
   META ROW
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__metaRow {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 2rem;
}


/* ==========================================================
   READER DATE
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__date {
    color:
            var(--tb-thurber2-muted);

    font-family:
            var(--tb-thurber2-serif);

    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.2;
}


/* ==========================================================
   READER CONTROLS
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__controls {
    display: flex;

    align-items: center;

    gap: 0.75rem;
}


/* ==========================================================
   STYLE / FORMAT WRAPPERS
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__styleSelectWrap {
    display: flex;

    align-items: center;

    gap: 0.55rem;

    margin-right: 0.2rem;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__styleSelectLabel {
    color:
            var(--tb-thurber2-muted);

    font-family:
            var(--tb-thurber2-sans);

    font-size: 1rem;
    font-weight: 600;

    letter-spacing: 0.04em;

    text-transform: uppercase;
}


/* ==========================================================
   STYLE / FORMAT DROPDOWNS
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__styleSelect {
    appearance: none;
    -webkit-appearance: none;

    box-sizing: border-box;

    height: 3.5rem;

    min-width: 11rem;

    margin: 0;

    padding:
            0
            2.8rem
            0
            1rem;

    border:
            1px solid
            var(--tb-thurber2-rule-strong);

    border-radius: 0.45rem;

    outline: 0;

    background:
            linear-gradient(
                    45deg,
                    transparent 50%,
                    var(--tb-thurber2-muted) 50%
            )
            calc(100% - 1.2rem)
            1.45rem
            /
            0.4rem
            0.4rem
            no-repeat,

            linear-gradient(
                    135deg,
                    var(--tb-thurber2-muted) 50%,
                    transparent 50%
            )
            calc(100% - 0.94rem)
            1.45rem
            /
            0.4rem
            0.4rem
            no-repeat,

            transparent;

    color:
            var(--tb-thurber2-ink);

    font-family:
            var(--tb-thurber2-sans);

    font-size: 1.1rem;

    cursor: pointer;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__thurber2FormatWrap
.tb-notebook-reader__styleSelect {
    min-width: 12.5rem;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__styleSelect:focus {
    border-color:
            var(--tb-thurber2-accent);
}


/* ==========================================================
   FAVORITE
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__favorite {
    appearance: none;
    -webkit-appearance: none;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    width: 3.8rem;
    height: 3.8rem;

    margin: 0;
    padding: 0;

    border:
            1px solid
            var(--tb-thurber2-rule-strong);

    border-radius: 50%;

    background: transparent;

    color:
            var(--tb-thurber2-accent);

    font-family:
            var(--tb-thurber2-serif);

    font-size: 2rem;

    cursor: pointer;
}


/* ==========================================================
   READ BUTTON
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__read {
    appearance: none;
    -webkit-appearance: none;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-width: 6rem;
    height: 3.8rem;

    margin: 0;

    padding:
            0
            1.25rem;

    border:
            1px solid
            var(--tb-thurber2-accent);

    border-radius: 0.45rem;

    background:
            var(--tb-thurber2-accent);

    color: #fff;

    font-family:
            var(--tb-thurber2-sans);

    font-size: 1.1rem;
    font-weight: 600;

    cursor: pointer;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__read:hover {
    filter:
            brightness(0.94);
}


/* ==========================================================
   CONTROL DIVIDER
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__controlDivider {
    width: 1px;
    height: 2.6rem;

    margin:
            0
            0.25rem;

    background:
            var(--tb-thurber2-rule-strong);
}


/* ==========================================================
   FONT BUTTONS
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__fontButton {
    appearance: none;
    -webkit-appearance: none;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    width: 3.8rem;
    height: 3.8rem;

    margin: 0;
    padding: 0;

    border:
            1px solid
            var(--tb-thurber2-rule-strong);

    border-radius: 50%;

    background: transparent;

    color:
            var(--tb-thurber2-ink);

    font-family:
            var(--tb-thurber2-serif);

    font-size: 1.25rem;

    cursor: pointer;
}


/* ==========================================================
   HIDE OLD STYLE ROW
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__styleBar,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__styleChoices,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__styleChoice {
    display: none !important;
}


/* ==========================================================
   HIDE STYLE VARIANT CONTROLS IN THURBER2
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__variantControl {
    display: none !important;
}


/* ==========================================================
   EDITORIAL BLOCK
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-editorialBlock {
    margin:
            0
            0
            2.5rem;

    padding: 0;

    border: 0;

    background: transparent;
}


/* ==========================================================
   SINGLE COLUMN — TITLE
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__titleWrap {
    margin: 0;

    padding: 0;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__title {
    max-width: 82rem;

    margin:
            0
            0
            1.6rem;

    color:
            var(--tb-thurber2-ink);

    font-family:
            "Instrument Serif",
            Georgia,
            serif;

    font-size:
            clamp(
                    3.5rem,
                    4.3vw,
                    5.4rem
            );

    font-weight: 400;
    line-height: 1;

    letter-spacing: -0.018em;

    -webkit-text-stroke:
            0.55px
            currentColor;
}


/* ==========================================================
   TITLE ACCENT
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__titleAccent {
    display: block;

    width: 6rem;
    height: 2px;

    margin:
            0
            0
            2.2rem;

    background:
            var(--tb-thurber2-accent);
}


/* ==========================================================
   ATLANTIC-ONLY ELEMENTS
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-atlanticHero,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-atlanticIntro,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-atlanticByline {
    display: none !important;
}


/* ==========================================================
   SINGLE COLUMN — BODY FRAME
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__bodyFrame {
    max-width: 82rem;

    margin: 0;

    padding: 0;

    border: 0;

    background: transparent;
}


/* ==========================================================
   SINGLE COLUMN — BODY
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__body {
    color:
            var(--tb-thurber2-ink);

    font-family:
            "Source Serif 4",
            Georgia,
            serif;

    font-size: 1.92rem;
    font-weight: 400;
    line-height: 1.55;

    letter-spacing: 0;

    text-align: left;

    hyphens: none;
}


/* ==========================================================
   BODY FONT SIZE
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
[data-notebook-font-size="xxsmall"]
.tb-notebook-reader__body {
    font-size: 1.35rem;
}


.tb-notebook[data-notebook-style="thurber2"]
[data-notebook-font-size="xsmall"]
.tb-notebook-reader__body {
    font-size: 1.50rem;
}


.tb-notebook[data-notebook-style="thurber2"]
[data-notebook-font-size="small"]
.tb-notebook-reader__body {
    font-size: 1.70rem;
}


.tb-notebook[data-notebook-style="thurber2"]
[data-notebook-font-size="normal"]
.tb-notebook-reader__body {
    font-size: 1.92rem;
}


.tb-notebook[data-notebook-style="thurber2"]
[data-notebook-font-size="large"]
.tb-notebook-reader__body {
    font-size: 2.10rem;
}


.tb-notebook[data-notebook-style="thurber2"]
[data-notebook-font-size="xlarge"]
.tb-notebook-reader__body {
    font-size: 2.30rem;
}


.tb-notebook[data-notebook-style="thurber2"]
[data-notebook-font-size="xxlarge"]
.tb-notebook-reader__body {
    font-size: 2.52rem;
}


.tb-notebook[data-notebook-style="thurber2"]
[data-notebook-font-size="xxxlarge"]
.tb-notebook-reader__body {
    font-size: 2.78rem;
}


.tb-notebook[data-notebook-style="thurber2"]
[data-notebook-font-size="huge"]
.tb-notebook-reader__body {
    font-size: 3.05rem;
}


/* ==========================================================
   BODY PARAGRAPHS
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__body p {
    margin:
            0
            0
            1.25em;

    color: inherit;

    font: inherit;

    line-height: inherit;
}


/* ==========================================================
   LINKS
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__body a {
    color:
            var(--tb-thurber2-accent);

    text-decoration-thickness: 1px;
    text-underline-offset: 0.15em;
}


/* ==========================================================
   BODY HEADINGS
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__body h2,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__body h3,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__body h4 {
    color:
            var(--tb-thurber2-ink);

    font-family:
            "Source Serif 4",
            Georgia,
            serif;

    font-weight: 700;

    letter-spacing: -0.02em;
}


/* ==========================================================
   BLOCKQUOTES
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__body blockquote {
    margin:
            1.8em
            0;

    padding:
            0
            0
            0
            1.6rem;

    border-left:
            2px solid
            var(--tb-thurber2-accent);

    color:
            #555957;

    font-style: italic;
}


/* ==========================================================
   IMAGES
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__body img {
    max-width: 100%;

    border-radius: 0;

    box-shadow: none;
}


/* ==========================================================
   TWO COLUMNS — NEWSPAPER TYPOGRAPHY
   ========================================================== */

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__title {
    max-width: 100%;

    font-family:
            "Fraunces",
            Georgia,
            serif;

    font-size:
            clamp(
                    3.8rem,
                    4.7vw,
                    5.9rem
            );

    font-weight: 700;
    line-height: 0.98;

    letter-spacing: -0.035em;

    -webkit-text-stroke: 0;
}


/* ==========================================================
   TWO COLUMNS — BODY FRAME
   ========================================================== */

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__bodyFrame {
    max-width: none;

    width: 100%;
}


/* ==========================================================
   TWO COLUMNS — BODY
   ========================================================== */

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body {
    width: 100%;

    max-width: none;

    font-family:
            "Merriweather",
            Georgia,
            serif;

    font-size: 1.72rem;
    font-weight: 400;
    line-height: 1.52;

    letter-spacing: -0.008em;

    column-count: 2;
    column-gap: 4rem;
    column-rule:
            1px solid
            var(--tb-thurber2-rule);

    text-align: left;

    hyphens: auto;
}


/* ==========================================================
   TWO COLUMNS — PARAGRAPH RHYTHM
   ========================================================== */

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body p {
    margin:
            0
            0
            1.05em;

    break-inside: avoid;
}


/* ==========================================================
   TWO COLUMNS — HEADINGS
   ========================================================== */

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body h2,

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body h3,

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body h4 {
    font-family:
            "Merriweather",
            Georgia,
            serif;

    break-after: avoid;
    break-inside: avoid;
}


/* ==========================================================
   TWO COLUMNS — BLOCKQUOTES
   ========================================================== */

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body blockquote {
    break-inside: avoid;
}


/* ==========================================================
   TWO COLUMNS — IMAGES / FIGURES

   Let substantial media span both columns rather than
   squeeze into one newspaper column.
   ========================================================== */

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body figure,

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body .kg-image-card,

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body .kg-gallery-card,

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body .kg-width-wide,

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__body .kg-width-full {
    column-span: all;

    break-inside: avoid;
}


/* ==========================================================
   TWO COLUMNS — FONT SIZE LADDER

   Preserve the A− / A+ behavior, but keep the newspaper
   treatment slightly smaller than single-column Thurber2.
   ========================================================== */

.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
][
    data-notebook-font-size="xxsmall"
]
.tb-notebook-reader__body {
    font-size: 1.22rem;
}


.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
][
    data-notebook-font-size="xsmall"
]
.tb-notebook-reader__body {
    font-size: 1.35rem;
}


.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
][
    data-notebook-font-size="small"
]
.tb-notebook-reader__body {
    font-size: 1.52rem;
}


.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
][
    data-notebook-font-size="normal"
]
.tb-notebook-reader__body {
    font-size: 1.72rem;
}


.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
][
    data-notebook-font-size="large"
]
.tb-notebook-reader__body {
    font-size: 1.88rem;
}


.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
][
    data-notebook-font-size="xlarge"
]
.tb-notebook-reader__body {
    font-size: 2.04rem;
}


.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
][
    data-notebook-font-size="xxlarge"
]
.tb-notebook-reader__body {
    font-size: 2.22rem;
}


.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
][
    data-notebook-font-size="xxxlarge"
]
.tb-notebook-reader__body {
    font-size: 2.42rem;
}


.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
][
    data-notebook-font-size="huge"
]
.tb-notebook-reader__body {
    font-size: 2.64rem;
}


/* ==========================================================
   READER ORNAMENT
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__ornament {
    display: none;
}


/* ==========================================================
   OLDER / NEWER FOOTER
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__footer {
    display: grid;

    grid-template-columns:
            repeat(
                    2,
                    minmax(0, 1fr)
            );

    gap: 3rem;

    max-width: 82rem;

    margin-top: 5rem;

    padding-top: 2rem;

    border-top:
            1px solid
            var(--tb-thurber2-rule);
}


.tb-notebook[
    data-notebook-style="thurber2"
][
    data-notebook-thurber2-format="times2col"
]
.tb-notebook-reader__footer {
    max-width: none;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__previous,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__next {
    appearance: none;
    -webkit-appearance: none;

    margin: 0;
    padding: 0;

    border: 0;

    background: transparent;

    color:
            var(--tb-thurber2-ink);

    font-family:
            var(--tb-thurber2-serif);

    text-align: left;

    cursor: pointer;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__next {
    text-align: right;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__navDirection {
    display: block;

    margin-bottom: 0.45rem;

    color:
            var(--tb-thurber2-muted);

    font-family:
            var(--tb-thurber2-sans);

    font-size: 1rem;
    font-weight: 600;

    letter-spacing: 0.08em;

    text-transform: uppercase;
}


.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__navTitle {
    color:
            var(--tb-thurber2-accent);

    font-size: 1.5rem;
    font-weight: 700;
}


/* ==========================================================
   EMPTY STATES
   ========================================================== */

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-list__empty,

.tb-notebook[data-notebook-style="thurber2"]
.tb-notebook-reader__empty {
    color:
            var(--tb-thurber2-muted);

    font-family:
            var(--tb-thurber2-serif);

    font-style: italic;
}


/* ==========================================================
   RESPONSIVE — 1100

   Give the toolbar room to wrap when both Style and Format
   selectors are present.
   ========================================================== */

@media (max-width: 1100px) {

    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__metaRow {
        align-items: flex-start;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__controls {
        flex-wrap: wrap;

        justify-content: flex-end;
    }
}


/* ==========================================================
   RESPONSIVE — 900
   ========================================================== */

@media (max-width: 900px) {

    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__introInner,

    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__workspace {
        width:
                calc(
                        100% - 4rem
                );
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__introCopy {
        width: 72%;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__slider {
        grid-template-columns:
                minmax(24rem, 29rem)
                minmax(0, 1fr);
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-list {
        padding-right: 2rem;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader {
        padding-left: 2.5rem;
    }


    .tb-notebook[
        data-notebook-style="thurber2"
    ][
        data-notebook-thurber2-format="times2col"
    ]
    .tb-notebook-reader__body {
        column-gap: 2.8rem;
    }
}


/* ==========================================================
   RESPONSIVE — 760
   ========================================================== */

@media (max-width: 760px) {

    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__intro {
        padding:
                3.3rem
                0
                2.8rem;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__introInner,

    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__workspace {
        width:
                calc(
                        100% - 3rem
                );
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__introCopy {
        width: 100%;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__heading {
        font-size:
                clamp(
                        4rem,
                        12vw,
                        5.8rem
                );
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__deck {
        font-size: 1.6rem;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__slider {
        display: block;

        min-height: 0;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-list {
        padding:
                2.5rem
                0
                3rem;

        border-right: 0;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader {
        padding:
                2.5rem
                0
                5rem;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__metaRow {
        flex-direction: column;

        align-items: stretch;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__controls {
        justify-content: flex-start;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__title {
        font-size:
                clamp(
                        3.2rem,
                        9vw,
                        4.7rem
                );
    }


    /*
     * At tablet/mobile widths the newspaper treatment
     * automatically collapses to one readable column.
     */

    .tb-notebook[
        data-notebook-style="thurber2"
    ][
        data-notebook-thurber2-format="times2col"
    ]
    .tb-notebook-reader__body {
        column-count: 1;

        column-gap: normal;
        column-rule: 0;

        hyphens: none;
    }
}


/* ==========================================================
   RESPONSIVE — 520
   ========================================================== */

@media (max-width: 520px) {

    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__introInner,

    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__workspace {
        width:
                calc(
                        100% - 2.4rem
                );
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook__heading {
        font-size: 4rem;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-list__filterGroup {
        grid-template-columns: 1fr;

        gap: 0.4rem;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__controls {
        gap: 0.55rem;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__styleSelectLabel {
        display: none;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__styleSelect {
        min-width: 9.5rem;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__thurber2FormatWrap
    .tb-notebook-reader__styleSelect {
        min-width: 10.5rem;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__footer {
        grid-template-columns: 1fr;

        gap: 2rem;
    }


    .tb-notebook[data-notebook-style="thurber2"]
    .tb-notebook-reader__next {
        text-align: left;
    }
}