@font-face {
    font-family: "ChicagoFLF";
    src: url("../font/ChicagoFLF.woff2") format("woff2");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}
:root {
  /* Pure CSS variables */
  --container-width: 800px;
  --serif-font-stack: "Freight Text", "Georgia", "Charter", serif;
  --sans-font-stack: "Helvetica Neue", "Helvetica", "Source Sans Pro", sans-serif;
  --mono-font-stack: "Source Code Pro", "Consolas", monospace;
  --font-stack: var(--mono-font-stack);
  /* Fallbacks should be provided, of course */
}

.has-serif-font {
  --font-stack: var(--serif-font-stack);
}

.has-sans-font {
  --font-stack: var(--sans-font-stack);
}

body {
  max-width: 800px;
  max-width: var(--container-width);

  padding: 0 0.5rem;

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

  line-height: 1.5;

  font-family: "ChicagoFLF", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--gh-font-heading, var(--font-stack));
}

img {
  max-width: 100%;
  height: auto;
}

figure {
  margin-left: auto;
  margin-right: auto;
}

figcaption {
  text-align: center;
  font-size: 0.75rem;
}

pre {
  overflow: auto;
}

nav ul {
  list-style-type: none;
  padding-left: 0;
}

footer nav {
  font-size: smaller;
}

hr {
  border: none;
  border-top: 1px solid #ccc;
  margin: 1.5rem 0 1.5rem 0;
}

ul {
  padding-inline-start: 1rem;
}

ol {
  padding-inline-start: 1.75rem;
}

.inline-block {
  display: inline-block;
}

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


/* IMAGE WIDTH STYLES */
/* ================== */

/* Style at will... */
/* figure.kg-width-full { } */
/* figure.kg-width-wide { } */
/*
PROTIP:
Try something like as a starting point for centering images that are wider than their parent container's width:

.full-bleed {
	  width: 100vw;
	  position: relative;
	  left: 50%;
	  right: 50%;
	  margin-left: -50vw;
	  margin-right: -50vw;
	}

For large images that aren't full width, but are larger than their parent, just replace 100vw with your max width (say, 1000px), and then replace the -50vw margins with -{NUM}px / 2 (in this case, -500px). You can see a version of this techinique in action in the stylesheet of my MNML Ghost theme:
https://github.com/curiositry/mnml-ghost-theme
*/

/* IMAGE GALLERY STYLES */
/* ==================== */

/* Style at will... */
/* .kg-gallery-card { } */
/* .kg-gallery-container { } */
/* .kg-gallery-row { } */
/* .kg-gallery-image { } */

/*
Docs can be found here: http://themes.ghost.org/docs/ghost-editor#section-gallery-card

The implementation that Ghost recommends is pretty robust, with one caveat: it needs a few lines of JavaScrpt. Example can be found here:
https://github.com/TryGhost/Casper/pull/475/files#diff-ce5e030f2e2e2a50f18199464f07ea70
*/


/* BOOKMARK CARD STYLES */
/* ==================== */

/* This is a lean implementation. Style to taste, or delete if you don’t use this modern stuff. (Note: Ghost will throw warnings on theme activation if you fully remove these classes.) */

/* Required for validation */
.kg-bookmark-card {}

.kg-bookmark-container {
  display: flex;
  flex-wrap: wrap;
  text-decoration: none;
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  background-color: #eee;
  text-align: center;
}

.kg-bookmark-content {
  padding: 1rem;
  order: 2;
  width: 100%;
}

.kg-bookmark-title {
  font-weight: 600;
}

.kg-bookmark-description,
.kg-bookmark-metadata {
  margin-top: 1rem;
  filter: grayscale(75%);
}

.kg-bookmark-thumbnail {
  width: 100%;
}

.kg-bookmark-icon {
  width: 22px;
  height: 22px;
  margin-right: 8px;
  vertical-align: bottom;
}

.kg-bookmark-publisher {
  display: inline-block;
}

.kg-bookmark-author:after {
  content: " • ";
}

/* END BOOKMARK CARD STYLES */

/* RESPONSIVE VIDEO EMBED STYLES */
/* ============================= */

/* This is lightest-weight implementation of responsive video embeds that I have been able to come up with. To cover all edge cases, a JavaScript solution would be needed, but this works in most modern browsers. */

iframe[src*="youtube.com"],
iframe[src*="youtube-nocookie.com"],
iframe[src*="vimeo.com"] {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}

/* END RESPONSIVE EMBED CARD STYLES */



/* MEMBERSHIP STYLES */
/* ================= */

/* Most membership stuff is handled by the Ghost portal. These are used for the optin form 
   at the bottom of each post. Feel free to remove these barebones membership styles if you 
   don't plan on enabling memberships & subscriptions for your blog. */

.notification-area {
  display: none;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  background-color: #82ea02;
  padding: 1rem;
  margin-top: 2rem;
  box-sizing: border-box;
}

.message-success,
.message-error {
  display: none;
  margin-top: 1rem;
}

.message-error,
[data-members-error] {
  color: red;
}

.message-success {
  color: green;
}

.loading button span,
.error button span,
.success button span {
  display: none;
}

.loading button::after {
  content: "Loading...";
}

.error button::after {
  content: "Error :(";
}

.success button::after {
  content: "Success :)";
}

.success~.message-success,
.invalid~.message-error,
.error~.message-error {
  display: block;
}


/* WELCOME MAT STYLES */

.membership-widget--welcome-mat {
  height: 100vh;
  width: 100vw;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100vw;
  position: absolute;
  left: 0;
  background-color: var(--tertiary-color);
}

.membership-widget--welcome-mat h4 {
  text-transform: uppercase;
  font-weight: 400;
}

.membership-widget--welcome-mat .welcome-mat-optin-cta {
  line-height: 1.618;
}

body:has(.membership-widget--welcome-mat) {
  margin-top: 0 !important;
}

.membership-widget--welcome-mat+.main-header {
  padding-top: calc(100vh + 1rem);
}

/* END MEMBERSHIP STYLES */

@media all and (min-width: 800px) {

  ol,
  ul {
    /* Hanging punctuation */
    padding-inline-start: 0;
  }

  nav li,
  nav ul {
    display: inline;
  }

  nav li {
    margin: 0.5rem;
  }

  .form-group {
    display: inline;
  }

  .site-footer__attribution>div {
    display: inline-block;
    margin: 0.5rem;
  }

}


@media print {
  p {
    text-indent: 0 !important;
  }
}

/* AUTHOR PAGES AND EDITABLE BIOS */
/* Existing author pages — shared bio layout. */
.dogtown-author-page {
    --dogtown-bio-name-font: "ChicagoFLF", sans-serif;
    --dogtown-bio-body-font: "ChicagoFLF", sans-serif;
    --dogtown-bio-detail-font: Verdana, Geneva, sans-serif;
    --dogtown-bio-grey: var(--dogtown-grey, #777777);
    --dogtown-bio-gap: 48px;
    min-width: 0;
}

.dogtown-author-page .dogtown-author-bio {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    align-items: start;
    gap: var(--dogtown-bio-gap);
    margin: 24px 0 48px;
    width: 100%;
    text-align: left;
}

.dogtown-author-page .dogtown-author-bio--no-photo {
    grid-template-columns: minmax(0, 1fr);
}

.dogtown-author-main,
.dogtown-author-sidebar-bio {
    min-width: 0;
}

.dogtown-author-page .dogtown-author-name {
    margin: 0 0 12px !important;
    padding: 0;
    color: var(--dogtown-red, #B01701) !important;
    font-family: var(--dogtown-bio-name-font) !important;
    font-size: clamp(30px, 4vw, 48px);
    font-weight: 400;
    line-height: 1.1;
    text-align: left !important;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.dogtown-author-page .dogtown-author-role {
    margin: 0 0 30px !important;
    color: var(--dogtown-bio-grey) !important;
    font-family: var(--dogtown-bio-detail-font) !important;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;
    text-transform: uppercase;
}

.dogtown-author-header {
    margin: 0 0 24px;
}

.dogtown-author-header:has(.dogtown-author-role) {
    margin-bottom: 0;
}

.dogtown-author-page .dogtown-author-copy {
    color: #000000;
    font-family: var(--dogtown-bio-body-font) !important;
    font-size: 18px;
    line-height: 1.65;
    overflow-wrap: break-word;
}

.dogtown-author-page .dogtown-author-copy p {
    margin: 0 0 24px;
    color: inherit;
    font: inherit;
}

.dogtown-author-page .dogtown-author-copy p:last-child {
    margin-bottom: 0;
}

.dogtown-author-page .dogtown-author-portrait {
    width: 100%;
    margin: 0 !important;
    padding: 0;
}

.dogtown-author-page .dogtown-author-photo {
    display: block;
    float: none;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.dogtown-author-page .dogtown-author-caption {
    display: block;
    margin: 18px 0 0 !important;
    padding: 0;
    color: var(--dogtown-bio-grey) !important;
    font-family: var(--dogtown-bio-detail-font) !important;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.65;
    text-align: left;
    overflow-wrap: break-word;
}

.dogtown-author-page .dogtown-author-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin: 28px 0 0;
    color: var(--dogtown-bio-grey);
    font-family: var(--dogtown-bio-detail-font);
    font-size: 12px;
    line-height: 1.5;
}

.dogtown-author-page .dogtown-author-links a {
    color: var(--dogtown-red, #B01701);
    overflow-wrap: anywhere;
}

.dogtown-author-links a:focus-visible {
    outline: 2px solid var(--dogtown-red, #B01701);
    outline-offset: 3px;
}

.dogtown-author-posts {
    margin: 0 0 40px;
    padding: 24px 0 0;
    border-top: 2px dotted var(--dogtown-red, #B01701);
}

.dogtown-author-page .dogtown-author-posts-title {
    margin: 0 0 20px;
    color: var(--dogtown-red, #B01701);
    font-family: var(--dogtown-bio-name-font);
    font-size: 24px;
    font-weight: 400;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

@media (max-width: 700px) {
    .dogtown-author-page .dogtown-author-bio {
        grid-template-columns: minmax(0, 1fr);
        gap: 32px;
    }

    .dogtown-author-page .dogtown-author-role {
        margin-bottom: 24px !important;
    }
}


/* Keep editor cards inside the biography column, including wide/full-width cards. */
.dogtown-author-page .dogtown-author-copy {
    display: block;
    min-width: 0;
}

.dogtown-author-page .dogtown-author-copy > *,
.dogtown-author-page .dogtown-author-copy .kg-width-wide,
.dogtown-author-page .dogtown-author-copy .kg-width-full {
    box-sizing: border-box;
    width: auto;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.dogtown-author-page .dogtown-author-copy img,
.dogtown-author-page .dogtown-author-copy video,
.dogtown-author-page .dogtown-author-copy iframe {
    max-width: 100%;
}

.dogtown-author-page .dogtown-author-socials {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
    margin-top: 32px !important;
}

.dogtown-author-page .dogtown-author-social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--dogtown-red, #B01701);
}

.dogtown-author-page .dogtown-author-social-link img {
    display: block;
    width: 22px;
    height: 22px;
    margin: 0;
}

.dogtown-author-page .dogtown-bio-profile-link {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
}

/* Manual BIOS directory: normal linked paragraphs or list items in Ghost. */
.dogtown-bios-directory {
    margin: 30px 0;
}

.dogtown-bios-directory ul,
.dogtown-bios-directory ol {
    list-style: none;
    padding-left: 0;
}

.dogtown-bios-directory p,
.dogtown-bios-directory li {
    margin: 0 0 16px;
    color: var(--dogtown-grey, #777777);
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.6;
}

.dogtown-bios-directory a {
    color: var(--dogtown-red, #B01701) !important;
    font-family: "ChicagoFLF", sans-serif !important;
    font-size: 22px;
    text-transform: uppercase;
}

/* DOGTOWN DESIGN — EDIT THE BRAND VARIABLES BELOW */
/* ==================================================
   DOGTOWN — BRAND VARIABLES
   ================================================== */

:root {
    --dogtown-red: #B01701;
    --dogtown-grey: #777777;
    --dogtown-date-text: #777777;
    --dogtown-sidebar-grey: #999999;
    --dogtown-black: #000000;
    --dogtown-pink: #F0CDB1;

    /* Inner pages: match the BIOS title; homepage keeps its current layout. */
    --dogtown-inner-title-size: 48px;
    --dogtown-inner-title-line-height: 1.05;
    --dogtown-description-nav-gap: 20px;
    --dogtown-tag-background: #FFFF00;
    --dogtown-tag-text: #000000;
    --dogtown-tag-hover-background: #FFD700;
    --dogtown-tag-font-family: Verdana, Geneva, sans-serif;
    --dogtown-tag-font-size: 11px;
    --dogtown-tag-font-weight: 700;
    --dogtown-tag-line-height: 1.4;
    --dogtown-tag-text-transform: uppercase;
    --dogtown-tag-padding: 4px 9px;
    --dogtown-tag-radius: 3px;
    --dogtown-tag-selected-background: #000000;
    --dogtown-tag-selected-text: #FFFF00;
    --dogtown-tag-selected-hover-background: #333333;
}

/* ==================================================
   GLOBAL
   ================================================== */

html {
    color-scheme: light !important;
}

html,
body {
    background-color: var(--dogtown-pink) !important;
}

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

.main-header__blog-title {
    display: none !important;
}

.main-header img {
    display: block;
    width: auto !important;
    max-width: 65% !important;
    height: auto !important;
    margin: 30px auto 10px !important;
}

.main-header__blog-description,
.main-header__description,
.main-header__tagline,
.main-header__blog-title + *,
.main-header__blog-title + * a,
.main-header__blog-title + * strong {
    margin-top: 0 !important;
    font-family: "ChicagoFLF", sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
    color: var(--dogtown-grey) !important;
}

/* SAME DESCRIPTION-TO-NAVIGATION GAP ON EVERY PAGE */

#body .main-header :is(
    .main-header__blog-description,
    .main-header__description,
    .main-header__tagline
) {
    margin-bottom: var(--dogtown-description-nav-gap) !important;
}

#body .main-header nav,
#body .main-header nav > ul {
    margin-top: 0 !important;
}

/* DESCRIPTION LINK — KEEP ITS ORIGINAL APPEARANCE */

.main-header a.dogtown-description-link,
.main-header a.dogtown-description-link:link,
.main-header a.dogtown-description-link:visited,
.main-header a.dogtown-description-link:hover,
.main-header a.dogtown-description-link:focus,
.main-header a.dogtown-description-link:active {
    color: inherit !important;
    font: inherit !important;
    text-transform: inherit !important;
    text-decoration: none !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* DESCRIPTION LINK — BLACK ON HOVER */

.main-header a.dogtown-description-link:hover,
.main-header a.dogtown-description-link:focus-visible {
    color: #000000 !important;
}

/* ==================================================
   NAVIGATION — CHICAGOFLF / 11PT / BOLD
   ================================================== */

.main-header nav,
.main-header nav a {
    font-family: "ChicagoFLF", sans-serif !important;
    font-size: 11pt !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}

.main-header nav a,
.main-header nav a:link,
.main-header nav a:visited,
.main-header nav a:hover,
.main-header nav a:focus {
    color: var(--dogtown-red) !important;
    text-decoration: none !important;
}

/* NAVIGATION — ONE ROW, UNBROKEN LABELS */

.main-header nav {
    max-width: 100%;
    overflow-x: auto;
    padding-bottom: 6px;
}

.main-header nav > ul.nav {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
    justify-content: center;
    gap: 12px;
    box-sizing: border-box;
    width: max-content;
    min-width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}

.main-header nav > ul.nav > li {
    display: block !important;
    flex: 0 0 auto;
    margin: 0 !important;
    padding: 0 !important;
}

.main-header nav > ul.nav > li > a {
    display: inline-block;
    white-space: nowrap !important;
}

/* ==================================================
   SITE-WIDE LINKS
   ================================================== */

a,
a:link,
a:visited,
a:hover,
a:focus,
a:active {
    color: var(--dogtown-red) !important;
    text-decoration-color: var(--dogtown-red) !important;
}

/* GLOBAL LINK UNDERLINES — DOTTED, INCLUDING HOVER STATES */

#body a {
    text-decoration-style: dotted !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 4px !important;
}

/* ==================================================
   HOMEPAGE LAYOUT
   ================================================== */

.dogtown-home-layout {
    width: min(1200px, calc(100% - 40px));
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    display: grid !important;
    grid-template-columns: minmax(0, 4fr)
        minmax(170px, 1fr);
    column-gap: 45px;
    align-items: stretch;
    overflow: visible !important;
}

/* ==================================================
   POSTS
   ================================================== */

.dogtown-home-posts {
    min-width: 0;
    overflow: visible !important;
}

.post__content,
.post__content p,
.post__content li,
.post__content blockquote,
.dogtown-home-preview,
.dogtown-home-preview p {
    font-family: "ChicagoFLF", sans-serif !important;
    font-weight: 400 !important;
}

/* POST HEADLINES — CHICAGOFLF / BOLD / TIGHT LINES */

.post__title,
.post__title a {
    font-size: 48px !important;
    color: var(--dogtown-red, #B01701) !important;
    text-decoration: none !important;
}

.post__title {
    margin-bottom: 0 !important;
}

/* HOMEPAGE — FEATURED IMAGES */

.dogtown-home-posts .dogtown-home-feature {
    display: block;
    width: 100%;
    margin: 20px 0;
    padding: 0;
    line-height: 0;
    text-decoration: none !important;
}

.dogtown-home-posts .dogtown-home-feature img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

/* ==================================================
   POST AUTHOR + PUBLISH DATE
   ================================================== */

.dogtown-post-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 4px;
    margin-bottom: 1.5rem;
    font-family: Verdana, Geneva, sans-serif !important;
    font-size: 12px;
    font-weight: 700 !important;
    line-height: 1.2;
    color: var(--dogtown-black);
    text-transform: uppercase;
}

.dogtown-post-author,
.dogtown-post-author a,
.dogtown-post-author a:visited {
    color: var(--dogtown-grey) !important;
    text-decoration: none !important;
}

.dogtown-post-author a:hover {
    text-decoration: underline !important;
}

.dogtown-post-meta-separator {
    color: var(--dogtown-black);
}

/* DATES — GREY TEXT; WHITE BYLINE HIGHLIGHT */

#body #content :is(time, .dogtown-post-date) {
    color: var(--dogtown-date-text, #777777) !important;
}

#body #content .dogtown-post-date {
    display: inline-block;
    padding: 3px 6px;
    background-color: #FFFFFF !important;
    white-space: nowrap;
}

/* ==================================================
   POST FOOTER — LEFT-ALIGNED
   ================================================== */

.dogtown-home-post-footer {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start !important;
    gap: 12px;
    text-align: left;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

/* ==================================================
   TAGS — WRAPPING LAYOUT
   ================================================== */

.dogtown-home-tags {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start !important;
    gap: 6px;
    max-width: 100%;
    margin: 0 !important;
    font-size: 0.9em;
}

.dogtown-full-article {
    white-space: nowrap;
    font-weight: 700;
}

/* FULL POST LINK — DOTTED UNDERLINE */

.dogtown-home-post-footer a.dogtown-full-article {
    display: inline-block;
    width: fit-content;
    border-bottom: 3px dotted var(--dogtown-red, #B01701) !important;
    padding-bottom: 3px;
    text-decoration: none !important;
}

/* ==================================================
   DIVIDER BETWEEN ARTICLES
   ================================================== */

.dogtown-post-divider {
    width: 80%;
    margin: 2.5rem auto;
    border: 0 !important;
    border-top: 2px dotted rgba(184, 29, 0, 0.4) !important;
}

/* ==================================================
   RIGHT SIDEBAR — TYPOGRAPHY + GREY TEXT
   ================================================== */

.dogtown-author-sidebar,
.dogtown-author-sidebar-inner {
    margin: 0;
    padding: 0;
    font-family: Verdana, Geneva, sans-serif !important;
    font-size: 12px;
    font-weight: 700 !important;
    line-height: 1.4;
    color: var(--dogtown-grey, #777777) !important;
}

/* ==================================================
   SIDEBAR CONTAINER
   ================================================== */

.dogtown-author-sidebar {
    min-width: 0;
    align-self: stretch;
    position: relative;
    overflow: visible !important;
}

/* ==================================================
   SIDEBAR CONTENT — SCROLLS WITH THE PAGE
   ================================================== */

.dogtown-author-sidebar-inner {
    position: static !important;
    top: auto;
    box-sizing: border-box;
    width: 100%;
    height: auto;
    max-height: none !important;
    overflow: visible !important;
    z-index: auto;
}

/* ==================================================
   SIDEBAR IMAGE 1 — DOG MODE RECORDS
   ================================================== */

.dogtown-sidebar-records {
    width: 100%;
    max-width: 100px;
}

/* RECORDS IMAGE — REMOVE EXTRA SPACING */

.dogtown-author-sidebar .dogtown-sidebar-records {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0;
}

.dogtown-author-sidebar .dogtown-sidebar-records > a {
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0;
}

.dogtown-author-sidebar .dogtown-sidebar-records-image {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    margin: 0 !important;
    padding: 0 !important;
}

.dogtown-sidebar-image-two-img {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    object-fit: contain;
}

/* ==================================================
   SIDEBAR IMAGE 2 — DOG MODE TV
   ================================================== */

.dogtown-sidebar-image-two {
    width: 100%;
    max-width: 100px;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
}

/* SIDEBAR — DOG MODE RECORDS BUTTON */

.dogtown-home-tags.dogtown-records-button {
    margin: 10px 0 !important;
}

/* YOUTUBE — IMAGE 3 BELOW DOG MODE RECORDS */

.dogtown-sidebar-youtube {
    margin: 20px 0;
    padding: 0;
}

.dogtown-author-sidebar .dogtown-sidebar-youtube-logo {
    display: block;
    width: 100px;
    margin-top: 0;
    margin-bottom: 20px !important;
    margin-left: 0;
}

.dogtown-author-sidebar .dogtown-sidebar-youtube-logo img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain;
}

/* ==================================================
   TABLE OF CONTENTS
   ================================================== */

.dogtown-toc {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding-top: 0;
    padding-bottom: 4rem;
}

.dogtown-toc-title {
    margin-bottom: 2rem;
    font-weight: 700;
    text-align: left;
    color: var(--dogtown-red);
}

.dogtown-toc-list {
    width: 100%;
}

.dogtown-toc-row {
    display: grid;
    grid-template-columns: max-content
        max-content
        minmax(0, 1fr);
    gap: 10px;
    align-items: baseline;
    margin-bottom: 10px;
}

.dogtown-toc-date {
    white-space: nowrap;
}

/* TABLE OF CONTENTS — SAME STYLE, KEEP EXISTING SIZE */

.dogtown-toc-link,
.dogtown-filter-post-title,
.dogtown-filter-post-title a {
    font-family: "ChicagoFLF", sans-serif !important;
    font-weight: 700 !important;
    line-height: 1.05 !important;
    color: var(--dogtown-red, #B01701) !important;
}

.dogtown-toc-link {
    text-decoration: underline;
}

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

.site-footer {
    width: 100vw !important;
    max-width: none !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 20px;
    display: block !important;
    clear: both !important;
    grid-column: 1 / -1 !important;
    text-align: center !important;
    font-family: Verdana, Geneva, sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.5;
}

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

.site-footer__navigation,
.site-footer__attribution,
.site-footer__attribution--copyright,
.site-footer__attribution > div {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    float: none !important;
    text-align: center !important;
}

/* ==================================================
   FOOTER NAVIGATION — ALL CAPS
   ================================================== */

.site-footer__navigation,
.site-footer__navigation a {
    text-transform: uppercase !important;
}

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

.site-footer a,
.site-footer a:link,
.site-footer a:visited,
.site-footer a:hover,
.site-footer a:focus {
    color: var(--dogtown-red) !important;
    text-decoration-color: var(--dogtown-red) !important;
}

/* FOOTER NAVIGATION LINKS — 13PX */

.site-footer .site-footer__navigation a {
    font-size: 13px !important;
}

/* ==================================================
   GLOBAL TAG STYLE — POST LINKS + SIDEBAR BUTTONS
   Edit the --dogtown-tag-* variables at the top.
   ================================================== */

.dogtown-home-tags a,
.dogtown-filter-tags .dogtown-tag {
    display: inline-block;
    box-sizing: border-box;
    margin: 0;
    padding: var(--dogtown-tag-padding);
    border: 0;
    border-radius: var(--dogtown-tag-radius);
    appearance: none;
    box-shadow: none;
    background-color: var(--dogtown-tag-background) !important;
    color: var(--dogtown-tag-text) !important;
    font-family: var(--dogtown-tag-font-family) !important;
    font-size: var(--dogtown-tag-font-size);
    font-weight: var(--dogtown-tag-font-weight);
    line-height: var(--dogtown-tag-line-height);
    text-transform: var(--dogtown-tag-text-transform) !important;
    text-decoration: none !important;
    text-decoration-color: currentColor !important;
    text-align: left;
    overflow-wrap: anywhere;
}

.dogtown-home-tags a:hover,
.dogtown-home-tags a:focus-visible,
.dogtown-filter-tags .dogtown-tag:hover,
.dogtown-filter-tags .dogtown-tag:focus-visible {
    background-color: var(--dogtown-tag-hover-background) !important;
    text-decoration: underline !important;
}

.dogtown-filter-tags .dogtown-tag[aria-pressed="true"] {
    background-color: var(--dogtown-tag-selected-background) !important;
    color: var(--dogtown-tag-selected-text) !important;
}

.dogtown-filter-tags .dogtown-tag[aria-pressed="true"]:hover,
.dogtown-filter-tags .dogtown-tag[aria-pressed="true"]:focus-visible {
    background-color: var(--dogtown-tag-selected-hover-background) !important;
}

.dogtown-home-tags a:focus-visible,
.dogtown-filter-tags .dogtown-tag:focus-visible,
.dogtown-filter-clear:focus-visible,
.dogtown-filter-retry:focus-visible {
    outline: 2px solid var(--dogtown-red);
    outline-offset: 2px;
}

/* ==================================================
   HOMEPAGE FILTER — CONTROLS
   ================================================== */

.dogtown-tag-filter {
    margin-top: 24px;
}

.dogtown-tag-filter .dogtown-filter-label {
    color: var(--dogtown-red) !important;
    margin: 0 0 8px;
    font: inherit;
    font-weight: 700;
}

.dogtown-filter-help {
    margin: 0 0 12px;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.5;
}

.dogtown-filter-tags {
    max-height: none !important;
    overflow: visible !important;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 6px;
    padding: 4px 3px;
    margin: -4px -3px 0;
}

.dogtown-filter-tags .dogtown-tag {
    max-width: 100%;
    cursor: pointer;
}

.dogtown-filter-clear,
.dogtown-filter-retry {
    display: inline-block;
    margin: 12px 0 0;
    padding: 4px 0;
    border: 0;
    background: transparent;
    color: var(--dogtown-red) !important;
    font: inherit;
    font-size: 11px;
    text-align: left;
    text-decoration: underline;
    cursor: pointer;
}

.dogtown-tag-filter[hidden],
.dogtown-filter-results[hidden],
[data-dogtown-feed][hidden],
.dogtown-tag-filter [hidden],
.dogtown-filter-results [hidden] {
    display: none !important;
}

/* ==================================================
   HOMEPAGE FILTER — COMPACT TABLE OF CONTENTS
   ================================================== */

.dogtown-filter-help:empty {
    display: none;
}

.dogtown-filter-results {
    min-width: 0;
}

.dogtown-filter-results-title {
    margin: 0 0 12px;
    color: var(--dogtown-red) !important;
    font-family: "ChicagoFLF", sans-serif;
    font-size: 24px;
    line-height: 1.2;
}

.dogtown-filter-summary,
.dogtown-filter-empty {
    margin: 0 0 20px;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.dogtown-filter-row {
    padding: 16px 0;
    border-bottom: 2px dotted rgba(184, 29, 0, 0.4);
}

.dogtown-filter-row-heading {
    display: grid;
    grid-template-columns: max-content max-content minmax(0, 1fr);
    align-items: baseline;
    gap: 10px;
    line-height: 1.4;
}

.dogtown-filter-post-title {
    margin: 0;
    font-size: 20px;
    overflow-wrap: anywhere;
}

.dogtown-filter-post-meta {
    margin: 6px 0 10px;
    line-height: 1.4;
}

.dogtown-filter-post-tags:empty {
    display: none;
}

.dogtown-home-pagination {
    margin: 20px 0;
}

/* MAIN TITLES — RED */

.post-template .post__title,
.post-template .post__title a,
.article-template .post__title,
.article-template .post__title a,
body main h1,
body #content h1,
.post__title,
.post__title a,
.page__title,
.author__title,
.author__name,
.content-header h1,
.content-header__title,
.content-header__title a {
    color: var(--dogtown-red, #B01701) !important;
}

/* SIGNUP WIDGET — LARGER TEXT */

.email-optin-widget small,
.email-optin-widget button,
.email-optin-widget button span,
.email-optin-widget input[type="email"] {
    font-size: 18px !important;
}

/* SOCIAL LOGO SPACING */

.dogtown-author-socials {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px !important;
    margin-top: 0;
}

/* SIMPLE AUTHOR LIST */

.dogtown-bios-list {
    list-style: none;
    margin: 30px 0;
    padding: 0;
}

.dogtown-bios-list li {
    margin-bottom: 16px;
    line-height: 1.6;
}

.dogtown-bios-list a {
    font-family: "ChicagoFLF", sans-serif !important;
    font-size: 22px;
    text-transform: uppercase;
    color: var(--dogtown-red, #B01701) !important;
}

.dogtown-bios-list .dogtown-author-role {
    display: inline;
    margin: 0;
    font-family: Verdana, Geneva, sans-serif !important;
    font-size: 12px;
    font-weight: 700;
    color: var(--dogtown-grey, #777777);
}

.dogtown-bios-list .dogtown-author-role::before {
    content: " — ";
}

/* MAKE THE HTML CARD FILL THE CONTENT WIDTH */

.kg-html-card:has(.dogtown-merch-product) {
    width: 100% !important;
    max-width: none !important;
    justify-self: stretch !important;
}

/* Product layout and image size are set in the merch page HTML card. */

/* ALL PAGE AND POST HEADINGS — BOLD CHICAGO */

body :is(h1, h2, h3, h4, h5, h6),
body :is(h1, h2, h3, h4, h5, h6) *,
body .content-header__title,
body .page__title,
body .post__title,
body .dogtown-toc-title,
body .dogtown-toc-link,
body .dogtown-filter-post-title,
body .dogtown-filter-post-title a {
    font-family: "ChicagoFLF", sans-serif !important;
    font-weight: 700 !important;
    line-height: 1.05 !important;
}

/* NAVIGATION UNDERLINES — ALL ON MOBILE; CURRENT PAGE ON DESKTOP */

.main-header nav a,
.main-header nav .nav-current a,
.main-header nav a.nav-current {
    border-bottom: 3px dotted var(--dogtown-red, #B01701) !important;
    padding-bottom: 3px;
    text-decoration: none !important;
}

/* SPACE BELOW THE NAVIGATION */

.main-header nav {
    margin-bottom: 28px !important;
}

/* FIRST POST — REMOVE EXTRA TOP SPACING */

.dogtown-home-posts,
.dogtown-home-posts [data-dogtown-feed],
.dogtown-home-posts [data-dogtown-feed] > .post:first-child,
.dogtown-home-posts [data-dogtown-feed] > .post:first-child > .post__header,
.dogtown-home-posts [data-dogtown-feed] > .post:first-child .post__title {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ==================================================
   INNER PAGES — SHARED TITLE SIZE AND TOP SPACING
   BIOS is the reference: ChicagoFLF, bold, 48px desktop.
   ================================================== */

body:not(:has(.dogtown-home-layout)) #content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body:not(:has(.dogtown-home-layout)) #content > :is(
    .post,
    .page,
    .dogtown-author-bio
),
body:not(:has(.dogtown-home-layout)) #content :is(
    .post__header,
    .page__header
) {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

body:not(:has(.dogtown-home-layout)) #content :is(
    .post__title,
    .page__title,
    .dogtown-toc-title,
    .dogtown-author-name,
    .content-header__title
) {
    margin-top: 0 !important;
    font-family: "ChicagoFLF", sans-serif !important;
    font-size: var(--dogtown-inner-title-size) !important;
    font-weight: 700 !important;
    line-height: var(--dogtown-inner-title-line-height) !important;
    color: var(--dogtown-red, #B01701) !important;
    text-align: left !important;
    overflow-wrap: anywhere;
}

/* Contact Us uses the same typography, centered. */
body:has(.dogtown-contact-form) #content :is(
    .post__title,
    .page__title,
    .content-header__title
),
body.page-contact-us #content :is(
    .post__title,
    .page__title,
    .content-header__title
) {
    text-align: center !important;
    width: 100%;
}

/* Manual directory: linked names, plain Verdana roles. */
.dogtown-bios-directory p,
.dogtown-bios-directory li {
    color: var(--dogtown-grey, #777777) !important;
    font-family: Verdana, Geneva, sans-serif !important;
    font-size: 12px;
    font-weight: 700;
}

.dogtown-bios-directory a,
.dogtown-bios-directory a * {
    color: var(--dogtown-red, #B01701) !important;
    font-family: "ChicagoFLF", sans-serif !important;
    font-size: 22px;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* BIOS DIRECTORY — DOTTED AUTHOR LINKS */

#body .dogtown-bios-directory a {
    text-decoration-line: underline !important;
    text-decoration-style: dotted !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 4px !important;
}

/* RESPONSIVE LAYOUT — DESKTOP, TABLET AND MOBILE */

@media (min-width: 601px) {
    .dogtown-home-layout {
        align-items: start;
    }

    .dogtown-author-sidebar,
    .dogtown-author-sidebar-inner {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .main-header nav a {
        border-bottom: none !important;
    }

    .main-header nav .nav-current a,
    .main-header nav a.nav-current {
        border-bottom: 3px dotted var(--dogtown-red, #B01701) !important;
    }
}

@media (max-width: 900px) {
    .dogtown-home-layout {
        grid-template-columns: minmax(0, 18fr)
            minmax(140px, 7fr);
        column-gap: 25px;
    }
}

@media (max-width: 600px) {
    /* Mobile navigation wraps into centered rows. */
    .main-header nav {
        overflow: visible;
    }

    .main-header nav > ul.nav {
        flex-wrap: wrap !important;
        width: 100%;
        min-width: 0;
        gap: 10px 14px;
    }

    :root {
        --dogtown-inner-title-size: 28px;
        --dogtown-description-nav-gap: 10px;
    }

    .dogtown-home-layout {
        width: calc(100% - 40px);
        grid-template-columns: 1fr;
        row-gap: 40px;
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .post__title,
    .post__title a {
        font-size: 28px !important;
    }

    .dogtown-author-sidebar {
        grid-column: 1;
        display: contents;
        margin-top: 0;
    }

    .dogtown-author-sidebar-inner {
        display: contents;
    }


    .dogtown-toc {
        padding-left: 20px;
        padding-right: 20px;
    }

    .dogtown-toc-row {
        gap: 6px;
        font-size: 0.9rem;
    }

    .dogtown-home-posts {
        grid-row: 1;
    }

    .dogtown-sidebar-editorial {
        grid-column: 1;
        grid-row: 2;
    }

    .dogtown-filter-row-heading {
        gap: 6px;
        font-size: 12px;
    }

    .dogtown-filter-post-title {
        font-size: 18px;
    }

    .main-header {
        margin-bottom: 12px !important;
        padding-bottom: 0 !important;
    }

}

/* DOG MODE — EVERY PAGE */
html[data-dogtown-mode="dark"] {
    --dogtown-pink: #000000;
    --dogtown-grey: #BBBBBB;
    --dogtown-sidebar-grey: #BBBBBB;
    background-color: #000000 !important;
}

html[data-dogtown-mode="dark"] #body {
    background-color: #000000 !important;
    color: #F5F5F5 !important;
}

/* Text with a fixed black color in the current theme. */
html[data-dogtown-mode="dark"] #body :is(
    .dogtown-author-copy,
    .dogtown-merch-price,
    #dogtown-contact-status
) {
    color: #F5F5F5 !important;
}

html[data-dogtown-mode="dark"] #body .dogtown-author-page {
    --dogtown-bio-grey: #BBBBBB;
}

html[data-dogtown-mode="dark"] #body .dogtown-contribute-hint {
    color: #BBBBBB;
}

html[data-dogtown-mode="dark"] #body .dogtown-contribute-status:not([data-state="error"]) {
    color: #F5F5F5;
}


html[data-dogtown-mode="dark"] #body .main-header a.dogtown-description-link:hover,
html[data-dogtown-mode="dark"] #body .main-header a.dogtown-description-link:focus-visible {
    color: #FFFFFF !important;
}

/* DARK MODE LABEL — YELLOW HIGHLIGHT */
html[data-dogtown-mode="dark"] #body .main-header__blog-description::after {
    content: "DARK MODE";
    display: block;
    width: fit-content;
    margin: 8px auto 0;
    padding: 4px 9px;

    background-color: var(--dogtown-tag-background, #FFFF00);
    color: #000000;
    border-radius: var(--dogtown-tag-radius, 3px);

    font: 700 11px/1.4 Verdana, Geneva, sans-serif;
    text-align: center;
    text-transform: uppercase;
}

/* TOGGLE — UPPER RIGHT */
#body #dogtown-mode-control {
    position: fixed;
    top: 14px;
    right: 20px;
    z-index: 1000;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px 6px;
    border-radius: 6px;
    background: var(--dogtown-pink, #F0CDB1);
}

#body #dogtown-mode-control .dogtown-mode-label {
    color: var(--dogtown-grey, #777777) !important;
    font: 700 10px/1.4 Verdana, Geneva, sans-serif !important;
    text-transform: uppercase;
}

#body #dogtown-mode-switch {
    position: relative;
    display: inline-flex;
    align-items: center;
    box-sizing: border-box;
    flex: 0 0 48px;
    width: 48px;
    height: 28px;
    margin: 0;
    padding: 3px;
    border: 0 !important;
    border-radius: 999px;
    background: #777777 !important;
    box-shadow: none !important;
    appearance: none;
    cursor: pointer;
}

#body #dogtown-mode-switch::after {
    content: "";
    display: block;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #FFFFFF;
    transform: translateX(0);
    transition: transform 150ms ease;
}

#body #dogtown-mode-switch[aria-checked="true"] {
    background: var(--dogtown-tag-background, #FFFF00) !important;
}

#body #dogtown-mode-switch[aria-checked="true"]::after {
    background: #000000;
    transform: translateX(20px);
}

#body #dogtown-mode-switch:focus-visible {
    outline: 2px solid var(--dogtown-red, #B01701);
    outline-offset: 4px;
}

@media (max-width: 600px) {
    #body #dogtown-mode-control {
        top: 8px;
        right: 10px;
    }

    #body .main-header {
        padding-top: 40px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    #body #dogtown-mode-switch::after {
        transition: none;
    }
}

/* DOG MODE — BYLINE AND SEPARATOR */
html[data-dogtown-mode="dark"] #body #content :is(
    .dogtown-post-meta,
    .dogtown-post-author,
    .dogtown-post-author a,
    .dogtown-post-author a:visited,
    .dogtown-post-meta-separator
) {
    color: var(--dogtown-grey, #BBBBBB) !important;
}

/* BIOS DIRECTORY — MANUALLY ENTERED ROLE TITLES */
html[data-dogtown-mode="dark"] #body .dogtown-bios-directory {
    --dogtown-grey: var(--dogtown-red, #B01701);
}
html[data-dogtown-mode="dark"] #body .dogtown-bios-directory :is(
    p, li, .dogtown-author-role
) {
    color: var(--dogtown-red, #B01701) !important;
}

/* HEADER LOGOS — ONE IMAGE PER MODE; REGULAR LOGO IS THE FALLBACK */
html #body #main-header img.dogtown-logo-default { display: block !important; }
html #body #main-header img.dogtown-logo-dark { display: none !important; }
html[data-dogtown-mode="dark"] #body #main-header .dogtown-mode-logos img.dogtown-logo-default {
    display: none !important;
}
html[data-dogtown-mode="dark"] #body #main-header .dogtown-mode-logos img.dogtown-logo-dark {
    display: block !important;
}