/* ==========================================================
   NOTEBOOK — BLOGGY

   Index-inspired Notebook style.

   Desktop readable page:
   fixed 1000px

   Tone colors are supplied by
   zcode-notebook-color-lab.js:

   --tb-bloggy-bg
   --tb-bloggy-outer-bg
   --tb-bloggy-accent
   --tb-bloggy-accent-med
   --tb-bloggy-accent-light
   ========================================================== */


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

.tb-notebook[data-notebook-style="bloggy"] {
    --tb-bloggy-readable-page-width: 1000px;

    --tb-bloggy-body-font-size: 1.78rem;
    --tb-bloggy-title-scale: 2;

    --tb-bloggy-bg:
            #F2EEEB;

    --tb-bloggy-outer-bg:
            #F2EEEB;

    --tb-bloggy-accent:
            #6B5549;

    --tb-bloggy-accent-med:
            #DDD5D0;

    --tb-bloggy-accent-light:
            #EAE5E2;

    --tb-bloggy-ink:
            #202426;

    --tb-bloggy-muted:
            #71777b;

    --tb-bloggy-faint:
            #a4aaad;

    --tb-bloggy-rule:
            rgba(
                    32,
                    36,
                    38,
                    0.14
            );

    --tb-bloggy-rule-strong:
            rgba(
                    32,
                    36,
                    38,
                    0.24
            );

    --tb-notebook-accent:
            var(--tb-bloggy-accent);

    --tb-notebook-accent-warm:
            var(--tb-bloggy-accent);

    --tb-notebook-accent-soft:
            var(--tb-bloggy-accent-light);

    --tb-notebook-selection:
            var(--tb-bloggy-accent-med);

    --tb-notebook-title-accent-color:
            var(--tb-bloggy-accent);

    --tb-bloggy-sans:
            "Avenir Next",
            Avenir,
            "Helvetica Neue",
            Helvetica,
            Arial,
            sans-serif;

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

    font-family:
            var(--tb-bloggy-sans);
}


/* ==========================================================
   OUTER PAGE
   ========================================================== */

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

    min-height: 100vh;

    background:
            var(--tb-bloggy-outer-bg);
}


/* ==========================================================
   READABLE SHEET
   ========================================================== */

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook__intro,

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

    width:
            var(--tb-bloggy-readable-page-width);

    max-width: 100%;

    margin-left: auto;
    margin-right: auto;

    background:
            var(--tb-bloggy-bg);
}


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

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook__intro {
    position: relative;

    overflow: hidden;

    padding:
            3.6rem
            4rem
            2.6rem;
}


/* ==========================================================
   ROTATING HEADER IMAGE
   ========================================================== */

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook__intro::after {
    content: "";

    position: absolute;

    top: 0;
    right: 0;
    bottom: 0;
    left: 44%;

    z-index: 0;

    pointer-events: none;

    background-image:
            var(
                    --tb-notebook-header-image,
                    url("../../images/notebook/notebook_header_1.png")
            );

    background-repeat:
            no-repeat;

    background-position:
            right center;

    background-size:
            contain;

    opacity: 0.76;

    mix-blend-mode: multiply;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook__introInner {
    position: relative;

    z-index: 1;

    width: 100%;

    margin: 0;
}


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

    max-width: 72rem;
}


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

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

    display: inline-block;

    margin:
            0
            0
            1.15rem;

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

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

    font-size:
            clamp(
                    4.1rem,
                    4.2vw,
                    5.75rem
            );

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

    letter-spacing: -0.05em;

    white-space: nowrap;
}


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

    position: absolute;

    left: 0;
    bottom: -0.55rem;

    width: 5.8rem;
    height: 2px;

    background:
            var(--tb-bloggy-accent) !important;
}


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

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

    margin: 0;

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

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

    font-size: 1.65rem;
    font-style: normal;
    font-weight: 400;
    line-height: 1.45;
}


/* ==========================================================
   HIDE LEGACY INTRO DECORATION
   ========================================================== */

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

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

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

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


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

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook__workspace {
    padding:
            0
            4rem;

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


/* ==========================================================
   APP FRAME
   ========================================================== */

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

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

    align-items: stretch;

    min-height: 68rem;

    background:
            var(--tb-bloggy-bg);
}


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

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

    min-width: 0;

    padding:
            2.6rem
            3rem
            5rem
            0;

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

    background:
            var(--tb-bloggy-bg);
}


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

    align-items: baseline;

    gap: 1rem;

    margin-bottom: 1.7rem;
}


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

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

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

    font-size: 2.6rem;
    font-weight: 600;
    line-height: 1;
}


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

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

    font-size: 1.15rem;
    font-weight: 400;
}


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

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

    align-items: center;

    gap: 0.8rem;

    box-sizing: border-box;

    width: 100%;
    height: 4.1rem;

    margin:
            0
            0
            1.2rem;

    padding:
            0
            1.25rem;

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

    border-radius: 2.1rem;

    background:
            transparent;
}


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


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

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

    font-size: 1.2rem;
}


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

    margin: 0;
    padding: 0;

    border: 0;
    outline: 0;

    background:
            transparent;

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

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

    font-size: 1.35rem;
}


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


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

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

    flex-direction: column;

    gap: 0.7rem;

    margin:
            0
            0
            1.35rem;
}


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

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

    align-items: center;

    gap: 0.65rem;

    margin: 0;
}


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

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

    font-size: 1.15rem;
}


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

    box-sizing: border-box;

    width: 100%;
    height: 3.65rem;

    margin: 0;

    padding:
            0
            3.1rem
            0
            1.05rem;

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

    border-radius: 0.4rem;

    outline: 0;

    background:
            linear-gradient(
                    45deg,
                    transparent 50%,
                    var(--tb-bloggy-muted) 50%
            )
            calc(100% - 1.3rem)
            1.52rem
            /
            0.4rem
            0.4rem
            no-repeat,

            linear-gradient(
                    135deg,
                    var(--tb-bloggy-muted) 50%,
                    transparent 50%
            )
            calc(100% - 1.03rem)
            1.52rem
            /
            0.4rem
            0.4rem
            no-repeat,

            transparent;

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

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

    font-size: 1.25rem;

    cursor: pointer;
}


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

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

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-list__segmented,

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


/* ==========================================================
   ENTRIES
   ========================================================== */

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

    flex-direction: column;

    gap: 0;
}


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

    position: relative;

    display: grid;

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

    grid-template-areas:
            ".     date  arrow"
            "check title arrow";

    align-items: center;

    column-gap: 0.55rem;
    row-gap: 0.12rem;

    width: 100%;

    margin: 0;

    padding:
            0.78rem
            1.15rem
            0.78rem
            0.45rem;

    border: 0;

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

    border-radius: 0;

    outline: 0;

    background:
            transparent;

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

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

    text-align: left;

    cursor: pointer;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-entry::before {
    content: "";

    grid-area: check;

    display: flex;

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

    align-self: start;

    width: 1.9rem;

    margin-top: 0.16rem;

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

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

    font-size: 1.18rem;
    font-weight: 700;
    line-height: 1.16;

    text-align: center;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-entry.is-read::before {
    content: "✓";
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-entry.is-read.is-favorite::before {
    content: "♥";

    align-self: start;

    width: 1.9rem;

    margin-top: 0.12rem;

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

    color:
            var(--tb-bloggy-accent);
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-entry:hover {
    background:
            var(--tb-bloggy-accent-light);
}


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

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


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

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

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

    font-size: 1.55rem;
    font-weight: 400;
    line-height: 1.05;
}


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

    position: relative;

    padding-left: 0;

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

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

    font-size: 1.62rem;
    font-weight: 500;
    line-height: 1.16;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-entry__title::before {
    content: none !important;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-entry.is-read
.tb-notebook-entry__title {
    padding-left: 0;
}


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

    font-weight: 600;
}


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


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

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

    font-size: 1.4rem;
}


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


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

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

    min-width: 0;

    padding:
            2.6rem
            0
            7rem
            3.5rem;

    background:
            var(--tb-bloggy-bg);
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__content {
    background:
            var(--tb-bloggy-bg);
}


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

    padding:
            0
            0
            1.35rem;

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


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

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

    gap: 2rem;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__metaSpacer {
    flex: 1 1 auto;
}


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

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

    font-size: 1.15rem;
}


/* ==========================================================
   TOP CONTROLS
   ========================================================== */

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

    align-items: center;

    gap: 0.75rem;
}


/* ==========================================================
   STYLE SELECT
   ========================================================== */

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

    align-items: center;

    gap: 0.55rem;
}


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

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

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

    letter-spacing: 0.05em;

    text-transform: uppercase;
}


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

    box-sizing: border-box;

    min-width: 11.5rem;
    height: 3.55rem;

    padding:
            0
            2.8rem
            0
            1rem;

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

    border-radius: 0.4rem;

    background:
            transparent;

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

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

    font-size: 1.15rem;
}


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


/* ==========================================================
   UTILITY DIVIDER / FONT CONTROLS
   ========================================================== */

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

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


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__fontButton {
    display: inline-flex;

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

    width: 3.65rem;
    height: 3.65rem;

    padding: 0;

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

    border-radius: 50%;

    background:
            transparent;

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

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

    font-size: 1.15rem;
}


/* ==========================================================
   TONE CONTROL
   ========================================================== */

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__toneRow {
    display: flex;

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

    gap: 1rem;

    min-height: 3.8rem;

    padding-top: 0.8rem;
}


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

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

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

    letter-spacing: 0.04em;

    text-transform: uppercase;
}


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

    width: 19.2rem;
    height: 2.2rem;

    margin: 0;
    padding: 0;

    background:
            transparent;

    cursor: pointer;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__toneSlider::-webkit-slider-runnable-track {
    width: 100%;
    height: 0.4rem;

    border-radius: 999px;

    background:
            linear-gradient(
                    90deg,
                    hsl(0 28% 42%),
                    hsl(45 28% 42%),
                    hsl(90 28% 42%),
                    hsl(135 28% 42%),
                    hsl(180 28% 42%),
                    hsl(225 28% 42%),
                    hsl(270 28% 42%),
                    hsl(315 28% 42%),
                    hsl(360 28% 42%)
            );
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__toneSlider::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;

    width: 1.85rem;
    height: 1.85rem;

    margin-top: -0.725rem;

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

    border-radius: 50%;

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

    box-shadow:
            0
            0
            0
            1px
            rgba(
                    255,
                    255,
                    255,
                    0.8
            );
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__toneSlider::-moz-range-track {
    height: 0.4rem;

    border: 0;
    border-radius: 999px;

    background:
            linear-gradient(
                    90deg,
                    hsl(0 28% 42%),
                    hsl(45 28% 42%),
                    hsl(90 28% 42%),
                    hsl(135 28% 42%),
                    hsl(180 28% 42%),
                    hsl(225 28% 42%),
                    hsl(270 28% 42%),
                    hsl(315 28% 42%),
                    hsl(360 28% 42%)
            );
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__toneSlider::-moz-range-thumb {
    width: 1.85rem;
    height: 1.85rem;

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

    border-radius: 50%;

    background:
            var(--tb-bloggy-bg);
}


/* ==========================================================
   HIDE OLD STYLE CONTROLS
   ========================================================== */

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

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

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__styleChoice,

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


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

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-editorialBlock {
    margin:
            0
            0
            2.2rem;
}


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

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__articleMetaRow {
    display: flex;

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

    gap: 2rem;

    width: 100%;
    max-width: 82rem;

    margin:
            0
            0
            1.2rem;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__articleMetaRow
.tb-notebook-reader__date {
    flex: 0 0 auto;

    margin: 0;
}


/* ==========================================================
   TITLE ACTIONS
   ========================================================== */

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__titleActions {
    display: flex;

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

    flex: 0 0 auto;

    gap: 1.15rem;

    min-height: 3.1rem;

    margin: 0;
    padding: 0;
}


/* ==========================================================
   READ — CIRCLED CHECK
   ========================================================== */

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

    display: inline-flex;

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

    box-sizing: border-box;

    flex: 0 0 2.9rem;

    width: 2.9rem;
    min-width: 2.9rem;
    height: 2.9rem;

    margin: 0;
    padding: 0;

    border:
            1.6px solid
            var(--tb-bloggy-faint) !important;

    border-radius: 50%;

    outline: 0;

    background:
            transparent !important;

    color:
            var(--tb-bloggy-faint) !important;

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

    font-size: 1.55rem;
    font-weight: 700;
    line-height: 1;

    cursor: pointer;

    transform: none !important;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__readIcon {
    display: block;

    width: 2.9rem;
    height: 2.9rem;

    margin: 0;

    color: currentColor;

    overflow: visible;

    pointer-events: none;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__read:hover {
    border-color:
            var(--tb-bloggy-faint) !important;

    background:
            transparent !important;

    color:
            var(--tb-bloggy-faint) !important;

    transform: none !important;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__read.is-active,

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__read.is-read {
    border-color:
            var(--tb-bloggy-accent) !important;

    background:
            var(--tb-bloggy-accent) !important;

    color:
            #ffffff !important;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__read.is-active:hover,

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__read.is-read:hover {
    border-color:
            var(--tb-bloggy-accent) !important;

    background:
            var(--tb-bloggy-accent) !important;

    color:
            #ffffff !important;

    transform: none !important;
}


/* ==========================================================
   FAVORITE — READER SVG HEART
   ========================================================== */

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

    display: inline-flex;

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

    flex: 0 0 3rem;

    width: 3rem;
    min-width: 3rem;
    height: 3rem;

    margin: 0;
    padding: 0;

    border: 0 !important;
    border-radius: 0;

    outline: 0;

    background:
            transparent !important;

    color:
            var(--tb-bloggy-faint) !important;

    cursor: pointer;

    transform: none !important;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__favoriteIcon {
    display: block;

    width: 2.85rem;
    height: 2.85rem;

    margin: 0;

    color: currentColor;

    overflow: visible;

    pointer-events: none;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__favorite:hover:not(:disabled) {
    background:
            transparent !important;

    color:
            var(--tb-bloggy-faint) !important;

    transform: none !important;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__favorite.is-active,

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__favorite.is-favorite {
    background:
            transparent !important;

    color:
            var(--tb-bloggy-accent) !important;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__favorite.is-active:hover,

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__favorite.is-favorite:hover {
    background:
            transparent !important;

    color:
            var(--tb-bloggy-accent) !important;

    transform: none !important;
}


/* ==========================================================
   DISABLED ACTIONS
   ========================================================== */

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__read:disabled,

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__favorite:disabled {
    opacity: 0.42;

    cursor: default;

    transform: none;
}


/* ==========================================================
   TITLE WRAP
   ========================================================== */

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__titleWrap {
    min-width: 0;

    width: 100%;
    max-width: 82rem;
}


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

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__title {
    width: 100%;
    max-width: none;

    margin:
            0
            0
            0.8rem;

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

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

    font-size:
            calc(
                    var(--tb-bloggy-body-font-size) *
                    var(--tb-bloggy-title-scale)
            );

    font-weight: 600;
    line-height: 1.02;

    letter-spacing: -0.035em;

    overflow-wrap: normal;
    word-break: normal;
}


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


/* ==========================================================
   ATLANTIC ELEMENTS
   ========================================================== */

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

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

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


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

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

    max-width: 82rem;

    margin: 0;

    background:
            var(--tb-bloggy-bg);
}


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

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

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

    font-family:
            var(--tb-bloggy-sans) !important;

    font-size:
            var(--tb-bloggy-body-font-size);

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

    letter-spacing: -0.008em;

    text-align: left;

    hyphens: none;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__body.gh-content * {
    font-family:
            var(--tb-bloggy-sans) !important;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__body.gh-content p {
    margin:
            0
            0
            1.15em;

    font-size: inherit;
    line-height: inherit;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__body.gh-content a {
    color:
            var(--tb-bloggy-accent) !important;
}


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__body.gh-content blockquote {
    border-left-color:
            var(--tb-bloggy-accent) !important;
}


/* ==========================================================
   FONT SIZE LADDER
   ========================================================== */

.tb-notebook[data-notebook-style="bloggy"][data-notebook-font-size="xxsmall"] {
    --tb-bloggy-body-font-size: 1.25rem;
}


.tb-notebook[data-notebook-style="bloggy"][data-notebook-font-size="xsmall"] {
    --tb-bloggy-body-font-size: 1.40rem;
}


.tb-notebook[data-notebook-style="bloggy"][data-notebook-font-size="small"] {
    --tb-bloggy-body-font-size: 1.58rem;
}


.tb-notebook[data-notebook-style="bloggy"][data-notebook-font-size="normal"] {
    --tb-bloggy-body-font-size: 1.78rem;
}


.tb-notebook[data-notebook-style="bloggy"][data-notebook-font-size="large"] {
    --tb-bloggy-body-font-size: 1.95rem;
}


.tb-notebook[data-notebook-style="bloggy"][data-notebook-font-size="xlarge"] {
    --tb-bloggy-body-font-size: 2.13rem;
}


.tb-notebook[data-notebook-style="bloggy"][data-notebook-font-size="xxlarge"] {
    --tb-bloggy-body-font-size: 2.32rem;
}


.tb-notebook[data-notebook-style="bloggy"][data-notebook-font-size="xxxlarge"] {
    --tb-bloggy-body-font-size: 2.52rem;
}


.tb-notebook[data-notebook-style="bloggy"][data-notebook-font-size="huge"] {
    --tb-bloggy-body-font-size: 2.75rem;
}


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

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


/* ==========================================================
   FOOTER
   ========================================================== */

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

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

    gap: 3rem;

    max-width: 82rem;

    margin-top: 4.5rem;

    padding-top: 1.8rem;

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


.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__navDirection,

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook-reader__navTitle {
    font-family:
            var(--tb-bloggy-sans);

    color:
            var(--tb-bloggy-accent) !important;
}


/* ==========================================================
   FINAL BLOGGY ACCENT OWNERSHIP
   ========================================================== */

.tb-notebook[data-notebook-style="bloggy"]
.tb-notebook__heading::after {
    background:
            var(--tb-bloggy-accent) !important;
}


.tb-notebook[data-notebook-style="bloggy"]
[data-notebook-entry].is-active {
    background:
            var(--tb-bloggy-accent-med) !important;

    box-shadow:
            inset
            3px
            0
            0
            var(--tb-bloggy-accent) !important;
}


.tb-notebook[data-notebook-style="bloggy"]
[data-notebook-entry].is-active
.tb-notebook-entry__title,

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


.tb-notebook[data-notebook-style="bloggy"]
[data-notebook-previous],

.tb-notebook[data-notebook-style="bloggy"]
[data-notebook-next],

.tb-notebook[data-notebook-style="bloggy"]
[data-notebook-previous]
.tb-notebook-reader__navDirection,

.tb-notebook[data-notebook-style="bloggy"]
[data-notebook-next]
.tb-notebook-reader__navDirection,

.tb-notebook[data-notebook-style="bloggy"]
[data-notebook-previous]
.tb-notebook-reader__navTitle,

.tb-notebook[data-notebook-style="bloggy"]
[data-notebook-next]
.tb-notebook-reader__navTitle {
    color:
            var(--tb-bloggy-accent) !important;
}


/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 1040px) {

    .tb-notebook[data-notebook-style="bloggy"]
    .tb-notebook__intro,

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


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


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 760px) {

    .tb-notebook[data-notebook-style="bloggy"] {
        background:
                var(--tb-bloggy-bg);
    }


    .tb-notebook[data-notebook-style="bloggy"]
    .tb-notebook__intro,

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


    .tb-notebook[data-notebook-style="bloggy"]
    .tb-notebook__intro {
        padding:
                3.2rem
                1.5rem
                2.6rem;
    }


    .tb-notebook[data-notebook-style="bloggy"]
    .tb-notebook__workspace {
        padding:
                0
                1.5rem;
    }


    .tb-notebook[data-notebook-style="bloggy"]
    .tb-notebook__intro::after {
        display: none;
    }


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


    .tb-notebook[data-notebook-style="bloggy"]
    .tb-notebook__heading {
        font-size:
                clamp(
                        3.4rem,
                        10vw,
                        4.5rem
                );

        white-space: normal;
    }


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


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

        border-right: 0;
    }


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


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

        align-items: stretch;
    }


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

        flex-wrap: wrap;
    }


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


    .tb-notebook[data-notebook-style="bloggy"]
    .tb-notebook-reader__toneSlider {
        width: 16rem;
    }


    .tb-notebook[data-notebook-style="bloggy"]
    .tb-notebook-reader__articleMetaRow {
        gap: 1.2rem;
    }


    .tb-notebook[data-notebook-style="bloggy"]
    .tb-notebook-reader__titleActions {
        gap: 0.85rem;
    }
}