/*
 * Not You Again full-viewport sketch layout v1.4.
 * Tighter hero/menu spacing and inverted article-image panels.
 */

*,
*::before,
*::after { box-sizing: border-box; }

:root {
    --nya-black: #050505;
    --nya-white: #ffffff;
    --nya-soft: #f8f8f8;
    --nya-ink: #202020;
    --nya-pink: #ff4fa0;
    --nya-line: 2px solid #050505;
    --nya-thin: 1px solid #050505;
}

html { scroll-behavior: smooth; }

body {
    margin: 0;
    background: var(--nya-white);
    color: var(--nya-black);
    font-family: 'Roboto Condensed', Arial, sans-serif;
    font-size: 14px;
    line-height: 1.35;
    overflow-x: hidden;
}

img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }

.site-header {
    background: var(--nya-white);
    border-bottom: 0;
    padding: 5px 18px;
    position: static;
    z-index: 10;
}

.header-container {
    max-width: 920px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.top-home-link {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    justify-content: center;
    padding: 1px 15px;
    border: var(--nya-thin);
    border-radius: 999px;
    background: var(--nya-soft);
    text-decoration: none;
    font-family: 'Roboto Condensed', Arial, sans-serif;
    font-weight: 700;
    font-size: 0.8rem;
    letter-spacing: 0.02em;
}

.site-main {
    width: min(100%, 920px);
    height: calc(100vh - 66px);
    min-height: 690px;
    max-height: 1040px;
    margin: 0 auto;
    background: var(--nya-white);
    border-left: var(--nya-thin);
    border-right: var(--nya-thin);
    display: grid;
    grid-template-rows: 31% 17% 44%;
}

/* HERO */
.sketch-hero-panel {
    min-height: 0;
    padding: 9px 28px 8px;
    border-bottom: var(--nya-line);
    position: relative;
    overflow: hidden;
}

.sketch-logo-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    height: 32px;
    margin-bottom: 0;
}

.sketch-logo-box {
    width: 80px;
    height: 30px;
    border: var(--nya-thin);
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--nya-white);
    overflow: hidden;
}

.sketch-logo-box .custom-logo-link,
.sketch-logo-box .custom-logo-link img {
    max-width: 70px;
    max-height: 22px;
}

.mini-logo {
    font-family: 'Permanent Marker', cursive;
    font-size: 0.82rem;
    text-decoration: none;
    letter-spacing: 0.05em;
}

.device-note {
    font-family: 'Permanent Marker', cursive;
    font-size: 0.9rem;
    transform: rotate(-2deg);
    margin-right: 14px;
    margin-top: 2px;
}

.header-slider {
    position: relative;
    height: calc(100% - 32px);
    min-height: 0;
    display: grid;
    align-items: stretch;
}

.slides-shell { height: 100%; min-height: 0; }

.header-slider .slide {
    display: none;
    height: 100%;
    min-height: 0;
    grid-template-columns: minmax(0, 1fr) 205px;
    gap: 18px;
    align-items: center;
}

.header-slider .slide.active { display: grid; }

.slide-copy {
    padding-left: 34px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.slide-copy h1,
.title-slide {
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(1.55rem, 4.2vw, 2.85rem);
    line-height: 0.98;
    margin: 0;
    max-width: 520px;
    text-transform: uppercase;
    border: var(--nya-line);
    padding: 3px 12px 7px;
    background: var(--nya-white);
    transform: rotate(-0.35deg);
}

.slide-copy p,
.text-slide {
    max-width: 335px;
    margin: 0;
    font-size: clamp(0.92rem, 1.7vw, 1.08rem);
    border: var(--nya-thin);
    padding: 8px 11px;
    background: var(--nya-white);
}

.slide-figure-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.slide-figure-wrap img {
    max-height: 94%;
    width: auto;
    object-fit: contain;
    filter: grayscale(1) contrast(1.38);
    mix-blend-mode: multiply;
}

.slider-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 23px;
    height: 23px;
    border: var(--nya-thin);
    background: var(--nya-white);
    color: var(--nya-black);
    border-radius: 999px;
    cursor: pointer;
    font-size: 1.12rem;
    line-height: 0.7;
    z-index: 3;
}

.slider-arrow:hover,
.slider-arrow:focus,
.news-arrow:hover,
.news-arrow:focus {
    background: var(--nya-black);
    color: var(--nya-white);
}

.slider-arrow-prev { left: 7px; }
.slider-arrow-next { right: 7px; }

/* MENU */
.section-kicker {
    margin: 0 0 6px;
    font-family: 'Permanent Marker', cursive;
    font-size: 1rem;
    letter-spacing: 0.02em;
}

.menu-grid {
    padding: 9px 28px 8px;
    border-bottom: var(--nya-line);
    background: var(--nya-white);
    min-height: 0;
    overflow: hidden;
}

.menu-items {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 6px 9px;
}

.menu-items li { margin: 0; }

.menu-items li a {
    display: flex;
    min-height: 25px;
    align-items: center;
    justify-content: center;
    padding: 2px 12px 5px;
    background: var(--nya-ink);
    color: var(--nya-white);
    border: var(--nya-thin);
    text-decoration: none;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(0.7rem, 1.12vw, 0.88rem);
    letter-spacing: 0.015em;
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.35) inset;
}

.menu-items li a:hover,
.menu-items li a:focus {
    background: var(--nya-black);
    transform: translateY(-1px);
}

/* NEWS */
.news-section {
    padding: 9px 28px 10px;
    border-bottom: var(--nya-line);
    min-height: 0;
    overflow: hidden;
}

.section-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.news-controls {
    display: flex;
    gap: 7px;
}

.news-arrow {
    width: 23px;
    height: 23px;
    border: var(--nya-thin);
    border-radius: 999px;
    background: var(--nya-white);
    cursor: pointer;
    font-size: 1.05rem;
    line-height: 0.7;
}

.news-slider-viewport {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.news-track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 0 2px 4px;
    scrollbar-width: none;
}

.news-track::-webkit-scrollbar { display: none; }

.news-item {
    --news-bg: none;
    flex: 0 0 calc((100% - 32px) / 3);
    min-width: 210px;
    height: clamp(210px, 32vh, 330px);
    border: var(--nya-thin);
    background: var(--nya-black);
    position: relative;
    display: flex;
    scroll-snap-align: start;
    overflow: hidden;
    isolation: isolate;
}

.news-item::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: var(--news-bg);
    background-size: cover;
    background-position: center;
    filter: grayscale(1) invert(1) contrast(1.22) brightness(0.88);
    z-index: -2;
    transform: scale(1.03);
}

.news-item::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0,0,0,0.34), rgba(0,0,0,0.72)),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.06) 0 1px, transparent 1px 5px);
    z-index: -1;
}

.news-item:not(.has-news-bg)::before {
    background:
        radial-gradient(circle at 25% 20%, rgba(255,255,255,0.22), transparent 35%),
        linear-gradient(135deg, #111, #000 60%, #2b2b2b);
    filter: none;
}

.news-card-link {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 14px 14px 12px;
    color: var(--nya-white);
    text-decoration: none;
    align-items: flex-start;
}

.news-copy {
    max-width: 100%;
    text-shadow: 0 2px 0 rgba(0,0,0,0.85), 0 0 9px rgba(0,0,0,0.85);
}

.news-copy h2 {
    margin: 0 0 8px;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(1.05rem, 1.85vw, 1.45rem);
    line-height: 1.02;
    text-transform: uppercase;
    color: var(--nya-white);
}

.news-excerpt,
.news-excerpt p,
.news-copy p {
    margin: 0;
    font-size: clamp(0.78rem, 1.18vw, 0.94rem);
    line-height: 1.28;
    color: var(--nya-white);
}

/* Old image links are hidden because the image is now the whole card. */
.news-image-link { display: none; }

.site-footer {
    width: min(100%, 920px);
    margin: 0 auto;
    padding: 0;
    background: var(--nya-white);
    font-family: 'Permanent Marker', cursive;
    font-size: 0.88rem;
    text-align: left;
    border-left: var(--nya-thin);
    border-right: var(--nya-thin);
}

.site-footer p {
    margin: 0;
    border-bottom: var(--nya-line);
    padding: 7px 28px;
    min-height: 30px;
}

@media (max-width: 860px) {
    .site-main {
        height: calc(100vh - 62px);
        min-height: 650px;
        border-left: 0;
        border-right: 0;
        grid-template-rows: 31% 16.5% 44.5%;
    }

    .sketch-hero-panel,
    .menu-grid,
    .news-section {
        padding-left: 22px;
        padding-right: 22px;
    }

    .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) 178px;
        gap: 10px;
    }

    .slide-copy { padding-left: 28px; }

    .slide-figure-wrap img { max-height: 92%; }

    .news-item { flex-basis: calc((100% - 18px) / 3); min-width: 185px; }
}

@media (max-width: 620px) {
    .site-main {
        height: auto;
        min-height: 0;
        display: block;
    }

    .sketch-hero-panel { height: 315px; }
    .menu-grid { min-height: 152px; }
    .news-section { min-height: 315px; }

    .header-slider .slide {
        grid-template-columns: 1fr 112px;
        gap: 6px;
    }

    .slide-copy { padding-left: 25px; gap: 8px; }

    .slide-copy h1,
    .title-slide { font-size: 1.28rem; padding: 4px 8px 6px; }

    .slide-copy p,
    .text-slide { font-size: 0.82rem; padding: 8px; }

    .news-item {
        flex-basis: 78%;
        min-width: 220px;
        height: 270px;
    }

    .site-footer { border-left: 0; border-right: 0; }
    .site-footer p { padding-left: 22px; padding-right: 22px; }
}


/* ===== Accessible single article + page templates v1.5 ===== */

.singular-main.accessible-singular {
    width: min(100%, 920px);
    height: auto;
    min-height: calc(100vh - 64px);
    max-height: none;
    margin: 0 auto;
    display: block;
    border-left: var(--nya-thin);
    border-right: var(--nya-thin);
    background: var(--nya-white);
}

.singular-card {
    border-bottom: var(--nya-line);
    background: var(--nya-white);
}

.singular-hero {
    --singular-bg: none;
    position: relative;
    min-height: clamp(300px, 44vh, 520px);
    border-bottom: var(--nya-line);
    background: var(--nya-black);
    color: var(--nya-white);
    overflow: hidden;
    isolation: isolate;
    display: flex;
    align-items: flex-end;
}

.singular-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: var(--singular-bg);
    background-size: cover;
    background-position: center;
    filter: grayscale(1) invert(1) contrast(1.16) brightness(0.78);
    transform: scale(1.03);
    z-index: -2;
}

.singular-hero:not(.has-singular-bg)::before {
    background:
        radial-gradient(circle at 20% 18%, rgba(255,255,255,0.20), transparent 35%),
        linear-gradient(135deg, #111, #000 62%, #303030);
    filter: none;
}

.singular-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0,0,0,0.20), rgba(0,0,0,0.82)),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.055) 0 1px, transparent 1px 6px);
    z-index: -1;
}

.singular-hero-inner {
    width: 100%;
    padding: clamp(28px, 5vw, 58px);
    text-shadow: 0 3px 0 rgba(0,0,0,0.9), 0 0 14px rgba(0,0,0,0.9);
}

.singular-kicker {
    display: inline-flex;
    margin: 0 0 14px;
    padding: 5px 13px 7px;
    border: 2px solid currentColor;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(1.05rem, 2.3vw, 1.45rem);
    line-height: 1;
    text-transform: uppercase;
    transform: rotate(-0.5deg);
}

.singular-title {
    max-width: 850px;
    margin: 0;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(2.5rem, 8vw, 5.9rem);
    line-height: 0.94;
    letter-spacing: 0.01em;
    text-transform: uppercase;
}

.singular-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin-top: 18px;
    font-size: clamp(1.05rem, 2.3vw, 1.35rem);
    font-weight: 700;
}

.singular-content-wrap {
    padding: clamp(26px, 5vw, 58px);
}

.singular-content {
    max-width: 760px;
    margin: 0 auto;
    font-size: clamp(1.28rem, 2.6vw, 1.62rem);
    line-height: 1.62;
    letter-spacing: 0.005em;
}

.singular-content > *:first-child {
    margin-top: 0;
}

.singular-content p,
.singular-content li {
    font-size: inherit;
}

.singular-content p {
    margin: 0 0 1.18em;
}

.singular-content h2,
.singular-content h3,
.singular-content h4 {
    font-family: 'Permanent Marker', cursive;
    line-height: 1.05;
    text-transform: uppercase;
    margin: 1.35em 0 0.55em;
}

.singular-content h2 {
    font-size: clamp(2rem, 5.5vw, 3.8rem);
}

.singular-content h3 {
    font-size: clamp(1.7rem, 4.2vw, 2.8rem);
}

.singular-content h4 {
    font-size: clamp(1.45rem, 3.2vw, 2.1rem);
}

.singular-content a {
    text-decoration-thickness: 0.12em;
    text-underline-offset: 0.12em;
    font-weight: 700;
}

.singular-content img,
.singular-content .wp-block-image img {
    width: 100%;
    height: auto;
    border: var(--nya-line);
    filter: grayscale(1) contrast(1.2);
}

.singular-content blockquote {
    margin: 1.4em 0;
    padding: 18px 22px;
    border-left: 8px solid var(--nya-black);
    background: var(--nya-soft);
    font-size: 1.08em;
    font-weight: 700;
}

.singular-content table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.92em;
}

.singular-content th,
.singular-content td {
    border: var(--nya-thin);
    padding: 10px;
    vertical-align: top;
}

.singular-footer {
    max-width: 760px;
    margin: 28px auto 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(1rem, 2vw, 1.2rem);
}

.singular-footer a,
.tag-row a,
.page-links a,
.page-links .post-page-numbers {
    display: inline-flex;
    margin: 4px 4px 4px 0;
    padding: 7px 12px;
    border: var(--nya-thin);
    background: var(--nya-black);
    color: var(--nya-white);
    text-decoration: none;
}

.page-links {
    margin-top: 26px;
    font-weight: 700;
}

/* Comments: large, touch-friendly, readable. */
.accessible-comments {
    padding: clamp(26px, 5vw, 58px);
    background: var(--nya-white);
    border-bottom: var(--nya-line);
}

.comments-title,
.comment-reply-title {
    max-width: 760px;
    margin: 0 auto 22px;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(2rem, 5vw, 3.4rem);
    line-height: 1;
    text-transform: uppercase;
}

.comment-list {
    max-width: 760px;
    margin: 0 auto 34px;
    padding: 0;
    list-style: none;
}

.comment-list .comment,
.comment-list .pingback,
.comment-list .trackback {
    margin: 0 0 18px;
    padding: clamp(16px, 3vw, 24px);
    border: var(--nya-line);
    background: var(--nya-soft);
}

.comment-body {
    font-size: clamp(1.12rem, 2.2vw, 1.38rem);
    line-height: 1.55;
}

.comment-author {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(1.25rem, 2.6vw, 1.65rem);
    line-height: 1.1;
}

.comment-author .avatar {
    border: var(--nya-thin);
    filter: grayscale(1) contrast(1.2);
}

.comment-metadata {
    margin: 8px 0 14px;
    font-size: 1rem;
    font-weight: 700;
}

.comment-content p {
    margin: 0 0 1em;
}

.reply a,
.comment-edit-link {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    margin-top: 8px;
    padding: 8px 14px;
    border: var(--nya-thin);
    background: var(--nya-black);
    color: var(--nya-white);
    text-decoration: none;
    font-family: 'Permanent Marker', cursive;
}

.comment-respond {
    max-width: 760px;
    margin: 0 auto;
}

.comment-form {
    font-size: clamp(1.08rem, 2.2vw, 1.32rem);
}

.comment-form p {
    margin: 0 0 16px;
}

.comment-form label {
    display: block;
    margin-bottom: 7px;
    font-weight: 700;
    font-size: 1.05em;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: var(--nya-line);
    background: var(--nya-white);
    color: var(--nya-black);
    font: inherit;
    border-radius: 0;
}

.comment-form textarea {
    min-height: 190px;
    resize: vertical;
}

.comment-form input:focus,
.comment-form textarea:focus,
.singular-content a:focus,
.comment-form .submit:focus {
    outline: 4px solid var(--nya-black);
    outline-offset: 3px;
}

.comment-form .submit,
.comment-submit {
    min-height: 52px;
    padding: 12px 20px;
    border: var(--nya-line);
    background: var(--nya-black);
    color: var(--nya-white);
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(1.15rem, 2.4vw, 1.5rem);
    cursor: pointer;
    border-radius: 0;
}

.comment-form .submit:hover,
.comment-submit:hover {
    background: var(--nya-white);
    color: var(--nya-black);
}

.comment-notes,
.logged-in-as,
.form-allowed-tags {
    font-size: 0.95em;
}

.no-comments {
    max-width: 760px;
    margin: 0 auto 22px;
    font-size: clamp(1.1rem, 2.4vw, 1.4rem);
    font-weight: 700;
}

@media (max-width: 860px) {
    .singular-main.accessible-singular {
        border-left: 0;
        border-right: 0;
    }

    .singular-hero {
        min-height: 42vh;
    }

    .singular-content {
        max-width: 100%;
        font-size: clamp(1.22rem, 3.9vw, 1.55rem);
    }

    .comment-list,
    .comment-respond,
    .comments-title,
    .comment-reply-title {
        max-width: 100%;
    }
}

@media (max-width: 520px) {
    .singular-hero {
        min-height: 360px;
    }

    .singular-hero-inner,
    .singular-content-wrap,
    .accessible-comments {
        padding-left: 20px;
        padding-right: 20px;
    }

    .singular-title {
        font-size: clamp(2.2rem, 12vw, 4rem);
    }

    .singular-content {
        font-size: 1.22rem;
        line-height: 1.58;
    }

    .comment-form textarea {
        min-height: 170px;
    }
}


/* ===== Homepage tightening update v1.6 =====
   Larger readable menu buttons, half the dead space under menu,
   and less empty space under the news cards. */

.full-view-sketch.site-main,
body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home {
    grid-template-rows: 30% 18% 45%;
    height: calc(100vh - 58px);
    min-height: 670px;
}

.full-view-sketch .sketch-hero-panel,
body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel {
    padding-top: 8px;
    padding-bottom: 6px;
}

.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid {
    padding-top: 8px;
    padding-bottom: 4px;
    overflow: hidden;
}

.full-view-sketch .menu-items,
body.home .menu-items,
body.front-page .menu-items {
    gap: 8px 11px;
    align-content: flex-start;
}

.full-view-sketch .menu-items li a,
body.home .menu-items li a,
body.front-page .menu-items li a {
    min-height: 32px;
    padding: 5px 16px 7px;
    font-size: clamp(0.82rem, 1.3vw, 1.02rem);
    line-height: 1;
}

.full-view-sketch .news-section,
body.home .news-section,
body.front-page .news-section {
    padding-top: 8px;
    padding-bottom: 4px;
}

.full-view-sketch .news-track,
body.home .news-track,
body.front-page .news-track {
    padding-bottom: 0;
}

.full-view-sketch .news-item,
body.home .news-item,
body.front-page .news-item {
    height: clamp(225px, 34vh, 350px);
}

.full-view-sketch .site-footer,
body.home + .site-footer,
body.front-page + .site-footer {
    margin-top: 0;
}

@media (max-width: 860px) {
    .full-view-sketch.site-main,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home {
        grid-template-rows: 30% 18.5% 44.5%;
        height: calc(100vh - 56px);
        min-height: 650px;
    }

    .full-view-sketch .menu-items,
    body.home .menu-items,
    body.front-page .menu-items {
        gap: 7px 9px;
    }

    .full-view-sketch .menu-items li a,
    body.home .menu-items li a,
    body.front-page .menu-items li a {
        min-height: 30px;
        padding: 5px 13px 7px;
        font-size: clamp(0.78rem, 1.7vw, 0.96rem);
    }

    .full-view-sketch .news-item,
    body.home .news-item,
    body.front-page .news-item {
        height: clamp(220px, 33vh, 335px);
    }
}

@media (max-width: 620px) {
    .full-view-sketch .menu-grid,
    body.home .menu-grid,
    body.front-page .menu-grid {
        min-height: 136px;
        padding-bottom: 4px;
    }

    .full-view-sketch .menu-items li a,
    body.home .menu-items li a,
    body.front-page .menu-items li a {
        min-height: 31px;
        padding: 5px 13px 7px;
        font-size: 0.84rem;
    }

    .full-view-sketch .news-section,
    body.home .news-section,
    body.front-page .news-section {
        min-height: 298px;
        padding-bottom: 4px;
    }

    .full-view-sketch .news-item,
    body.home .news-item,
    body.front-page .news-item {
        height: 286px;
    }
}


/* ===== Global logo-only home header update v1.7 =====
   The top bar is now only the logo home button on every page.
   The duplicate logo inside the homepage hero is removed. */

.site-header {
    padding: 5px 18px;
    background: var(--nya-white);
    border-bottom: 0;
    position: static;
}

.header-container {
    width: min(100%, 920px);
    max-width: 920px;
    margin: 0 auto;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.top-home-link {
    display: none;
}

.top-logo-home {
    width: 96px;
    height: 34px;
    border: var(--nya-thin);
    background: var(--nya-white);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    text-decoration: none;
}

.top-logo-home:hover,
.top-logo-home:focus {
    outline: 3px solid var(--nya-black);
    outline-offset: 3px;
}

.top-logo-image {
    max-width: 82px;
    max-height: 26px;
    width: auto;
    height: auto;
    display: block;
    filter: grayscale(1) contrast(1.35);
    object-fit: contain;
}

.top-logo-fallback {
    font-family: 'Permanent Marker', cursive;
    font-size: 1.05rem;
    line-height: 1;
    color: var(--nya-black);
    letter-spacing: 0.05em;
}

.full-view-sketch .sketch-logo-row,
body.home .sketch-logo-row,
body.front-page .sketch-logo-row {
    justify-content: flex-end;
    height: 28px;
}

.sketch-logo-box {
    display: none;
}

.full-view-sketch .device-note,
body.home .device-note,
body.front-page .device-note {
    margin-right: 14px;
    margin-top: 0;
}

.full-view-sketch .header-slider,
body.home .header-slider,
body.front-page .header-slider {
    height: calc(100% - 28px);
}

.full-view-sketch.site-main,
body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home {
    height: calc(100vh - 54px);
}

@media (max-width: 860px) {
    .site-header {
        padding-left: 14px;
        padding-right: 14px;
    }

    .top-logo-home {
        width: 92px;
        height: 32px;
    }

    .top-logo-image {
        max-width: 78px;
        max-height: 24px;
    }

    .full-view-sketch.site-main,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home {
        height: calc(100vh - 52px);
    }
}

@media (max-width: 620px) {
    .top-logo-home {
        width: 86px;
        height: 30px;
    }

    .top-logo-image {
        max-width: 72px;
        max-height: 22px;
    }
}


/* ===== Category/archive one-viewport styling v1.8 ===== */

.archive-main.category-viewport {
    width: min(100%, 920px);
    height: calc(100vh - 54px);
    min-height: 650px;
    max-height: 1040px;
    margin: 0 auto;
    display: grid;
    grid-template-rows: 34% 66%;
    border-left: var(--nya-thin);
    border-right: var(--nya-thin);
    background: var(--nya-white);
    overflow: hidden;
}

.archive-hero {
    position: relative;
    min-height: 0;
    border-bottom: var(--nya-line);
    background: var(--nya-black);
    color: var(--nya-white);
    overflow: hidden;
    isolation: isolate;
    display: flex;
    align-items: flex-end;
}

.archive-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 18% 20%, rgba(255,255,255,0.22), transparent 34%),
        radial-gradient(circle at 82% 25%, rgba(255,255,255,0.12), transparent 28%),
        linear-gradient(135deg, #111, #000 58%, #303030);
    filter: grayscale(1) contrast(1.1);
    z-index: -2;
}

.archive-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0,0,0,0.14), rgba(0,0,0,0.78)),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.06) 0 1px, transparent 1px 6px);
    z-index: -1;
}

.archive-hero-inner {
    width: 100%;
    padding: clamp(24px, 4vw, 42px);
    text-shadow: 0 3px 0 rgba(0,0,0,0.9), 0 0 14px rgba(0,0,0,0.9);
}

.archive-kicker {
    display: inline-flex;
    margin: 0 0 12px;
    padding: 5px 13px 7px;
    border: 2px solid currentColor;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(1rem, 2vw, 1.35rem);
    line-height: 1;
    text-transform: uppercase;
    transform: rotate(-0.5deg);
}

.archive-title {
    max-width: 850px;
    margin: 0;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(2.3rem, 7vw, 5.4rem);
    line-height: 0.94;
    letter-spacing: 0.01em;
    text-transform: uppercase;
}

.archive-title .vcard,
.archive-title span {
    color: inherit;
}

.archive-description {
    max-width: 760px;
    margin-top: 14px;
    font-size: clamp(1.08rem, 2.2vw, 1.38rem);
    line-height: 1.35;
    font-weight: 700;
}

.archive-description p {
    margin: 0;
}

.archive-results {
    min-height: 0;
    padding: 12px 28px 10px;
    overflow: hidden;
    background: var(--nya-white);
}

.archive-results-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 8px;
}

.archive-results-head .section-kicker {
    margin-bottom: 0;
}

.archive-count {
    min-width: 34px;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: var(--nya-thin);
    background: var(--nya-black);
    color: var(--nya-white);
    font-family: 'Permanent Marker', cursive;
    font-size: 1rem;
}

.archive-slider-viewport {
    width: 100%;
    overflow: hidden;
}

.archive-track {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 0 2px 2px;
    scrollbar-width: none;
}

.archive-track::-webkit-scrollbar {
    display: none;
}

.archive-card {
    --archive-card-bg: none;
    flex: 0 0 calc((100% - 32px) / 3);
    min-width: 210px;
    height: clamp(290px, 46vh, 430px);
    border: var(--nya-thin);
    background: var(--nya-black);
    position: relative;
    display: flex;
    scroll-snap-align: start;
    overflow: hidden;
    isolation: isolate;
}

.archive-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: var(--archive-card-bg);
    background-size: cover;
    background-position: center;
    filter: grayscale(1) invert(1) contrast(1.18) brightness(0.78);
    transform: scale(1.035);
    z-index: -2;
}

.archive-card:not(.has-archive-bg)::before {
    background:
        radial-gradient(circle at 24% 18%, rgba(255,255,255,0.20), transparent 34%),
        linear-gradient(135deg, #111, #000 60%, #2b2b2b);
    filter: none;
}

.archive-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(0,0,0,0.26), rgba(0,0,0,0.78)),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.055) 0 1px, transparent 1px 6px);
    z-index: -1;
}

.archive-card-link {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 15px 15px 13px;
    color: var(--nya-white);
    text-decoration: none;
    align-items: flex-start;
}

.archive-card-link:hover,
.archive-card-link:focus {
    outline: 4px solid var(--nya-black);
    outline-offset: -8px;
}

.archive-card-copy {
    max-width: 100%;
    text-shadow: 0 2px 0 rgba(0,0,0,0.9), 0 0 12px rgba(0,0,0,0.9);
}

.archive-card h2 {
    margin: 0 0 9px;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(1.2rem, 2vw, 1.65rem);
    line-height: 1.02;
    text-transform: uppercase;
    color: var(--nya-white);
}

.archive-card-meta {
    margin: 0 0 10px;
    font-size: clamp(0.82rem, 1.3vw, 1rem);
    font-weight: 700;
    color: var(--nya-white);
}

.archive-card-excerpt,
.archive-card-excerpt p {
    margin: 0;
    font-size: clamp(0.82rem, 1.25vw, 1rem);
    line-height: 1.32;
    color: var(--nya-white);
}

.archive-pagination {
    max-height: 54px;
    margin-top: 10px;
    overflow: hidden;
    font-family: 'Permanent Marker', cursive;
}

.archive-pagination .nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-items: center;
}

.archive-pagination a,
.archive-pagination span {
    display: inline-flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    padding: 4px 10px 6px;
    border: var(--nya-thin);
    background: var(--nya-white);
    color: var(--nya-black);
    text-decoration: none;
}

.archive-pagination .current,
.archive-pagination a:hover,
.archive-pagination a:focus {
    background: var(--nya-black);
    color: var(--nya-white);
}

.archive-empty {
    display: flex;
    flex-direction: column;
}

.archive-empty-card {
    border: var(--nya-line);
    padding: clamp(20px, 4vw, 36px);
    font-size: clamp(1.2rem, 2.4vw, 1.5rem);
}

.archive-empty-card h2 {
    margin: 0 0 12px;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(2rem, 5vw, 3.4rem);
    line-height: 1;
    text-transform: uppercase;
}

.archive-empty-card p {
    margin: 0;
}

@media (max-width: 860px) {
    .archive-main.category-viewport {
        height: calc(100vh - 52px);
        min-height: 620px;
        border-left: 0;
        border-right: 0;
        grid-template-rows: 32% 68%;
    }

    .archive-results {
        padding-left: 22px;
        padding-right: 22px;
    }

    .archive-card {
        flex-basis: calc((100% - 18px) / 3);
        min-width: 185px;
        height: clamp(285px, 47vh, 420px);
    }

    .archive-card-link {
        padding: 13px 13px 12px;
    }
}

@media (max-width: 620px) {
    .archive-main.category-viewport {
        height: auto;
        min-height: 0;
        display: block;
        overflow: visible;
    }

    .archive-hero {
        min-height: 310px;
    }

    .archive-hero-inner,
    .archive-results {
        padding-left: 20px;
        padding-right: 20px;
    }

    .archive-title {
        font-size: clamp(2.1rem, 11vw, 3.8rem);
    }

    .archive-results {
        min-height: 355px;
    }

    .archive-card {
        flex-basis: 78%;
        min-width: 220px;
        height: 320px;
    }
}


/* ===== Refined hero sticker title/subtitle v1.9 =====
   The title and subtitle now read like designed stickers:
   thicker edge, subtle paper lift, hand-cut outline, and cleaner hierarchy. */

.full-view-sketch .slide-copy,
body.home .slide-copy,
body.front-page .slide-copy {
    gap: 12px;
}

.full-view-sketch .slide-copy h1,
.full-view-sketch .title-slide,
body.home .slide-copy h1,
body.home .title-slide,
body.front-page .slide-copy h1,
body.front-page .title-slide {
    position: relative;
    display: inline-block;
    border: 3px solid var(--nya-black);
    border-radius: 3px 9px 4px 7px;
    background: var(--nya-white);
    padding: 7px 18px 11px;
    box-shadow:
        6px 6px 0 rgba(0,0,0,0.12),
        0 0 0 2px var(--nya-white),
        0 0 0 5px var(--nya-black);
    transform: rotate(-0.8deg);
    letter-spacing: 0.015em;
    filter: drop-shadow(0 2px 0 rgba(0,0,0,0.20));
}

.full-view-sketch .slide-copy h1::before,
.full-view-sketch .title-slide::before,
body.home .slide-copy h1::before,
body.home .title-slide::before,
body.front-page .slide-copy h1::before,
body.front-page .title-slide::before {
    content: "";
    position: absolute;
    inset: 5px 7px 6px 7px;
    border: 1px solid rgba(0,0,0,0.28);
    border-radius: 2px 7px 3px 6px;
    pointer-events: none;
    opacity: 0.55;
}

.full-view-sketch .slide-copy h1::after,
.full-view-sketch .title-slide::after,
body.home .slide-copy h1::after,
body.home .title-slide::after,
body.front-page .slide-copy h1::after,
body.front-page .title-slide::after {
    content: "";
    position: absolute;
    left: 18px;
    right: 26px;
    bottom: -9px;
    height: 7px;
    background:
        linear-gradient(90deg, transparent 0 3%, var(--nya-black) 3% 9%, transparent 9% 14%, var(--nya-black) 14% 21%, transparent 21% 100%);
    opacity: 0.85;
    transform: rotate(0.6deg);
    pointer-events: none;
}

.full-view-sketch .slide-copy p,
.full-view-sketch .text-slide,
body.home .slide-copy p,
body.home .text-slide,
body.front-page .slide-copy p,
body.front-page .text-slide {
    position: relative;
    display: inline-block;
    width: auto;
    max-width: 380px;
    border: 2px solid var(--nya-black);
    border-radius: 4px 2px 8px 3px;
    background: var(--nya-white);
    padding: 9px 14px 10px;
    box-shadow:
        4px 4px 0 rgba(0,0,0,0.10),
        0 0 0 2px var(--nya-white),
        0 0 0 4px var(--nya-black);
    transform: rotate(0.55deg) translateX(7px);
    font-weight: 700;
}

.full-view-sketch .slide-copy p::after,
.full-view-sketch .text-slide::after,
body.home .slide-copy p::after,
body.home .text-slide::after,
body.front-page .slide-copy p::after,
body.front-page .text-slide::after {
    content: "";
    position: absolute;
    right: 12px;
    bottom: -7px;
    width: 38%;
    height: 5px;
    background: var(--nya-black);
    opacity: 0.85;
    transform: rotate(-1.2deg);
}

@media (max-width: 860px) {
    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        padding: 6px 14px 9px;
        box-shadow:
            4px 4px 0 rgba(0,0,0,0.12),
            0 0 0 2px var(--nya-white),
            0 0 0 4px var(--nya-black);
    }

    .full-view-sketch .slide-copy p,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.home .text-slide,
    body.front-page .slide-copy p,
    body.front-page .text-slide {
        padding: 8px 12px;
        transform: rotate(0.4deg) translateX(4px);
    }
}

@media (max-width: 620px) {
    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        padding: 5px 10px 8px;
        border-width: 2px;
        box-shadow:
            3px 3px 0 rgba(0,0,0,0.12),
            0 0 0 2px var(--nya-white),
            0 0 0 3px var(--nya-black);
    }

    .full-view-sketch .slide-copy p,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.home .text-slide,
    body.front-page .slide-copy p,
    body.front-page .text-slide {
        max-width: 260px;
        border-width: 2px;
        box-shadow:
            3px 3px 0 rgba(0,0,0,0.10),
            0 0 0 2px var(--nya-white),
            0 0 0 3px var(--nya-black);
    }
}


/* ===== Wide-screen and landscape refinements v2.0 =====
   iPad/iOS rules above remain canonical. These additions only stretch the
   sketch layout more elegantly on laptops, desktops, and big landscape screens. */

@media (min-width: 1100px) {
    .header-container,
    .site-main,
    .site-footer,
    .singular-main.accessible-singular,
    .archive-main.category-viewport {
        width: min(94vw, 1120px);
        max-width: 1120px;
    }

    .full-view-sketch.site-main,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home {
        grid-template-rows: 31% 16% 46%;
        min-height: 690px;
    }

    .full-view-sketch .sketch-hero-panel,
    body.home .sketch-hero-panel,
    body.front-page .sketch-hero-panel,
    .full-view-sketch .menu-grid,
    body.home .menu-grid,
    body.front-page .menu-grid,
    .full-view-sketch .news-section,
    body.home .news-section,
    body.front-page .news-section {
        padding-left: clamp(30px, 4vw, 54px);
        padding-right: clamp(30px, 4vw, 54px);
    }

    .full-view-sketch .header-slider .slide,
    body.home .header-slider .slide,
    body.front-page .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(220px, 24vw, 310px);
        gap: clamp(18px, 3vw, 44px);
    }

    .full-view-sketch .slide-copy,
    body.home .slide-copy,
    body.front-page .slide-copy {
        padding-left: clamp(36px, 5vw, 72px);
    }

    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        max-width: min(680px, 58vw);
        font-size: clamp(2.25rem, 3.4vw, 4.4rem);
    }

    .full-view-sketch .slide-copy p,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.home .text-slide,
    body.front-page .slide-copy p,
    body.front-page .text-slide {
        max-width: min(510px, 46vw);
        font-size: clamp(1.02rem, 1.25vw, 1.24rem);
    }

    .full-view-sketch .menu-items,
    body.home .menu-items,
    body.front-page .menu-items {
        gap: 10px 14px;
    }

    .full-view-sketch .menu-items li a,
    body.home .menu-items li a,
    body.front-page .menu-items li a {
        min-height: 36px;
        padding: 7px 20px 8px;
        font-size: clamp(0.92rem, 1vw, 1.12rem);
    }

    .full-view-sketch .news-item,
    body.home .news-item,
    body.front-page .news-item {
        flex-basis: calc((100% - 48px) / 4);
        min-width: 220px;
        height: clamp(250px, 33vh, 390px);
    }

    .archive-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .singular-content,
    .singular-footer,
    .comment-list,
    .comment-respond,
    .comments-title,
    .comment-reply-title {
        max-width: 820px;
    }
}

@media (min-width: 1360px) {
    .header-container,
    .site-main,
    .site-footer,
    .singular-main.accessible-singular,
    .archive-main.category-viewport {
        width: min(92vw, 1280px);
        max-width: 1280px;
    }

    .full-view-sketch.site-main,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home {
        grid-template-rows: 32% 15% 46%;
        min-height: 720px;
    }

    .full-view-sketch .news-item,
    body.home .news-item,
    body.front-page .news-item {
        flex-basis: calc((100% - 64px) / 5);
        min-width: 218px;
    }

    .archive-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

@media (orientation: landscape) and (min-width: 900px) and (max-height: 760px) {
    .full-view-sketch.site-main,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home {
        grid-template-rows: 34% 17% 42%;
        min-height: 560px;
    }

    .full-view-sketch .news-item,
    body.home .news-item,
    body.front-page .news-item {
        height: clamp(205px, 30vh, 270px);
    }
}

/* ===== Image lightbox v2.0 ===== */

.singular-content img,
.entry-content img,
.wp-block-image img,
.gallery img {
    cursor: zoom-in;
}

.nya-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
    background: rgba(0, 0, 0, 0.88);
    color: var(--nya-white);
}

.nya-lightbox.is-open {
    display: flex;
}

.nya-lightbox__dialog {
    width: min(100%, 1240px);
    max-height: 100%;
    display: grid;
    grid-template-rows: 1fr auto;
    gap: 10px;
    position: relative;
}

.nya-lightbox__image {
    max-width: 100%;
    max-height: calc(100vh - 112px);
    width: auto;
    height: auto;
    margin: 0 auto;
    border: 2px solid var(--nya-white);
    background: var(--nya-black);
    object-fit: contain;
    box-shadow: 8px 8px 0 rgba(255,255,255,0.16);
}

.nya-lightbox__caption {
    max-width: 900px;
    margin: 0 auto;
    font-family: 'Roboto Condensed', Arial, sans-serif;
    font-size: clamp(0.95rem, 2vw, 1.1rem);
    line-height: 1.35;
    text-align: center;
}

.nya-lightbox__button {
    appearance: none;
    border: 2px solid var(--nya-white);
    background: var(--nya-black);
    color: var(--nya-white);
    font-family: 'Permanent Marker', cursive;
    cursor: pointer;
    min-width: 44px;
    min-height: 44px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    box-shadow: 3px 3px 0 rgba(255,255,255,0.22);
}

.nya-lightbox__button:hover,
.nya-lightbox__button:focus {
    outline: 3px solid var(--nya-white);
    outline-offset: 3px;
}

.nya-lightbox__close {
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 1.45rem;
}

.nya-lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.8rem;
}

.nya-lightbox__prev { left: 12px; }
.nya-lightbox__next { right: 12px; }

@media (max-width: 620px) {
    .nya-lightbox {
        padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
    }

    .nya-lightbox__image {
        max-height: calc(100vh - 130px);
        box-shadow: 4px 4px 0 rgba(255,255,255,0.16);
    }

    .nya-lightbox__nav {
        bottom: 12px;
        top: auto;
        transform: none;
    }

    .nya-lightbox__prev { left: 16px; }
    .nya-lightbox__next { right: 16px; }
}


/* ===== v2.1 Category/menu panel scroll fix =====
   Keeps the landing page full-viewport layout, but lets overflowing
   category/menu buttons scroll vertically instead of being clipped. */

.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid {
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-gutter: stable both-edges;
}

.full-view-sketch .menu-grid::after,
body.home .menu-grid::after,
body.front-page .menu-grid::after {
    content: "";
    display: block;
    height: 18px;
    flex: 0 0 18px;
}

.full-view-sketch .menu-items,
body.home .menu-items,
body.front-page .menu-items {
    align-content: flex-start;
    padding-bottom: 18px;
}

.full-view-sketch .menu-items li a,
body.home .menu-items li a,
body.front-page .menu-items li a {
    white-space: nowrap;
}

/* On phones, make the menu panel clearly swipe/scrollable while keeping
   the homepage compact. */
@media (max-width: 620px) {
    .full-view-sketch .menu-grid,
    body.home .menu-grid,
    body.front-page .menu-grid {
        max-height: 190px;
        min-height: 152px;
        padding-bottom: 10px;
    }

    .full-view-sketch .menu-items,
    body.home .menu-items,
    body.front-page .menu-items {
        padding-bottom: 26px;
    }
}

/* On very short landscape screens, give the category panel a usable
   scrolling window instead of letting extra rows disappear. */
@media (orientation: landscape) and (max-height: 760px) {
    .full-view-sketch .menu-grid,
    body.home .menu-grid,
    body.front-page .menu-grid {
        min-height: 120px;
        max-height: clamp(120px, 22vh, 180px);
    }
}



/* ===== v3.4 Consolidated homepage refinements + slightly larger hero character ===== */

/* cleaner homepage framing */
.full-view-sketch.site-main,
body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home {
    border-left: 0 !important;
    border-right: 0 !important;
}

.full-view-sketch .sketch-hero-panel,
body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel,
.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .news-section,
body.home .news-section,
body.front-page .news-section {
    border-top: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

.full-view-sketch .section-kicker,
body.home .section-kicker,
body.front-page .section-kicker,
.full-view-sketch .section-row,
body.home .section-row,
body.front-page .section-row,
.full-view-sketch .news-section > .news-controls,
body.home .news-section > .news-controls,
body.front-page .news-section > .news-controls {
    display: none !important;
}

/* header / logo polish */
.top-logo-home {
    width: 138px;
    height: 46px;
    border: 1.5px solid var(--nya-black);
    box-shadow: 3px 3px 0 rgba(0,0,0,0.08);
    transform: rotate(-0.8deg);
}
.top-logo-image { max-width: 118px; max-height: 34px; }

.full-view-sketch .slide-copy h1,
.full-view-sketch .title-slide,
body.home .slide-copy h1,
body.home .title-slide,
body.front-page .slide-copy h1,
body.front-page .title-slide {
    max-width: min(720px, 76vw);
    font-size: clamp(2.4rem, 5vw, 4.4rem);
    padding: 10px 24px 14px;
}

.full-view-sketch .slide-copy p,
.full-view-sketch .text-slide,
body.home .slide-copy p,
body.home .text-slide,
body.front-page .slide-copy p,
body.front-page .text-slide {
    font-size: clamp(1rem, 1.8vw, 1.35rem);
    padding: 12px 16px 13px;
}

/* slightly larger hero character */
.full-view-sketch .header-slider .slide,
body.home .header-slider .slide,
body.front-page .header-slider .slide {
    grid-template-columns: minmax(0, 1fr) 246px;
    gap: 20px;
}

.full-view-sketch .slide-figure-wrap img,
body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img {
    max-height: 100%;
    transform: scale(1.2);
    transform-origin: center bottom;
}

/* menu/news sections */
.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .news-section,
body.home .news-section,
body.front-page .news-section {
    position: relative;
}

.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid {
    display: flex;
    align-items: center !important;
    padding: 10px 50px 12px;
    min-height: 132px;
    overflow: hidden;
}

.full-view-sketch .menu-slider-viewport,
body.home .menu-slider-viewport,
body.front-page .menu-slider-viewport,
.full-view-sketch .news-slider-viewport,
body.home .news-slider-viewport,
body.front-page .news-slider-viewport {
    position: relative;
    width: 100%;
    overflow: visible;
}

.full-view-sketch .menu-items,
body.home .menu-items,
body.front-page .menu-items {
    width: 100%;
    list-style: none;
    margin: 0;
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 0 14px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 2px 0 10px;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
}
.full-view-sketch .menu-items::-webkit-scrollbar,
body.home .menu-items::-webkit-scrollbar,
body.front-page .menu-items::-webkit-scrollbar,
.full-view-sketch .news-track::-webkit-scrollbar,
body.home .news-track::-webkit-scrollbar,
body.front-page .news-track::-webkit-scrollbar { display: none; }

.full-view-sketch .menu-items li,
body.home .menu-items li,
body.front-page .menu-items li {
    flex: 0 0 calc((100% - 24px) / 3);
    max-width: calc((100% - 24px) / 3);
    min-width: 0;
    scroll-snap-align: start;
    margin: 0;
}

.full-view-sketch .menu-items li a.nya-menu-card,
body.home .menu-items li a.nya-menu-card,
body.front-page .menu-items li a.nya-menu-card {
    position: relative;
    isolation: isolate;
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 108px !important;
    padding: 0 16px !important;
    border: 2px solid var(--nya-black);
    border-radius: 20px;
    background: linear-gradient(180deg, #ffffff 0%, #f6f6f6 100%);
    color: var(--nya-black);
    text-decoration: none;
    box-shadow: 0 2px 0 var(--nya-black), 0 8px 0 rgba(5,5,5,0.98), 0 12px 20px rgba(5,5,5,0.16), inset 0 1px 0 rgba(255,255,255,0.95);
    transform: translateY(0) rotate(var(--nya-card-tilt, 0deg));
    overflow: hidden;
}
.full-view-sketch .menu-items li a.nya-menu-card > *,
body.home .menu-items li a.nya-menu-card > *,
body.front-page .menu-items li a.nya-menu-card > * { grid-area: 1 / 1; }

.nya-menu-label {
    position: relative;
    z-index: 3;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 8px !important;
    text-align: center !important;
    font-family: 'Permanent Marker', cursive;
    font-size: clamp(1.45rem, 2vw, 2rem) !important;
    line-height: 1.04 !important;
    letter-spacing: 0.01em;
    text-wrap: balance;
    overflow-wrap: anywhere;
}
.nya-menu-art {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 80%;
    height: 80%;
    transform: translate(-50%, -50%);
    z-index: 1;
    opacity: 0.10;
    pointer-events: none;
}
.nya-menu-art img { width: 100%; height: 100%; object-fit: contain; filter: grayscale(1) contrast(1.08); }

/* shared nav arrows */
.full-view-sketch .menu-controls,
body.home .menu-controls,
body.front-page .menu-controls,
.full-view-sketch .news-controls.news-controls-inline,
body.home .news-controls.news-controls-inline,
body.front-page .news-controls.news-controls-inline {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 8;
    --nya-nav-edge-offset: 8px;
}
.full-view-sketch .menu-controls .menu-arrow,
body.home .menu-controls .menu-arrow,
body.front-page .menu-controls .menu-arrow,
.full-view-sketch .news-controls.news-controls-inline .news-arrow,
body.home .news-controls.news-controls-inline .news-arrow,
body.front-page .news-controls.news-controls-inline .news-arrow {
    position: absolute;
    top: 0;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border: 2px solid var(--nya-pink);
    color: var(--nya-pink);
    background: rgba(255,255,255,0.95);
    border-radius: 999px;
    box-shadow: 0 2px 0 rgba(255,79,160,0.20);
    cursor: pointer;
    font-size: 1.25rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
}
.full-view-sketch .menu-controls .menu-arrow-prev,
body.home .menu-controls .menu-arrow-prev,
body.front-page .menu-controls .menu-arrow-prev,
.full-view-sketch .news-controls.news-controls-inline .news-arrow-prev,
body.home .news-controls.news-controls-inline .news-arrow-prev,
body.front-page .news-controls.news-controls-inline .news-arrow-prev { left: var(--nya-nav-edge-offset); }
.full-view-sketch .menu-controls .menu-arrow-next,
body.home .menu-controls .menu-arrow-next,
body.front-page .menu-controls .menu-arrow-next,
.full-view-sketch .news-controls.news-controls-inline .news-arrow-next,
body.home .news-controls.news-controls-inline .news-arrow-next,
body.front-page .news-controls.news-controls-inline .news-arrow-next { right: var(--nya-nav-edge-offset); }
.menu-arrow:hover,.menu-arrow:focus,.news-arrow:hover,.news-arrow:focus { background: var(--nya-pink); color: var(--nya-white); outline: none; }

/* news row */
.full-view-sketch .news-section,
body.home .news-section,
body.front-page .news-section { padding: 12px 50px 8px; }
.full-view-sketch .news-track,
body.home .news-track,
body.front-page .news-track { padding-top: 0; }

/* responsive cards per panel */
@media (min-width: 1380px) {
  .full-view-sketch .menu-items li, body.home .menu-items li, body.front-page .menu-items li { flex-basis: calc((100% - 64px) / 5); max-width: calc((100% - 64px) / 5); }
  .nya-menu-label { font-size: clamp(1.5rem, 1.8vw, 2.05rem) !important; }
}
@media (min-width: 1024px) and (max-width: 1379px) {
  .full-view-sketch .menu-items li, body.home .menu-items li, body.front-page .menu-items li { flex-basis: calc((100% - 42px) / 4); max-width: calc((100% - 42px) / 4); }
  .nya-menu-label { font-size: clamp(1.42rem, 1.7vw, 1.85rem) !important; }
}
@media (min-width: 700px) and (max-width: 1023px) {
  .full-view-sketch.site-main, body.home .site-main.sketch-home, body.front-page .site-main.sketch-home { grid-template-rows: 34% 18% 48%; min-height: 820px; }
  .full-view-sketch .header-slider .slide, body.home .header-slider .slide, body.front-page .header-slider .slide { grid-template-columns: minmax(0, 1fr) 276px; gap: 24px; }
  .full-view-sketch .menu-items li, body.home .menu-items li, body.front-page .menu-items li { flex-basis: calc((100% - 24px) / 3); max-width: calc((100% - 24px) / 3); }
  .nya-menu-label { font-size: 1.55rem !important; }
}
@media (min-width: 480px) and (max-width: 699px) {
  .full-view-sketch .header-slider .slide, body.home .header-slider .slide, body.front-page .header-slider .slide { grid-template-columns: minmax(0, 1fr) 210px; gap: 16px; }
  .full-view-sketch .menu-items li, body.home .menu-items li, body.front-page .menu-items li { flex-basis: calc((100% - 10px) / 2); max-width: calc((100% - 10px) / 2); }
  .nya-menu-label { font-size: 1.36rem !important; }
  .full-view-sketch .menu-items li a.nya-menu-card, body.home .menu-items li a.nya-menu-card, body.front-page .menu-items li a.nya-menu-card { min-height: 102px !important; }
}
@media (max-width: 479px) {
  .full-view-sketch .menu-grid, body.home .menu-grid, body.front-page .menu-grid,
  .full-view-sketch .news-section, body.home .news-section, body.front-page .news-section { padding-left: 40px; padding-right: 40px; }
  .full-view-sketch .header-slider .slide, body.home .header-slider .slide, body.front-page .header-slider .slide { grid-template-columns: minmax(0, 1fr) 170px; gap: 12px; }
  .full-view-sketch .menu-items li, body.home .menu-items li, body.front-page .menu-items li { flex-basis: calc(82% - 2px); max-width: calc(82% - 2px); }
  .nya-menu-label { font-size: 1.26rem !important; }
  .full-view-sketch .menu-items li a.nya-menu-card, body.home .menu-items li a.nya-menu-card, body.front-page .menu-items li a.nya-menu-card { min-height: 96px !important; }
  .full-view-sketch .menu-controls, body.home .menu-controls, body.front-page .menu-controls,
  .full-view-sketch .news-controls.news-controls-inline, body.home .news-controls.news-controls-inline, body.front-page .news-controls.news-controls-inline { --nya-nav-edge-offset: 4px; }
  .full-view-sketch .menu-controls .menu-arrow, body.home .menu-controls .menu-arrow, body.front-page .menu-controls .menu-arrow,
  .full-view-sketch .news-controls.news-controls-inline .news-arrow, body.home .news-controls.news-controls-inline .news-arrow, body.front-page .news-controls.news-controls-inline .news-arrow { width: 34px; height: 34px; font-size: 1.05rem; }
}


/* ===== v3.5 Remove iPad/iOS note to restore hero headroom ===== */
.full-view-sketch .sketch-logo-row,
body.home .sketch-logo-row,
body.front-page .sketch-logo-row,
.full-view-sketch .device-note,
body.home .device-note,
body.front-page .device-note {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.full-view-sketch .header-slider,
body.home .header-slider,
body.front-page .header-slider {
    height: 100% !important;
}


/* ===== v3.6 Lower hero character slightly so the head is fully visible ===== */
.full-view-sketch .slide-figure-wrap,
body.home .slide-figure-wrap,
body.front-page .slide-figure-wrap {
    align-items: flex-end;
    padding-top: 6px;
}

.full-view-sketch .slide-figure-wrap img,
body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img {
    max-height: 98%;
    transform: translateY(12px) scale(1.16);
    transform-origin: center bottom;
}

@media (min-width: 700px) and (max-width: 1023px) {
    .full-view-sketch .slide-figure-wrap img,
    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img {
        transform: translateY(10px) scale(1.14);
    }
}

@media (max-width: 699px) {
    .full-view-sketch .slide-figure-wrap,
    body.home .slide-figure-wrap,
    body.front-page .slide-figure-wrap {
        padding-top: 4px;
    }

    .full-view-sketch .slide-figure-wrap img,
    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img {
        transform: translateY(8px) scale(1.12);
    }
}


/* ===== v3.7 Footer removed, homepage viewport fit, top header line removed ===== */
.site-footer {
    display: none !important;
}

.full-view-sketch.site-main,
body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home {
    height: calc(100svh - 44px) !important;
    min-height: 0 !important;
    max-height: none !important;
}

@supports (height: 100dvh) {
    .full-view-sketch.site-main,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home {
        height: calc(100dvh - 44px) !important;
    }
}

@media (max-width: 860px) {
    .full-view-sketch.site-main,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home {
        height: calc(100svh - 42px) !important;
    }

    @supports (height: 100dvh) {
        .full-view-sketch.site-main,
        body.home .site-main.sketch-home,
        body.front-page .site-main.sketch-home {
            height: calc(100dvh - 42px) !important;
        }
    }
}

@media (max-width: 620px) {
    .full-view-sketch.site-main,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home {
        height: auto !important;
    }
}


/* ===== v3.8 Keep copyright footer, remove only the 'Footer' text ===== */
.site-footer {
    display: block !important;
}

/* ===== v3.9 True viewport fit with visible copyright footer =====
   The homepage now subtracts both the logo header and the copyright footer,
   and forces every panel to shrink/scroll internally instead of making the
   document taller than the viewport. */
:root {
    --nya-home-header-h: 56px;
    --nya-home-footer-h: 34px;
    --nya-home-chrome-h: calc(var(--nya-home-header-h) + var(--nya-home-footer-h));
}

body.home,
body.front-page {
    min-height: 100svh;
    overflow: hidden;
}

@supports (min-height: 100dvh) {
    body.home,
    body.front-page {
        min-height: 100dvh;
    }
}

body.home .site-header,
body.front-page .site-header {
    min-height: var(--nya-home-header-h);
    padding-top: 5px;
    padding-bottom: 5px;
}

body.home .site-footer,
body.front-page .site-footer {
    display: block !important;
    height: var(--nya-home-footer-h);
    overflow: hidden;
}

body.home .site-footer p,
body.front-page .site-footer p {
    min-height: 0;
    height: var(--nya-home-footer-h);
    padding-top: 5px;
    padding-bottom: 5px;
    line-height: 1.15;
    overflow: hidden;
}

.full-view-sketch.site-main,
body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home {
    display: grid !important;
    width: min(100%, 920px);
    height: calc(100svh - var(--nya-home-chrome-h)) !important;
    min-height: 0 !important;
    max-height: none !important;
    grid-template-rows: minmax(0, 35fr) minmax(0, 22fr) minmax(0, 43fr) !important;
    overflow: hidden !important;
}

@supports (height: 100dvh) {
    .full-view-sketch.site-main,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home {
        height: calc(100dvh - var(--nya-home-chrome-h)) !important;
    }
}

.full-view-sketch .sketch-hero-panel,
body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel,
.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .news-section,
body.home .news-section,
body.front-page .news-section {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
}

.full-view-sketch .sketch-hero-panel,
body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel {
    padding-top: clamp(4px, 0.9svh, 12px) !important;
    padding-bottom: clamp(4px, 0.8svh, 10px) !important;
}

.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid {
    padding-top: clamp(4px, 0.8svh, 10px) !important;
    padding-bottom: clamp(4px, 0.8svh, 10px) !important;
}

.full-view-sketch .news-section,
body.home .news-section,
body.front-page .news-section {
    padding-top: clamp(4px, 0.8svh, 12px) !important;
    padding-bottom: clamp(4px, 0.8svh, 8px) !important;
}

.full-view-sketch .header-slider,
body.home .header-slider,
body.front-page .header-slider,
.full-view-sketch .slides-shell,
body.home .slides-shell,
body.front-page .slides-shell,
.full-view-sketch .header-slider .slide,
body.home .header-slider .slide,
body.front-page .header-slider .slide,
.full-view-sketch .menu-slider-viewport,
body.home .menu-slider-viewport,
body.front-page .menu-slider-viewport,
.full-view-sketch .news-slider-viewport,
body.home .news-slider-viewport,
body.front-page .news-slider-viewport {
    min-height: 0 !important;
    height: 100% !important;
}

.full-view-sketch .menu-items,
body.home .menu-items,
body.front-page .menu-items,
.full-view-sketch .news-track,
body.home .news-track,
body.front-page .news-track {
    max-height: 100%;
}

.full-view-sketch .menu-items li a.nya-menu-card,
body.home .menu-items li a.nya-menu-card,
body.front-page .menu-items li a.nya-menu-card {
    min-height: clamp(70px, 13.5svh, 108px) !important;
}

.full-view-sketch .news-item,
body.home .news-item,
body.front-page .news-item {
    height: clamp(130px, 31svh, 330px) !important;
}

@media (max-width: 620px) {
    .full-view-sketch.site-main,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home {
        display: grid !important;
        height: calc(100svh - var(--nya-home-chrome-h)) !important;
        grid-template-rows: minmax(0, 34fr) minmax(0, 24fr) minmax(0, 42fr) !important;
    }

    @supports (height: 100dvh) {
        .full-view-sketch.site-main,
        body.home .site-main.sketch-home,
        body.front-page .site-main.sketch-home {
            height: calc(100dvh - var(--nya-home-chrome-h)) !important;
        }
    }
}

@media (max-height: 720px) {
    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        font-size: clamp(1.55rem, 4.2vw, 3.35rem) !important;
        padding: 6px 16px 9px !important;
    }

    .full-view-sketch .slide-copy p,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.home .text-slide,
    body.front-page .slide-copy p,
    body.front-page .text-slide {
        font-size: clamp(0.78rem, 1.45vw, 1.05rem) !important;
        padding: 7px 10px 8px !important;
    }

    .full-view-sketch .menu-items li a.nya-menu-card,
    body.home .menu-items li a.nya-menu-card,
    body.front-page .menu-items li a.nya-menu-card {
        min-height: clamp(58px, 12svh, 88px) !important;
    }

    .nya-menu-label {
        font-size: clamp(1rem, 1.7vw, 1.42rem) !important;
    }

    .full-view-sketch .news-item,
    body.home .news-item,
    body.front-page .news-item {
        height: clamp(105px, 29svh, 230px) !important;
    }
}

/* ===== v3.10 Edge-to-edge footer and single article layout =====
   Removes the visible container/panel lines and makes the single article hero
   image span the full viewport width. */
.site-footer,
body.home .site-footer,
body.front-page .site-footer {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: var(--nya-white) !important;
}

.site-footer p,
body.home .site-footer p,
body.front-page .site-footer p {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* Single article/page should not sit inside a bordered panel. */
body.single .singular-main.accessible-singular,
body.single-post .singular-main.accessible-singular,
body.page .singular-main.accessible-singular {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: var(--nya-white) !important;
}

body.single .singular-card,
body.single-post .singular-card,
body.page .singular-card {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

body.single .singular-hero,
body.single-post .singular-hero {
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    border: 0 !important;
    box-shadow: none !important;
    min-height: clamp(320px, 54svh, 720px) !important;
}

@supports (min-height: 54dvh) {
    body.single .singular-hero,
    body.single-post .singular-hero {
        min-height: clamp(320px, 54dvh, 720px) !important;
    }
}

body.single .singular-hero::after,
body.single-post .singular-hero::after {
    background: linear-gradient(180deg, rgba(0,0,0,0.10), rgba(0,0,0,0.72)) !important;
}

body.single .singular-content-wrap,
body.single-post .singular-content-wrap,
body.page .singular-content-wrap {
    border: 0 !important;
    box-shadow: none !important;
}

/* Article body images can go full-bleed without drawing a framed box. */
body.single .singular-content figure,
body.single-post .singular-content figure,
body.single .singular-content .wp-block-image,
body.single-post .singular-content .wp-block-image {
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

body.single .singular-content img,
body.single-post .singular-content img,
body.single .singular-content .wp-block-image img,
body.single-post .singular-content .wp-block-image img {
    width: 100% !important;
    max-width: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.single .singular-footer,
body.single-post .singular-footer,
body.page .singular-footer,
body.single .accessible-comments,
body.single-post .accessible-comments,
body.page .accessible-comments {
    border: 0 !important;
    box-shadow: none !important;
}

/* ===== v3.11 Only the title/header hero image is full-bleed =====
   Keep the article/category title image edge-to-edge, but restore normal
   in-content images, galleries, and article-body media. */
body.single .singular-hero,
body.single-post .singular-hero,
body.archive .archive-hero,
body.category .archive-hero {
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.archive .archive-main.category-viewport,
body.category .archive-main.category-viewport {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.archive .archive-hero,
body.category .archive-hero {
    min-height: clamp(240px, 34svh, 480px) !important;
}

@supports (min-height: 34dvh) {
    body.archive .archive-hero,
    body.category .archive-hero {
        min-height: clamp(240px, 34dvh, 480px) !important;
    }
}

/* Undo v3.10 full-bleed body image/gallery treatment. */
body.single .singular-content figure,
body.single-post .singular-content figure,
body.single .singular-content .wp-block-image,
body.single-post .singular-content .wp-block-image,
body.single .singular-content .wp-block-gallery,
body.single-post .singular-content .wp-block-gallery,
body.single .singular-content .gallery,
body.single-post .singular-content .gallery {
    width: auto !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

body.single .singular-content img,
body.single-post .singular-content img,
body.single .singular-content .wp-block-image img,
body.single-post .singular-content .wp-block-image img,
body.single .singular-content .wp-block-gallery img,
body.single-post .singular-content .wp-block-gallery img,
body.single .singular-content .gallery img,
body.single-post .singular-content .gallery img {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    border: var(--nya-line) !important;
}

body.single .singular-content .alignfull,
body.single-post .singular-content .alignfull,
body.single .singular-content .alignwide,
body.single-post .singular-content .alignwide {
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ===== v3.12 Bottom-locked homepage stack + larger hero =====
   Menu cards and article cards sit against the bottom of the viewport while
   the hero area takes only the remaining space. The title, subtitle, and
   character are enlarged but still constrained to stay visible. */
body.home,
body.front-page {
    overflow: hidden !important;
}

.full-view-sketch.site-main,
body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home {
    grid-template-rows: minmax(0, 1fr) auto auto !important;
    align-content: end !important;
    row-gap: 0 !important;
}

.full-view-sketch .sketch-hero-panel,
body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel {
    display: flex !important;
    align-items: stretch !important;
    padding-top: clamp(2px, 0.4svh, 8px) !important;
    padding-bottom: clamp(8px, 1.1svh, 18px) !important;
}

.full-view-sketch .header-slider,
body.home .header-slider,
body.front-page .header-slider,
.full-view-sketch .slides-shell,
body.home .slides-shell,
body.front-page .slides-shell {
    width: 100% !important;
    height: 100% !important;
}

.full-view-sketch .header-slider .slide,
body.home .header-slider .slide,
body.front-page .header-slider .slide {
    grid-template-columns: minmax(0, 1fr) clamp(260px, 29vw, 380px) !important;
    gap: clamp(18px, 3.4vw, 56px) !important;
    align-items: end !important;
}

.full-view-sketch .slide-copy,
body.home .slide-copy,
body.front-page .slide-copy {
    align-self: center !important;
    padding-left: clamp(38px, 6vw, 78px) !important;
    padding-bottom: clamp(10px, 2.2svh, 34px) !important;
    gap: clamp(12px, 1.5svh, 20px) !important;
}

.full-view-sketch .slide-copy h1,
.full-view-sketch .title-slide,
body.home .slide-copy h1,
body.home .title-slide,
body.front-page .slide-copy h1,
body.front-page .title-slide {
    max-width: min(760px, 74vw) !important;
    font-size: clamp(2.8rem, 6.1vw, 5.35rem) !important;
    line-height: 0.95 !important;
    padding: clamp(9px, 1.1svh, 15px) clamp(20px, 2.5vw, 32px) clamp(12px, 1.4svh, 20px) !important;
}

.full-view-sketch .slide-copy p,
.full-view-sketch .text-slide,
body.home .slide-copy p,
body.home .text-slide,
body.front-page .slide-copy p,
body.front-page .text-slide {
    max-width: min(520px, 48vw) !important;
    font-size: clamp(1.12rem, 1.9vw, 1.55rem) !important;
    line-height: 1.05 !important;
    padding: clamp(9px, 1svh, 14px) clamp(14px, 1.7vw, 22px) !important;
}

.full-view-sketch .slide-figure-wrap,
body.home .slide-figure-wrap,
body.front-page .slide-figure-wrap {
    align-self: end !important;
    align-items: flex-end !important;
    padding-top: 0 !important;
    overflow: visible !important;
}

.full-view-sketch .slide-figure-wrap img,
body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img {
    max-height: min(100%, 48svh) !important;
    width: auto !important;
    transform: translateY(0) scale(1.08) !important;
    transform-origin: center bottom !important;
}

.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .news-section,
body.home .news-section,
body.front-page .news-section {
    align-self: end !important;
    width: 100% !important;
}

.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid {
    min-height: 0 !important;
    padding-top: clamp(4px, 0.7svh, 10px) !important;
    padding-bottom: clamp(7px, 1svh, 14px) !important;
}

.full-view-sketch .menu-items,
body.home .menu-items,
body.front-page .menu-items {
    align-items: flex-end !important;
    padding-bottom: 9px !important;
}

.full-view-sketch .menu-items li a.nya-menu-card,
body.home .menu-items li a.nya-menu-card,
body.front-page .menu-items li a.nya-menu-card {
    min-height: clamp(84px, 11svh, 122px) !important;
}

.full-view-sketch .news-section,
body.home .news-section,
body.front-page .news-section {
    padding-top: clamp(6px, 0.8svh, 12px) !important;
    padding-bottom: clamp(4px, 0.55svh, 8px) !important;
}

.full-view-sketch .news-slider-viewport,
body.home .news-slider-viewport,
body.front-page .news-slider-viewport {
    height: auto !important;
}

.full-view-sketch .news-track,
body.home .news-track,
body.front-page .news-track {
    align-items: flex-end !important;
    padding-bottom: 2px !important;
}

.full-view-sketch .news-item,
body.home .news-item,
body.front-page .news-item {
    height: clamp(205px, 29svh, 360px) !important;
}

@media (min-width: 700px) and (max-width: 1099px) {
    .full-view-sketch .header-slider .slide,
    body.home .header-slider .slide,
    body.front-page .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(250px, 32vw, 340px) !important;
    }

    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        font-size: clamp(3rem, 6.4vw, 4.65rem) !important;
    }

    .full-view-sketch .slide-figure-wrap img,
    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img {
        max-height: min(100%, 45svh) !important;
        transform: translateY(0) scale(1.06) !important;
    }
}

@media (max-height: 780px) {
    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        font-size: clamp(2rem, 5.2vw, 3.7rem) !important;
        padding: 7px 16px 10px !important;
    }

    .full-view-sketch .slide-copy p,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.home .text-slide,
    body.front-page .slide-copy p,
    body.front-page .text-slide {
        font-size: clamp(0.92rem, 1.55vw, 1.18rem) !important;
        padding: 7px 11px 8px !important;
    }

    .full-view-sketch .slide-figure-wrap img,
    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img {
        max-height: min(100%, 42svh) !important;
        transform: translateY(0) scale(1.02) !important;
    }

    .full-view-sketch .menu-items li a.nya-menu-card,
    body.home .menu-items li a.nya-menu-card,
    body.front-page .menu-items li a.nya-menu-card {
        min-height: clamp(62px, 10svh, 92px) !important;
    }

    .full-view-sketch .news-item,
    body.home .news-item,
    body.front-page .news-item {
        height: clamp(118px, 25svh, 230px) !important;
    }
}

@media (max-width: 620px) {
    .full-view-sketch .header-slider .slide,
    body.home .header-slider .slide,
    body.front-page .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(126px, 36vw, 210px) !important;
        gap: 10px !important;
    }

    .full-view-sketch .slide-copy,
    body.home .slide-copy,
    body.front-page .slide-copy {
        padding-left: clamp(18px, 7vw, 40px) !important;
        padding-bottom: 8px !important;
    }

    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        max-width: 62vw !important;
        font-size: clamp(1.65rem, 8.2vw, 3rem) !important;
    }

    .full-view-sketch .slide-copy p,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.home .text-slide,
    body.front-page .slide-copy p,
    body.front-page .text-slide {
        max-width: 58vw !important;
        font-size: clamp(0.82rem, 3.3vw, 1.02rem) !important;
    }

    .full-view-sketch .news-item,
    body.home .news-item,
    body.front-page .news-item {
        height: clamp(136px, 30svh, 260px) !important;
    }
}

/* ===== v3.13 One-line responsive hero title + larger character =====
   Keeps the lower menu/news blocks bottom-aligned, but forces the homepage
   title sticker to stay on one line and scales it to the available viewport.
   The character is slightly larger while still capped by the visible hero area. */
.full-view-sketch .header-slider .slide,
body.home .header-slider .slide,
body.front-page .header-slider .slide {
    grid-template-columns: minmax(0, 1fr) clamp(300px, 31vw, 430px) !important;
    gap: clamp(20px, 4vw, 68px) !important;
}

.full-view-sketch .slide-copy,
body.home .slide-copy,
body.front-page .slide-copy {
    min-width: 0 !important;
    padding-left: clamp(46px, 7vw, 92px) !important;
}

.full-view-sketch .slide-copy h1,
.full-view-sketch .title-slide,
body.home .slide-copy h1,
body.home .title-slide,
body.front-page .slide-copy h1,
body.front-page .title-slide {
    white-space: nowrap !important;
    width: max-content !important;
    max-width: calc(100vw - clamp(300px, 31vw, 430px) - clamp(46px, 7vw, 92px) - clamp(20px, 4vw, 68px) - 40px) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    font-size: clamp(2.95rem, 5.25vw, 5.15rem) !important;
    line-height: 0.9 !important;
}

.full-view-sketch .slide-figure-wrap img,
body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img {
    max-height: min(100%, 52svh) !important;
    transform: translateY(0) scale(1.14) !important;
    transform-origin: center bottom !important;
}

/* Landscape/tablet: give the title more horizontal room and keep all rows visible. */
@media (orientation: landscape) and (min-width: 760px) {
    .full-view-sketch .header-slider .slide,
    body.home .header-slider .slide,
    body.front-page .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(280px, 25vw, 410px) !important;
        gap: clamp(18px, 3.2vw, 58px) !important;
    }

    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        max-width: calc(100vw - clamp(280px, 25vw, 410px) - clamp(46px, 7vw, 92px) - clamp(18px, 3.2vw, 58px) - 44px) !important;
        font-size: clamp(3rem, 4.6vw, 5.45rem) !important;
    }

    .full-view-sketch .slide-figure-wrap img,
    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img {
        max-height: min(100%, 55svh) !important;
        transform: translateY(0) scale(1.16) !important;
    }
}

/* iPad/admin-bar height constraints: reduce the sticker before wrapping. */
@media (max-height: 820px) and (min-width: 700px) {
    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        white-space: nowrap !important;
        font-size: clamp(2.35rem, 4.35vw, 4.15rem) !important;
        padding: 8px 18px 12px !important;
    }

    .full-view-sketch .slide-figure-wrap img,
    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img {
        max-height: min(100%, 48svh) !important;
        transform: translateY(0) scale(1.12) !important;
    }
}

/* Narrow screens still keep the title in one line by shrinking instead of wrapping. */
@media (max-width: 620px) {
    .full-view-sketch .header-slider .slide,
    body.home .header-slider .slide,
    body.front-page .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(132px, 34vw, 210px) !important;
    }

    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        white-space: nowrap !important;
        max-width: calc(100vw - clamp(132px, 34vw, 210px) - 44px) !important;
        font-size: clamp(1.25rem, 6.1vw, 2.45rem) !important;
        padding: 6px 10px 9px !important;
    }

    .full-view-sketch .slide-figure-wrap img,
    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img {
        max-height: min(100%, 44svh) !important;
        transform: translateY(0) scale(1.08) !important;
    }
}

/* ===== v3.14 Stretch hero title sticker to fully contain one-line title =====
   The title text was correctly staying on one line, but the sticker panel was
   still capped by the reserved character column. On tablet/landscape and larger
   screens, let the sticker use its real text width so the border surrounds all
   of “NOT YOU AGAIN”. Narrow screens keep the viewport-safe cap. */
@media (min-width: 700px) {
    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        width: max-content !important;
        max-width: none !important;
        min-width: max-content !important;
        overflow: visible !important;
    }
}

/* Give the landscape/iPad composition just a little more title-side room so the
   stretched sticker does not feel cramped against the character. */
@media (orientation: landscape) and (min-width: 760px) {
    .full-view-sketch .header-slider .slide,
    body.home .header-slider .slide,
    body.front-page .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(260px, 24vw, 390px) !important;
        gap: clamp(14px, 2.5vw, 48px) !important;
    }

    .full-view-sketch .slide-copy,
    body.home .slide-copy,
    body.front-page .slide-copy {
        padding-left: clamp(42px, 6vw, 84px) !important;
    }
}

/* Safety for short admin-bar/iPad viewports: keep the full sticker visible by
   scaling the text slightly before any viewport overflow can happen. */
@media (orientation: landscape) and (min-width: 760px) and (max-height: 840px) {
    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        font-size: clamp(2.25rem, 4.15vw, 4rem) !important;
    }
}

/* ===== v3.17 Article gallery slider only ===== */
body.single .singular-content .nya-article-gallery-slider,
body.single-post .singular-content .nya-article-gallery-slider {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 2rem auto !important;
    padding: 0 54px !important;
    box-sizing: border-box !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.single .singular-content .nya-article-gallery-slider__viewport,
body.single-post .singular-content .nya-article-gallery-slider__viewport {
    width: 100% !important;
    overflow: hidden !important;
}

body.single .singular-content .nya-article-gallery-slider__track,
body.single-post .singular-content .nya-article-gallery-slider__track {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: clamp(12px, 2vw, 20px) !important;
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    scroll-behavior: smooth !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
}

body.single .singular-content .nya-article-gallery-slider__track::-webkit-scrollbar,
body.single-post .singular-content .nya-article-gallery-slider__track::-webkit-scrollbar {
    display: none !important;
}

body.single .singular-content .nya-article-gallery-slider__item,
body.single-post .singular-content .nya-article-gallery-slider__item,
body.single .singular-content .wp-block-gallery.nya-article-gallery-slider.has-nested-images figure.wp-block-image.nya-article-gallery-slider__item,
body.single-post .singular-content .wp-block-gallery.nya-article-gallery-slider.has-nested-images figure.wp-block-image.nya-article-gallery-slider__item {
    flex: 0 0 calc((100% - (clamp(12px, 2vw, 20px) * 2)) / 3) !important;
    width: calc((100% - (clamp(12px, 2vw, 20px) * 2)) / 3) !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    scroll-snap-align: start !important;
    box-sizing: border-box !important;
    border: 0 !important;
}

body.single .singular-content .nya-article-gallery-slider__item img,
body.single-post .singular-content .nya-article-gallery-slider__item img,
body.single .singular-content .wp-block-gallery.nya-article-gallery-slider img,
body.single-post .singular-content .wp-block-gallery.nya-article-gallery-slider img,
body.single .singular-content .gallery.nya-article-gallery-slider img,
body.single-post .singular-content .gallery.nya-article-gallery-slider img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: clamp(170px, 24vw, 300px) !important;
    object-fit: cover !important;
    margin: 0 !important;
    border: var(--nya-line) !important;
    box-sizing: border-box !important;
}

body.single .singular-content .nya-article-gallery-slider figcaption,
body.single-post .singular-content .nya-article-gallery-slider figcaption {
    font-size: 0.72em !important;
    line-height: 1.2 !important;
    margin: 8px 0 0 !important;
}

.nya-article-gallery-slider__button {
    position: absolute !important;
    top: 50% !important;
    z-index: 3 !important;
    width: 44px !important;
    height: 44px !important;
    transform: translateY(-50%) !important;
    display: grid !important;
    place-items: center !important;
    border: 3px solid var(--nya-pink) !important;
    border-radius: 999px !important;
    background: var(--nya-white) !important;
    color: var(--nya-pink) !important;
    font-family: 'Permanent Marker', cursive !important;
    font-size: 1.9rem !important;
    line-height: 1 !important;
    cursor: pointer !important;
}

.nya-article-gallery-slider__button--prev {
    left: 0 !important;
}

.nya-article-gallery-slider__button--next {
    right: 0 !important;
}

.nya-article-gallery-slider__button:disabled {
    opacity: 0.3 !important;
    cursor: default !important;
}

@media (max-width: 760px) {
    body.single .singular-content .nya-article-gallery-slider,
    body.single-post .singular-content .nya-article-gallery-slider {
        padding: 0 48px !important;
    }

    body.single .singular-content .nya-article-gallery-slider__item,
    body.single-post .singular-content .nya-article-gallery-slider__item,
    body.single .singular-content .wp-block-gallery.nya-article-gallery-slider.has-nested-images figure.wp-block-image.nya-article-gallery-slider__item,
    body.single-post .singular-content .wp-block-gallery.nya-article-gallery-slider.has-nested-images figure.wp-block-image.nya-article-gallery-slider__item {
        flex-basis: calc((100% - clamp(12px, 2vw, 20px)) / 2) !important;
        width: calc((100% - clamp(12px, 2vw, 20px)) / 2) !important;
    }
}

@media (max-width: 520px) {
    body.single .singular-content .nya-article-gallery-slider,
    body.single-post .singular-content .nya-article-gallery-slider {
        padding: 0 42px !important;
    }

    body.single .singular-content .nya-article-gallery-slider__item,
    body.single-post .singular-content .nya-article-gallery-slider__item,
    body.single .singular-content .wp-block-gallery.nya-article-gallery-slider.has-nested-images figure.wp-block-image.nya-article-gallery-slider__item,
    body.single-post .singular-content .wp-block-gallery.nya-article-gallery-slider.has-nested-images figure.wp-block-image.nya-article-gallery-slider__item {
        flex-basis: 100% !important;
        width: 100% !important;
    }
}

/* ===== v3.18 Category landscape hero crop fix =====
   Keep the v3-17 article gallery work, but stop the category hero text from
   being clipped at the top on iPad/Safari landscape and other short viewports.
   This only targets archive/category pages in landscape. */
@media (orientation: landscape) and (min-width: 700px) and (max-height: 840px) {
    body.archive .archive-main.category-viewport,
    body.category .archive-main.category-viewport {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        display: block !important;
        overflow: visible !important;
    }

    body.archive .archive-hero,
    body.category .archive-hero {
        height: auto !important;
        min-height: clamp(360px, 52svh, 520px) !important;
        align-items: flex-end !important;
        overflow: hidden !important;
    }

    @supports (min-height: 52dvh) {
        body.archive .archive-hero,
        body.category .archive-hero {
            min-height: clamp(360px, 52dvh, 520px) !important;
        }
    }

    body.archive .archive-hero-inner,
    body.category .archive-hero-inner {
        padding: clamp(42px, 7svh, 78px) clamp(32px, 4vw, 56px) clamp(30px, 5svh, 52px) !important;
    }

    body.archive .archive-title,
    body.category .archive-title {
        font-size: clamp(2.8rem, 5.3vw, 4.6rem) !important;
        line-height: 0.98 !important;
    }

    body.archive .archive-description,
    body.category .archive-description {
        max-width: 880px !important;
        font-size: clamp(1rem, 1.7vw, 1.26rem) !important;
        line-height: 1.3 !important;
    }

    body.archive .archive-results,
    body.category .archive-results {
        overflow: visible !important;
    }
}


/* ===== v3.19 Category hero illustration integration =====
   Integrate the custom black/pink/white branded banner into the category
   hero without changing the page structure. Uses a web-optimised WebP asset.
*/
body.archive .archive-hero,
body.category .archive-hero {
    background: #050505 !important;
}

body.archive .archive-hero::before,
body.category .archive-hero::before {
    background:
        linear-gradient(90deg,
            rgba(5,5,5,0.86) 0%,
            rgba(5,5,5,0.68) 14%,
            rgba(5,5,5,0.28) 35%,
            rgba(5,5,5,0.16) 50%,
            rgba(5,5,5,0.34) 66%,
            rgba(5,5,5,0.74) 86%,
            rgba(5,5,5,0.88) 100%),
        url('../images/category-hero-bg.webp') center center / cover no-repeat !important;
    filter: none !important;
    opacity: 1 !important;
}

body.archive .archive-hero::after,
body.category .archive-hero::after {
    background:
        linear-gradient(180deg, rgba(0,0,0,0.14), rgba(0,0,0,0.72)),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.045) 0 1px, transparent 1px 6px) !important;
}

body.archive .archive-hero-inner,
body.category .archive-hero-inner {
    position: relative;
    z-index: 1;
}

body.archive .archive-kicker,
body.category .archive-kicker {
    background: rgba(0,0,0,0.42);
    backdrop-filter: blur(1px);
}

body.archive .archive-title,
body.category .archive-title,
body.archive .archive-description,
body.category .archive-description {
    position: relative;
    z-index: 1;
}

/* ===== v3.20 Category article slider arrows =====
   Give category/archive article cards the same left/right pink slider
   navigation language as the starter page, without changing the card layout.
*/
body.archive .archive-results,
body.category .archive-results {
    padding-left: 50px;
    padding-right: 50px;
}

body.archive .archive-slider-viewport,
body.category .archive-slider-viewport {
    width: 100%;
    overflow: hidden;
    position: relative;
}

body.archive .archive-controls.archive-controls-inline,
body.category .archive-controls.archive-controls-inline {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 8;
    --nya-nav-edge-offset: 8px;
}

body.archive .archive-controls.archive-controls-inline .archive-arrow,
body.category .archive-controls.archive-controls-inline .archive-arrow {
    position: absolute;
    top: 0;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border: 2px solid var(--nya-pink);
    color: var(--nya-pink);
    background: rgba(255,255,255,0.95);
    border-radius: 999px;
    box-shadow: 0 2px 0 rgba(255,79,160,0.20);
    cursor: pointer;
    font-size: 1.25rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
}

body.archive .archive-controls.archive-controls-inline .archive-arrow-prev,
body.category .archive-controls.archive-controls-inline .archive-arrow-prev {
    left: var(--nya-nav-edge-offset);
}

body.archive .archive-controls.archive-controls-inline .archive-arrow-next,
body.category .archive-controls.archive-controls-inline .archive-arrow-next {
    right: var(--nya-nav-edge-offset);
}

body.archive .archive-controls.archive-controls-inline .archive-arrow:hover,
body.archive .archive-controls.archive-controls-inline .archive-arrow:focus,
body.category .archive-controls.archive-controls-inline .archive-arrow:hover,
body.category .archive-controls.archive-controls-inline .archive-arrow:focus {
    background: var(--nya-pink);
    color: var(--nya-white);
    outline: none;
}

body.archive .archive-controls.archive-controls-inline .archive-arrow:disabled,
body.category .archive-controls.archive-controls-inline .archive-arrow:disabled {
    opacity: 0.45;
    cursor: default;
}

@media (max-width: 700px) {
    body.archive .archive-results,
    body.category .archive-results {
        padding-left: 36px;
        padding-right: 36px;
    }

    body.archive .archive-controls.archive-controls-inline .archive-arrow,
    body.category .archive-controls.archive-controls-inline .archive-arrow {
        width: 34px;
        height: 34px;
        font-size: 1.05rem;
    }
}

/* ===== v3.21 Category articles spacing tweak =====
   Restore breathing room between the category banner and the article rail/head.
   This only adjusts the category/archive article section spacing.
*/
body.archive .archive-results,
body.category .archive-results {
    padding-top: clamp(24px, 3.2vw, 42px) !important;
}

body.archive .archive-results-head,
body.category .archive-results-head {
    margin-bottom: clamp(12px, 1.6vw, 18px) !important;
}

/* ===== v3.22 Category landscape viewport fit tweak =====
   Portrait already looks right. This only compresses the category page on
   short landscape viewports so the hero, article rail, cards, and pagination
   fit in the visible viewport without changing the portrait layout.
*/
@media (orientation: landscape) and (min-width: 900px) and (max-height: 900px) {
    body.archive .archive-main.category-viewport,
    body.category .archive-main.category-viewport {
        height: calc(100vh - 66px) !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: hidden !important;
        display: grid !important;
        grid-template-rows: auto 1fr !important;
    }

    body.archive .archive-hero,
    body.category .archive-hero {
        min-height: clamp(250px, 30svh, 340px) !important;
    }

    @supports (min-height: 30dvh) {
        body.archive .archive-hero,
        body.category .archive-hero {
            min-height: clamp(250px, 30dvh, 340px) !important;
        }
    }

    body.archive .archive-hero-inner,
    body.category .archive-hero-inner {
        padding: clamp(24px, 3vw, 34px) clamp(28px, 3vw, 44px) clamp(20px, 2.6vw, 30px) !important;
    }

    body.archive .archive-kicker,
    body.category .archive-kicker {
        margin-bottom: 10px !important;
        font-size: clamp(0.95rem, 1.3vw, 1.15rem) !important;
        padding: 4px 12px 6px !important;
    }

    body.archive .archive-title,
    body.category .archive-title {
        font-size: clamp(2.4rem, 4.2vw, 3.8rem) !important;
        margin-bottom: 12px !important;
    }

    body.archive .archive-description,
    body.category .archive-description {
        max-width: 980px !important;
        font-size: clamp(0.95rem, 1.35vw, 1.12rem) !important;
        line-height: 1.24 !important;
    }

    body.archive .archive-results,
    body.category .archive-results {
        padding-top: 18px !important;
        padding-bottom: 6px !important;
        display: flex !important;
        flex-direction: column !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    body.archive .archive-results-head,
    body.category .archive-results-head {
        margin-bottom: 10px !important;
        flex: 0 0 auto !important;
    }

    body.archive .archive-slider-viewport,
    body.category .archive-slider-viewport {
        flex: 1 1 auto !important;
        min-height: 0 !important;
    }

    body.archive .archive-track,
    body.category .archive-track {
        padding-bottom: 0 !important;
    }

    body.archive .archive-card,
    body.category .archive-card {
        height: clamp(215px, 31svh, 300px) !important;
    }

    @supports (height: 31dvh) {
        body.archive .archive-card,
        body.category .archive-card {
            height: clamp(215px, 31dvh, 300px) !important;
        }
    }

    body.archive .archive-card-link,
    body.category .archive-card-link {
        padding: 12px 12px 10px !important;
    }

    body.archive .archive-card h2,
    body.category .archive-card h2 {
        font-size: clamp(1.05rem, 1.55vw, 1.35rem) !important;
        margin-bottom: 7px !important;
    }

    body.archive .archive-card-meta,
    body.category .archive-card-meta {
        margin-bottom: 8px !important;
        font-size: clamp(0.78rem, 1vw, 0.92rem) !important;
    }

    body.archive .archive-card-excerpt,
    body.archive .archive-card-excerpt p,
    body.category .archive-card-excerpt,
    body.category .archive-card-excerpt p {
        font-size: clamp(0.75rem, 0.98vw, 0.9rem) !important;
        line-height: 1.24 !important;
    }

    body.archive .archive-pagination,
    body.category .archive-pagination {
        margin-top: 8px !important;
        flex: 0 0 auto !important;
    }
}

/* ===== v3.23 Category landscape nav vertical centering =====
   In the compressed landscape layout, keep the pink category slider arrows
   vertically centered on the visible article cards instead of the whole flexed
   viewport area.
*/
@media (orientation: landscape) and (min-width: 900px) and (max-height: 900px) {
    body.archive .archive-slider-viewport,
    body.category .archive-slider-viewport {
        flex: 0 0 auto !important;
        min-height: auto !important;
    }

    body.archive .archive-controls.archive-controls-inline,
    body.category .archive-controls.archive-controls-inline {
        top: 0 !important;
        transform: none !important;
        height: clamp(215px, 31svh, 300px) !important;
    }

    @supports (height: 31dvh) {
        body.archive .archive-controls.archive-controls-inline,
        body.category .archive-controls.archive-controls-inline {
            height: clamp(215px, 31dvh, 300px) !important;
        }
    }

    body.archive .archive-controls.archive-controls-inline .archive-arrow,
    body.category .archive-controls.archive-controls-inline .archive-arrow {
        top: 50% !important;
        transform: translateY(-50%) !important;
    }
}

/* ===== v3.25 Desktop/laptop full-width homepage responsiveness =====
   Do not shrink the hero title or character. On real desktop/laptop pointers,
   give the starter page the full viewport width so the hero has enough room.
   Touch/iPad layouts are left untouched.
*/
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
    body.home,
    body.front-page {
        overflow: hidden !important;
    }

    body.home .header-container,
    body.front-page .header-container,
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main,
    body.home .site-footer,
    body.front-page .site-footer {
        width: 100vw !important;
        max-width: none !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
        border-left: 0 !important;
        border-right: 0 !important;
    }

    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 38fr) minmax(0, 20fr) minmax(0, 42fr) !important;
    }

    body.home .sketch-hero-panel,
    body.front-page .sketch-hero-panel,
    .full-view-sketch .sketch-hero-panel {
        padding-left: clamp(48px, 6vw, 110px) !important;
        padding-right: clamp(48px, 6vw, 110px) !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(300px, 22vw, 430px) !important;
        gap: clamp(28px, 4vw, 78px) !important;
    }

    body.home .slide-copy,
    body.front-page .slide-copy,
    .full-view-sketch .slide-copy {
        padding-left: clamp(32px, 4vw, 86px) !important;
        padding-right: 0 !important;
    }

    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide,
    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide {
        width: max-content !important;
        max-width: none !important;
        min-width: max-content !important;
        white-space: nowrap !important;
        overflow: visible !important;
    }

    body.home .slide-copy p,
    body.home .text-slide,
    body.front-page .slide-copy p,
    body.front-page .text-slide,
    .full-view-sketch .slide-copy p,
    .full-view-sketch .text-slide {
        max-width: min(560px, 44vw) !important;
    }

    body.home .slide-figure-wrap,
    body.front-page .slide-figure-wrap,
    .full-view-sketch .slide-figure-wrap {
        justify-content: center !important;
    }

    body.home .menu-grid,
    body.front-page .menu-grid,
    .full-view-sketch .menu-grid,
    body.home .news-section,
    body.front-page .news-section,
    .full-view-sketch .news-section {
        padding-left: clamp(70px, 10vw, 190px) !important;
        padding-right: clamp(70px, 10vw, 190px) !important;
    }
}

@media (min-width: 1024px) and (hover: hover) and (pointer: fine) and (max-height: 820px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 39fr) minmax(0, 20fr) minmax(0, 41fr) !important;
    }

    body.home .news-item,
    body.front-page .news-item,
    .full-view-sketch .news-item {
        height: clamp(118px, 27svh, 240px) !important;
    }
}


/* ===== v3.26 Tiny pink face-dot navigation =====
   Replace side-mounted slider arrows with small branded face dots underneath
   the menu, homepage article slider, and category/archive article slider.
   This avoids responsive left/right alignment drift across sections.
*/
.full-view-sketch .menu-controls,
body.home .menu-controls,
body.front-page .menu-controls,
.full-view-sketch .news-controls.news-controls-inline,
body.home .news-controls.news-controls-inline,
body.front-page .news-controls.news-controls-inline,
body.archive .archive-controls.archive-controls-inline,
body.category .archive-controls.archive-controls-inline {
    display: none !important;
}

.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .news-section,
body.home .news-section,
body.front-page .news-section,
body.archive .archive-results,
body.category .archive-results {
    padding-left: 28px !important;
    padding-right: 28px !important;
}

.full-view-sketch .menu-slider-viewport,
body.home .menu-slider-viewport,
body.front-page .menu-slider-viewport,
.full-view-sketch .news-slider-viewport,
body.home .news-slider-viewport,
body.front-page .news-slider-viewport,
body.archive .archive-slider-viewport,
body.category .archive-slider-viewport {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.full-view-sketch .menu-items,
body.home .menu-items,
body.front-page .menu-items,
.full-view-sketch .news-track,
body.home .news-track,
body.front-page .news-track,
body.archive .archive-track,
body.category .archive-track {
    scroll-snap-type: x proximity;
}

.full-view-sketch .menu-items li,
body.home .menu-items li,
body.front-page .menu-items li,
.full-view-sketch .news-item,
body.home .news-item,
body.front-page .news-item,
body.archive .archive-card,
body.category .archive-card {
    scroll-snap-align: start;
}

.nya-face-dot-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 8px auto 0;
    width: 100%;
    min-height: 18px;
}

.nya-face-dot-nav[hidden] {
    display: none !important;
}

.nya-face-dot {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    background: transparent;
    padding: 0;
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    background-image: url('../images/nav-face-dot.webp');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.34;
    transform: scale(0.9);
    transition: transform 0.18s ease, opacity 0.18s ease, filter 0.18s ease;
    cursor: pointer;
    filter: drop-shadow(0 0 0 rgba(255, 78, 160, 0));
}

.nya-face-dot:hover,
.nya-face-dot:focus-visible {
    opacity: 0.72;
    transform: scale(1);
    outline: none;
}

.nya-face-dot.is-active {
    opacity: 1;
    transform: scale(1.08);
    filter: drop-shadow(0 0 3px rgba(255, 78, 160, 0.35));
}

.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid {
    padding-bottom: 4px !important;
}

.full-view-sketch .news-section,
body.home .news-section,
body.front-page .news-section {
    padding-top: 8px !important;
    padding-bottom: 4px !important;
}

body.archive .archive-results,
body.category .archive-results {
    padding-top: 14px !important;
}

body.archive .archive-dot-nav,
body.category .archive-dot-nav {
    margin-top: 6px;
}

@media (max-width: 820px) {
    .nya-face-dot-nav {
        gap: 5px;
        margin-top: 7px;
    }

    .nya-face-dot {
        width: 14px;
        height: 14px;
        flex-basis: 14px;
    }

    .full-view-sketch .menu-grid,
    body.home .menu-grid,
    body.front-page .menu-grid,
    .full-view-sketch .news-section,
    body.home .news-section,
    body.front-page .news-section,
    body.archive .archive-results,
    body.category .archive-results {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

@media (orientation: landscape) and (min-width: 900px) and (max-height: 900px) {
    body.archive .archive-hero,
    body.category .archive-hero {
        min-height: clamp(235px, 27dvh, 320px) !important;
    }

    body.archive .archive-results,
    body.category .archive-results {
        padding-top: 12px !important;
        padding-bottom: 4px !important;
    }

    body.archive .archive-results-head,
    body.category .archive-results-head {
        margin-bottom: 8px !important;
    }

    body.archive .archive-card,
    body.category .archive-card {
        height: clamp(198px, 28dvh, 276px) !important;
    }

    body.archive .archive-dot-nav,
    body.category .archive-dot-nav {
        margin-top: 4px !important;
        min-height: 14px !important;
    }

    body.archive .archive-pagination,
    body.category .archive-pagination {
        margin-top: 6px !important;
    }

    .nya-face-dot {
        width: 13px;
        height: 13px;
        flex-basis: 13px;
    }
}


/* ===== v3.27 Face-dot nav everywhere + menu dot placement fix ===== */
/* Put the menu dots inside the slider viewport so they sit underneath the menu cards,
   not to the right of the menu section when the wrapper is flexed. */
.full-view-sketch .menu-slider-viewport,
body.home .menu-slider-viewport,
body.front-page .menu-slider-viewport,
.full-view-sketch .news-slider-viewport,
body.home .news-slider-viewport,
body.front-page .news-slider-viewport,
body.archive .archive-slider-viewport,
body.category .archive-slider-viewport,
.header-slider,
body.single .singular-content .nya-article-gallery-slider,
body.single-post .singular-content .nya-article-gallery-slider {
    display: block !important;
}

/* The new tiny face-dot navigation is the shared slider UI everywhere. */
.slider-arrow,
.nya-article-gallery-slider__button {
    display: none !important;
}

.header-slider {
    padding-bottom: 4px !important;
}

.header-dot-nav,
.menu-dot-nav,
.news-dot-nav,
.archive-dot-nav,
.nya-article-gallery-slider__dot-nav {
    justify-content: center !important;
    width: 100% !important;
}

/* Keep the menu section vertically stacked in all responsive states. */
.full-view-sketch .menu-grid,
body.home .menu-grid,
body.front-page .menu-grid {
    display: block !important;
}

.full-view-sketch .menu-slider-viewport,
body.home .menu-slider-viewport,
body.front-page .menu-slider-viewport {
    width: 100% !important;
}

/* Article galleries now use dots under the gallery instead of side arrows. */
body.single .singular-content .nya-article-gallery-slider,
body.single-post .singular-content .nya-article-gallery-slider {
    padding: 0 !important;
}

body.single .singular-content .nya-article-gallery-slider__viewport,
body.single-post .singular-content .nya-article-gallery-slider__viewport {
    width: 100% !important;
    overflow: hidden !important;
}

body.single .singular-content .nya-article-gallery-slider__dot-nav,
body.single-post .singular-content .nya-article-gallery-slider__dot-nav {
    margin-top: 10px !important;
}

@media (max-width: 760px) {
    body.single .singular-content .nya-article-gallery-slider,
    body.single-post .singular-content .nya-article-gallery-slider {
        padding: 0 !important;
    }
}

@media (max-width: 520px) {
    body.single .singular-content .nya-article-gallery-slider,
    body.single-post .singular-content .nya-article-gallery-slider {
        padding: 0 !important;
    }
}


/* ===== v4 Hero swap + animated title/subtitle ===== */
.header-slider .slide-copy {
    position: relative;
    z-index: 2;
}

.header-slider .title-slide,
.header-slider .text-slide {
    will-change: transform, opacity;
}

.header-slider .slide.active .title-slide {
    animation: nyaHeroStickerIn 700ms cubic-bezier(.22,.61,.36,1) both;
}

.header-slider .slide.active .text-slide {
    animation: nyaHeroStickerIn 760ms cubic-bezier(.22,.61,.36,1) 100ms both;
}

@keyframes nyaHeroStickerIn {
    0% {
        opacity: 0;
        transform: translateY(18px) rotate(-1deg) scale(0.985);
    }
    100% {
        opacity: 1;
        transform: translateY(0) rotate(0deg) scale(1);
    }
}

body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img,
.full-view-sketch .slide-figure-wrap img {
    max-width: min(100%, 520px) !important;
    max-height: min(100%, 50svh) !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
}

@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(350px, 27vw, 520px) !important;
    }
}


/* ===== v5 Pink title/subtitle panels + black text with white drop shadow ===== */
body.home .title-slide,
body.home .text-slide,
body.front-page .title-slide,
body.front-page .text-slide,
.full-view-sketch .title-slide,
.full-view-sketch .text-slide {
    background: #ff2f92 !important;
    color: #050505 !important;
    border-color: #050505 !important;
    box-shadow: 0 0 0 2px rgba(255,255,255,0.96), 6px 6px 0 rgba(5,5,5,0.18) !important;
    text-shadow: 2px 2px 0 rgba(255,255,255,0.98), 3px 3px 0 rgba(255,255,255,0.78) !important;
}

body.home .title-slide,
body.front-page .title-slide,
.full-view-sketch .title-slide {
    letter-spacing: 0.015em !important;
}

body.home .text-slide,
body.front-page .text-slide,
.full-view-sketch .text-slide {
    font-weight: 700 !important;
}

.header-slider .slide.active .title-slide {
    animation: nyaHeroStickerIn 700ms cubic-bezier(.22,.61,.36,1) both, nyaHeroStickerFloat 4600ms ease-in-out infinite 900ms;
}

.header-slider .slide.active .text-slide {
    animation: nyaHeroStickerIn 760ms cubic-bezier(.22,.61,.36,1) 100ms both, nyaHeroSubtitlePulse 4600ms ease-in-out infinite 1100ms;
}

@keyframes nyaHeroStickerFloat {
    0%, 100% { transform: translateY(0) rotate(-0.35deg); }
    50% { transform: translateY(-3px) rotate(0deg); }
}

@keyframes nyaHeroSubtitlePulse {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-2px); }
}

/* ===== v3.18 Prevent homepage hero title from being clipped on iPad/admin views =====
   Earlier one-line rules used min-width:max-content and max-width:none, which
   can make long slide titles extend beyond the viewport. Keep the sticker on
   one line, but let JS shrink it to the available width and remove the hard
   max-content minimum that caused the right side to be cut off. */
.full-view-sketch .slide-copy h1,
.full-view-sketch .title-slide,
body.home .slide-copy h1,
body.home .title-slide,
body.front-page .slide-copy h1,
body.front-page .title-slide {
    min-width: 0 !important;
    width: fit-content !important;
    max-width: calc(100vw - clamp(42px, 6vw, 84px) - 24px) !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
}


/* ===== v3.19 Hard fix: fit long homepage hero titles on iPad/Safari =====
   JS now writes font-size with !important, so these viewport-safe fallbacks
   actually take effect before JS measures and fine-tunes the active title. */
.full-view-sketch .title-slide,
body.home .title-slide,
body.front-page .title-slide {
    max-width: calc(100vw - clamp(42px, 6vw, 84px) - 28px) !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

@media (orientation: landscape) and (min-width: 760px) and (max-width: 1180px) {
    .full-view-sketch .title-slide,
    body.home .title-slide,
    body.front-page .title-slide {
        font-size: clamp(2rem, 3.55vw, 2.7rem) !important;
        padding: 8px 18px 12px !important;
    }
}

@media (orientation: landscape) and (min-width: 760px) and (max-width: 1180px) and (max-height: 860px) {
    .full-view-sketch .title-slide,
    body.home .title-slide,
    body.front-page .title-slide {
        font-size: clamp(1.85rem, 3.35vw, 2.45rem) !important;
    }
}

/* ===== v3.15 Fill homepage hero headroom + slightly smaller one-line title =====
   On tablet/iPad the character had too much empty space above it. Make the
   hero artwork noticeably larger so it climbs into that unused space, while
   reducing the title sticker size a bit so the one-line heading still fits. */
@media (min-width: 700px) {
    .full-view-sketch .sketch-hero-panel,
    body.home .sketch-hero-panel,
    body.front-page .sketch-hero-panel {
        padding-top: 0 !important;
        padding-bottom: clamp(2px, 0.4svh, 8px) !important;
    }

    .full-view-sketch .header-slider .slide,
    body.home .header-slider .slide,
    body.front-page .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(240px, 27vw, 400px) !important;
        gap: clamp(10px, 2vw, 36px) !important;
        align-items: end !important;
    }

    .full-view-sketch .slide-copy,
    body.home .slide-copy,
    body.front-page .slide-copy {
        align-self: end !important;
        padding-left: clamp(32px, 5vw, 78px) !important;
        padding-bottom: clamp(4px, 0.8svh, 16px) !important;
        gap: clamp(10px, 1.1svh, 16px) !important;
    }

    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        white-space: nowrap !important;
        font-size: clamp(2.35rem, 4.35vw, 4.7rem) !important;
        line-height: 0.9 !important;
        max-width: calc(100vw - clamp(240px, 27vw, 400px) - clamp(32px, 5vw, 78px) - clamp(10px, 2vw, 36px) - 26px) !important;
        padding: 8px 18px 12px !important;
    }

    .full-view-sketch .slide-copy p,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.home .text-slide,
    body.front-page .slide-copy p,
    body.front-page .text-slide {
        max-width: min(470px, 46vw) !important;
        font-size: clamp(0.98rem, 1.55vw, 1.3rem) !important;
        line-height: 1.04 !important;
        padding: 8px 14px 10px !important;
    }

    .full-view-sketch .slide-figure-wrap,
    body.home .slide-figure-wrap,
    body.front-page .slide-figure-wrap {
        height: 100% !important;
        align-self: end !important;
        align-items: flex-end !important;
        overflow: visible !important;
    }

    .full-view-sketch .slide-figure-wrap img,
    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img {
        max-height: min(100%, 66svh) !important;
        width: auto !important;
        object-fit: contain !important;
        object-position: center bottom !important;
        transform: translateY(0) scale(1.22) !important;
        transform-origin: center bottom !important;
    }
}

@media (orientation: landscape) and (min-width: 760px) {
    .full-view-sketch .header-slider .slide,
    body.home .header-slider .slide,
    body.front-page .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(225px, 24vw, 380px) !important;
        gap: clamp(8px, 1.8vw, 28px) !important;
    }

    .full-view-sketch .slide-copy,
    body.home .slide-copy,
    body.front-page .slide-copy {
        padding-left: clamp(28px, 4.6vw, 68px) !important;
    }

    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        font-size: clamp(2.2rem, 4vw, 4.35rem) !important;
        max-width: calc(100vw - clamp(225px, 24vw, 380px) - clamp(28px, 4.6vw, 68px) - clamp(8px, 1.8vw, 28px) - 22px) !important;
    }

    .full-view-sketch .slide-figure-wrap img,
    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img {
        max-height: min(100%, 70svh) !important;
        transform: translateY(0) scale(1.26) !important;
    }
}

@media (orientation: landscape) and (min-width: 760px) and (max-height: 860px) {
    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide {
        font-size: clamp(2rem, 3.65vw, 3.9rem) !important;
        padding: 7px 16px 10px !important;
    }

    .full-view-sketch .slide-copy p,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.home .text-slide,
    body.front-page .slide-copy p,
    body.front-page .text-slide {
        font-size: clamp(0.92rem, 1.35vw, 1.12rem) !important;
    }
}

/* ===== v3.16 Remove hero panels entirely + black text with bright pink shadow + much larger hero =====
   User requested: no title/subtitle containers at all, only black lettering
   with a bright pink drop shadow, and a visibly larger hero figure that uses
   the empty space above it. These rules intentionally override the earlier
   pink sticker/panel styles. */
body.home .slide-copy,
body.front-page .slide-copy,
.full-view-sketch .slide-copy {
    position: relative !important;
    z-index: 3 !important;
}

body.home .title-slide,
body.front-page .title-slide,
.full-view-sketch .title-slide,
body.home .text-slide,
body.front-page .text-slide,
.full-view-sketch .text-slide,
body.home .slide-copy h1,
body.front-page .slide-copy h1,
.full-view-sketch .slide-copy h1,
body.home .slide-copy p,
body.front-page .slide-copy p,
.full-view-sketch .slide-copy p {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    color: #000000 !important;
}

body.home .title-slide::before,
body.front-page .title-slide::before,
.full-view-sketch .title-slide::before,
body.home .title-slide::after,
body.front-page .title-slide::after,
.full-view-sketch .title-slide::after,
body.home .text-slide::before,
body.front-page .text-slide::before,
.full-view-sketch .text-slide::before,
body.home .text-slide::after,
body.front-page .text-slide::after,
.full-view-sketch .text-slide::after,
body.home .slide-copy h1::before,
body.front-page .slide-copy h1::before,
.full-view-sketch .slide-copy h1::before,
body.home .slide-copy h1::after,
body.front-page .slide-copy h1::after,
.full-view-sketch .slide-copy h1::after,
body.home .slide-copy p::before,
body.front-page .slide-copy p::before,
.full-view-sketch .slide-copy p::before,
body.home .slide-copy p::after,
body.front-page .slide-copy p::after,
.full-view-sketch .slide-copy p::after {
    content: none !important;
    display: none !important;
}

body.home .title-slide,
body.front-page .title-slide,
.full-view-sketch .title-slide,
body.home .slide-copy h1,
body.front-page .slide-copy h1,
.full-view-sketch .slide-copy h1 {
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100vw - clamp(235px, 26vw, 430px) - clamp(24px, 4vw, 60px) - 18px) !important;
    white-space: nowrap !important;
    font-size: clamp(2.05rem, 3.85vw, 4.15rem) !important;
    line-height: 0.92 !important;
    letter-spacing: 0.01em !important;
    text-shadow:
        2px 2px 0 #ff2f92,
        4px 4px 0 #ff2f92,
        6px 6px 0 rgba(255, 47, 146, 0.55) !important;
}

body.home .text-slide,
body.front-page .text-slide,
.full-view-sketch .text-slide,
body.home .slide-copy p,
body.front-page .slide-copy p,
.full-view-sketch .slide-copy p {
    padding: 0 !important;
    margin: 0 !important;
    max-width: min(470px, 47vw) !important;
    font-size: clamp(0.95rem, 1.38vw, 1.2rem) !important;
    line-height: 1.02 !important;
    font-weight: 700 !important;
    text-shadow:
        1.5px 1.5px 0 #ff2f92,
        3px 3px 0 rgba(255, 47, 146, 0.85) !important;
}

@media (min-width: 700px) {
    body.home .sketch-hero-panel,
    body.front-page .sketch-hero-panel,
    .full-view-sketch .sketch-hero-panel {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(250px, 28vw, 460px) !important;
        gap: clamp(6px, 1.6vw, 24px) !important;
        align-items: end !important;
    }

    body.home .slide-copy,
    body.front-page .slide-copy,
    .full-view-sketch .slide-copy {
        align-self: end !important;
        justify-self: start !important;
        padding-left: clamp(24px, 4vw, 60px) !important;
        padding-bottom: clamp(8px, 1.1svh, 18px) !important;
        gap: clamp(8px, 1svh, 14px) !important;
    }

    body.home .slide-figure-wrap,
    body.front-page .slide-figure-wrap,
    .full-view-sketch .slide-figure-wrap {
        height: 100% !important;
        align-self: end !important;
        align-items: flex-end !important;
        justify-content: center !important;
        overflow: visible !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-width: none !important;
        max-height: min(100%, 78svh) !important;
        width: auto !important;
        height: auto !important;
        object-fit: contain !important;
        object-position: center bottom !important;
        transform: translateY(0) scale(1.36) !important;
        transform-origin: center bottom !important;
    }
}

@media (orientation: landscape) and (min-width: 760px) {
    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(255px, 26vw, 450px) !important;
        gap: clamp(4px, 1.3vw, 18px) !important;
    }

    body.home .slide-copy,
    body.front-page .slide-copy,
    .full-view-sketch .slide-copy {
        padding-left: clamp(18px, 3.2vw, 42px) !important;
        padding-bottom: clamp(8px, 1svh, 16px) !important;
    }

    body.home .title-slide,
    body.front-page .title-slide,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.front-page .slide-copy h1,
    .full-view-sketch .slide-copy h1 {
        max-width: calc(100vw - clamp(255px, 26vw, 450px) - clamp(18px, 3.2vw, 42px) - 10px) !important;
        font-size: clamp(1.95rem, 3.5vw, 3.75rem) !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-height: min(100%, 82svh) !important;
        transform: translateY(0) scale(1.42) !important;
    }
}

@media (orientation: landscape) and (min-width: 760px) and (max-height: 860px) {
    body.home .title-slide,
    body.front-page .title-slide,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.front-page .slide-copy h1,
    .full-view-sketch .slide-copy h1 {
        font-size: clamp(1.8rem, 3.1vw, 3.25rem) !important;
    }

    body.home .text-slide,
    body.front-page .text-slide,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.front-page .slide-copy p,
    .full-view-sketch .slide-copy p {
        font-size: clamp(0.88rem, 1.15vw, 1.02rem) !important;
    }
}

/* ===== v3.17 Remove hidden top hero spacer/clipping + use empty space above figure =====
   There is no duplicate logo row inside the homepage hero anymore, so the hero
   slider must use the full panel height. Also remove any clipping so the larger
   figure can rise into the unused white space instead of losing its head.
   Keep only the permanent site logo in the actual header. */
body.home .sketch-logo-row,
body.front-page .sketch-logo-row,
.full-view-sketch .sketch-logo-row,
body.home .device-note,
body.front-page .device-note,
.full-view-sketch .device-note,
body.home .sketch-logo-box,
body.front-page .sketch-logo-box,
.full-view-sketch .sketch-logo-box {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel,
.full-view-sketch .sketch-hero-panel {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
    border-bottom: 0 !important;
}

body.home .header-slider,
body.front-page .header-slider,
.full-view-sketch .header-slider,
body.home .slides-shell,
body.front-page .slides-shell,
.full-view-sketch .slides-shell,
body.home .header-slider .slide,
body.front-page .header-slider .slide,
.full-view-sketch .header-slider .slide,
body.home .slide-figure-wrap,
body.front-page .slide-figure-wrap,
.full-view-sketch .slide-figure-wrap {
    height: 100% !important;
    min-height: 0 !important;
    overflow: visible !important;
}

body.home .header-slider,
body.front-page .header-slider,
.full-view-sketch .header-slider {
    padding-bottom: 0 !important;
}

@media (min-width: 700px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 45fr) minmax(0, 17fr) minmax(0, 38fr) !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) clamp(250px, 28vw, 460px) !important;
        gap: clamp(4px, 1.2vw, 18px) !important;
        align-items: end !important;
    }

    body.home .slide-copy,
    body.front-page .slide-copy,
    .full-view-sketch .slide-copy {
        align-self: end !important;
        z-index: 3 !important;
        padding-left: clamp(22px, 3.5vw, 46px) !important;
        padding-bottom: clamp(12px, 1.5svh, 22px) !important;
    }

    body.home .slide-figure-wrap,
    body.front-page .slide-figure-wrap,
    .full-view-sketch .slide-figure-wrap {
        position: relative !important;
        align-self: stretch !important;
        justify-content: center !important;
        align-items: flex-end !important;
        z-index: 1 !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-width: none !important;
        max-height: none !important;
        width: auto !important;
        height: calc(100% + clamp(90px, 12vh, 180px)) !important;
        object-fit: contain !important;
        object-position: center bottom !important;
        transform: none !important;
        filter: grayscale(1) contrast(1.38) !important;
        mix-blend-mode: multiply !important;
    }
}

@media (orientation: landscape) and (min-width: 760px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 47fr) minmax(0, 16fr) minmax(0, 37fr) !important;
    }

    body.home .slide-copy,
    body.front-page .slide-copy,
    .full-view-sketch .slide-copy {
        padding-left: clamp(18px, 2.8vw, 38px) !important;
    }

    body.home .title-slide,
    body.front-page .title-slide,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.front-page .slide-copy h1,
    .full-view-sketch .slide-copy h1 {
        max-width: calc(100vw - clamp(250px, 28vw, 460px) - clamp(18px, 2.8vw, 38px) - 8px) !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        height: calc(100% + clamp(110px, 15vh, 220px)) !important;
    }
}

/* ===== v3.18 Remove the full-width white top bar on all pages =====
   Keep only the logo button/panel itself. The header wrapper becomes transparent
   and shrink-to-fit so there is no visible white strip across the page. */
.site-header {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 8px 14px 0 !important;
    width: auto !important;
}

.header-container {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    background: transparent !important;
    border: 0 !important;
}

.top-logo-home {
    display: inline-flex !important;
    flex: 0 0 auto !important;
}

body.home .site-header,
body.front-page .site-header {
    min-height: 0 !important;
    padding-top: 8px !important;
    padding-bottom: 0 !important;
}

body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home,
.full-view-sketch.site-main {
    height: calc(100vh - 44px) !important;
}

@supports (min-height: 100dvh) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        height: calc(100dvh - 44px) !important;
    }
}

@media (max-width: 860px) {
    .site-header {
        padding: 8px 10px 0 !important;
    }
}


/* ===== v3.19 Clean composition reset: no top bar, no text panels, visible full hero =====
   Previous pass made the character too large and cropped. This resets the hero
   to a balanced full-figure layout: larger than the original, but not cropped,
   with only black text + bright pink shadow and no title/subtitle containers. */

/* Keep only the logo panel, never a full-width header strip. */
.site-header {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 8px 14px 0 !important;
    min-height: 0 !important;
}
.header-container {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
}
.top-logo-home {
    display: inline-flex !important;
}

/* Remove any leftover internal hero header/spacer. */
body.home .sketch-logo-row,
body.front-page .sketch-logo-row,
.full-view-sketch .sketch-logo-row,
body.home .device-note,
body.front-page .device-note,
.full-view-sketch .device-note,
body.home .sketch-logo-box,
body.front-page .sketch-logo-box,
.full-view-sketch .sketch-logo-box {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* Hero no longer clips the character heads, but the image itself is sized to fit. */
body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel,
.full-view-sketch .sketch-hero-panel {
    padding: 0 clamp(18px, 2.4vw, 34px) 0 !important;
    border-bottom: 0 !important;
    overflow: visible !important;
}

body.home .header-slider,
body.front-page .header-slider,
.full-view-sketch .header-slider,
body.home .slides-shell,
body.front-page .slides-shell,
.full-view-sketch .slides-shell,
body.home .header-slider .slide,
body.front-page .header-slider .slide,
.full-view-sketch .header-slider .slide {
    height: 100% !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding-bottom: 0 !important;
}

body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home,
.full-view-sketch.site-main {
    height: calc(100vh - 44px) !important;
    grid-template-rows: minmax(0, 43fr) minmax(0, 17fr) minmax(0, 40fr) !important;
}

@supports (height: 100dvh) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        height: calc(100dvh - 44px) !important;
    }
}

/* Balanced hero layout: text left, complete character image right. */
body.home .header-slider .slide,
body.front-page .header-slider .slide,
.full-view-sketch .header-slider .slide {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 45vw) !important;
    gap: clamp(8px, 1.6vw, 24px) !important;
    align-items: end !important;
}

body.home .slide-copy,
body.front-page .slide-copy,
.full-view-sketch .slide-copy {
    align-self: end !important;
    justify-self: start !important;
    z-index: 3 !important;
    padding-left: clamp(28px, 4vw, 56px) !important;
    padding-bottom: clamp(12px, 1.6svh, 22px) !important;
    padding-right: 0 !important;
    gap: clamp(5px, 0.7svh, 10px) !important;
}

body.home .slide-figure-wrap,
body.front-page .slide-figure-wrap,
.full-view-sketch .slide-figure-wrap {
    position: relative !important;
    z-index: 1 !important;
    height: 100% !important;
    min-height: 0 !important;
    align-self: stretch !important;
    justify-content: flex-end !important;
    align-items: flex-end !important;
    overflow: visible !important;
    padding: 0 !important;
}

body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img,
.full-view-sketch .slide-figure-wrap img {
    height: auto !important;
    width: auto !important;
    max-height: min(100%, 47svh) !important;
    max-width: min(100%, 46vw, 560px) !important;
    object-fit: contain !important;
    object-position: right bottom !important;
    transform: none !important;
    filter: grayscale(1) contrast(1.38) !important;
    mix-blend-mode: multiply !important;
}

/* No text containers. Only black letters with bright pink drop shadow. */
body.home .title-slide,
body.front-page .title-slide,
.full-view-sketch .title-slide,
body.home .text-slide,
body.front-page .text-slide,
.full-view-sketch .text-slide,
body.home .slide-copy h1,
body.front-page .slide-copy h1,
.full-view-sketch .slide-copy h1,
body.home .slide-copy p,
body.front-page .slide-copy p,
.full-view-sketch .slide-copy p {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    color: #000 !important;
}

body.home .title-slide::before,
body.front-page .title-slide::before,
.full-view-sketch .title-slide::before,
body.home .title-slide::after,
body.front-page .title-slide::after,
.full-view-sketch .title-slide::after,
body.home .text-slide::before,
body.front-page .text-slide::before,
.full-view-sketch .text-slide::before,
body.home .text-slide::after,
body.front-page .text-slide::after,
.full-view-sketch .text-slide::after,
body.home .slide-copy h1::before,
body.front-page .slide-copy h1::before,
.full-view-sketch .slide-copy h1::before,
body.home .slide-copy h1::after,
body.front-page .slide-copy h1::after,
.full-view-sketch .slide-copy h1::after,
body.home .slide-copy p::before,
body.front-page .slide-copy p::before,
.full-view-sketch .slide-copy p::before,
body.home .slide-copy p::after,
body.front-page .slide-copy p::after,
.full-view-sketch .slide-copy p::after {
    content: none !important;
    display: none !important;
}

body.home .title-slide,
body.front-page .title-slide,
.full-view-sketch .title-slide,
body.home .slide-copy h1,
body.front-page .slide-copy h1,
.full-view-sketch .slide-copy h1 {
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100vw - min(46vw, 560px) - clamp(28px, 4vw, 56px) - 28px) !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    line-height: 0.92 !important;
    font-size: clamp(1.9rem, 3.45vw, 3.7rem) !important;
    letter-spacing: 0.01em !important;
    text-shadow:
        2px 2px 0 #ff2f92,
        4px 4px 0 #ff2f92,
        5px 5px 0 rgba(255,47,146,0.55) !important;
}

body.home .text-slide,
body.front-page .text-slide,
.full-view-sketch .text-slide,
body.home .slide-copy p,
body.front-page .slide-copy p,
.full-view-sketch .slide-copy p {
    width: auto !important;
    max-width: min(470px, 48vw) !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.02 !important;
    font-size: clamp(0.9rem, 1.15vw, 1.05rem) !important;
    font-weight: 700 !important;
    text-shadow:
        1.5px 1.5px 0 #ff2f92,
        3px 3px 0 rgba(255,47,146,0.85) !important;
}

/* iPad/tablet portrait: keep the whole crew visible and comfortably large. */
@media (min-width: 700px) and (max-width: 1180px) and (orientation: portrait) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 42fr) minmax(0, 17fr) minmax(0, 41fr) !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) minmax(360px, 48vw) !important;
        gap: 8px !important;
    }

    body.home .slide-copy,
    body.front-page .slide-copy,
    .full-view-sketch .slide-copy {
        padding-left: clamp(28px, 4vw, 48px) !important;
        padding-bottom: clamp(12px, 1.2svh, 18px) !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-height: min(100%, 45svh) !important;
        max-width: min(100%, 47vw, 520px) !important;
    }

    body.home .title-slide,
    body.front-page .title-slide,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.front-page .slide-copy h1,
    .full-view-sketch .slide-copy h1 {
        font-size: clamp(1.75rem, 3.2vw, 3.25rem) !important;
    }
}

/* Landscape/tablet: avoid right-side cropping. */
@media (orientation: landscape) and (min-width: 760px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 40fr) minmax(0, 18fr) minmax(0, 42fr) !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) minmax(300px, 38vw) !important;
        gap: clamp(8px, 1.4vw, 20px) !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-height: min(100%, 42svh) !important;
        max-width: min(100%, 38vw, 520px) !important;
    }

    body.home .title-slide,
    body.front-page .title-slide,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.front-page .slide-copy h1,
    .full-view-sketch .slide-copy h1 {
        font-size: clamp(1.75rem, 3vw, 3.4rem) !important;
    }
}

/* ===== v3.19 Restore one-screen homepage layout after logo-bar removal =====
   The logo bar is visually gone, but the homepage still needs to reserve exact
   space for the logo panel and copyright footer. This keeps hero/menu/articles
   locked into one viewport again instead of creating a scroll page. */
:root {
    --nya-home-header-h: 46px;
    --nya-home-footer-h: 26px;
    --nya-home-chrome-h: calc(var(--nya-home-header-h) + var(--nya-home-footer-h));
}

html:has(body.home),
html:has(body.front-page),
body.home,
body.front-page {
    height: 100svh !important;
    min-height: 100svh !important;
    max-height: 100svh !important;
    overflow: hidden !important;
}

@supports (height: 100dvh) {
    html:has(body.home),
    html:has(body.front-page),
    body.home,
    body.front-page {
        height: 100dvh !important;
        min-height: 100dvh !important;
        max-height: 100dvh !important;
    }
}

/* No visual top bar: only the logo panel exists, but the header still reserves
   a small predictable row so the viewport math remains stable. */
body.home .site-header,
body.front-page .site-header,
.site-header {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    min-height: var(--nya-home-header-h) !important;
    height: var(--nya-home-header-h) !important;
    padding: 8px 14px 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.header-container {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    background: transparent !important;
    border: 0 !important;
}

.top-logo-home {
    display: inline-flex !important;
    flex: 0 0 auto !important;
}

body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home,
.full-view-sketch.site-main {
    display: grid !important;
    height: calc(100svh - var(--nya-home-chrome-h)) !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    align-content: stretch !important;
    grid-template-rows: minmax(0, 42fr) minmax(0, 18fr) minmax(0, 40fr) !important;
    row-gap: 0 !important;
}

@supports (height: 100dvh) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        height: calc(100dvh - var(--nya-home-chrome-h)) !important;
    }
}

body.home .site-footer,
body.front-page .site-footer {
    display: block !important;
    height: var(--nya-home-footer-h) !important;
    min-height: var(--nya-home-footer-h) !important;
    max-height: var(--nya-home-footer-h) !important;
    overflow: hidden !important;
    background: transparent !important;
}

body.home .site-footer p,
body.front-page .site-footer p {
    height: var(--nya-home-footer-h) !important;
    min-height: 0 !important;
    padding-top: 4px !important;
    padding-bottom: 0 !important;
    line-height: 1.05 !important;
    overflow: hidden !important;
}

body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel,
.full-view-sketch .sketch-hero-panel,
body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .menu-grid,
body.home .news-section,
body.front-page .news-section,
.full-view-sketch .news-section {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: hidden !important;
}

body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel,
.full-view-sketch .sketch-hero-panel {
    padding: 0 clamp(18px, 2.4vw, 34px) 0 !important;
}

body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .menu-grid {
    align-self: stretch !important;
    padding-top: clamp(2px, 0.35svh, 5px) !important;
    padding-bottom: clamp(2px, 0.35svh, 5px) !important;
}

body.home .news-section,
body.front-page .news-section,
.full-view-sketch .news-section {
    align-self: stretch !important;
    padding-top: clamp(3px, 0.45svh, 7px) !important;
    padding-bottom: clamp(2px, 0.35svh, 5px) !important;
}

body.home .header-slider,
body.front-page .header-slider,
.full-view-sketch .header-slider,
body.home .slides-shell,
body.front-page .slides-shell,
.full-view-sketch .slides-shell,
body.home .header-slider .slide,
body.front-page .header-slider .slide,
.full-view-sketch .header-slider .slide,
body.home .menu-slider-viewport,
body.front-page .menu-slider-viewport,
.full-view-sketch .menu-slider-viewport,
body.home .news-slider-viewport,
body.front-page .news-slider-viewport,
.full-view-sketch .news-slider-viewport {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
}

body.home .menu-items,
body.front-page .menu-items,
.full-view-sketch .menu-items,
body.home .news-track,
body.front-page .news-track,
.full-view-sketch .news-track {
    height: 100% !important;
    max-height: 100% !important;
    align-items: stretch !important;
}

body.home .menu-items li a.nya-menu-card,
body.front-page .menu-items li a.nya-menu-card,
.full-view-sketch .menu-items li a.nya-menu-card {
    height: calc(100% - 18px) !important;
    min-height: 0 !important;
    max-height: none !important;
}

body.home .news-item,
body.front-page .news-item,
.full-view-sketch .news-item {
    height: calc(100% - 18px) !important;
    min-height: 0 !important;
    max-height: none !important;
}

/* Hero scales inside its reserved row instead of changing the page height. */
body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img,
.full-view-sketch .slide-figure-wrap img {
    max-height: min(100%, 44svh) !important;
    max-width: min(100%, 43vw, 560px) !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: right bottom !important;
    transform: none !important;
}

@media (orientation: landscape) and (min-width: 760px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 39fr) minmax(0, 18fr) minmax(0, 43fr) !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-height: min(100%, 40svh) !important;
        max-width: min(100%, 37vw, 520px) !important;
    }
}

@media (max-height: 760px) {
    :root {
        --nya-home-header-h: 42px;
        --nya-home-footer-h: 24px;
    }

    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 38fr) minmax(0, 19fr) minmax(0, 43fr) !important;
    }
}

/* ===== v9 Responsive landscape recovery + full-viewport alignment =====
   Restore the single-viewport home layout, make the homepage use the full
   available width on tablets/iPad landscape, keep the footer visible, and
   ensure the pink face-dot navigation stays under the menu/news sliders. */
:root {
    --nya-home-header-h: 46px;
    --nya-home-footer-h: 28px;
    --nya-home-chrome-h: calc(var(--nya-home-header-h) + var(--nya-home-footer-h));
}

html:has(body.home),
html:has(body.front-page),
body.home,
body.front-page {
    overflow: hidden !important;
}

body.home .site-header,
body.front-page .site-header,
body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home,
.full-view-sketch.site-main,
body.home .site-footer,
body.front-page .site-footer {
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    border-left: 0 !important;
    border-right: 0 !important;
}

body.home .site-header,
body.front-page .site-header,
.site-header {
    padding: 8px 12px 0 !important;
    min-height: var(--nya-home-header-h) !important;
    height: var(--nya-home-header-h) !important;
}

body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home,
.full-view-sketch.site-main {
    height: calc(100svh - var(--nya-home-chrome-h)) !important;
    grid-template-rows: minmax(0, 41fr) minmax(0, 18fr) minmax(0, 41fr) !important;
    background: var(--nya-white) !important;
}

@supports (height: 100dvh) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        height: calc(100dvh - var(--nya-home-chrome-h)) !important;
    }
}

body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel,
.full-view-sketch .sketch-hero-panel,
body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .menu-grid,
body.home .news-section,
body.front-page .news-section,
.full-view-sketch .news-section {
    padding-left: clamp(12px, 1.6vw, 20px) !important;
    padding-right: clamp(12px, 1.6vw, 20px) !important;
}

body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel,
.full-view-sketch .sketch-hero-panel {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden !important;
}

body.home .header-slider,
body.front-page .header-slider,
.full-view-sketch .header-slider {
    height: 100% !important;
    padding-bottom: 0 !important;
}

body.home .header-slider .slide,
body.front-page .header-slider .slide,
.full-view-sketch .header-slider .slide {
    grid-template-columns: minmax(0, 1fr) minmax(250px, 41vw) !important;
    gap: clamp(8px, 1.5vw, 18px) !important;
    align-items: stretch !important;
}

body.home .slide-copy,
body.front-page .slide-copy,
.full-view-sketch .slide-copy {
    align-self: stretch !important;
    justify-content: center !important;
    height: 100% !important;
    padding-left: clamp(16px, 2.2vw, 26px) !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    gap: 6px !important;
    text-align: left !important;
}

body.home .title-slide,
body.front-page .title-slide,
.full-view-sketch .title-slide,
body.home .slide-copy h1,
body.front-page .slide-copy h1,
.full-view-sketch .slide-copy h1 {
    font-size: clamp(2rem, 4.2vw, 4rem) !important;
    max-width: calc(100vw - min(44vw, 620px) - clamp(18px, 2.2vw, 26px) - 28px) !important;
    white-space: nowrap !important;
    margin: 0 !important;
    text-align: left !important;
}

body.home .text-slide,
body.front-page .text-slide,
.full-view-sketch .text-slide,
body.home .slide-copy p,
body.front-page .slide-copy p,
.full-view-sketch .slide-copy p {
    max-width: min(560px, 52vw) !important;
    margin: 0 !important;
    text-align: left !important;
}

body.home .slide-figure-wrap,
body.front-page .slide-figure-wrap,
.full-view-sketch .slide-figure-wrap {
    justify-content: flex-end !important;
    align-items: flex-end !important;
    align-self: stretch !important;
    overflow: hidden !important;
}

body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img,
.full-view-sketch .slide-figure-wrap img {
    max-height: min(100%, 52svh) !important;
    max-width: min(100%, 46vw, 640px) !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: right bottom !important;
    transform: none !important;
}

body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .menu-grid,
body.home .news-section,
body.front-page .news-section,
.full-view-sketch .news-section {
    overflow: hidden !important;
}

body.home .menu-slider-viewport,
body.front-page .menu-slider-viewport,
.full-view-sketch .menu-slider-viewport,
body.home .news-slider-viewport,
body.front-page .news-slider-viewport,
.full-view-sketch .news-slider-viewport {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

body.home .menu-items,
body.front-page .menu-items,
.full-view-sketch .menu-items,
body.home .news-track,
body.front-page .news-track,
.full-view-sketch .news-track {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none;
}

body.home .menu-items::-webkit-scrollbar,
body.front-page .menu-items::-webkit-scrollbar,
.full-view-sketch .menu-items::-webkit-scrollbar,
body.home .news-track::-webkit-scrollbar,
body.front-page .news-track::-webkit-scrollbar,
.full-view-sketch .news-track::-webkit-scrollbar {
    display: none;
}

body.home .menu-items li,
body.front-page .menu-items li,
.full-view-sketch .menu-items li {
    flex: 0 0 calc((100% - 28px) / 3) !important;
    max-width: calc((100% - 28px) / 3) !important;
}

body.home .menu-items li a.nya-menu-card,
body.front-page .menu-items li a.nya-menu-card,
.full-view-sketch .menu-items li a.nya-menu-card,
body.home .news-item,
body.front-page .news-item,
.full-view-sketch .news-item {
    height: auto !important;
    min-height: 0 !important;
}

body.home .menu-dot-nav,
body.front-page .menu-dot-nav,
.full-view-sketch .menu-dot-nav,
body.home .news-dot-nav,
body.front-page .news-dot-nav,
.full-view-sketch .news-dot-nav {
    display: flex !important;
    flex: 0 0 auto !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 6px 0 0 !important;
    min-height: 16px !important;
}

body.home .news-track .news-item,
body.front-page .news-track .news-item,
.full-view-sketch .news-track .news-item {
    flex: 0 0 calc((100% - 28px) / 3) !important;
    max-width: calc((100% - 28px) / 3) !important;
}

body.home .site-footer,
body.front-page .site-footer {
    display: block !important;
    height: var(--nya-home-footer-h) !important;
    min-height: var(--nya-home-footer-h) !important;
    max-height: var(--nya-home-footer-h) !important;
    overflow: hidden !important;
    padding: 0 12px !important;
    background: transparent !important;
}

body.home .site-footer p,
body.front-page .site-footer p {
    display: flex !important;
    align-items: flex-end !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 0 3px !important;
    line-height: 1 !important;
}

@media (orientation: landscape) and (min-width: 760px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 40fr) minmax(0, 17fr) minmax(0, 43fr) !important;
    }

    body.home .title-slide,
    body.front-page .title-slide,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.front-page .slide-copy h1,
    .full-view-sketch .slide-copy h1 {
        font-size: clamp(1.8rem, 3.9vw, 3.6rem) !important;
        max-width: calc(100vw - min(43vw, 610px) - clamp(16px, 2vw, 24px) - 24px) !important;
    }

    body.home .text-slide,
    body.front-page .text-slide,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.front-page .slide-copy p,
    .full-view-sketch .slide-copy p {
        font-size: clamp(0.92rem, 1.25vw, 1.1rem) !important;
        max-width: min(500px, 47vw) !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-height: min(100%, 54svh) !important;
        max-width: min(100%, 44vw, 620px) !important;
    }

    body.home .menu-items li,
    body.front-page .menu-items li,
    .full-view-sketch .menu-items li,
    body.home .news-track .news-item,
    body.front-page .news-track .news-item,
    .full-view-sketch .news-track .news-item {
        flex-basis: calc((100% - 32px) / 4) !important;
        max-width: calc((100% - 32px) / 4) !important;
    }
}

@media (orientation: landscape) and (min-width: 760px) and (max-height: 860px) {
    :root {
        --nya-home-header-h: 44px;
        --nya-home-footer-h: 24px;
        --nya-home-chrome-h: calc(var(--nya-home-header-h) + var(--nya-home-footer-h));
    }

    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 39fr) minmax(0, 18fr) minmax(0, 43fr) !important;
    }

    body.home .slide-copy,
    body.front-page .slide-copy,
    .full-view-sketch .slide-copy {
        padding-left: 14px !important;
        gap: 4px !important;
    }

    body.home .title-slide,
    body.front-page .title-slide,
    .full-view-sketch .title-slide,
    body.home .slide-copy h1,
    body.front-page .slide-copy h1,
    .full-view-sketch .slide-copy h1 {
        font-size: clamp(1.65rem, 3.45vw, 3.1rem) !important;
    }

    body.home .text-slide,
    body.front-page .text-slide,
    .full-view-sketch .text-slide,
    body.home .slide-copy p,
    body.front-page .slide-copy p,
    .full-view-sketch .slide-copy p {
        font-size: clamp(0.84rem, 1.08vw, 0.98rem) !important;
    }
}

@media (max-width: 820px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 42fr) minmax(0, 18fr) minmax(0, 40fr) !important;
    }

    body.home .menu-items li,
    body.front-page .menu-items li,
    .full-view-sketch .menu-items li,
    body.home .news-track .news-item,
    body.front-page .news-track .news-item,
    .full-view-sketch .news-track .news-item {
        flex-basis: calc((100% - 14px) / 2) !important;
        max-width: calc((100% - 14px) / 2) !important;
    }
}

/* ===== v9.1 Bottom-anchored menu panels + larger hero character =====
   Keep the existing menu/news navigation, but pull the menu cards down toward
   their pink face-dot navigation and give the hero artwork more of the unused
   white space. */
body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home,
.full-view-sketch.site-main {
    grid-template-rows: minmax(0, 46fr) minmax(0, 14fr) minmax(0, 40fr) !important;
}

body.home .header-slider .slide,
body.front-page .header-slider .slide,
.full-view-sketch .header-slider .slide {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 48vw) !important;
}

body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img,
.full-view-sketch .slide-figure-wrap img {
    max-height: min(116%, 66svh) !important;
    max-width: min(112%, 52vw, 760px) !important;
    transform: translateY(2%) scale(1.08) !important;
    transform-origin: right bottom !important;
}

body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .menu-grid {
    display: flex !important;
    align-items: flex-end !important;
    padding-top: 0 !important;
    padding-bottom: clamp(0px, 0.4svh, 5px) !important;
}

body.home .menu-slider-viewport,
body.front-page .menu-slider-viewport,
.full-view-sketch .menu-slider-viewport {
    justify-content: flex-end !important;
    gap: clamp(1px, 0.35svh, 5px) !important;
}

body.home .menu-items,
body.front-page .menu-items,
.full-view-sketch .menu-items {
    flex: 0 0 auto !important;
    height: clamp(56px, 10.5svh, 102px) !important;
    align-items: flex-end !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

body.home .menu-items li,
body.front-page .menu-items li,
.full-view-sketch .menu-items li {
    display: flex !important;
    align-items: flex-end !important;
}

body.home .menu-items li a.nya-menu-card,
body.front-page .menu-items li a.nya-menu-card,
.full-view-sketch .menu-items li a.nya-menu-card {
    height: 100% !important;
    min-height: 0 !important;
}

body.home .menu-dot-nav,
body.front-page .menu-dot-nav,
.full-view-sketch .menu-dot-nav {
    margin-top: clamp(1px, 0.35svh, 5px) !important;
    min-height: clamp(10px, 1.6svh, 16px) !important;
}

@media (orientation: landscape) and (min-width: 760px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 47fr) minmax(0, 14fr) minmax(0, 39fr) !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) minmax(330px, 50vw) !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-height: min(118%, 68svh) !important;
        max-width: min(115%, 53vw, 800px) !important;
        transform: translateY(2%) scale(1.1) !important;
    }
}

@media (orientation: landscape) and (min-width: 760px) and (max-height: 860px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 46fr) minmax(0, 14fr) minmax(0, 40fr) !important;
    }

    body.home .menu-items,
    body.front-page .menu-items,
    .full-view-sketch .menu-items {
        height: clamp(52px, 10.2svh, 88px) !important;
    }
}

@media (max-width: 820px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 46fr) minmax(0, 16fr) minmax(0, 38fr) !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 1fr) minmax(220px, 48vw) !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-height: min(112%, 60svh) !important;
        max-width: min(110%, 52vw, 620px) !important;
        transform: translateY(1.5%) scale(1.06) !important;
    }
}

/* ===== v2.4 Bottom-locked menu + larger hero fill =====
   Keeps the existing menu/news navigation. The category cards are anchored
   to the bottom of their own panel, beside the current face-dot controls,
   while the hero crew is allowed to occupy more of the white field. */
body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home,
.full-view-sketch.site-main {
    grid-template-rows: minmax(0, 54fr) minmax(0, 9fr) minmax(0, 37fr) !important;
}

body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel,
.full-view-sketch .sketch-hero-panel {
    padding-bottom: 0 !important;
}

body.home .header-slider,
body.front-page .header-slider,
.full-view-sketch .header-slider,
body.home .slides-shell,
body.front-page .slides-shell,
.full-view-sketch .slides-shell {
    height: 100% !important;
    min-height: 0 !important;
}

body.home .header-slider .slide,
body.front-page .header-slider .slide,
.full-view-sketch .header-slider .slide {
    grid-template-columns: minmax(0, 48fr) minmax(300px, 52fr) !important;
    align-items: end !important;
    gap: clamp(8px, 2vw, 28px) !important;
}

body.home .slide-copy,
body.front-page .slide-copy,
.full-view-sketch .slide-copy {
    align-self: center !important;
    padding-left: clamp(22px, 3.8vw, 54px) !important;
    z-index: 2 !important;
}

body.home .slide-figure-wrap,
body.front-page .slide-figure-wrap,
.full-view-sketch .slide-figure-wrap {
    align-items: flex-end !important;
    justify-content: flex-end !important;
    overflow: visible !important;
    min-height: 0 !important;
}

body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img,
.full-view-sketch .slide-figure-wrap img {
    max-height: min(126%, 72svh) !important;
    max-width: min(126%, 58vw, 860px) !important;
    transform: translateY(0) scale(1.12) !important;
    transform-origin: right bottom !important;
}

body.home .menu-grid,
body.front-page .menu-grid,
.full-view-sketch .menu-grid {
    display: grid !important;
    align-items: end !important;
    overflow: visible !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

body.home .menu-slider-viewport,
body.front-page .menu-slider-viewport,
.full-view-sketch .menu-slider-viewport {
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    gap: 2px !important;
}

body.home .menu-items,
body.front-page .menu-items,
.full-view-sketch .menu-items {
    flex: 0 0 auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    align-items: flex-end !important;
    align-content: flex-end !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

body.home .menu-items li a.nya-menu-card,
body.front-page .menu-items li a.nya-menu-card,
.full-view-sketch .menu-items li a.nya-menu-card,
body.home .menu-items li a,
body.front-page .menu-items li a,
.full-view-sketch .menu-items li a {
    min-height: clamp(32px, 4.2svh, 50px) !important;
}

body.home .menu-dot-nav,
body.front-page .menu-dot-nav,
.full-view-sketch .menu-dot-nav {
    margin-top: 2px !important;
    margin-bottom: 0 !important;
    min-height: clamp(12px, 1.6svh, 18px) !important;
}

@media (orientation: landscape) and (min-width: 760px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 57fr) minmax(0, 9fr) minmax(0, 34fr) !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 46fr) minmax(340px, 54fr) !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-height: min(132%, 76svh) !important;
        max-width: min(132%, 60vw, 920px) !important;
        transform: translateY(0) scale(1.14) !important;
    }
}

@media (max-width: 820px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 53fr) minmax(0, 10fr) minmax(0, 37fr) !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 47fr) minmax(230px, 53fr) !important;
    }

    body.home .slide-figure-wrap img,
    body.front-page .slide-figure-wrap img,
    .full-view-sketch .slide-figure-wrap img {
        max-height: min(120%, 68svh) !important;
        max-width: min(122%, 59vw, 700px) !important;
        transform: translateY(0) scale(1.09) !important;
    }
}

/* ===== v3.13 Transparent header + safe hero containment =====
   Fixes the oversized/cropped hero from v3.11 and removes unnecessary
   white fills from the header area. The logo card remains intentionally white. */
body.home .site-header,
body.front-page .site-header,
.site-header {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.home .header-container,
body.front-page .header-container,
.header-container {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Only the actual logo keeps the white sticker/card treatment. */
body.home .top-logo-home,
body.front-page .top-logo-home,
.top-logo-home {
    background: var(--nya-white) !important;
}

/* Remove white sticker boxes from hero copy so only text/art sits on the page. */
body.home .slide-copy h1,
body.home .title-slide,
body.front-page .slide-copy h1,
body.front-page .title-slide,
.full-view-sketch .slide-copy h1,
.full-view-sketch .title-slide,
body.home .slide-copy p,
body.home .text-slide,
body.front-page .slide-copy p,
body.front-page .text-slide,
.full-view-sketch .slide-copy p,
.full-view-sketch .text-slide {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Keep the hero big, but contained: no cropped heads, no image crossing the title. */
body.home .sketch-hero-panel,
body.front-page .sketch-hero-panel,
.full-view-sketch .sketch-hero-panel {
    overflow: hidden !important;
}

body.home .header-slider .slide,
body.front-page .header-slider .slide,
.full-view-sketch .header-slider .slide {
    grid-template-columns: minmax(0, 48fr) minmax(280px, 52fr) !important;
    gap: clamp(12px, 2vw, 28px) !important;
    align-items: stretch !important;
}

body.home .slide-copy,
body.front-page .slide-copy,
.full-view-sketch .slide-copy {
    align-self: center !important;
    z-index: 3 !important;
    padding-left: clamp(22px, 3.8vw, 54px) !important;
    padding-right: 0 !important;
    max-width: 100% !important;
}

body.home .slide-copy h1,
body.home .title-slide,
body.front-page .slide-copy h1,
body.front-page .title-slide,
.full-view-sketch .slide-copy h1,
.full-view-sketch .title-slide {
    max-width: 100% !important;
    font-size: clamp(2rem, 4.4vw, 4rem) !important;
    line-height: 0.96 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.home .slide-figure-wrap,
body.front-page .slide-figure-wrap,
.full-view-sketch .slide-figure-wrap {
    align-self: stretch !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
    overflow: hidden !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding-top: clamp(4px, 1svh, 12px) !important;
}

body.home .slide-figure-wrap img,
body.front-page .slide-figure-wrap img,
.full-view-sketch .slide-figure-wrap img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: right bottom !important;
    transform: none !important;
    transform-origin: right bottom !important;
}

@media (orientation: landscape) and (min-width: 760px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 52fr) minmax(0, 10fr) minmax(0, 38fr) !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 47fr) minmax(320px, 53fr) !important;
    }
}

@media (max-width: 820px) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        grid-template-rows: minmax(0, 51fr) minmax(0, 11fr) minmax(0, 38fr) !important;
    }

    body.home .header-slider .slide,
    body.front-page .header-slider .slide,
    .full-view-sketch .header-slider .slide {
        grid-template-columns: minmax(0, 48fr) minmax(210px, 52fr) !important;
    }

    body.home .slide-copy h1,
    body.home .title-slide,
    body.front-page .slide-copy h1,
    body.front-page .title-slide,
    .full-view-sketch .slide-copy h1,
    .full-view-sketch .title-slide {
        font-size: clamp(1.7rem, 4.1vw, 3.1rem) !important;
    }
}


/* ===== v5.1 Remove menu button panels: typography-only labels =====
   User requested the homepage/category menu items to no longer use the
   bordered pill/panel treatment. Keep only the handwritten typography,
   preserve the existing dot navigation, and avoid any residual box/shadow. */
.full-view-sketch .menu-items li a,
body.home .menu-items li a,
body.front-page .menu-items li a,
.full-view-sketch .menu-items li a.nya-menu-card,
body.home .menu-items li a.nya-menu-card,
body.front-page .menu-items li a.nya-menu-card {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
    overflow: visible !important;
    isolation: auto !important;
}

.full-view-sketch .menu-items li a::before,
body.home .menu-items li a::before,
body.front-page .menu-items li a::before,
.full-view-sketch .menu-items li a::after,
body.home .menu-items li a::after,
body.front-page .menu-items li a::after,
.full-view-sketch .menu-items li a.nya-menu-card::before,
body.home .menu-items li a.nya-menu-card::before,
body.front-page .menu-items li a.nya-menu-card::before,
.full-view-sketch .menu-items li a.nya-menu-card::after,
body.home .menu-items li a.nya-menu-card::after,
body.front-page .menu-items li a.nya-menu-card::after {
    content: none !important;
    display: none !important;
}

.full-view-sketch .menu-items li a:hover,
body.home .menu-items li a:hover,
body.front-page .menu-items li a:hover,
.full-view-sketch .menu-items li a:focus,
body.home .menu-items li a:focus,
body.front-page .menu-items li a:focus,
.full-view-sketch .menu-items li a.nya-menu-card:hover,
body.home .menu-items li a.nya-menu-card:hover,
body.front-page .menu-items li a.nya-menu-card:hover,
.full-view-sketch .menu-items li a.nya-menu-card:focus,
body.home .menu-items li a.nya-menu-card:focus,
body.front-page .menu-items li a.nya-menu-card:focus {
    background: transparent !important;
    color: var(--nya-black) !important;
    transform: none !important;
    box-shadow: none !important;
}

.full-view-sketch .menu-items li a.nya-menu-card > *,
body.home .menu-items li a.nya-menu-card > *,
body.front-page .menu-items li a.nya-menu-card > * {
    grid-area: auto !important;
}

.full-view-sketch .menu-items li,
body.home .menu-items li,
body.front-page .menu-items li {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.full-view-sketch .menu-items,
body.home .menu-items,
body.front-page .menu-items {
    gap: 8px 18px !important;
}

.full-view-sketch .nya-menu-label,
body.home .nya-menu-label,
body.front-page .nya-menu-label {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--nya-black) !important;
    background: transparent !important;
    font-family: 'Permanent Marker', cursive !important;
    font-size: clamp(1.45rem, 2vw, 2rem) !important;
    line-height: 1.04 !important;
    text-align: center !important;
    text-wrap: balance;
    overflow-wrap: anywhere;
}

.full-view-sketch .nya-menu-art,
body.home .nya-menu-art,
body.front-page .nya-menu-art {
    display: none !important;
}

@media (max-width: 860px) {
    .full-view-sketch .nya-menu-label,
    body.home .nya-menu-label,
    body.front-page .nya-menu-label {
        font-size: clamp(1.15rem, 3.2vw, 1.55rem) !important;
    }
}

@media (max-width: 620px) {
    .full-view-sketch .menu-items,
    body.home .menu-items,
    body.front-page .menu-items {
        gap: 8px 12px !important;
    }

    .full-view-sketch .nya-menu-label,
    body.home .nya-menu-label,
    body.front-page .nya-menu-label {
        font-size: clamp(1rem, 4.3vw, 1.26rem) !important;
    }
}


/* ===== v5.2 Desktop/laptop article image uncrop =====
   On wider screens, images inside articles should behave like normal content
   images, not fixed-height cropped tiles. This only affects single/article page
   content and gallery images; homepage/news thumbnails keep their card crop. */
@media (min-width: 861px) {
    body.single .singular-content img,
    body.single-post .singular-content img,
    body.page .singular-content img,
    body.single .entry-content img,
    body.single-post .entry-content img,
    body.page .entry-content img,
    body.single .post-content img,
    body.single-post .post-content img,
    body.page .post-content img,
    body.single .wp-block-image img,
    body.single-post .wp-block-image img,
    body.page .wp-block-image img,
    body.single .wp-block-gallery img,
    body.single-post .wp-block-gallery img,
    body.page .wp-block-gallery img,
    body.single .gallery img,
    body.single-post .gallery img,
    body.page .gallery img,
    body.single .singular-content .nya-article-gallery-slider img,
    body.single-post .singular-content .nya-article-gallery-slider img,
    body.page .singular-content .nya-article-gallery-slider img,
    body.single .singular-content .wp-block-gallery.nya-article-gallery-slider img,
    body.single-post .singular-content .wp-block-gallery.nya-article-gallery-slider img,
    body.page .singular-content .wp-block-gallery.nya-article-gallery-slider img,
    body.single .singular-content .gallery.nya-article-gallery-slider img,
    body.single-post .singular-content .gallery.nya-article-gallery-slider img,
    body.page .singular-content .gallery.nya-article-gallery-slider img {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        object-fit: contain !important;
        object-position: center center !important;
    }

    body.single .singular-content figure,
    body.single-post .singular-content figure,
    body.page .singular-content figure,
    body.single .entry-content figure,
    body.single-post .entry-content figure,
    body.page .entry-content figure,
    body.single .post-content figure,
    body.single-post .post-content figure,
    body.page .post-content figure,
    body.single .wp-block-image,
    body.single-post .wp-block-image,
    body.page .wp-block-image {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    body.single .singular-content .nya-article-gallery-slider__item,
    body.single-post .singular-content .nya-article-gallery-slider__item,
    body.page .singular-content .nya-article-gallery-slider__item,
    body.single .singular-content .wp-block-gallery.nya-article-gallery-slider.has-nested-images figure.wp-block-image.nya-article-gallery-slider__item,
    body.single-post .singular-content .wp-block-gallery.nya-article-gallery-slider.has-nested-images figure.wp-block-image.nya-article-gallery-slider__item,
    body.page .singular-content .wp-block-gallery.nya-article-gallery-slider.has-nested-images figure.wp-block-image.nya-article-gallery-slider__item {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        align-self: flex-start !important;
    }
}

/* ===== v6.0 Thin pink graffiti header/menu bar =====
   Global top bar using the optimized NYA strip. Applies consistently to the
   start page, category/archive pages, and single article pages. */
:root {
    --nya-header-strip-height: 62px;
}

.site-header.nya-global-header,
body.home .site-header.nya-global-header,
body.front-page .site-header.nya-global-header {
    display: block !important;
    width: 100% !important;
    min-height: var(--nya-header-strip-height) !important;
    height: var(--nya-header-strip-height) !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    background-color: var(--nya-pink) !important;
    background-image: url('../images/nya-thin-header-banner.webp') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 100% 100% !important;
    border: 0 !important;
    border-bottom: 3px solid var(--nya-black) !important;
    box-shadow: 0 3px 0 rgba(0, 0, 0, 0.22) !important;
    position: relative !important;
    z-index: 50 !important;
}

.site-header.nya-global-header::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(255,79,160,0.18) 0%, rgba(255,79,160,0.04) 55%, rgba(255,79,160,0) 100%);
    z-index: 0;
}

.nya-header-bar,
.site-header.nya-global-header .header-container,
body.home .site-header.nya-global-header .header-container,
body.front-page .site-header.nya-global-header .header-container {
    width: min(100%, 1200px) !important;
    max-width: 1200px !important;
    height: 100% !important;
    margin: 0 auto !important;
    padding: 0 clamp(12px, 2vw, 26px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: clamp(10px, 2vw, 22px) !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    position: relative !important;
    z-index: 1 !important;
}

.site-header.nya-global-header .top-logo-home,
body.home .site-header.nya-global-header .top-logo-home,
body.front-page .site-header.nya-global-header .top-logo-home {
    width: auto !important;
    min-width: 74px !important;
    height: 34px !important;
    padding: 4px 12px !important;
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid var(--nya-black) !important;
    border-radius: 0 !important;
    background: rgba(255, 255, 255, 0.92) !important;
    color: var(--nya-black) !important;
    text-decoration: none !important;
    overflow: hidden !important;
    transform: rotate(-0.8deg) !important;
    box-shadow: 3px 3px 0 var(--nya-black) !important;
}

.site-header.nya-global-header .top-logo-home:hover,
.site-header.nya-global-header .top-logo-home:focus {
    background: var(--nya-black) !important;
    color: var(--nya-white) !important;
    outline: 2px solid var(--nya-white) !important;
    outline-offset: 2px !important;
}

.site-header.nya-global-header .top-logo-image {
    max-width: 96px !important;
    max-height: 24px !important;
    width: auto !important;
    height: auto !important;
    display: block !important;
    object-fit: contain !important;
    filter: grayscale(1) contrast(1.45) !important;
}

.site-header.nya-global-header .top-logo-fallback {
    font-family: 'Permanent Marker', cursive !important;
    font-size: 1.05rem !important;
    line-height: 1 !important;
    color: inherit !important;
    letter-spacing: 0.05em !important;
}

.nya-top-navigation {
    min-width: 0;
    max-width: calc(100% - 110px);
    display: flex;
    align-items: center;
}

.nya-top-menu {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: clamp(5px, 0.8vw, 10px) !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
}

.nya-top-menu::-webkit-scrollbar { display: none; }

.nya-top-menu li {
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
}

.nya-top-menu a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 30px !important;
    padding: 5px 10px 6px !important;
    border: 2px solid var(--nya-black) !important;
    background: rgba(255, 255, 255, 0.88) !important;
    color: var(--nya-black) !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    font-family: 'Roboto Condensed', Arial, sans-serif !important;
    font-size: clamp(0.78rem, 1.05vw, 0.92rem) !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0.03em !important;
    box-shadow: 2px 2px 0 var(--nya-black) !important;
    white-space: nowrap !important;
}

.nya-top-menu a:hover,
.nya-top-menu a:focus,
.nya-top-menu .current-menu-item > a,
.nya-top-menu .current_page_item > a {
    background: var(--nya-black) !important;
    color: var(--nya-white) !important;
    outline: 2px solid var(--nya-white) !important;
    outline-offset: 1px !important;
}

/* Keep the viewport layouts aligned after restoring a real thin header strip. */
body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home,
.full-view-sketch.site-main {
    height: calc(100vh - var(--nya-header-strip-height)) !important;
}

@supports (height: 100dvh) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        height: calc(100dvh - var(--nya-header-strip-height)) !important;
    }
}

.archive-main.category-viewport,
body.archive .archive-main.category-viewport,
body.category .archive-main.category-viewport,
body.single .singular-main.accessible-singular,
body.single-post .singular-main.accessible-singular,
body.page .singular-main.accessible-singular {
    min-height: calc(100vh - var(--nya-header-strip-height)) !important;
}

@media (max-width: 760px) {
    :root { --nya-header-strip-height: 54px; }

    .site-header.nya-global-header,
    body.home .site-header.nya-global-header,
    body.front-page .site-header.nya-global-header {
        background-size: auto 100% !important;
        background-position: 70% center !important;
    }

    .site-header.nya-global-header .top-logo-home,
    body.home .site-header.nya-global-header .top-logo-home,
    body.front-page .site-header.nya-global-header .top-logo-home {
        min-width: 62px !important;
        height: 30px !important;
        padding: 3px 8px !important;
        box-shadow: 2px 2px 0 var(--nya-black) !important;
    }

    .site-header.nya-global-header .top-logo-fallback {
        font-size: 0.94rem !important;
    }

    .site-header.nya-global-header .top-logo-image {
        max-width: 78px !important;
        max-height: 21px !important;
    }

    .nya-header-bar,
    .site-header.nya-global-header .header-container {
        gap: 8px !important;
        padding-left: 9px !important;
        padding-right: 9px !important;
    }

    .nya-top-navigation {
        max-width: calc(100% - 76px);
    }

    .nya-top-menu a {
        min-height: 27px !important;
        padding: 4px 8px 5px !important;
        font-size: 0.76rem !important;
    }
}

/* ===== v6.1 Header height emergency fix =====
   The v6.0 graffiti header was forcing a 62px strip, which made the top menu
   feel far too tall. This override keeps the same pink banner/menu design but
   compresses the header, logo, and menu pills so the page content starts higher. */
:root {
    --nya-header-strip-height: 42px !important;
}

.site-header.nya-global-header,
body.home .site-header.nya-global-header,
body.front-page .site-header.nya-global-header {
    min-height: var(--nya-header-strip-height) !important;
    height: var(--nya-header-strip-height) !important;
    border-bottom-width: 2px !important;
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.18) !important;
    background-size: 100% 100% !important;
}

.nya-header-bar,
.site-header.nya-global-header .header-container,
body.home .site-header.nya-global-header .header-container,
body.front-page .site-header.nya-global-header .header-container {
    min-height: 0 !important;
    height: var(--nya-header-strip-height) !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    gap: clamp(7px, 1.4vw, 16px) !important;
}

.site-header.nya-global-header .top-logo-home,
body.home .site-header.nya-global-header .top-logo-home,
body.front-page .site-header.nya-global-header .top-logo-home {
    min-width: 58px !important;
    height: 25px !important;
    min-height: 0 !important;
    padding: 2px 8px !important;
    border-width: 1.5px !important;
    box-shadow: 2px 2px 0 var(--nya-black) !important;
}

.site-header.nya-global-header .top-logo-image {
    max-width: 78px !important;
    max-height: 17px !important;
}

.site-header.nya-global-header .top-logo-fallback {
    font-size: 0.88rem !important;
}

.nya-top-navigation {
    min-height: 0 !important;
    height: 100% !important;
    max-width: calc(100% - 78px) !important;
    align-items: center !important;
}

.nya-top-menu {
    min-height: 0 !important;
    align-items: center !important;
}

.nya-top-menu a {
    min-height: 23px !important;
    padding: 3px 7px 4px !important;
    border-width: 1.5px !important;
    font-size: clamp(0.68rem, 0.9vw, 0.82rem) !important;
    line-height: 1 !important;
    box-shadow: 1.5px 1.5px 0 var(--nya-black) !important;
}

body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home,
.full-view-sketch.site-main {
    height: calc(100vh - var(--nya-header-strip-height)) !important;
}

@supports (height: 100dvh) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        height: calc(100dvh - var(--nya-header-strip-height)) !important;
    }
}

.archive-main.category-viewport,
body.archive .archive-main.category-viewport,
body.category .archive-main.category-viewport,
body.single .singular-main.accessible-singular,
body.single-post .singular-main.accessible-singular,
body.page .singular-main.accessible-singular {
    min-height: calc(100vh - var(--nya-header-strip-height)) !important;
}

@media (max-width: 760px) {
    :root {
        --nya-header-strip-height: 38px !important;
    }

    .site-header.nya-global-header .top-logo-home,
    body.home .site-header.nya-global-header .top-logo-home,
    body.front-page .site-header.nya-global-header .top-logo-home {
        min-width: 52px !important;
        height: 23px !important;
        padding: 2px 6px !important;
    }

    .site-header.nya-global-header .top-logo-image {
        max-width: 68px !important;
        max-height: 16px !important;
    }

    .site-header.nya-global-header .top-logo-fallback {
        font-size: 0.82rem !important;
    }

    .nya-header-bar,
    .site-header.nya-global-header .header-container {
        gap: 6px !important;
        padding-left: 7px !important;
        padding-right: 7px !important;
    }

    .nya-top-navigation {
        max-width: calc(100% - 64px) !important;
    }

    .nya-top-menu a {
        min-height: 21px !important;
        padding: 2px 6px 3px !important;
        font-size: 0.68rem !important;
    }
}

/* ===== v6.2 Branding-correct icon-only header + foldout menu =====
   Header art is treated as cropped background texture only. The top bar shows
   no inline logo or text menu; only the face icon sits in the right corner and
   opens the real menu as a foldout panel. */
:root {
    --nya-header-strip-height: 36px !important;
}

.site-header.nya-global-header,
body.home .site-header.nya-global-header,
body.front-page .site-header.nya-global-header {
    min-height: var(--nya-header-strip-height) !important;
    height: var(--nya-header-strip-height) !important;
    overflow: visible !important;
    background-color: var(--nya-pink) !important;
    background-image: url('../images/nya-thin-header-banner.webp') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: cover !important;
    border-bottom-width: 2px !important;
    position: relative !important;
    z-index: 1000 !important;
}

.site-header.nya-global-header::before {
    display: none !important;
}

.nya-header-bar,
.site-header.nya-global-header .header-container,
body.home .site-header.nya-global-header .header-container,
body.front-page .site-header.nya-global-header .header-container {
    width: 100% !important;
    max-width: none !important;
    height: var(--nya-header-strip-height) !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    position: relative !important;
    z-index: 2 !important;
}

.nya-header-foldout {
    position: relative !important;
    display: block !important;
    width: auto !important;
    height: var(--nya-header-strip-height) !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1001 !important;
}

.nya-header-menu-trigger {
    list-style: none !important;
    width: 32px !important;
    height: 32px !important;
    margin: 2px 0 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

.nya-header-menu-trigger::-webkit-details-marker,
.nya-header-menu-trigger::marker {
    display: none !important;
    content: "" !important;
}

.nya-header-menu-trigger:focus-visible {
    outline: 2px solid var(--nya-black) !important;
    outline-offset: 1px !important;
}

.nya-header-menu-icon {
    width: 31px !important;
    height: 31px !important;
    display: block !important;
    object-fit: contain !important;
    mix-blend-mode: multiply !important;
    filter: contrast(1.18) saturate(0) !important;
    transform: rotate(-1deg) !important;
}

.nya-header-foldout[open] .nya-header-menu-icon {
    transform: rotate(2deg) scale(1.04) !important;
}

.nya-foldout-panel,
.site-header.nya-global-header .nya-foldout-panel,
body.home .site-header.nya-global-header .nya-foldout-panel,
body.front-page .site-header.nya-global-header .nya-foldout-panel {
    position: absolute !important;
    top: calc(var(--nya-header-strip-height) + 2px) !important;
    right: 0 !important;
    width: min(250px, calc(100vw - 16px)) !important;
    max-width: min(250px, calc(100vw - 16px)) !important;
    height: auto !important;
    min-height: 0 !important;
    display: none !important;
    padding: 8px !important;
    border: 2px solid var(--nya-black) !important;
    background: rgba(255, 79, 160, 0.96) !important;
    box-shadow: 4px 4px 0 var(--nya-black) !important;
    z-index: 1002 !important;
}

.nya-header-foldout[open] .nya-foldout-panel {
    display: block !important;
}

.nya-foldout-panel .nya-top-menu,
.site-header.nya-global-header .nya-foldout-panel .nya-top-menu {
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
    overflow: visible !important;
}

.nya-foldout-panel .nya-top-menu li {
    width: 100% !important;
}

.nya-foldout-panel .nya-top-menu a,
.site-header.nya-global-header .nya-foldout-panel .nya-top-menu a {
    width: 100% !important;
    min-height: 30px !important;
    padding: 6px 9px !important;
    display: flex !important;
    justify-content: center !important;
    border: 2px solid var(--nya-black) !important;
    background: var(--nya-white) !important;
    color: var(--nya-black) !important;
    box-shadow: 2px 2px 0 var(--nya-black) !important;
    font-size: 0.8rem !important;
    line-height: 1 !important;
    text-align: center !important;
}

body.home .site-main.sketch-home,
body.front-page .site-main.sketch-home,
.full-view-sketch.site-main {
    height: calc(100vh - var(--nya-header-strip-height)) !important;
}

@supports (height: 100dvh) {
    body.home .site-main.sketch-home,
    body.front-page .site-main.sketch-home,
    .full-view-sketch.site-main {
        height: calc(100dvh - var(--nya-header-strip-height)) !important;
    }
}

.archive-main.category-viewport,
body.archive .archive-main.category-viewport,
body.category .archive-main.category-viewport,
body.single .singular-main.accessible-singular,
body.single-post .singular-main.accessible-singular,
body.page .singular-main.accessible-singular {
    min-height: calc(100vh - var(--nya-header-strip-height)) !important;
}

@media (max-width: 760px) {
    :root {
        --nya-header-strip-height: 34px !important;
    }

    .site-header.nya-global-header,
    body.home .site-header.nya-global-header,
    body.front-page .site-header.nya-global-header {
        background-size: cover !important;
        background-position: center center !important;
    }

    .nya-header-bar,
    .site-header.nya-global-header .header-container {
        padding-left: 6px !important;
        padding-right: 6px !important;
    }

    .nya-header-menu-trigger {
        width: 30px !important;
        height: 30px !important;
    }

    .nya-header-menu-icon {
        width: 29px !important;
        height: 29px !important;
    }

    .nya-foldout-panel,
    .site-header.nya-global-header .nya-foldout-panel {
        width: min(230px, calc(100vw - 12px)) !important;
        max-width: min(230px, calc(100vw - 12px)) !important;
    }
}