/* Scrappy Kin adapter. Loaded after Source; edit directly, no build step. */
@font-face {
    font-family: "Londrina Solid";
    src: url("../fonts/londrina-solid-400.ttf") format("truetype");
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: "Bricolage Grotesque";
    src: url("../fonts/bricolage-grotesque-400.ttf") format("truetype");
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: "Bricolage Grotesque";
    src: url("../fonts/bricolage-grotesque-700.ttf") format("truetype");
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: "Martian Mono";
    src: url("../fonts/martian-mono-400.ttf") format("truetype");
    font-weight: 400;
    font-display: swap;
}

/* Paper plus ink: pale surfaces are pink, never white or neutral grey. */
:root, :root.has-light-text, :is(.gh-navigation, .gh-footer).has-accent-color {
    --kin-paper: #ffc0c0;
    --kin-ink: #201818;
    --kin-muted: #664747;
    --kin-wash: #e8acac;
    --background-color: var(--kin-paper);
    --ghost-accent-color: var(--kin-ink);
    --color-white: var(--kin-paper);
    --color-black: var(--kin-ink);
    --color-lighter-gray: var(--kin-wash);
    --color-light-gray: #d69c9c;
    --color-mid-gray: #b68181;
    --color-dark-gray: var(--kin-muted);
    --color-darker-gray: var(--kin-ink);
    --color-primary-text: var(--kin-ink);
    --color-secondary-text: var(--kin-muted);
    --color-border: #b68181;
    --color-dark-border: var(--kin-ink);
    --font-sans: "Bricolage Grotesque", sans-serif;
    --font-serif: var(--font-sans);
    --font-serif-alt: var(--font-sans);
    --font-mono: "Martian Mono", monospace;
    --gh-font-body: var(--font-sans);
    --gh-font-heading: "Londrina Solid", sans-serif;
    --container-width: 1120px;
}
body { background: var(--kin-paper); color: var(--kin-ink); }
::selection { background: var(--kin-ink); color: var(--kin-paper); }
a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible {
    outline: 3px solid currentColor;
    outline-offset: 5px;
}
.kin-skip {
    position: absolute;
    top: 8px;
    left: 16px;
    z-index: 100;
    padding: 10px 16px;
    background: var(--kin-ink);
    color: var(--kin-paper);
    transform: translateY(-160%);
}
.kin-skip:focus { transform: none; }
.gh-navigation { border-bottom: 2px solid var(--kin-ink); }
.gh-navigation-logo { font-family: var(--gh-font-heading); font-weight: 400; }
.gh-navigation :is(.nav, .gh-navigation-actions), .gh-footer-menu,
.gh-card-meta, .gh-card-tag, .gh-article-tag, .gh-article-meta-content,
.gh-container-title, .gh-footer-copyright {
    font-family: var(--font-mono);
    font-size: 1.2rem;
    font-weight: 400;
    letter-spacing: 0;
}
.gh-navigation a:hover, .gh-footer a:hover { text-decoration: underline; opacity: 1; }
.kin-masthead { padding-block: 52px 40px; }
.kin-masthead-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding-bottom: 32px;
    border-bottom: 8px solid var(--kin-ink);
}
.kin-masthead h1 {
    font-family: var(--gh-font-heading);
    font-size: clamp(5.6rem, 8vw, 10rem);
    font-weight: 400;
    line-height: 0.98;
    letter-spacing: -0.02em;
}
.kin-masthead p { max-width: 52ch; margin-top: 20px; font-size: 2rem; line-height: 1.5; }
.kin-pigeon { width: 140px; height: 140px; flex: 0 0 auto; mix-blend-mode: darken; }
.home-template .gh-container { margin-top: 0; }
.gh-container-title { padding-block: 12px; border-color: var(--kin-ink); }
body .is-title, body .gh-content :is(h2, h3) { font-weight: 400; }
body .gh-card-title { font-size: clamp(3rem, 3.4vw, 4.4rem); line-height: 1.08; }
.gh-card-link:hover .gh-card-title { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; }
.gh-card-excerpt { line-height: 1.6; }
body .gh-article-title { font-size: clamp(4.4rem, 6vw, 7.6rem); line-height: 1.04; }
.gh-article-header { padding-top: 56px; }
.gh-meta-share { padding-block: 18px; border-block: 1px solid var(--kin-ink); }
.gh-article-author-image svg path { fill: var(--kin-paper); }
.gh-article-author-image a { background: var(--kin-muted); }
.gh-content { --content-font-size: 2rem; line-height: 1.7; }
.gh-content :is(h2, h3) { line-height: 1.15; }
.gh-content a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.gh-content blockquote:not([class]) { border-left: 4px solid var(--kin-ink); padding-left: 24px; }
.gh-content hr {
    height: 8px;
    border: 0;
    background: repeating-linear-gradient(135deg, var(--kin-ink) 0 1px, transparent 1px 5px);
}
.gh-button { border-radius: 0; background: var(--kin-ink); color: var(--kin-paper); }
.gh-footer { background: var(--kin-paper); padding-top: 32px; border-top: 2px solid var(--kin-ink); }
.gh-footer-logo { font-size: 2.8rem; }
.kin-privacy-trigger, .kin-privacy-page-trigger {
    cursor: pointer;
    border: 0;
    padding: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.kin-privacy-trigger[hidden], .kin-privacy-page-trigger[hidden] { display: none; }
.kin-privacy-trigger { margin-left: 1.6rem; }
.kin-privacy-dialog {
    position: fixed;
    width: min(64rem, calc(100vw - 3.2rem));
    max-height: calc(100vh - 3.2rem);
    overflow: auto;
    margin: auto;
    padding: 3.2rem;
    border: 3px solid var(--kin-ink);
    border-radius: 0;
    background: var(--kin-paper);
    color: var(--kin-ink);
    box-shadow: 8px 8px 0 var(--kin-ink);
    font-family: var(--font-sans);
    font-size: 1.6rem;
    line-height: 1.45;
}
.kin-privacy-dialog::backdrop { background: rgb(32 24 24 / 70%); }
.kin-privacy-dialog h2 { padding-right: 3rem; font-family: var(--gh-font-heading); font-size: 3.6rem; line-height: 1.1; }
.kin-privacy-dialog h3 { margin-top: 1.6rem; font-size: 1.8rem; font-weight: 700; }
.kin-privacy-dialog p, .kin-privacy-dialog ul { margin-top: 1rem; }
.kin-privacy-dialog ul { padding-left: 2.2rem; list-style: disc; }
.kin-privacy-dismiss { float: right; border: 0; background: transparent; color: inherit; cursor: pointer; font-size: 3rem; line-height: 1; }
.kin-privacy-actions { display: flex; flex-wrap: wrap; gap: 1.2rem; margin-top: 2rem; }
.kin-privacy-actions button { flex: 1 1 20rem; min-height: 4.8rem; padding: .8rem 1.2rem; border: 2px solid var(--kin-ink); background: var(--kin-paper); color: var(--kin-ink); cursor: pointer; font: inherit; font-weight: 700; }
.kin-privacy-actions button:hover { background: var(--kin-ink); color: var(--kin-paper); }
.kin-privacy-actions button:disabled { cursor: not-allowed; opacity: .55; }
.kin-privacy-actions button:disabled:hover { background: var(--kin-paper); color: var(--kin-ink); }
@media (max-width: 767px) {
    .kin-masthead { padding-block: 32px 24px; }
    .kin-masthead-inner { gap: 16px; align-items: flex-start; padding-bottom: 24px; }
    .kin-pigeon { width: 64px; height: 64px; }
    .kin-masthead h1 { font-size: clamp(4.2rem, 10vw, 6rem); }
    .kin-masthead p { font-size: 1.8rem; }
    .gh-article-header { padding-top: 32px; }
    .gh-content { --content-font-size: 1.8rem; }
    .kin-privacy-dialog { padding: 2rem; box-shadow: 4px 4px 0 var(--kin-ink); }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
