/* Standalone editorials share the archive preference; artwork keeps its own palette. */
:root { color-scheme: light; --article-code: #e7eadf; }
:root[data-blog-theme='dark'] {
    color-scheme: dark;
    --paper: #0b0f0d;
    --paper-deep: #151d17;
    --ink: #eaf0e8;
    --muted: #aebbaa;
    --green: #9dff22;
    --teal: #9ee5c9;
    --line: #354333;
    --article-code: #202b21;
}
[data-blog-article-theme] { transition: background-color .2s ease, color .2s ease; }
[data-blog-article-theme] .nav { flex-wrap: wrap; }
[data-blog-article-theme] .blog-article-theme-switch {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    flex-shrink: 0;
    padding: 3px;
    border: 1px solid #52614e;
    border-radius: 10px;
    background: #0b130de6;
    color: #eaf0e8;
}
[data-blog-article-theme] .blog-article-theme-switch[hidden] { display: none; }
.blog-article-theme-switch::before {
    content: '';
    position: absolute;
    inset: 3px auto 3px 3px;
    width: calc(50% - 3px);
    border-radius: 6px;
    background: #263b24;
    transition: transform .22s cubic-bezier(.2,.7,.3,1);
    pointer-events: none;
}
:root[data-blog-theme='dark'] .blog-article-theme-switch::before { transform: translateX(100%); }
.blog-article-theme-switch button {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-width: 72px;
    min-height: 44px;
    padding: 8px 10px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #b5c3b0;
    font: 500 12px/1 'Space Grotesk', sans-serif;
    cursor: pointer;
}
.blog-article-theme-switch button:is(:hover, [aria-pressed='true']) { color: #f4f8f0; }
.blog-article-theme-switch button[aria-pressed='true'] svg { color: #9dff22; }
.blog-article-theme-switch svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.blog-article-theme-switch button:focus-visible { outline: 2px solid #9dff22; outline-offset: 5px; }
[data-blog-article-theme] .article code { background: var(--article-code); }
[data-blog-article-theme] .wide img { border-color: var(--line); }
:root[data-blog-theme='dark'] [data-blog-article-theme] :is(main h2, .intro strong, .margin-note blockquote) { color: var(--ink); }
:root[data-blog-theme='dark'] [data-blog-article-theme] .note { color: var(--ink); }
:root[data-blog-theme='dark'] [data-blog-article-theme] :is(main a, .intro a):hover { color: #c3f2ac; }
@media (max-width: 700px) {
    [data-blog-article-theme] .hero { height: auto; max-height: none; }
    [data-blog-article-theme] .nav { gap: 16px 12px; }
    [data-blog-article-theme] .blog-article-theme-switch { margin-left: auto; }
}
@media (max-width: 440px) {
    [data-blog-article-theme] .nav > .blog-article-theme-switch { margin-left: auto; }
    [data-blog-article-theme] .nav .nav-links { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
    [data-blog-article-theme], [data-blog-article-theme] *, [data-blog-article-theme] *::before { transition: none !important; }
}
