/* /Components/Layout/Footer.razor.rz.scp.css */
.site-footer[b-wsc13r9y7d] {
    position: relative;
    z-index: 1;
    background: rgba(10, 14, 23, 0.9);
    border-top: var(--border-hair) solid var(--accent);
    height: var(--footer-height);
    padding: 0 calc(var(--spacing) * 6);
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

.footer-inner[b-wsc13r9y7d] {
    max-width: var(--max-w-wide);
    margin: 0 auto;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.footer-brand[b-wsc13r9y7d] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-logo[b-wsc13r9y7d] {
    height: 1.5rem;
    width: auto;
    object-fit: contain;
    vertical-align: middle;
}

.footer-legal a[b-wsc13r9y7d] {
    font-size: var(--text-xs);
    color: var(--text);
    text-decoration: none;
    transition: color 0.2s;
}

.footer-legal a:hover[b-wsc13r9y7d] {
    color: var(--primary);
}

@media (min-width: 64em) {
    .site-footer[b-wsc13r9y7d] {
        height: var(--footer-height-lg);
        padding: 0 calc(var(--spacing) * 8);
    }
    .footer-inner[b-wsc13r9y7d] {
        max-width: 88rem;
        justify-content: center;
        /* 12rem horizontal spread between the brand mark and the legal links on desktop. */
        gap: calc(var(--spacing) * 48);
    }
    .footer-logo[b-wsc13r9y7d] { height: 2rem; }
    .footer-legal a[b-wsc13r9y7d] { font-size: var(--text-sm); }
}

@media (max-width: 47.99em) {
    .footer-inner[b-wsc13r9y7d] {
        justify-content: center;
        gap: calc(var(--spacing) * 2);
    }
}

@media (min-width: 48em) and (max-width: 63.99em) {
    .footer-inner[b-wsc13r9y7d] {
        justify-content: center;
        gap: calc(var(--spacing) * 24);
    }
}
/* /Components/Layout/LanguageSwitch.razor.rz.scp.css */
.lang-switch[b-s7z2k1ny2j] {
    position: fixed;
    bottom: calc(var(--spacing) * 2);
    left: calc(var(--spacing) * 1);
    z-index: 900;
    display: inline-flex;
    align-items: baseline;
    gap: 0;
    padding: calc(var(--spacing) * 1.4) calc(var(--spacing) * 0.4);
    background: rgba(10, 14, 23, 0.88);
    border: var(--border-hair) solid var(--primary);
    backdrop-filter: blur(0.25rem);
    -webkit-backdrop-filter: blur(0.25rem);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    line-height: 1;
    user-select: none;
    box-shadow: 0 0.0625rem 0.25rem rgba(0, 0, 0, 0.5);
    animation: langFadeIn-b-s7z2k1ny2j 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s both;
}

@keyframes langFadeIn-b-s7z2k1ny2j {
    from { opacity: 0; transform: translateY(0.5rem); }
    to { opacity: 1; transform: translateY(0); }
}

.lang-opt[b-s7z2k1ny2j] {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
    line-height: 1;
    color: var(--muted);
    text-decoration: none;
    transition: color 0.2s ease, text-shadow 0.2s ease;
    position: relative;
    letter-spacing: 0.03em;
}

.lang-opt + .lang-opt[b-s7z2k1ny2j] {
    margin-left: -0.3em;
}

.lang-opt[b-s7z2k1ny2j]::before,
.lang-opt[b-s7z2k1ny2j]::after {
    color: var(--primary);
    visibility: hidden;
    transition: opacity 0.2s ease;
    opacity: 0.85;
}

.lang-opt[b-s7z2k1ny2j]::before {
    content: '[';
    margin-right: 0.05em;
}

.lang-opt[b-s7z2k1ny2j]::after {
    content: ']';
    margin-left: 0.05em;
}

.lang-opt:hover[b-s7z2k1ny2j] {
    color: var(--primary);
}

.lang-opt:focus-visible[b-s7z2k1ny2j] {
    outline: var(--border-hair) dashed var(--primary);
    outline-offset: 0.25em;
}

.lang-opt.active[b-s7z2k1ny2j] {
    color: var(--primary);
    text-shadow: 0 0 0.5rem rgba(34, 211, 238, 0.5);
}

.lang-opt.active[b-s7z2k1ny2j]::before,
.lang-opt.active[b-s7z2k1ny2j]::after {
    visibility: visible;
}

@media (min-width: 48em) {
    .lang-switch[b-s7z2k1ny2j] {
        font-size: var(--text-sm);
        padding: calc(var(--spacing) * 1.6) var(--spacing);
        bottom: calc(var(--spacing) * 1.5);
    }
    .lang-opt + .lang-opt[b-s7z2k1ny2j] {
        margin-left: 0.3em;
    }
}

@media (min-width: 64em) {
    .lang-switch[b-s7z2k1ny2j] {
        bottom: calc(var(--spacing) * 3);
    }
}

@media (min-width: 80em) {
    .lang-switch[b-s7z2k1ny2j] {
        font-size: var(--text-base);
        padding: calc(var(--spacing) * 2) calc(var(--spacing) * 1.2);
        bottom: calc(var(--spacing) * 2);
    }
    .lang-opt + .lang-opt[b-s7z2k1ny2j] {
        margin-left: 0.3em;
    }
}

@media (prefers-reduced-motion: reduce) {
    .lang-switch[b-s7z2k1ny2j] {
        animation: none;
    }

    .lang-opt[b-s7z2k1ny2j],
    .lang-opt[b-s7z2k1ny2j]::before,
    .lang-opt[b-s7z2k1ny2j]::after {
        transition: none;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
main[b-pg5drb2i04] {
    position: relative;
    z-index: 1;
    padding-top: var(--nav-height);
}

main:focus[b-pg5drb2i04] {
    outline: none;
}

.skip-to-content[b-pg5drb2i04] {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10000;
    padding: calc(var(--spacing) * 2) calc(var(--spacing) * 4);
    background: var(--bg);
    color: var(--primary);
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    text-decoration: none;
    border: var(--border-hair) solid var(--primary);
    transform: translateY(-150%);
    transition: transform 0.15s ease-out;
}

.skip-to-content:focus[b-pg5drb2i04],
.skip-to-content:focus-visible[b-pg5drb2i04] {
    transform: translateY(0);
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

[b-pg5drb2i04] section {
    position: relative;
    padding: calc(var(--spacing) * 8) calc(var(--spacing) * 6);
}

[b-pg5drb2i04] .full-section {
    min-height: calc(100dvh - var(--nav-height));
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    padding: calc(var(--spacing) * 4) calc(var(--spacing) * 6);
    position: relative;
}

[b-pg5drb2i04] section.full-section:last-of-type {
    min-height: calc(100dvh - var(--nav-height) - var(--footer-height));
}

[b-pg5drb2i04] .full-section:nth-child(odd) {
    background: rgba(10, 14, 23, 0.55);
}

[b-pg5drb2i04] .full-section:nth-child(even) {
    background: rgba(17, 24, 39, 0.55);
}

[b-pg5drb2i04] .section-content {
    width: 100%;
    max-width: var(--max-w-wide);
    flex: 1;
    display: flex;
    flex-direction: column;
}

[b-pg5drb2i04] .section-title {
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: var(--text-3xl);
    color: var(--primary);
    margin-top: auto;
    margin-bottom: auto;
    padding-bottom: calc(var(--spacing) * 8);
    text-align: center;
}

@media (min-width: 48em) {
    [b-pg5drb2i04] .section-title { font-size: var(--text-4xl); }
}

@media (max-width: 48em) {
    /* Give the Kontakt compose-window edge-to-edge breathing room on phones. */
    [b-pg5drb2i04] #kontakt.full-section { padding-inline: calc(var(--spacing) * 2); }
}

@media (min-width: 64em) {
    [b-pg5drb2i04] .section-title { font-size: var(--text-5xl); }
    [b-pg5drb2i04] .full-section { padding-inline: calc(var(--spacing) * 8); }
    [b-pg5drb2i04] section.full-section:last-of-type {
        min-height: calc(100dvh - var(--nav-height) - var(--footer-height-lg));
    }
}

[b-pg5drb2i04] .section-title .prompt {
    color: var(--accent);
    margin-right: 0.3em;
}

.scroll-top[b-pg5drb2i04] {
    position: fixed;
    bottom: calc(var(--spacing) * 1);
    right: calc(var(--spacing) * 1);
    width: 2rem;
    height: 2rem;
    background: rgba(10, 14, 23, 0.85);
    border: var(--border-hair) solid var(--primary);
    color: var(--primary);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 900;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s, visibility 0.3s, background 0.3s, color 0.3s;
    padding: 0;
}

.scroll-top svg[b-pg5drb2i04] {
    width: 1.1rem;
    height: 1.1rem;
}

.scroll-top.visible[b-pg5drb2i04] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.scroll-top:hover[b-pg5drb2i04] {
    background: var(--primary);
    color: var(--bg);
}

@media (min-width: 64em) {
    .scroll-top[b-pg5drb2i04] {
        width: 2.75rem;
        height: 2.75rem;
    }
    .scroll-top svg[b-pg5drb2i04] { width: 1.5rem; height: 1.5rem; }
}

#blazor-error-ui[b-pg5drb2i04] {
    background: var(--surface);
    color: #f87171;
    bottom: 0;
    box-shadow: 0 -0.0625rem 0.25rem rgba(0, 0, 0, 0.4);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: calc(var(--spacing) * 2) calc(var(--spacing) * 4) calc(var(--spacing) * 3);
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-pg5drb2i04] {
        cursor: pointer;
        position: absolute;
        right: calc(var(--spacing) * 3);
        top: calc(var(--spacing) * 2);
    }
/* /Components/Layout/MeshBackground.razor.rz.scp.css */
#bg-mesh[b-vyg2guo194] {
    position: fixed;
    top: var(--nav-height);
    left: 0;
    width: 100%;
    height: calc(100dvh - var(--nav-height));
    z-index: 0;
    pointer-events: none;
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar[b-mnltnumr33] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--nav-height);
    background: rgba(10, 14, 23, 0.92);
    backdrop-filter: blur(0.75rem);
    -webkit-backdrop-filter: blur(0.75rem);
    border-bottom: var(--border-hair) solid var(--accent);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 calc(var(--spacing) * 6);
    z-index: 1000;
}

.nav-logo[b-mnltnumr33] {
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: var(--text-xl);
    color: var(--accent);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0;
    white-space: nowrap;
}

.nav-logo .prompt[b-mnltnumr33] {
    color: var(--muted);
    margin-right: 0.4em;
}

.cursor-blink[b-mnltnumr33] {
    display: inline-block;
    width: 0.55em;
    height: 1.1em;
    background: var(--accent);
    margin-left: 0.125em;
    animation: cursorBlink 1s step-end infinite;
    vertical-align: text-bottom;
}

.nav-links[b-mnltnumr33] {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 6);
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav-links a[b-mnltnumr33] {
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: var(--text-lg);
    color: var(--text);
    text-decoration: none;
    position: relative;
    padding-bottom: var(--spacing);
    transition: color 0.3s;
}

.nav-links a[b-mnltnumr33]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: var(--border-hair);
    background: var(--primary);
    box-shadow: var(--glow-primary);
    transition: width 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.nav-links a:hover[b-mnltnumr33] {
    color: var(--primary);
}

.nav-links a:hover[b-mnltnumr33]::after {
    width: 100%;
}

.nav-icon[b-mnltnumr33] {
    width: 1.2em;
    height: 1.2em;
    display: block;
}

.nav-links a.nav-contact[b-mnltnumr33] {
    font-family: var(--font-mono);
    font-size: var(--text-lg);
    color: var(--cta) !important;
    text-decoration: none;
    border: var(--border-hair) solid var(--cta);
    padding: 0.385em 0.99em;
    min-height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
}

.nav-links a.nav-contact[b-mnltnumr33]::after {
    display: none !important;
}

.nav-links a.nav-contact:hover[b-mnltnumr33] {
    background: var(--cta);
    color: var(--bg) !important;
    box-shadow: var(--glow-cta);
}

.nav-right[b-mnltnumr33] {
    display: contents;
}

.nav-contact-mobile[b-mnltnumr33] {
    display: none;
}

.hamburger[b-mnltnumr33] {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    cursor: pointer;
    background: none;
    border: none;
    padding: var(--spacing);
    min-width: 2.75rem;
    min-height: 2.75rem;
}

.hamburger span[b-mnltnumr33] {
    display: block;
    width: 1.75rem;
    height: var(--border-thin);
    background: var(--accent);
    transition: all 0.3s;
}

.hamburger.active span:nth-child(1)[b-mnltnumr33] {
    transform: translateY(0.5rem) rotate(45deg);
}

.hamburger.active span:nth-child(2)[b-mnltnumr33] {
    opacity: 0;
}

.hamburger.active span:nth-child(3)[b-mnltnumr33] {
    transform: translateY(-0.5rem) rotate(-45deg);
}

@media (min-width: 64em) {
    .nav-logo[b-mnltnumr33] { font-size: var(--text-2xl); }
    .nav-links a[b-mnltnumr33] { font-size: var(--text-xl); }
    .nav-links a.nav-contact[b-mnltnumr33] { font-size: var(--text-xl); }
}

@media (max-width: 48em) {
    .navbar[b-mnltnumr33] {
        padding-inline: calc(var(--spacing) * 3);
    }

    .nav-logo[b-mnltnumr33] {
        font-size: var(--text-lg);
    }

    .nav-right[b-mnltnumr33] {
        display: flex;
        align-items: center;
        gap: calc(var(--spacing) * 3);
    }

    .nav-contact-mobile[b-mnltnumr33] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--cta);
        border: var(--border-hair) solid var(--cta);
        padding: 0.35em 0.55em;
        font-size: var(--text-base);
        text-decoration: none;
        transition: all 0.3s;
    }

    .nav-contact-mobile:hover[b-mnltnumr33] {
        background: var(--cta);
        color: var(--bg);
        box-shadow: var(--glow-cta);
    }

    .hamburger[b-mnltnumr33] {
        display: flex;
        padding-right: 0;
        gap: calc(var(--spacing) * 1.2);
        min-width: 2.25rem;
        min-height: 2.25rem;
    }

    .hamburger span[b-mnltnumr33] {
        width: 1.4rem;
    }

    .nav-links li:has(.nav-contact)[b-mnltnumr33] {
        display: none;
    }

    .nav-links[b-mnltnumr33] {
        position: fixed;
        top: var(--nav-height);
        left: 0;
        right: 0;
        background: rgba(10, 14, 23, 0.97);
        flex-direction: column;
        padding: 0;
        gap: calc(var(--spacing) * 6);
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s ease, padding 0.35s ease, border-bottom-color 0.35s ease;
        border-bottom: var(--border-hair) solid transparent;
    }

    .nav-links.open[b-mnltnumr33] {
        max-height: calc(100vh - var(--nav-height));
        padding: calc(var(--spacing) * 6) 0;
        border-bottom-color: var(--accent);
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-enr3r12ggb],
.components-reconnect-repeated-attempt-visible[b-enr3r12ggb],
.components-reconnect-failed-visible[b-enr3r12ggb],
.components-pause-visible[b-enr3r12ggb],
.components-resume-failed-visible[b-enr3r12ggb],
.components-rejoining-animation[b-enr3r12ggb] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-enr3r12ggb],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-enr3r12ggb],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-enr3r12ggb],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-enr3r12ggb],
#components-reconnect-modal.components-reconnect-retrying[b-enr3r12ggb],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-enr3r12ggb],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-enr3r12ggb],
#components-reconnect-modal.components-reconnect-failed[b-enr3r12ggb],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-enr3r12ggb] {
    display: block;
}


#components-reconnect-modal[b-enr3r12ggb] {
    background-color: var(--surface);
    color: var(--text);
    width: calc(100% - 2rem);
    max-width: 28rem;
    margin: calc(var(--spacing) * 16) auto;
    padding: calc(var(--spacing) * 6);
    border: var(--border-hair) solid rgba(96, 165, 232, 0.2);
    border-radius: var(--radius-lg);
    box-shadow: 0 0.1875rem 0.75rem 0.125rem rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-enr3r12ggb 0.5s both;
    &[open] {
        animation: components-reconnect-modal-slideUp-b-enr3r12ggb 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-enr3r12ggb 0.5s ease-in-out 0.3s;
        animation-fill-mode: both;
    }
}

#components-reconnect-modal[b-enr3r12ggb]::backdrop {
    background-color: rgba(0, 0, 0, 0.6);
    animation: components-reconnect-modal-fadeInOpacity-b-enr3r12ggb 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-enr3r12ggb {
    0% {
        transform: translateY(1.875rem) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-enr3r12ggb {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-enr3r12ggb {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-enr3r12ggb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(var(--spacing) * 4);
}

#components-reconnect-modal p[b-enr3r12ggb] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-enr3r12ggb] {
    border: 0;
    background-color: var(--primary);
    color: var(--bg);
    padding: calc(var(--spacing) * 2) calc(var(--spacing) * 6);
    border-radius: var(--radius-md);
    min-height: 2.75rem;
    font-family: var(--font-mono);
    cursor: pointer;
}

    #components-reconnect-modal button:hover[b-enr3r12ggb] {
        background-color: var(--accent);
    }

    #components-reconnect-modal button:active[b-enr3r12ggb] {
        background-color: var(--primary);
    }

.components-rejoining-animation[b-enr3r12ggb] {
    position: relative;
    width: 5rem;
    height: 5rem;
}

    .components-rejoining-animation div[b-enr3r12ggb] {
        position: absolute;
        border: var(--border-medium) solid var(--primary);
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-enr3r12ggb 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-enr3r12ggb] {
            animation-delay: -0.5s;
        }

@media (prefers-reduced-motion: reduce) {
    #components-reconnect-modal[b-enr3r12ggb] {
        animation: none;
        opacity: 1;
    }

    #components-reconnect-modal[open][b-enr3r12ggb] {
        animation: none;
        opacity: 1;
    }

    #components-reconnect-modal[b-enr3r12ggb]::backdrop {
        animation: none;
    }

    .components-rejoining-animation div[b-enr3r12ggb] {
        animation: none;
    }
}

@keyframes components-rejoining-animation-b-enr3r12ggb {
    0% {
        top: 2.5rem;
        left: 2.5rem;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 2.5rem;
        left: 2.5rem;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 2.5rem;
        left: 2.5rem;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0;
        left: 0;
        width: 5rem;
        height: 5rem;
        opacity: 0;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
.hero[b-7brtq0bb4i] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 0;
}

/* The SVG breaks out of the hero's section-content (max-width ~1200px at FHD+)
   and spans the full viewport width. Left offset and width are set in JS from
   document.documentElement.clientWidth so no horizontal scrollbar is introduced. */
.hero-circuits[b-7brtq0bb4i] {
    position: absolute;
    top: 0;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}

[b-7brtq0bb4i] .circuit-trace {
    fill: none;
    stroke: var(--accent);
    stroke-width: 1.5;
    stroke-linecap: square;
    filter: drop-shadow(0 0 0.1875rem rgba(74, 222, 128, 0.5));
    opacity: 0.7;
}

[b-7brtq0bb4i] .circuit-node {
    fill: var(--accent);
    filter: drop-shadow(0 0 0.375rem rgba(74, 222, 128, 0.8));
}

[b-7brtq0bb4i] .circuit-node-ring {
    fill: none;
    stroke: var(--accent);
    stroke-width: 1;
    opacity: 0.4;
}

/* @keyframes for traceIn, nodeAppear, nodePulse, nodeRingPulse are defined in
   wwwroot/app.css. Razor's CSS isolation renames @keyframes (e.g. traceIn ->
   traceIn-b-XXXX), which breaks JS-set animations that reference the unscoped
   names from Home.razor.js. Keep them globally scoped. */

[b-7brtq0bb4i] .circuit-node,
[b-7brtq0bb4i] .circuit-node-ring {
    transform-origin: center;
    transform-box: fill-box;
}

.hero-content[b-7brtq0bb4i] {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: var(--max-w);
    opacity: 0;
    transform: translateY(1.25rem);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.hero-content.visible[b-7brtq0bb4i] {
    opacity: 1;
    transform: translateY(0);
}

.hero h1[b-7brtq0bb4i] {
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: var(--text-3xl);
    color: var(--text);
    line-height: 1.2;
    margin-bottom: calc(var(--spacing) * 4);
}

.hero h1[b-7brtq0bb4i]  br { display: none; }

@media (min-width: 40em) {
    .hero h1[b-7brtq0bb4i] { font-size: var(--text-5xl); }
    .hero h1[b-7brtq0bb4i]  br { display: inline; }
}

@media (min-width: 48em) {
    .hero h1[b-7brtq0bb4i] { font-size: var(--text-6xl); }
}

.hero h1 .accent[b-7brtq0bb4i] {
    color: var(--primary);
}

.hero-sub[b-7brtq0bb4i] {
    font-family: var(--font-body);
    font-weight: 400;
    font-size: var(--text-xl);
    color: var(--muted);
    line-height: 1.8;
    max-width: var(--max-w-narrow);
    margin: 0 auto;
}

.hero-sub[b-7brtq0bb4i]  br { display: none; }

@media (min-width: 40em) {
    .hero-sub[b-7brtq0bb4i] { font-size: var(--text-2xl); }
    .hero-sub[b-7brtq0bb4i]  br { display: inline; }
}

.typed-cursor[b-7brtq0bb4i] {
    color: var(--accent);
    font-weight: 300;
    animation: cursorBlink 0.7s step-end infinite;
}

@media (prefers-reduced-motion: reduce) {
    .hero-content[b-7brtq0bb4i] {
        opacity: 1;
        transform: none;
        transition: none;
    }
}
/* /Components/Pages/Index.razor.rz.scp.css */
.scanline-overlay[b-hzfrep2cyk] {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 9999;
    background: repeating-linear-gradient(
        to bottom,
        transparent 0,
        transparent 0.125rem,
        rgba(0, 0, 0, 0.03) 0.125rem,
        rgba(0, 0, 0, 0.03) 0.25rem
    );
}

.scroll-down[b-hzfrep2cyk] {
    position: absolute;
    bottom: calc(var(--spacing) * 4);
    left: 50%;
    transform: translateX(-50%);
    width: 3rem;
    height: 3rem;
    color: var(--primary);
    z-index: 3;
    pointer-events: none;
    animation: slowDown-b-hzfrep2cyk 3s ease-in-out infinite;
}

@keyframes slowDown-b-hzfrep2cyk {
    0%, 100% { transform: translateX(-50%) translateY(0); }
    50% { transform: translateX(-50%) translateY(0.375rem); }
}

.scroll-up[b-hzfrep2cyk] {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 2.75rem;
    height: 2.75rem;
    color: var(--muted);
    opacity: 0.5;
    transition: opacity 0.3s, color 0.3s;
    z-index: 3;
    text-decoration: none;
    animation: slowUp-b-hzfrep2cyk 3s ease-in-out infinite;
}

.scroll-up:hover[b-hzfrep2cyk] {
    opacity: 1;
    color: var(--primary);
}

@keyframes slowUp-b-hzfrep2cyk {
    0%, 100% { transform: translateX(-50%) translateY(0); }
    50% { transform: translateX(-50%) translateY(-0.1875rem); }
}

@media (min-width: 64em) {
    #leistungen > .section-content[b-hzfrep2cyk],
    #technologien > .section-content[b-hzfrep2cyk] { max-width: 88rem; }
}

/* /Components/Pages/Kontakt.razor.rz.scp.css */
.kontakt-container[b-5gftmv8vxp] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.compose-window[b-5gftmv8vxp] {
    max-width: var(--max-w);
    width: 100%;
    margin: 0 auto auto;
    background: #0d1117;
    border: var(--border-hair) solid rgba(74, 222, 128, 0.2);
    overflow: hidden;
    opacity: 0;
    transform: translateY(0.9375rem);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.compose-window.open[b-5gftmv8vxp] {
    opacity: 1;
    transform: translateY(0);
}

.compose-titlebar[b-5gftmv8vxp] {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    padding: calc(var(--spacing) * 2) calc(var(--spacing) * 4);
    background: rgba(17, 24, 39, 0.8);
    border-bottom: var(--border-hair) solid rgba(74, 222, 128, 0.15);
}

.compose-dot[b-5gftmv8vxp] {
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
}

.compose-dot.red[b-5gftmv8vxp] { background: #ff5f57; }
.compose-dot.yellow[b-5gftmv8vxp] { background: #febc2e; }
.compose-dot.green[b-5gftmv8vxp] { background: #28c840; }

.compose-title[b-5gftmv8vxp] {
    flex: 1;
    text-align: center;
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--muted);
}

.compose-fields[b-5gftmv8vxp] {
    border-bottom: var(--border-hair) solid rgba(74, 222, 128, 0.1);
}

.compose-field[b-5gftmv8vxp] {
    display: flex;
    align-items: center;
    padding: calc(var(--spacing) * 2) calc(var(--spacing) * 4);
    border-bottom: var(--border-hair) solid rgba(107, 114, 128, 0.1);
    position: relative;
}

.compose-field:last-child[b-5gftmv8vxp] {
    border-bottom: none;
}

.compose-field[b-5gftmv8vxp]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: var(--border-hair);
    background: rgba(74, 222, 128, 0.6);
    transition: width 0.3s ease;
    box-shadow: 0 0 0.375rem rgba(74, 222, 128, 0.4);
}

.compose-field:focus-within[b-5gftmv8vxp]::after {
    width: 100%;
}

.field-label[b-5gftmv8vxp] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--muted);
    width: 4.5rem;
    flex-shrink: 0;
}

.field-input[b-5gftmv8vxp] {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: var(--text);
    font-family: var(--font-body);
    font-size: var(--text-base);
    padding: calc(var(--spacing) * 1.2) 0;
}

.field-input[b-5gftmv8vxp]::placeholder {
    color: rgba(107, 114, 128, 0.4);
}

.compose-body[b-5gftmv8vxp] {
    padding: calc(var(--spacing) * 4);
    position: relative;
}

.compose-body[b-5gftmv8vxp]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: var(--border-hair);
    background: rgba(74, 222, 128, 0.6);
    transition: width 0.3s ease;
    box-shadow: 0 0 0.375rem rgba(74, 222, 128, 0.4);
}

.compose-body:focus-within[b-5gftmv8vxp]::after {
    width: 100%;
}

.body-input[b-5gftmv8vxp] {
    width: 100%;
    background: transparent;
    border: none;
    outline: none;
    color: var(--text);
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: 1.9;
    resize: none;
    min-height: 16rem;
}

.body-input[b-5gftmv8vxp]::placeholder {
    color: rgba(107, 114, 128, 0.4);
}

.compose-footer[b-5gftmv8vxp] {
    display: flex;
    justify-content: flex-end;
    padding: calc(var(--spacing) * 2) calc(var(--spacing) * 2) calc(var(--spacing) * 2) calc(var(--spacing) * 3);
    border-top: var(--border-hair) solid rgba(74, 222, 128, 0.1);
}

.send-btn[b-5gftmv8vxp] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    font-weight: 700;
    color: var(--bg);
    background: var(--cta);
    border: none;
    padding: 0.6em 1.8em;
    min-height: 2.5rem;
    cursor: pointer;
    transition: background 0.3s, box-shadow 0.3s, transform 0.1s;
}

.send-btn:hover[b-5gftmv8vxp] {
    background: var(--accent);
    box-shadow: var(--glow-accent);
}

.send-btn:active[b-5gftmv8vxp] {
    transform: scale(0.97);
}

.send-btn .send-prompt[b-5gftmv8vxp] {
    color: var(--bg);
    opacity: 0.7;
}

.send-btn:disabled[b-5gftmv8vxp] {
    opacity: 0.5;
    cursor: not-allowed;
}

.status-message[b-5gftmv8vxp] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    margin-right: auto;
    align-self: center;
}

.status-success[b-5gftmv8vxp] {
    color: #4ade80;
}

.status-error[b-5gftmv8vxp] {
    color: #f87171;
}

@media (min-width: 48em) {
    .field-label[b-5gftmv8vxp] {
        width: 7rem;
    }

    .body-input[b-5gftmv8vxp] {
        min-height: 22rem;
    }
}

@media (min-width: 64em) {
    .compose-title[b-5gftmv8vxp] { font-size: var(--text-base); }

    .compose-field[b-5gftmv8vxp] {
        padding: calc(var(--spacing) * 3) calc(var(--spacing) * 5);
    }

    .field-label[b-5gftmv8vxp] {
        font-size: var(--text-base);
        width: 8rem;
    }

    .field-input[b-5gftmv8vxp] { font-size: var(--text-lg); }

    .compose-body[b-5gftmv8vxp] {
        padding: calc(var(--spacing) * 6);
    }

    .body-input[b-5gftmv8vxp] {
        font-size: var(--text-lg);
        min-height: 24rem;
    }

    .send-btn[b-5gftmv8vxp] { font-size: var(--text-base); }

    .status-message[b-5gftmv8vxp] { font-size: var(--text-base); }
}

@media (prefers-reduced-motion: reduce) {
    .compose-window[b-5gftmv8vxp] {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .compose-field[b-5gftmv8vxp]::after,
    .compose-body[b-5gftmv8vxp]::after {
        transition: none;
    }
}
/* /Components/Pages/Leistungen.razor.rz.scp.css */
.leistungen-container[b-b222sym7n2] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
}

.services-grid[b-b222sym7n2] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: calc(var(--spacing) * 4);
    max-width: var(--max-w-wide);
    margin: 0 auto auto;
    width: 100%;
}

@media (min-width: 64em) {
    .services-grid[b-b222sym7n2] { max-width: 88rem; }
}

@media (min-width: 80em) {
    .services-grid[b-b222sym7n2] {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 64em) {
    .services-grid[b-b222sym7n2] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 36em) {
    .services-grid[b-b222sym7n2] {
        grid-template-columns: 1fr;
        grid-auto-rows: 1fr;
    }

    .service-card[b-b222sym7n2] {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-rows: auto auto;
        align-items: center;
        column-gap: calc(var(--spacing) * 3);
    }

    .service-icon[b-b222sym7n2] {
        grid-row: 1;
        grid-column: 1;
        margin-bottom: 0;
    }

    .service-name[b-b222sym7n2] {
        grid-row: 1;
        grid-column: 2;
        margin-bottom: 0;
    }

    .service-desc[b-b222sym7n2] {
        grid-row: 2;
        grid-column: 1 / -1;
        margin-top: calc(var(--spacing) * 2);
    }
}

.service-card[b-b222sym7n2] {
    background: var(--surface);
    border: var(--border-hair) solid rgba(107, 114, 128, 0.2);
    padding: calc(var(--spacing) * 3) calc(var(--spacing) * 4);
    position: relative;
    overflow: hidden;
    cursor: default;
    opacity: 0;
    transform: translateY(0.75rem);
    transition: opacity 0.3s, transform 0.3s;
}

.service-card.booted[b-b222sym7n2] {
    opacity: 1;
    transform: translateY(0);
}

.service-card[b-b222sym7n2]::before {
    content: '';
    position: absolute;
    inset: 0;
    border: var(--border-thin) solid transparent;
    background: linear-gradient(var(--surface), var(--surface)) padding-box,
                conic-gradient(from var(--border-angle, 0deg), transparent 0%, var(--accent) 25%, var(--primary) 50%, var(--accent) 75%, transparent 100%) border-box;
    opacity: 0;
    transition: opacity 0.4s;
    pointer-events: none;
}

.service-card:hover[b-b222sym7n2]::before {
    opacity: 1;
    animation: borderTrace-b-b222sym7n2 2s linear infinite;
}

@keyframes borderTrace-b-b222sym7n2 {
    to { --border-angle: 360deg; }
}

@property --border-angle {
    syntax: '<angle>';
    inherits: false;
    initial-value: 0deg;
}

.service-card:hover[b-b222sym7n2] {
    border-color: transparent;
    box-shadow: 0 0 1.25rem rgba(74, 222, 128, 0.08);
}

.service-card.flash[b-b222sym7n2] {
    animation: bootFlash-b-b222sym7n2 0.15s ease;
}

@keyframes bootFlash-b-b222sym7n2 {
    0% { background: rgba(74, 222, 128, 0.15); }
    100% { background: var(--surface); }
}

.service-icon[b-b222sym7n2],
.service-name[b-b222sym7n2],
.service-desc[b-b222sym7n2] {
    position: relative;
}

.service-icon[b-b222sym7n2] {
    width: 2rem;
    height: 2rem;
    margin-bottom: calc(var(--spacing) * 2);
    color: var(--primary);
}

.service-icon svg[b-b222sym7n2] {
    width: 100%;
    height: 100%;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.5;
    stroke-linecap: square;
    stroke-linejoin: miter;
}

.service-name[b-b222sym7n2] {
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: var(--text-lg);
    font-variant-ligatures: none;
    font-feature-settings: "liga" 0, "clig" 0, "calt" 0, "dlig" 0;
    color: var(--text);
    margin-bottom: calc(var(--spacing) * 1.2);
}


.service-desc[b-b222sym7n2] {
    font-size: var(--text-base);
    font-weight: 400;
    color: var(--muted);
    line-height: 1.35;
}

@media (min-width: 64em) {
    .service-card[b-b222sym7n2] {
        padding: calc(var(--spacing) * 5) calc(var(--spacing) * 6);
    }

    .service-icon[b-b222sym7n2] {
        width: 3rem;
        height: 3rem;
        margin-bottom: calc(var(--spacing) * 3);
    }

    .service-name[b-b222sym7n2] {
        font-size: var(--text-xl);
    }

    .service-desc[b-b222sym7n2] {
        font-size: var(--text-lg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .service-card[b-b222sym7n2] {
        opacity: 1;
        transform: none;
    }

    .service-card.flash[b-b222sym7n2] {
        animation: none;
    }

    .service-card:hover[b-b222sym7n2]::before {
        animation: none;
    }
}
/* /Components/Pages/Technologien.razor.rz.scp.css */
.technologien-container[b-lbp94l12kg] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.terminal-grid[b-lbp94l12kg] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: calc(var(--spacing) * 4);
    max-width: var(--max-w-wide);
    width: 100%;
    margin: 0 auto auto;
}

@media (max-width: 47.99em) {
    .terminal-grid[b-lbp94l12kg] {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 48em) and (max-width: 63.99em) {
    .terminal-grid[b-lbp94l12kg] {
        grid-template-columns: 1fr 1fr;
    }

    .terminal-window:nth-child(3)[b-lbp94l12kg] {
        grid-column: 1 / -1;
        justify-self: center;
        width: calc(50% - calc(var(--spacing) * 2));
    }
}

.terminal-window[b-lbp94l12kg] {
    width: 100%;
    background: #0d1117;
    border: var(--border-hair) solid rgba(74, 222, 128, 0.2);
    overflow: hidden;
    font-family: var(--font-mono);
    opacity: 0;
    transform: translateY(0.9375rem);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.terminal-window.open[b-lbp94l12kg] {
    opacity: 1;
    transform: translateY(0);
}

.terminal-titlebar[b-lbp94l12kg] {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    padding: calc(var(--spacing) * 2) calc(var(--spacing) * 4);
    background: rgba(17, 24, 39, 0.8);
    border-bottom: var(--border-hair) solid rgba(74, 222, 128, 0.15);
}

.terminal-dot[b-lbp94l12kg] {
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
}

.terminal-dot.red[b-lbp94l12kg] { background: #ff5f57; }
.terminal-dot.yellow[b-lbp94l12kg] { background: #febc2e; }
.terminal-dot.green[b-lbp94l12kg] { background: #28c840; }

.terminal-title[b-lbp94l12kg] {
    flex: 1;
    text-align: center;
    font-size: var(--text-sm);
    color: var(--muted);
}

.terminal-body[b-lbp94l12kg] {
    padding: calc(var(--spacing) * 4) calc(var(--spacing) * 5);
    font-size: var(--text-lg);
    line-height: 1.9;
}

.term-dir[b-lbp94l12kg] {
    color: var(--primary);
    font-weight: 700;
    margin-top: calc(var(--spacing) * 4);
    display: block;
}

.term-dir:first-child[b-lbp94l12kg] {
    margin-top: 0;
}

.term-line[b-lbp94l12kg] {
    display: block;
    color: var(--accent);
    padding-left: 1.2em;
    opacity: 0;
    max-width: 0;
    white-space: nowrap;
    overflow: hidden;
    transition: none;
}

.term-line.typed[b-lbp94l12kg] {
    opacity: 1;
    max-width: 100%;
    animation: typeIn-b-lbp94l12kg 0.6s steps(20) forwards;
}

@keyframes typeIn-b-lbp94l12kg {
    from { max-width: 0; }
    to { max-width: 25rem; }
}

.term-line .dollar[b-lbp94l12kg] {
    color: var(--muted);
    margin-right: 0.5em;
    user-select: none;
}

.term-line .tech-name[b-lbp94l12kg] {
    color: var(--accent);
}

.terminal-prompt-final[b-lbp94l12kg] {
    display: block;
    margin-top: calc(var(--spacing) * 4);
    padding-left: 1.2em;
    color: var(--muted);
    opacity: 0;
    transition: opacity 0.3s;
}

.terminal-prompt-final.typed[b-lbp94l12kg] {
    opacity: 1;
}

.terminal-prompt-final .cursor-term[b-lbp94l12kg] {
    display: inline-block;
    width: 0.55em;
    height: 0.85em;
    background: var(--accent);
    animation: cursorBlink 1s step-end infinite;
    vertical-align: -0.1em;
    margin-left: 0.5em;
}

@media (min-width: 64em) {
    .terminal-grid[b-lbp94l12kg] { max-width: 88rem; }

    .terminal-title[b-lbp94l12kg] { font-size: var(--text-base); }

    .terminal-body[b-lbp94l12kg] { font-size: var(--text-xl); }
}

@media (prefers-reduced-motion: reduce) {
    .terminal-window[b-lbp94l12kg] {
        opacity: 1;
        transform: none;
    }

    .term-line[b-lbp94l12kg] {
        opacity: 1;
        max-width: 100%;
    }

    .term-line.typed[b-lbp94l12kg] {
        animation: none;
    }
}
/* /Components/Pages/UeberMich.razor.rz.scp.css */
.ueber-mich-container[b-48yxypeupy] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.git-log[b-48yxypeupy] {
    position: relative;
    max-width: var(--max-w);
    width: 100%;
    padding: calc(var(--spacing) * 4) 0 0;
    margin-top: -1.5rem;
    margin-bottom: auto;
}

.git-log[b-48yxypeupy]::before {
    content: '';
    position: absolute;
    left: 50%;
    top: calc(calc(var(--spacing) * 4) + 0.5625rem);
    width: var(--border-thin);
    height: calc(100% - calc(var(--spacing) * 4) - 0.5625rem);
    background: linear-gradient(to bottom, var(--accent) 0%, var(--accent) 85%, rgba(74, 222, 128, 0.1) 100%);
    transform: translateX(-50%) scaleY(0);
    transform-origin: top;
    transition: transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    box-shadow: 0 0 0.375rem rgba(74, 222, 128, 0.4);
}

.git-log.active[b-48yxypeupy]::before {
    transform: translateX(-50%) scaleY(1);
}

.commit[b-48yxypeupy] {
    position: relative;
    width: calc(50% - 1.5rem);
    padding-bottom: calc(var(--spacing) * 8);
    opacity: 0;
    transition: opacity 0.5s ease, transform 0.5s ease;
}

.commit:last-child[b-48yxypeupy] {
    padding-bottom: 0;
}

.commit:nth-child(odd)[b-48yxypeupy] {
    margin-left: calc(50% + 1.5rem);
    transform: translateX(1.25rem);
}

.commit:nth-child(even)[b-48yxypeupy] {
    margin-left: 0;
    text-align: right;
    transform: translateX(-1.25rem);
}

.commit.revealed[b-48yxypeupy] {
    opacity: 1;
    transform: translateX(0);
}

.commit-node[b-48yxypeupy] {
    position: absolute;
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 50%;
    background: var(--bg);
    border: var(--border-thin) solid var(--accent);
    top: 0.3125rem;
    z-index: 2;
    transition: background 0.3s ease 0.1s, box-shadow 0.3s ease 0.1s;
}

.commit.revealed .commit-node[b-48yxypeupy] {
    background: var(--accent);
    box-shadow: 0 0 0.5rem rgba(74, 222, 128, 0.6), 0 0 1.25rem rgba(74, 222, 128, 0.2);
}

.commit-node[b-48yxypeupy]::after {
    content: '';
    position: absolute;
    inset: -0.3125rem;
    border-radius: 50%;
    border: var(--border-hair) solid var(--accent);
    opacity: 0;
}

.commit.revealed .commit-node[b-48yxypeupy]::after {
    animation: ringPulse-b-48yxypeupy 2s ease-out 0.3s infinite;
}

@keyframes ringPulse-b-48yxypeupy {
    0% { transform: scale(1); opacity: 0.4; }
    50% { transform: scale(1.8); opacity: 0; }
    100% { transform: scale(1); opacity: 0; }
}

.commit:nth-child(odd) .commit-node[b-48yxypeupy] {
    left: calc(-1.5rem - 0.4375rem);
}

.commit:nth-child(even) .commit-node[b-48yxypeupy] {
    right: calc(-1.5rem - 0.4375rem);
}

.commit-header[b-48yxypeupy] {
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 3);
    margin-bottom: calc(var(--spacing) * 1.6);
}

.commit:nth-child(even) .commit-header[b-48yxypeupy] {
    justify-content: flex-end;
}

.commit-hash[b-48yxypeupy] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--cta);
    letter-spacing: 0.05em;
}

.commit-ref[b-48yxypeupy] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--accent);
    border: var(--border-hair) solid rgba(74, 222, 128, 0.3);
    padding: 0.1em 0.5em;
    border-radius: var(--radius-sm);
    white-space: nowrap;
}

.commit-msg[b-48yxypeupy] {
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: var(--text-lg);
    color: var(--text);
    margin-bottom: calc(var(--spacing) * 1.2);
}

.commit-desc[b-48yxypeupy] {
    font-size: var(--text-base);
    font-weight: 400;
    color: var(--muted);
    line-height: 1.9;
}

.commit-desc br[b-48yxypeupy] {
    display: none;
}

@media (min-width: 48em) {
    .commit-desc br[b-48yxypeupy] { display: inline; }
}

@media (min-width: 48em) {
    .commit[b-48yxypeupy] {
        padding-bottom: calc(var(--spacing) * 6);
    }
}

@media (min-width: 64em) {
    .commit-hash[b-48yxypeupy] { font-size: var(--text-base); }
    .commit-ref[b-48yxypeupy] { font-size: var(--text-sm); }
    .commit-msg[b-48yxypeupy] { font-size: var(--text-xl); }
    .commit-desc[b-48yxypeupy] { font-size: var(--text-lg); }
    .commit-node[b-48yxypeupy] { top: 0.375rem; }
}

@media (max-width: 48em) {
    .git-log[b-48yxypeupy]::before {
        left: 1rem;
        transform: translateX(0) scaleY(0);
    }

    .git-log.active[b-48yxypeupy]::before {
        transform: translateX(0) scaleY(1);
    }

    .commit[b-48yxypeupy],
    .commit:nth-child(odd)[b-48yxypeupy],
    .commit:nth-child(even)[b-48yxypeupy] {
        width: calc(100% - 2.75rem);
        margin-left: calc(var(--spacing) * 11);
        text-align: left;
        transform: translateY(0.9375rem);
    }

    .commit.revealed[b-48yxypeupy],
    .commit:nth-child(odd).revealed[b-48yxypeupy],
    .commit:nth-child(even).revealed[b-48yxypeupy] {
        transform: translateY(0);
    }

    .commit-node[b-48yxypeupy],
    .commit:nth-child(odd) .commit-node[b-48yxypeupy],
    .commit:nth-child(even) .commit-node[b-48yxypeupy] {
        left: -2.1875rem;
        right: auto;
    }

    .commit:nth-child(even) .commit-header[b-48yxypeupy] {
        justify-content: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {
    .git-log[b-48yxypeupy]::before {
        transform: translateX(-50%) scaleY(1);
        transition: none;
    }

    .commit[b-48yxypeupy] {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .commit .commit-node[b-48yxypeupy] {
        background: var(--accent);
        box-shadow: 0 0 0.5rem rgba(74, 222, 128, 0.6);
    }

    .commit .commit-node[b-48yxypeupy]::after,
    .commit.revealed .commit-node[b-48yxypeupy]::after {
        animation: none;
    }
}
