/* /Components/Layout/AppHeader.razor.rz.scp.css */
.app-header[b-l0fhn6uuh4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.1rem 2.5rem;
    position: sticky;
    top: 0;
    z-index: 10;
    background: var(--navy);
    color: #f3f1ec;
}

.app-nav[b-l0fhn6uuh4] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.app-nav a[b-l0fhn6uuh4] {
    color: #c7c5bd;
    font-family: "Press Start 2P", "Inter", sans-serif;
    font-weight: 400;
    font-size: 0.65rem;
    letter-spacing: -0.05em;
    word-spacing: -0.3em;
    transition: color 0.15s ease;
}

.app-nav a:hover[b-l0fhn6uuh4] {
    color: #fff;
}

@media (max-width: 40rem) {
    .app-header[b-l0fhn6uuh4] {
        padding: 1.1rem 1.25rem;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-b83ykjpxmt] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-b83ykjpxmt] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-e439k2hzmc],
.components-reconnect-repeated-attempt-visible[b-e439k2hzmc],
.components-reconnect-failed-visible[b-e439k2hzmc],
.components-pause-visible[b-e439k2hzmc],
.components-resume-failed-visible[b-e439k2hzmc],
.components-rejoining-animation[b-e439k2hzmc] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-e439k2hzmc],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-e439k2hzmc],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-e439k2hzmc],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-e439k2hzmc],
#components-reconnect-modal.components-reconnect-retrying[b-e439k2hzmc],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-e439k2hzmc],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-e439k2hzmc],
#components-reconnect-modal.components-reconnect-failed[b-e439k2hzmc],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-e439k2hzmc] {
    display: block;
}


#components-reconnect-modal[b-e439k2hzmc] {
    background-color: var(--bg);
    color: var(--text);
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-pixel);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-e439k2hzmc 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-e439k2hzmc 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-e439k2hzmc 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-e439k2hzmc]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-e439k2hzmc 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-e439k2hzmc {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-e439k2hzmc {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-e439k2hzmc {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-e439k2hzmc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-e439k2hzmc] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-e439k2hzmc] {
    border: 0;
    background-color: var(--accent);
    color: #fff;
    padding: 4px 24px;
    border-radius: var(--radius-sm);
    font-family: "Press Start 2P", "Inter", sans-serif;
    font-size: 0.65rem;
}

    #components-reconnect-modal button:hover[b-e439k2hzmc] {
        background-color: var(--accent-dark);
    }

    #components-reconnect-modal button:active[b-e439k2hzmc] {
        background-color: var(--accent);
    }

.components-rejoining-animation[b-e439k2hzmc] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-e439k2hzmc] {
        position: absolute;
        border: 3px solid var(--accent);
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-e439k2hzmc 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-e439k2hzmc] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-e439k2hzmc {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Layout/SiteFooter.razor.rz.scp.css */
.site-footer[b-z01lrvno8y] {
    background: var(--navy);
    color: #d8d6cf;
    margin-top: 3rem;
}

.footer-main[b-z01lrvno8y] {
    max-width: 64rem;
    margin: 0 auto;
    padding: 4rem 2rem 2.5rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 2rem;
    flex-wrap: wrap;
}

.footer-brand .brand-mark[b-z01lrvno8y] {
    margin-bottom: 0.75rem;
}

.footer-brand p[b-z01lrvno8y] {
    color: #a4a29a;
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    max-width: 22rem;
    margin: 0;
}

.footer-actions[b-z01lrvno8y] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.site-footer .btn-ghost[b-z01lrvno8y] {
    border-color: #3a3b47;
    color: #f3f1ec;
}

.site-footer .btn-ghost:hover[b-z01lrvno8y] {
    border-color: var(--accent);
}

.footer-bottom[b-z01lrvno8y] {
    max-width: 64rem;
    margin: 0 auto;
    padding: 1.5rem 2rem;
    border-top: 1px solid #2f303c;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 0.85rem;
    color: #8b8a82;
}

.footer-nav[b-z01lrvno8y] {
    display: flex;
    gap: 1.5rem;
}

.footer-nav a:hover[b-z01lrvno8y] {
    color: #fff;
}
/* /Components/Layout/SiteHeader.razor.rz.scp.css */
.site-header[b-q5jd7u28l4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.1rem 2.5rem;
    position: sticky;
    top: 0;
    z-index: 10;
    background: var(--navy);
    color: #f3f1ec;
}

.site-nav[b-q5jd7u28l4] {
    display: flex;
    align-items: center;
    gap: 2rem;
    position: relative;
}

.site-nav-links[b-q5jd7u28l4] {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.nav-hamburger[b-q5jd7u28l4] {
    display: none;
}

.site-nav a[b-q5jd7u28l4] {
    color: #c7c5bd;
    font-family: "Press Start 2P", "Inter", sans-serif;
    font-weight: 400;
    font-size: 0.65rem;
    letter-spacing: -0.05em;
    word-spacing: -0.3em;
    transition: color 0.15s ease;
}

.site-nav a:hover[b-q5jd7u28l4] {
    color: #fff;
}

.nav-cta[b-q5jd7u28l4] {
    background: var(--accent);
    color: #fff !important;
    padding: 0.55rem 1.1rem;
    border-radius: var(--radius-sm);
    font-weight: 400 !important;
}

.nav-cta:hover[b-q5jd7u28l4] {
    background: var(--accent-dark);
    color: #fff !important;
}

@media (max-width: 40rem) {
    .site-header[b-q5jd7u28l4] {
        padding: 1.1rem 1.25rem;
    }

    .site-nav[b-q5jd7u28l4] {
        gap: 0.6rem;
    }

    .nav-hamburger[b-q5jd7u28l4] {
        display: inline-flex;
    }

    .site-nav-links[b-q5jd7u28l4] {
        display: none;
        position: absolute;
        top: calc(100% + 0.75rem);
        right: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.9rem;
        background: var(--navy);
        padding: 1.1rem 1.25rem;
        border-radius: var(--radius-sm);
        box-shadow: var(--shadow-pixel);
        z-index: 20;
    }

    .site-nav-links a[b-q5jd7u28l4] {
        white-space: nowrap;
    }

    .site-nav-links.open[b-q5jd7u28l4] {
        display: flex;
    }
}
/* /Components/Pages/AccountSetup.razor.rz.scp.css */
.login-page[b-zes88d1mvl] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.login-main[b-zes88d1mvl] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4rem 1.5rem;
}

.login-card[b-zes88d1mvl] {
    width: 100%;
    max-width: 26rem;
    text-align: center;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 2.5rem 2rem;
    background: var(--bg-alt);
}

.login-card h1[b-zes88d1mvl] {
    font-size: 1.4rem;
    line-height: 1.6;
}

.login-sub[b-zes88d1mvl] {
    color: var(--muted);
    margin: 0 0 2rem;
}

[b-zes88d1mvl] .login-form {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    text-align: left;
}

.field[b-zes88d1mvl] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
}

.field[b-zes88d1mvl]  input {
    font-family: "Inter", sans-serif;
    font-size: 1rem;
    font-weight: 400;
    padding: 0.75rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg);
    color: var(--text);
    width: 100%;
    box-sizing: border-box;
}

.field[b-zes88d1mvl]  input:focus {
    outline: none;
    border-color: var(--accent);
}

.login-status[b-zes88d1mvl] {
    font-size: 0.85rem;
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.12);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.9rem;
    margin: 0;
}

.login-submit[b-zes88d1mvl] {
    justify-content: center;
    margin-top: 0.5rem;
}

.back-link[b-zes88d1mvl] {
    margin-top: 2rem;
}
/* /Components/Pages/Blog.razor.rz.scp.css */
.list-page[b-4m7pe4unvz] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-4m7pe4unvz] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.list-main[b-4m7pe4unvz] {
    flex: 1;
    max-width: 42rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.list-main h1[b-4m7pe4unvz] {
    font-size: 1.5rem;
    line-height: 1.6;
}

.search-form[b-4m7pe4unvz] {
    display: flex;
    gap: 0.75rem;
    margin: 2rem 0 2.5rem;
}

.search-form input[b-4m7pe4unvz] {
    flex: 1;
    font-family: "Inter", sans-serif;
    font-size: 1rem;
    padding: 0.75rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    color: var(--text);
}

.search-form input:focus[b-4m7pe4unvz] {
    outline: none;
    border-color: var(--accent);
}

.post-list[b-4m7pe4unvz] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

@media (max-width: 40rem) {
    .list-main[b-4m7pe4unvz] {
        padding: 3rem 1.25rem 3.5rem;
    }

    .search-form[b-4m7pe4unvz] {
        flex-direction: column;
    }
}
/* /Components/Pages/BlogPostEditor.razor.rz.scp.css */
.content-editor-page[b-vgqg2ab5pg] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-vgqg2ab5pg] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.content-editor-main[b-vgqg2ab5pg] {
    flex: 1;
    max-width: 42rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.content-editor-main h1[b-vgqg2ab5pg] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin: 0.75rem 0;
}

.editor-toolbar[b-vgqg2ab5pg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.5rem 0 1.25rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--border);
}

.toolbar-actions[b-vgqg2ab5pg] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.btn.danger[b-vgqg2ab5pg] {
    color: var(--accent-game);
}

.status-badge[b-vgqg2ab5pg] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-radius: var(--radius-sm);
    padding: 0.2rem 0.6rem;
}

.status-draft[b-vgqg2ab5pg] {
    color: var(--muted);
    background: var(--bg-alt);
}

.status-published[b-vgqg2ab5pg] {
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.12);
}

.editor-status[b-vgqg2ab5pg] {
    font-size: 0.85rem;
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.12);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.9rem;
    margin: 0 0 1.25rem;
}

.field[b-vgqg2ab5pg] {
    display: block;
    margin-bottom: 1.25rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
}

.field span[b-vgqg2ab5pg] {
    display: block;
    margin-bottom: 0.4rem;
}

.field input[b-vgqg2ab5pg] {
    width: 100%;
    box-sizing: border-box;
    font-family: "Inter", sans-serif;
    font-size: 0.95rem;
    font-weight: 400;
    padding: 0.65rem 0.9rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    color: var(--text);
}

.field input:focus[b-vgqg2ab5pg] {
    outline: none;
    border-color: var(--accent);
}

.field-row[b-vgqg2ab5pg] {
    display: flex;
    gap: 1.25rem;
}

.field-row .field[b-vgqg2ab5pg] {
    flex: 1;
    min-width: 0;
}

.field-date[b-vgqg2ab5pg] {
    flex: 0 0 10rem;
}

.body-textarea[b-vgqg2ab5pg] {
    width: 100%;
    box-sizing: border-box;
    min-height: 24rem;
    resize: vertical;
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    color: var(--text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.9rem;
    line-height: 1.6;
}

.body-textarea:focus[b-vgqg2ab5pg] {
    outline: none;
    border-color: var(--accent);
}

/* Rendered markdown preview — injected via MarkupString, so ::deep is
   required for every rule here (same pattern as BlogPostPage.razor.css). */

.prose[b-vgqg2ab5pg] {
    color: var(--text);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.75;
    min-height: 24rem;
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    box-sizing: border-box;
}

.prose[b-vgqg2ab5pg]  p {
    margin: 0 0 1.2rem;
}

.prose[b-vgqg2ab5pg]  a {
    color: var(--accent-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.prose[b-vgqg2ab5pg]  h2,
.prose[b-vgqg2ab5pg]  h3 {
    margin-top: 2rem;
}

.prose[b-vgqg2ab5pg]  img {
    max-width: 100%;
    border-radius: 0.75rem;
    margin: 1.5rem 0;
}

.prose[b-vgqg2ab5pg]  code {
    background: var(--bg);
    padding: 0.15rem 0.4rem;
    border-radius: 0.35rem;
    font-size: 0.9em;
}

.prose[b-vgqg2ab5pg]  pre {
    background: var(--navy);
    color: #f3f1ec;
    padding: 1rem 1.25rem;
    border-radius: 0.75rem;
    overflow-x: auto;
    margin: 0 0 1.2rem;
}

.prose[b-vgqg2ab5pg]  pre code {
    background: none;
    padding: 0;
    color: inherit;
}

@media (max-width: 40rem) {
    .content-editor-main[b-vgqg2ab5pg] {
        padding: 3rem 1.25rem 3.5rem;
    }

    .field-row[b-vgqg2ab5pg] {
        flex-direction: column;
        gap: 0;
    }

    .field-date[b-vgqg2ab5pg] {
        flex: none;
    }
}
/* /Components/Pages/BlogPostPage.razor.rz.scp.css */
.blog-post-page[b-ejmgmqfbuc] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.blog-post-main[b-ejmgmqfbuc] {
    flex: 1;
}

.blog-post[b-ejmgmqfbuc],
.blog-post-missing[b-ejmgmqfbuc] {
    max-width: 42rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
}

.blog-post h1[b-ejmgmqfbuc] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.75rem;
}

.blog-post .post-date[b-ejmgmqfbuc] {
    margin-bottom: 0;
}

.blog-post .post-tags[b-ejmgmqfbuc] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin: 1rem 0 0.5rem;
}

.blog-post-missing p[b-ejmgmqfbuc] {
    color: var(--muted);
    margin: 0.75rem 0 1.5rem;
}

/* Rendered markdown content — injected via MarkupString, so these elements
   never receive a scope attribute at all; ::deep is required for every rule
   here, not just descendant lookups. */

.prose[b-ejmgmqfbuc] {
    margin-top: 2rem;
    color: var(--text);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.75;
}

.prose[b-ejmgmqfbuc]  p {
    margin: 0 0 1.2rem;
}

.prose[b-ejmgmqfbuc]  a {
    color: var(--accent-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.prose[b-ejmgmqfbuc]  h2,
.prose[b-ejmgmqfbuc]  h3 {
    margin-top: 2rem;
}

.prose[b-ejmgmqfbuc]  code {
    background: var(--bg-alt);
    padding: 0.15rem 0.4rem;
    border-radius: 0.35rem;
    font-size: 0.9em;
}

.prose[b-ejmgmqfbuc]  pre {
    background: var(--navy);
    color: #f3f1ec;
    padding: 1rem 1.25rem;
    border-radius: 0.75rem;
    overflow-x: auto;
    margin: 0 0 1.2rem;
}

.prose[b-ejmgmqfbuc]  pre code {
    background: none;
    padding: 0;
    color: inherit;
}

.prose[b-ejmgmqfbuc]  blockquote {
    border-left: 3px solid var(--accent);
    margin: 0 0 1.2rem;
    padding: 0.25rem 1.25rem;
    color: var(--muted);
    font-style: italic;
}

.prose[b-ejmgmqfbuc]  ul,
.prose[b-ejmgmqfbuc]  ol {
    margin: 0 0 1.2rem;
    padding-left: 1.4rem;
}

.prose[b-ejmgmqfbuc]  li {
    margin-bottom: 0.4rem;
}

.prose[b-ejmgmqfbuc]  img {
    max-width: 100%;
    border-radius: 0.75rem;
    margin: 1.5rem 0;
}

.prose[b-ejmgmqfbuc]  hr {
    border: none;
    border-top: 1px solid var(--border);
    margin: 2rem 0;
}

@media (max-width: 40rem) {
    .blog-post[b-ejmgmqfbuc],
    .blog-post-missing[b-ejmgmqfbuc] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/BlogPostsAdmin.razor.rz.scp.css */
.content-list-page[b-cniebp8bkm] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-cniebp8bkm] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.content-list-main[b-cniebp8bkm] {
    flex: 1;
    max-width: 56rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.content-list-main h1[b-cniebp8bkm] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.75rem;
}

.content-list-main .eyebrow[b-cniebp8bkm] {
    display: inline-block;
    margin-top: 1.5rem;
}

[b-cniebp8bkm] .inline-add-form {
    max-width: 26rem;
    margin: 1.5rem 0 2.5rem;
}

.content-grid[b-cniebp8bkm] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1.25rem;
}

.content-card[b-cniebp8bkm] {
    display: block;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    padding: 1.5rem;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.content-card:hover[b-cniebp8bkm] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
}

.content-card h2[b-cniebp8bkm] {
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 0.75rem 0 0.4rem;
}

.content-card p[b-cniebp8bkm] {
    color: var(--muted);
    font-size: 0.85rem;
    margin: 0;
}

.status-badge[b-cniebp8bkm] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-radius: var(--radius-sm);
    padding: 0.2rem 0.6rem;
}

.status-draft[b-cniebp8bkm] {
    color: var(--muted);
    background: var(--bg);
}

.status-published[b-cniebp8bkm] {
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.12);
}

@media (max-width: 40rem) {
    .content-list-main[b-cniebp8bkm] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/CharacterSheetEditor.razor.rz.scp.css */
.cs-editor[b-cvxp1zmkc5] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-width: 48rem;
}

.cs-editor-top[b-cvxp1zmkc5] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.cs-thumbnail-picker[b-cvxp1zmkc5] {
    width: 7rem;
    height: 7rem;
    flex-shrink: 0;
    border: 1px dashed var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    padding: 0;
    overflow: hidden;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cs-thumbnail-picker:hover[b-cvxp1zmkc5] {
    border-color: var(--accent);
}

.cs-thumbnail-picker img[b-cvxp1zmkc5] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cs-thumbnail-placeholder[b-cvxp1zmkc5] {
    color: var(--muted);
    font-size: 0.75rem;
    text-align: center;
    padding: 0 0.5rem;
}

.cs-field-label[b-cvxp1zmkc5] {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--muted);
    margin-bottom: -0.75rem;
}

.cs-description-input[b-cvxp1zmkc5],
.cs-tags-input[b-cvxp1zmkc5],
.cs-field-label-input[b-cvxp1zmkc5],
.cs-field-value-input[b-cvxp1zmkc5],
.cs-field-display-select[b-cvxp1zmkc5] {
    width: 100%;
    box-sizing: border-box;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    color: var(--text);
    font-family: inherit;
    font-size: 0.9rem;
    line-height: 1.5;
}

.cs-description-input[b-cvxp1zmkc5] {
    resize: vertical;
}

.cs-fields-section[b-cvxp1zmkc5] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.cs-fields-header[b-cvxp1zmkc5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.cs-fields-header h3[b-cvxp1zmkc5] {
    font-size: 0.85rem;
    margin: 0;
}

.cs-field-row[b-cvxp1zmkc5] {
    display: grid;
    grid-template-columns: 1fr 1fr auto auto;
    align-items: center;
    gap: 0.5rem;
}

.cs-field-toggle-input[b-cvxp1zmkc5] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    font-size: 0.85rem;
}

.cs-field-remove[b-cvxp1zmkc5] {
    padding: 0.4rem 0.7rem;
    line-height: 1;
}

@media (max-width: 34rem) {
    .cs-field-row[b-cvxp1zmkc5] {
        grid-template-columns: 1fr 1fr;
    }
}

.cs-notes-header[b-cvxp1zmkc5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.cs-notes-toolbar[b-cvxp1zmkc5] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--border);
}

.cs-notes-toolbar .toolbar-group[b-cvxp1zmkc5] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.cs-notes-toolbar .toolbar-group[b-cvxp1zmkc5]::after {
    content: "";
    display: block;
    width: 1px;
    height: 1.1rem;
    margin-left: 0.65rem;
    background: var(--border);
}

.cs-notes-toolbar .toolbar-group:last-child[b-cvxp1zmkc5]::after {
    display: none;
}

.cs-notes-toolbar button[b-cvxp1zmkc5] {
    min-width: 1.9rem;
    height: 1.9rem;
    padding: 0 0.5rem;
    border: 1px solid var(--border);
    border-radius: 0.4rem;
    background: var(--bg-alt);
    color: var(--text);
    font-size: 0.8rem;
    line-height: 1;
    cursor: pointer;
}

.cs-notes-toolbar button:hover[b-cvxp1zmkc5] {
    background: var(--bg);
}

.cs-notes-toolbar .fmt-bold[b-cvxp1zmkc5] {
    font-weight: 700;
}

.cs-notes-toolbar .fmt-italic[b-cvxp1zmkc5] {
    font-style: italic;
}

.cs-notes-toolbar .color-group .color-swatch[b-cvxp1zmkc5] {
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    padding: 0;
    cursor: pointer;
}

.cs-notes-body[b-cvxp1zmkc5] {
    padding-left: 0.75rem;
}

.cs-notes-body.editing[b-cvxp1zmkc5] {
    display: flex;
    align-items: stretch;
    gap: 1.5rem;
}

.cs-notes-body.editing .cs-notes-textarea[b-cvxp1zmkc5] {
    flex: 1;
    min-width: 0;
}

.cs-notes-body.editing .prose[b-cvxp1zmkc5] {
    flex: 1;
    min-width: 0;
    overflow-y: auto;
    max-height: 24rem;
    padding-left: 1.5rem;
    border-left: 1px solid var(--border);
}

.cs-notes-textarea[b-cvxp1zmkc5] {
    width: 100%;
    box-sizing: border-box;
    min-height: 14rem;
    resize: vertical;
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: 0.75rem;
    background: var(--bg-alt);
    color: var(--text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.9rem;
    line-height: 1.6;
}

.hidden[b-cvxp1zmkc5] {
    display: none;
}

/* Rendered markdown content — injected via MarkupString, so ::deep is
   required for every rule here (same pattern as NoteEditor.razor.css). */

.prose[b-cvxp1zmkc5] {
    color: var(--text);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.75;
    font-size: 0.9rem;
}

.prose.solo[b-cvxp1zmkc5] {
    max-width: 100%;
}

.prose[b-cvxp1zmkc5]  p {
    margin: 0 0 1rem;
}

.prose[b-cvxp1zmkc5]  a.wikilink {
    color: var(--accent-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.prose[b-cvxp1zmkc5]  a.wikilink.unresolved {
    color: var(--muted);
    border-bottom: 1px dashed var(--muted);
    text-decoration: none;
}

.prose[b-cvxp1zmkc5]  img {
    max-width: 100%;
    /* Same reasoning as NoteEditor.razor.css's identical rule: caps how
       tall a portrait/high-resolution upload can render, since this form
       is meant to stay compact rather than grow to fit a full-size photo. */
    max-height: 20rem;
    border-radius: 0.6rem;
    margin: 1rem 0;
}

.prose[b-cvxp1zmkc5]  code {
    background: var(--bg-alt);
    padding: 0.15rem 0.4rem;
    border-radius: 0.35rem;
    font-size: 0.9em;
}

.prose[b-cvxp1zmkc5]  pre {
    background: var(--navy);
    color: #f3f1ec;
    padding: 0.85rem 1rem;
    border-radius: 0.6rem;
    overflow-x: auto;
    margin: 0 0 1rem;
}

.prose[b-cvxp1zmkc5]  pre code {
    background: none;
    padding: 0;
    color: inherit;
}

.prose[b-cvxp1zmkc5]  ul,
.prose[b-cvxp1zmkc5]  ol {
    margin: 0 0 1rem;
    padding-left: 1.25rem;
}

@media (max-width: 40rem) {
    .cs-notes-body.editing[b-cvxp1zmkc5] {
        flex-direction: column;
    }

    .cs-notes-body.editing .prose[b-cvxp1zmkc5] {
        max-height: none;
        padding-left: 0;
        padding-top: 1rem;
        border-left: none;
        border-top: 1px solid var(--border);
    }
}
/* /Components/Pages/Dashboard.razor.rz.scp.css */
.dashboard-page[b-hzwn7cb77k] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.dashboard-main[b-hzwn7cb77k] {
    flex: 1;
    max-width: 72rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.dashboard-main h1[b-hzwn7cb77k] {
    font-size: 1.5rem;
    line-height: 1.6;
}

.dashboard-main .section-sub[b-hzwn7cb77k] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin-bottom: 3rem;
}

.dashboard-layout[b-hzwn7cb77k] {
    display: grid;
    grid-template-columns: 1fr 19rem;
    align-items: start;
    gap: 2.5rem;
}

.dashboard-sidebar[b-hzwn7cb77k] {
    min-width: 0;
}

.recent-section h2[b-hzwn7cb77k] {
    font-size: 0.85rem;
    line-height: 1.6;
    margin-bottom: 1rem;
}

.recent-list[b-hzwn7cb77k] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.recent-item[b-hzwn7cb77k] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.recent-item:hover[b-hzwn7cb77k] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
}

.recent-item-icon[b-hzwn7cb77k] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius-sm);
    color: #fff;
}

.recent-item-icon-kanban[b-hzwn7cb77k] { background: var(--accent-dev); }
.recent-item-icon-notes[b-hzwn7cb77k] { background: var(--accent-game); }
.recent-item-icon-moodboard[b-hzwn7cb77k] { background: var(--accent-art); }

.recent-item-body[b-hzwn7cb77k] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.recent-item-title[b-hzwn7cb77k] {
    font-size: 0.9rem;
    color: var(--text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.recent-item-meta[b-hzwn7cb77k] {
    font-size: 0.78rem;
    color: var(--muted);
}

.tile-section-heading[b-hzwn7cb77k] {
    font-size: 0.85rem;
    line-height: 1.6;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
    margin-bottom: 1.25rem;
}

.tile-divider[b-hzwn7cb77k] {
    border: none;
    border-top: 1px solid var(--border);
    margin: 2.5rem 0;
}

.tile-grid[b-hzwn7cb77k] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 1.5rem;
}

.tile[b-hzwn7cb77k] {
    position: relative;
    display: block;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 1.75rem;
    background: var(--bg-alt);
    transition: box-shadow 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
}

.tile:hover[b-hzwn7cb77k] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
    border-color: var(--accent);
}

.tile-disabled[b-hzwn7cb77k] {
    cursor: default;
    opacity: 0.7;
}

.tile-disabled:hover[b-hzwn7cb77k] {
    box-shadow: none;
    transform: none;
    border-color: var(--border);
}

.tile-icon[b-hzwn7cb77k] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: var(--radius-sm);
    color: #fff;
    margin-bottom: 1.25rem;
}

.tile-icon-kanban[b-hzwn7cb77k] { background: var(--accent-dev); }
.tile-icon-notes[b-hzwn7cb77k] { background: var(--accent-game); }
.tile-icon-moodboard[b-hzwn7cb77k] { background: var(--accent-art); }
.tile-icon-blog[b-hzwn7cb77k] { background: var(--accent); }
.tile-icon-work[b-hzwn7cb77k] { background: var(--accent-art); }
.tile-icon-assets[b-hzwn7cb77k] { background: var(--accent-dark); }
.tile-icon-users[b-hzwn7cb77k] { background: var(--navy); }

.tile h2[b-hzwn7cb77k] {
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 0.5rem;
}

.tile p[b-hzwn7cb77k] {
    color: var(--muted);
    font-size: 0.9rem;
    margin: 0;
}

.coming-soon[b-hzwn7cb77k] {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
    background: var(--bg);
    border-radius: var(--radius-sm);
    padding: 0.25rem 0.7rem;
    margin-top: 1rem;
}

@media (max-width: 56rem) {
    .dashboard-layout[b-hzwn7cb77k] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 40rem) {
    .dashboard-main[b-hzwn7cb77k] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/Error.razor.rz.scp.css */
.list-page[b-8y1ce499hq] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.list-main[b-8y1ce499hq] {
    flex: 1;
    max-width: 42rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.list-main h1[b-8y1ce499hq] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.75rem;
}

.list-main .section-sub[b-8y1ce499hq] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin: 0.75rem 0 1.5rem;
}

.error-heading[b-8y1ce499hq] {
    color: var(--accent-game);
}

.list-main h3[b-8y1ce499hq] {
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 2rem 0 0.75rem;
}

.list-main code[b-8y1ce499hq] {
    background: var(--bg-alt);
    padding: 0.15rem 0.4rem;
    border-radius: 0.35rem;
    font-size: 0.9em;
}

.list-main .back-link[b-8y1ce499hq] {
    display: inline-block;
    margin-top: 1.5rem;
}

@media (max-width: 40rem) {
    .list-main[b-8y1ce499hq] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Hero */

.hero[b-899mamw5qu] {
    max-width: 46rem;
    margin: 0 auto;
    padding: 6rem 2rem 5.5rem;
}

.hero h1[b-899mamw5qu] {
    font-size: clamp(1.1rem, 2.8vw, 1.6rem);
    font-weight: 400;
    line-height: 1.6;
}

.hero-sub[b-899mamw5qu] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 1.15rem;
    max-width: 34rem;
    margin: 0 0 2.2rem;
}

.hero-actions[b-899mamw5qu] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

/* Sections */

section[b-899mamw5qu] {
    max-width: 64rem;
    margin: 0 auto;
    padding: 4.5rem 2rem;
}

section h2[b-899mamw5qu] {
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 1.6;
}

.section-sub[b-899mamw5qu] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin-top: -0.75rem;
    margin-bottom: 2rem;
}

.about[b-899mamw5qu] {
    background: var(--bg-alt);
    max-width: none;
}

.about-inner[b-899mamw5qu] {
    max-width: 64rem;
    margin: 0 auto;
}

/* Direct-child combinator on purpose: the pillar cards' <p> tags are also
   descendants of .about-inner (nested under .pillars), and a plain
   descendant selector here would silently pull them onto Silkscreen too. */
.about-inner > p[b-899mamw5qu] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    max-width: 42rem;
    font-size: 1.05rem;
}

.pillars[b-899mamw5qu] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    align-items: stretch;
    gap: 2rem;
    margin-top: 2.5rem;
}

/* Grid items stretch to the row's tallest card by default, so a flex column
   here plus margin-top: auto on the icon pins it to the bottom of that
   shared height — the icons line up regardless of how much each pillar's
   own text wraps to. */
.pillar[b-899mamw5qu] {
    display: flex;
    flex-direction: column;
}

.pillar-tag[b-899mamw5qu] {
    display: block;
    font-family: "Press Start 2P", "Inter", sans-serif;
    font-weight: 400;
    font-size: 0.85rem;
    letter-spacing: -0.05em;
    word-spacing: -0.3em;
    margin-bottom: 0.5rem;
}

.pillar p[b-899mamw5qu] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 0.95rem;
    margin: 0 0 1rem;
    max-width: none;
}

.pillar-image[b-899mamw5qu] {
    width: 4rem;
    height: 4rem;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    color: #fff;
}

.pillar-image-dev[b-899mamw5qu] { background: var(--accent-dev); }
.pillar-image-game[b-899mamw5qu] { background: var(--accent-game); }
.pillar-image-art[b-899mamw5qu] { background: var(--accent-art); }

/* Work — the star of the page */

.work-grid[b-899mamw5qu] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    gap: 2rem;
}

.section-more[b-899mamw5qu] {
    text-align: center;
    margin-top: 2.5rem;
}

.see-more[b-899mamw5qu] {
    display: inline-block;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--accent-dark);
}

.see-more:hover[b-899mamw5qu] {
    text-decoration: underline;
}

/* My Thoughts — article-style list */

.post-list[b-899mamw5qu] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

@media (max-width: 40rem) {
    .hero[b-899mamw5qu] {
        padding: 3.5rem 1.25rem 3.5rem;
    }

    section[b-899mamw5qu] {
        padding: 3rem 1.25rem;
    }
}
/* /Components/Pages/KanbanBoard.razor.rz.scp.css */
.board-page[b-vi6gf1rh3w] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-vi6gf1rh3w] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.board-main[b-vi6gf1rh3w] {
    flex: 1;
    padding: 4rem 2rem 5rem;
    box-sizing: border-box;
}

.board-main .eyebrow[b-vi6gf1rh3w] {
    display: inline-block;
    margin-top: 1rem;
}

.board-main h1[b-vi6gf1rh3w] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin: 0.75rem 0 2rem;
}

.columns-row[b-vi6gf1rh3w] {
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
    overflow-x: auto;
    padding-bottom: 1rem;
}

.kanban-column[b-vi6gf1rh3w] {
    flex: none;
    width: 18rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    overflow: hidden;
    box-sizing: border-box;
}

.column-block[b-vi6gf1rh3w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.9rem 1rem;
    background: var(--border);
}

.column-block h2[b-vi6gf1rh3w] {
    font-size: 0.8rem;
    line-height: 1.6;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.column-block-colored h2[b-vi6gf1rh3w] {
    color: #fff;
}

.column-block-colored .icon-btn[b-vi6gf1rh3w] {
    color: rgba(255, 255, 255, 0.85);
}

.column-block-colored .icon-btn:hover[b-vi6gf1rh3w] {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
}

.column-body[b-vi6gf1rh3w] {
    padding: 1rem 1.25rem 1.25rem;
}

.column-count[b-vi6gf1rh3w] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
    margin: 0 0 0.85rem;
}

.column-colors[b-vi6gf1rh3w] {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 1rem;
}

.color-swatch[b-vi6gf1rh3w] {
    width: 1rem;
    height: 1rem;
    border-radius: 3px;
    border: 2px solid transparent;
    cursor: pointer;
    padding: 0;
}

.color-swatch.active[b-vi6gf1rh3w] {
    border-color: var(--text);
}

.color-swatch-none[b-vi6gf1rh3w] {
    background: var(--bg);
    border: 1px solid var(--border);
}

.color-swatch-none.active[b-vi6gf1rh3w] {
    border: 2px solid var(--text);
}

.card-list[b-vi6gf1rh3w] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 1rem;
    min-height: 2rem;
}

.kanban-card[b-vi6gf1rh3w] {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg);
    padding: 0.85rem 2.2rem 0.85rem 0.85rem;
    cursor: pointer;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.kanban-card:hover[b-vi6gf1rh3w] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
}

.card-chip[b-vi6gf1rh3w] {
    flex: none;
    width: 1.4rem;
    height: 1.4rem;
    margin-top: 0.05rem;
    border-radius: 0.4rem;
    background: var(--border);
}

.card-chip-none[b-vi6gf1rh3w] {
    background: var(--bg-alt);
    border: 1px solid var(--border);
}

.kanban-card p[b-vi6gf1rh3w] {
    margin: 0;
    font-size: 0.9rem;
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--text);
    flex: 1;
    min-width: 0;
}

.card-delete[b-vi6gf1rh3w] {
    position: absolute;
    top: 0.5rem;
    right: 0.4rem;
    width: 1.5rem;
    height: 1.5rem;
}

.icon-btn[b-vi6gf1rh3w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border: none;
    border-radius: 999px;
    background: none;
    color: var(--muted);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    flex: none;
}

.icon-btn:hover[b-vi6gf1rh3w] {
    background: rgba(226, 27, 60, 0.1);
    color: var(--accent-game);
}

.new-column[b-vi6gf1rh3w] {
    flex: none;
    width: 18rem;
    border: 1px dashed var(--border);
    border-radius: var(--radius-md);
    padding: 1.25rem;
    box-sizing: border-box;
}

.new-column-label[b-vi6gf1rh3w] {
    display: block;
    font-family: "Press Start 2P", "Inter", sans-serif;
    font-weight: 400;
    font-size: 0.65rem;
    letter-spacing: -0.05em;
    word-spacing: -0.3em;
    color: var(--muted);
    margin-bottom: 0.85rem;
}

[b-vi6gf1rh3w] .inline-add-form {
    flex-direction: column;
}

@media (max-width: 40rem) {
    .board-main[b-vi6gf1rh3w] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/KanbanBoards.razor.rz.scp.css */
.kanban-list-page[b-ej8iw41qjp] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-ej8iw41qjp] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.kanban-list-main[b-ej8iw41qjp] {
    flex: 1;
    max-width: 56rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.kanban-list-main h1[b-ej8iw41qjp] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.75rem;
}

.kanban-list-main .eyebrow[b-ej8iw41qjp] {
    display: inline-block;
    margin-top: 1.5rem;
}

[b-ej8iw41qjp] .inline-add-form {
    max-width: 26rem;
    margin: 2rem 0 2.5rem;
}

.board-grid[b-ej8iw41qjp] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1.25rem;
}

.board-card[b-ej8iw41qjp] {
    position: relative;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.board-card:hover[b-ej8iw41qjp] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
}

.board-card-link[b-ej8iw41qjp] {
    display: block;
    padding: 1.5rem;
}

.board-card-link h2[b-ej8iw41qjp] {
    font-size: 0.9rem;
    line-height: 1.6;
    margin-bottom: 0.4rem;
}

.board-card-link p[b-ej8iw41qjp] {
    color: var(--muted);
    font-size: 0.85rem;
    margin: 0;
}

.icon-btn[b-ej8iw41qjp] {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    border: none;
    border-radius: 999px;
    background: none;
    color: var(--muted);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.icon-btn:hover[b-ej8iw41qjp] {
    background: rgba(226, 27, 60, 0.1);
    color: var(--accent-game);
}

@media (max-width: 40rem) {
    .kanban-list-main[b-ej8iw41qjp] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/Login.razor.rz.scp.css */
.login-page[b-mfjpxtzq9s] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.login-main[b-mfjpxtzq9s] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4rem 1.5rem;
}

.login-card[b-mfjpxtzq9s] {
    width: 100%;
    max-width: 26rem;
    text-align: center;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 2.5rem 2rem;
    background: var(--bg-alt);
}

.login-card h1[b-mfjpxtzq9s] {
    font-size: 1.4rem;
    line-height: 1.6;
}

.login-sub[b-mfjpxtzq9s] {
    color: var(--muted);
    margin: 0 0 2rem;
}

[b-mfjpxtzq9s] .login-form {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    text-align: left;
}

.field[b-mfjpxtzq9s] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
}

.field[b-mfjpxtzq9s]  input {
    font-family: "Inter", sans-serif;
    font-size: 1rem;
    font-weight: 400;
    padding: 0.75rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg);
    color: var(--text);
    width: 100%;
    box-sizing: border-box;
}

.field[b-mfjpxtzq9s]  input:focus {
    outline: none;
    border-color: var(--accent);
}

.field-checkbox[b-mfjpxtzq9s] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
}

.field-checkbox[b-mfjpxtzq9s]  input {
    width: 1.05rem;
    height: 1.05rem;
    accent-color: var(--accent);
}

.login-status[b-mfjpxtzq9s] {
    font-size: 0.85rem;
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.12);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.9rem;
    margin: 0;
}

.login-submit[b-mfjpxtzq9s] {
    justify-content: center;
    margin-top: 0.5rem;
}

.back-link[b-mfjpxtzq9s] {
    margin-top: 2rem;
}
/* /Components/Pages/MoodboardBoard.razor.rz.scp.css */
.moodboard-page[b-8fof9gpdrr] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    box-sizing: border-box;
    overflow: hidden;
}

.moodboard-not-found[b-8fof9gpdrr] {
    padding: 4rem 2rem;
}

.section-sub[b-8fof9gpdrr] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.moodboard-toolbar[b-8fof9gpdrr] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.25rem 2rem;
    flex: none;
}

.moodboard-toolbar h1[b-8fof9gpdrr] {
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
    flex: 1;
}

.toolbar-actions[b-8fof9gpdrr] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.toolbar-actions .btn[b-8fof9gpdrr] {
    padding: 0.6rem 1.1rem;
    font-size: 0.6rem;
}

.toolbar-actions .danger[b-8fof9gpdrr] {
    color: var(--accent-game);
}

.toolbar-actions .btn:disabled[b-8fof9gpdrr] {
    opacity: 0.4;
    cursor: not-allowed;
    transform: none;
}

.toolbar-actions .btn:disabled:hover[b-8fof9gpdrr] {
    transform: none;
    border-color: var(--border);
}

.moodboard-body[b-8fof9gpdrr] {
    position: relative;
    flex: 1;
    display: flex;
    min-height: 0;
}

.moodboard-rail[b-8fof9gpdrr] {
    flex: none;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.75rem 0.5rem;
    border-right: 1px solid var(--border);
    background: var(--bg);
}

.rail-btn[b-8fof9gpdrr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid transparent;
    border-radius: 0.6rem;
    background: none;
    color: var(--text);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.rail-btn:hover[b-8fof9gpdrr] {
    background: var(--bg-alt);
}

.rail-btn.active[b-8fof9gpdrr] {
    background: var(--bg-alt);
    border-color: var(--accent);
    color: var(--accent-dark);
}

.rail-popover[b-8fof9gpdrr] {
    position: absolute;
    top: 0.75rem;
    left: 4rem;
    z-index: 20;
    width: 18rem;
    max-width: calc(100vw - 5rem);
    box-sizing: border-box;
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: 0.75rem;
    background: var(--bg);
    box-shadow: 0 8px 24px rgba(43, 43, 43, 0.12);
}

.rail-popover h4[b-8fof9gpdrr] {
    margin: 0 0 0.75rem;
    font-size: 0.75rem;
    line-height: 1.4;
}

/* NoteSearchBox's results/recent list defaults to a floating absolute
   overlay (right for a page-level search box), which doesn't work inside
   this fixed-size popover — the popover's own box doesn't grow to contain
   an absolutely-positioned child, so the list visually spilled out past
   the popover's rounded border instead of looking contained in it. Pulling
   it back into normal flow (::deep reaches into the child component's own
   scoped markup) lets the popover grow to fit it instead, with a capped
   height + scroll as a safety net if a search ever returns many results. */
.rail-popover[b-8fof9gpdrr]  .note-search-results {
    position: static;
    margin-top: 0.5rem;
    max-height: 12rem;
    overflow-y: auto;
    box-shadow: none;
}

.image-popover-section[b-8fof9gpdrr] {
    margin-bottom: 0.85rem;
}

.image-popover-section label[b-8fof9gpdrr] {
    display: block;
    margin-bottom: 0.3rem;
    font-size: 0.75rem;
    color: var(--muted);
}

.image-popover-row[b-8fof9gpdrr] {
    display: flex;
    gap: 0.4rem;
}

.image-popover-row input[b-8fof9gpdrr] {
    flex: 1;
    min-width: 0;
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    background: var(--bg-alt);
    color: var(--text);
}

.rail-popover .btn-ghost[b-8fof9gpdrr] {
    margin-top: 0.75rem;
    padding: 0.4rem 0.8rem;
    font-size: 0.65rem;
}

.popover-error[b-8fof9gpdrr] {
    margin: 0 0 0.75rem;
    color: var(--accent-game);
    font-size: 0.8rem;
}

.draw-toolbar[b-8fof9gpdrr] {
    position: absolute;
    top: 0.75rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 21;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--border);
    border-radius: 0.75rem;
    background: var(--bg);
    box-shadow: 0 8px 24px rgba(43, 43, 43, 0.12);
}

.draw-toolbar-group[b-8fof9gpdrr] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.draw-toolbar-divider[b-8fof9gpdrr] {
    width: 1px;
    height: 1.5rem;
    background: var(--border);
}

.draw-tool-btn[b-8fof9gpdrr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    background: none;
    color: var(--text);
    cursor: pointer;
}

.draw-tool-btn:hover[b-8fof9gpdrr] {
    background: var(--bg-alt);
}

.draw-tool-btn.active[b-8fof9gpdrr] {
    background: var(--bg-alt);
    border-color: var(--accent);
    color: var(--accent-dark);
}

.brush-size-btn[b-8fof9gpdrr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    background: none;
    cursor: pointer;
}

.brush-size-btn:hover[b-8fof9gpdrr] {
    background: var(--bg-alt);
}

.brush-size-btn.active[b-8fof9gpdrr] {
    border-color: var(--accent);
    background: var(--bg-alt);
}

.brush-dot[b-8fof9gpdrr] {
    display: block;
    border-radius: 999px;
    background: var(--text);
}

.color-swatch[b-8fof9gpdrr] {
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 999px;
    border: 2px solid transparent;
    cursor: pointer;
    padding: 0;
}

.color-swatch.active[b-8fof9gpdrr] {
    border-color: var(--text);
}

.color-swatch-none[b-8fof9gpdrr] {
    background: var(--bg);
    border: 1px solid var(--border);
}

.color-swatch-none.active[b-8fof9gpdrr] {
    border: 2px solid var(--text);
}

.header-color-swatches[b-8fof9gpdrr] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

@media (max-width: 40rem) {
    .draw-toolbar[b-8fof9gpdrr] {
        left: 0.75rem;
        right: 0.75rem;
        transform: none;
        flex-wrap: wrap;
        justify-content: center;
    }
}

.board-viewport[b-8fof9gpdrr] {
    position: relative;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    background-color: var(--bg-alt);
    background-image: radial-gradient(circle, var(--border) 1px, transparent 1px);
    background-size: 24px 24px;
    touch-action: none;
    cursor: grab;
    /* Without this, dragging to move/draw/resize anything whose path
       crosses text or an image triggers the browser's native
       text/image-selection highlight — the custom pointer-capture gestures
       below don't stop that on their own. Doesn't affect the .card-text
       textarea: user-select:none on an ancestor never disables editing
       inside a form control. */
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

/* tabindex="0" so it can hold keyboard focus for shortcuts (see
   MoodboardBoard.razor.js's viewportEl.focus() calls) — no visible focus
   state makes sense here since selection is already shown on cards
   themselves, so the browser's default ring is just noise. */
.board-viewport:focus[b-8fof9gpdrr] {
    outline: none;
}

.board-viewport:active[b-8fof9gpdrr] {
    cursor: grabbing;
}

.board-viewport.drawing-mode[b-8fof9gpdrr],
.board-viewport.drawing-mode:active[b-8fof9gpdrr] {
    cursor: crosshair;
}

.board-canvas[b-8fof9gpdrr] {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    transform-origin: 0 0;
}

.board-drawing-layer[b-8fof9gpdrr] {
    position: absolute;
    top: 0;
    left: 0;
    overflow: visible;
    /* Purely a render target — gesture routing goes through the single
       delegated viewport listener via the boardDrawMode flag, not through
       this element, so it never needs to receive pointer events itself.
       That's also what lets clicks pass straight through to a card sitting
       under a drawn line when draw mode is off. */
    pointer-events: none;
    /* Above every card regardless of the cards' own z-index values (small,
       incrementing ints starting at 1) — annotations read as sitting on
       top, matching what they're usually drawn for (pointing at/circling
       something already on the board). */
    z-index: 999999;
}

.stroke-hit-target[b-8fof9gpdrr] {
    /* Only pointer-reachable while the erase tool is active (see the
       .erase-mode toggle applied from setDrawTool in the JS module) — the
       rest of the time these stay inert so they can't intercept normal
       clicks meant for whatever's underneath. */
    pointer-events: none;
}

/* Toggled on .board-canvas (the shared ancestor of both the board-level
   drawing layer and every card's drawing surface), so one flag covers
   erasing in both places. */
.board-canvas.erase-mode .stroke-hit-target[b-8fof9gpdrr] {
    pointer-events: stroke;
}

.board-card[b-8fof9gpdrr] {
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 0 0;
    border: 1px solid var(--border);
    border-radius: 0.75rem;
    background: var(--bg);
    box-shadow: 0 4px 14px rgba(43, 43, 43, 0.08);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.board-card.selected[b-8fof9gpdrr] {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px var(--accent);
}

.card-handle[b-8fof9gpdrr] {
    flex: none;
    height: 1.4rem;
    background: var(--bg-alt);
    border-bottom: 1px solid var(--border);
    cursor: grab;
}

.card-handle:active[b-8fof9gpdrr] {
    cursor: grabbing;
}

.card-text[b-8fof9gpdrr] {
    flex: 1;
    border: none;
    outline: none;
    resize: none;
    padding: 0.6rem 0.75rem;
    font-family: inherit;
    font-size: 0.85rem;
    color: var(--text);
    background: transparent;
    box-sizing: border-box;
}

.card-note-preview[b-8fof9gpdrr] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 0.75rem 0.85rem;
    overflow: hidden;
    cursor: pointer;
}

.card-note-preview strong[b-8fof9gpdrr] {
    font-size: 0.85rem;
    color: var(--text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.card-note-preview span[b-8fof9gpdrr] {
    font-size: 0.75rem;
    color: var(--muted);
}

.card-note-preview span.missing[b-8fof9gpdrr] {
    color: var(--accent-game);
}

/* Character Sheet cards get a distinct "trading card" frame — a double
   border, applied on the outer .board-card itself (not just the inner
   content) so the frame shows even when the thumbnail bleeds to the edges.
   Color comes from --cs-accent, an inline custom property set per-card in
   the markup from the card's own HeaderColor (the same color already used
   for its drag-handle stripe) so the frame/banner/toggle dots all pick up
   whatever color the user assigned that card, falling back to the site's
   amber "art" accent when no HeaderColor is set. */
.board-card.card-character[b-8fof9gpdrr] {
    border: 1px solid var(--cs-accent, var(--accent-art));
    border-radius: 0.6rem;
    background: var(--bg);
    box-shadow: inset 0 0 0 3px var(--bg), inset 0 0 0 4px var(--cs-accent, var(--accent-art)), 0 4px 14px rgba(43, 43, 43, 0.1);
}

.card-character-preview[b-8fof9gpdrr] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0 0.7rem 0.6rem;
    overflow: hidden;
    cursor: pointer;
}

.cs-thumbnail[b-8fof9gpdrr] {
    width: calc(100% + 1.4rem);
    margin: 0 -0.7rem;
    height: 7.5rem;
    /* object-fit itself is set inline per-card (cover/contain, from
       ThumbnailFit) — this background only shows through on "contain",
       where the image doesn't fill the box (letterboxing). */
    background: var(--bg-alt);
    -webkit-user-drag: none;
    flex: none;
}

.cs-thumbnail-empty[b-8fof9gpdrr] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-alt);
    color: var(--muted);
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Nameplate banner — bleeds edge-to-edge like a card frame's title bar,
   set in the site's established pixel heading font (same convention as
   global h1-h3: negative letter/word-spacing compensates the glyphs'
   width) so a character card reads as game-ish at a glance. Background is
   a tint of --cs-accent (same low-opacity-over-page convention Kanban's
   own color-coded cards/columns already use — see KanbanService.ColorPalette's
   Tint field) rather than a solid fill, since --cs-accent can be any of the
   six arbitrary swatch colors and a solid fill would need per-color text
   contrast handling; the tint keeps text on the theme's normal --text
   color safely readable against every swatch. */
.cs-header[b-8fof9gpdrr] {
    display: block;
    width: calc(100% + 1.4rem);
    margin: 0 -0.7rem;
    padding: 0.35rem 0.7rem;
    box-sizing: border-box;
    background: color-mix(in srgb, var(--cs-accent, var(--accent-art)) 18%, var(--bg));
    border-bottom: 2px solid var(--cs-accent, var(--accent-art));
    color: var(--text);
    font-family: "Press Start 2P", "Inter", sans-serif;
    font-weight: 400;
    font-size: 0.6rem;
    letter-spacing: -0.04em;
    word-spacing: -0.3em;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Wraps the description text + its own resize handle. Height defaults to
   roughly two lines via CSS and is overridden inline (card.DescriptionHeight)
   once the user drags the handle — a per-field resize, distinct from the
   whole-card corner handle (.card-resize-handle). */
.cs-description-wrap[b-8fof9gpdrr] {
    position: relative;
    margin-top: 0.4rem;
    height: 2.35rem;
}

.cs-description[b-8fof9gpdrr] {
    display: block;
    width: 100%;
    height: 100%;
    font-size: 0.72rem;
    font-style: italic;
    line-height: 1.3;
    color: var(--muted);
    overflow: hidden;
}

.cs-description-resize-handle[b-8fof9gpdrr] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.4rem;
    height: 0.7rem;
    cursor: ns-resize;
    opacity: 0;
    transition: opacity 0.15s ease;
    touch-action: none;
}

.cs-description-resize-handle[b-8fof9gpdrr]::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 1.6rem;
    height: 3px;
    border-radius: 999px;
    background: var(--muted);
    transform: translate(-50%, -50%);
}

.board-card:hover .cs-description-resize-handle[b-8fof9gpdrr],
.board-card.selected .cs-description-resize-handle[b-8fof9gpdrr] {
    opacity: 1;
}

/* Stat block — each field on its own row rather than a tag cloud, so a
   custom field reads as part of the sheet ("Faction  Acrobats") instead of
   a generic label chip. */
.cs-field-list[b-8fof9gpdrr] {
    display: flex;
    flex-direction: column;
    margin-top: 0.4rem;
    padding-top: 0.3rem;
    border-top: 1px dashed var(--border);
}

.cs-stat-row[b-8fof9gpdrr] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.6rem;
    padding: 0.2rem 0;
    font-size: 0.68rem;
    border-bottom: 1px solid var(--border);
}

.cs-stat-row:last-child[b-8fof9gpdrr] {
    border-bottom: none;
}

.cs-stat-label[b-8fof9gpdrr] {
    color: var(--muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    flex-shrink: 0;
}

.cs-stat-value[b-8fof9gpdrr] {
    color: var(--text);
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cs-stat-toggle[b-8fof9gpdrr] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--text);
    flex-shrink: 0;
}

.cs-stat-toggle-dot[b-8fof9gpdrr] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 999px;
    background: var(--border);
    flex-shrink: 0;
}

.cs-stat-toggle-dot.on[b-8fof9gpdrr] {
    background: var(--cs-accent, var(--accent-art));
}

.card-image[b-8fof9gpdrr] {
    flex: 1;
    width: 100%;
    height: 100%;
    /* cover, not contain — contain letterboxes any image whose aspect
       ratio doesn't match the card's box, which read as a thick margin
       around the picture rather than the picture actually filling the
       card it's sized to. */
    object-fit: cover;
    background: var(--bg-alt);
    -webkit-user-drag: none;
}

.card-drawing-surface[b-8fof9gpdrr] {
    flex: 1;
    width: 100%;
    height: 100%;
    background: var(--bg);
    touch-action: none;
    cursor: crosshair;
}

.card-resize-handle[b-8fof9gpdrr] {
    /* Hit target is deliberately larger than the visible corner glyph
       (drawn by the border lines, which stay flush with the true corner) —
       .board-card clips overflow, so this can't extend past the card edge
       to grow the hit area; growing inward is the only option. */
    position: absolute;
    right: 0;
    bottom: 0;
    width: 1.4rem;
    height: 1.4rem;
    border-bottom: 2px solid var(--muted);
    border-right: 2px solid var(--muted);
    cursor: nwse-resize;
    opacity: 0;
    transition: opacity 0.15s ease;
    touch-action: none;
}

.board-card:hover .card-resize-handle[b-8fof9gpdrr],
.board-card.selected .card-resize-handle[b-8fof9gpdrr] {
    opacity: 1;
}

@media (max-width: 40rem) {
    .moodboard-toolbar[b-8fof9gpdrr] {
        padding: 1rem 1.25rem;
        flex-wrap: wrap;
    }
}
/* /Components/Pages/MoodboardList.razor.rz.scp.css */
.moodboard-list-page[b-if0vik252r] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-if0vik252r] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.moodboard-list-main[b-if0vik252r] {
    flex: 1;
    max-width: 56rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.moodboard-list-main h1[b-if0vik252r] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.75rem;
}

.moodboard-list-main .eyebrow[b-if0vik252r] {
    display: inline-block;
    margin-top: 1.5rem;
}

[b-if0vik252r] .inline-add-form {
    max-width: 26rem;
    margin: 2rem 0 2.5rem;
}

.tag-filters[b-if0vik252r] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.filter-chip[b-if0vik252r] {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--muted);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 0.35rem 0.9rem;
    background: none;
    font-family: inherit;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.filter-chip:hover[b-if0vik252r] {
    border-color: var(--accent);
    color: var(--text);
}

.filter-chip.active[b-if0vik252r] {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}

.board-grid[b-if0vik252r] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1.25rem;
}

.board-card[b-if0vik252r] {
    position: relative;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.board-card:hover[b-if0vik252r] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
}

.board-card-link[b-if0vik252r] {
    display: block;
    padding: 1.5rem 1.5rem 0.5rem;
}

.board-card-link h2[b-if0vik252r] {
    font-size: 0.9rem;
    line-height: 1.6;
    margin-bottom: 0.4rem;
}

.board-card-link p[b-if0vik252r] {
    color: var(--muted);
    font-size: 0.85rem;
    margin: 0;
}

.board-card-tags-input[b-if0vik252r] {
    display: block;
    width: calc(100% - 3rem);
    margin: 0 1.5rem 1.25rem;
    box-sizing: border-box;
    padding: 0.3rem 0.5rem;
    border: 1px solid transparent;
    border-radius: 0.35rem;
    background: transparent;
    color: var(--muted);
    font-family: inherit;
    font-size: 0.78rem;
}

.board-card-tags-input:hover[b-if0vik252r],
.board-card-tags-input:focus[b-if0vik252r] {
    border-color: var(--border);
    background: var(--bg);
    outline: none;
}

.icon-btn[b-if0vik252r] {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    border: none;
    border-radius: 999px;
    background: none;
    color: var(--muted);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.icon-btn:hover[b-if0vik252r] {
    background: rgba(226, 27, 60, 0.1);
    color: var(--accent-game);
}

@media (max-width: 40rem) {
    .moodboard-list-main[b-if0vik252r] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/MyAssets.razor.rz.scp.css */
.assets-page[b-df06vcjz8j] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-df06vcjz8j] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.assets-main[b-df06vcjz8j] {
    flex: 1;
    max-width: 56rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.assets-main h1[b-df06vcjz8j] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.75rem;
}

.assets-main .eyebrow[b-df06vcjz8j] {
    display: inline-block;
    margin-top: 1.5rem;
}

.assets-upload[b-df06vcjz8j] {
    margin: 1.5rem 0 2rem;
}

.popover-error[b-df06vcjz8j] {
    color: var(--accent-game);
    font-size: 0.85rem;
    margin: 0.5rem 0 0;
}

.asset-grid[b-df06vcjz8j] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
    gap: 1rem;
}

.asset-card[b-df06vcjz8j] {
    position: relative;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    overflow: hidden;
    aspect-ratio: 1;
}

.asset-card img[b-df06vcjz8j] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.icon-btn[b-df06vcjz8j] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    border: none;
    border-radius: 999px;
    background: rgba(25, 26, 35, 0.55);
    color: #fff;
    cursor: pointer;
    transition: background 0.15s ease;
}

.icon-btn:hover[b-df06vcjz8j] {
    background: var(--accent-game);
}

@media (max-width: 40rem) {
    .assets-main[b-df06vcjz8j] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/NoteEditor.razor.rz.scp.css */
.note-editor-page[b-37ukzcq62g] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-37ukzcq62g] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.note-editor-main[b-37ukzcq62g] {
    flex: 1;
    max-width: 64rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.note-editor-main h1[b-37ukzcq62g] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin: 0;
}

.note-editor-toolbar[b-37ukzcq62g] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.5rem 0 1.25rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--border);
}

.toolbar-actions[b-37ukzcq62g] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.btn.danger[b-37ukzcq62g] {
    color: var(--accent-game);
}

.rename-form[b-37ukzcq62g] {
    display: flex;
    gap: 0.4rem;
}

.rename-form input[b-37ukzcq62g] {
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    background: var(--bg-alt);
    color: var(--text);
}

.note-tags-row[b-37ukzcq62g] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: -0.75rem 0 1.25rem;
}

.note-tags-row label[b-37ukzcq62g] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--muted);
    flex: none;
}

.note-tags-row input[b-37ukzcq62g] {
    flex: 1;
    max-width: 24rem;
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    background: var(--bg-alt);
    color: var(--text);
    font-size: 0.85rem;
}

.formatting-toolbar[b-37ukzcq62g] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--border);
}

.toolbar-group[b-37ukzcq62g] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.toolbar-group[b-37ukzcq62g]::after {
    content: "";
    display: block;
    width: 1px;
    height: 1.1rem;
    margin-left: 0.65rem;
    background: var(--border);
}

.toolbar-group:last-child[b-37ukzcq62g]::after {
    display: none;
}

.formatting-toolbar button[b-37ukzcq62g] {
    min-width: 1.9rem;
    height: 1.9rem;
    padding: 0 0.5rem;
    border: 1px solid var(--border);
    border-radius: 0.4rem;
    background: var(--bg-alt);
    color: var(--text);
    font-size: 0.8rem;
    line-height: 1;
    cursor: pointer;
}

.formatting-toolbar button:hover[b-37ukzcq62g] {
    background: var(--bg);
}

.formatting-toolbar .fmt-bold[b-37ukzcq62g] {
    font-weight: 700;
}

.formatting-toolbar .fmt-italic[b-37ukzcq62g] {
    font-style: italic;
}

.color-group .color-swatch[b-37ukzcq62g] {
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    padding: 0;
    cursor: pointer;
}

.note-editor-body[b-37ukzcq62g] {
    padding-left: 0.75rem;
}

.note-editor-body.editing[b-37ukzcq62g] {
    display: flex;
    align-items: stretch;
    gap: 1.5rem;
}

.note-editor-body.editing .note-textarea[b-37ukzcq62g] {
    flex: 1;
    min-width: 0;
}

.note-editor-body.editing .prose[b-37ukzcq62g] {
    flex: 1;
    min-width: 0;
    overflow-y: auto;
    max-height: 32rem;
    padding-left: 1.5rem;
    border-left: 1px solid var(--border);
}

.note-textarea[b-37ukzcq62g] {
    width: 100%;
    box-sizing: border-box;
    min-height: 24rem;
    resize: vertical;
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: 0.75rem;
    background: var(--bg-alt);
    color: var(--text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.9rem;
    line-height: 1.6;
}

.hidden[b-37ukzcq62g] {
    display: none;
}

/* Rendered markdown content — injected via MarkupString, so ::deep is
   required for every rule here (see BlogPostPage.razor.css for the same
   pattern). */

.prose[b-37ukzcq62g] {
    color: var(--text);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.75;
}

.prose.solo[b-37ukzcq62g] {
    max-width: 42rem;
    margin: 0 auto;
}

.prose[b-37ukzcq62g]  p {
    margin: 0 0 1.2rem;
}

.prose[b-37ukzcq62g]  a.wikilink {
    color: var(--accent-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.prose[b-37ukzcq62g]  a.wikilink.unresolved {
    color: var(--muted);
    border-bottom: 1px dashed var(--muted);
    text-decoration: none;
}

.prose[b-37ukzcq62g]  h2,
.prose[b-37ukzcq62g]  h3 {
    margin-top: 2rem;
}

.prose[b-37ukzcq62g]  img {
    max-width: 100%;
    /* Caps how tall an inserted image can render — max-width alone doesn't
       stop a portrait-oriented or very-high-resolution upload (e.g. a
       3000x4000 photo) from stretching the page far past what's needed to
       preview it. No explicit width/height is ever set on these <img> tags
       (they come straight from markdown ![]()), so max-height alongside
       max-width shrinks proportionally — no distortion, no object-fit needed. */
    max-height: 24rem;
    border-radius: 0.75rem;
    margin: 1.5rem 0;
}

.prose[b-37ukzcq62g]  code {
    background: var(--bg-alt);
    padding: 0.15rem 0.4rem;
    border-radius: 0.35rem;
    font-size: 0.9em;
}

.prose[b-37ukzcq62g]  pre {
    background: var(--navy);
    color: #f3f1ec;
    padding: 1rem 1.25rem;
    border-radius: 0.75rem;
    overflow-x: auto;
    margin: 0 0 1.2rem;
}

.prose[b-37ukzcq62g]  pre code {
    background: none;
    padding: 0;
    color: inherit;
}

.prose[b-37ukzcq62g]  ul,
.prose[b-37ukzcq62g]  ol {
    margin: 0 0 1.2rem;
    padding-left: 1.4rem;
}

@media (max-width: 48rem) {
    .note-editor-body.editing[b-37ukzcq62g] {
        flex-direction: column;
    }

    .note-editor-body.editing .prose[b-37ukzcq62g] {
        max-height: none;
        padding-left: 0;
        padding-top: 1.25rem;
        border-left: none;
        border-top: 1px solid var(--border);
    }
}

@media (max-width: 40rem) {
    .note-editor-main[b-37ukzcq62g] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/NotesList.razor.rz.scp.css */
.notes-list-page[b-m84kq1zobn] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-m84kq1zobn] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.notes-list-main[b-m84kq1zobn] {
    flex: 1;
    max-width: 72rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.notes-layout[b-m84kq1zobn] {
    display: grid;
    grid-template-columns: 1fr 19rem;
    align-items: start;
    gap: 2.5rem;
}

.notes-sidebar[b-m84kq1zobn] {
    min-width: 0;
}

.recent-section h2[b-m84kq1zobn] {
    font-size: 0.85rem;
    line-height: 1.6;
    margin-bottom: 1rem;
}

.recent-list[b-m84kq1zobn] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.recent-item[b-m84kq1zobn] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.recent-item:hover[b-m84kq1zobn] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
}

.recent-item-icon[b-m84kq1zobn] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius-sm);
    color: #fff;
    background: var(--accent-game);
}

.recent-item-body[b-m84kq1zobn] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.recent-item-title[b-m84kq1zobn] {
    font-size: 0.9rem;
    color: var(--text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.recent-item-meta[b-m84kq1zobn] {
    font-size: 0.78rem;
    color: var(--muted);
}

@media (max-width: 56rem) {
    .notes-layout[b-m84kq1zobn] {
        grid-template-columns: 1fr;
    }
}

.notes-list-main h1[b-m84kq1zobn] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.75rem;
}

.notes-list-main .eyebrow[b-m84kq1zobn] {
    display: inline-block;
    margin-top: 1.5rem;
}

[b-m84kq1zobn] .inline-add-form {
    max-width: 26rem;
    margin: 0.75rem 0 2.5rem;
}

.note-type-toggle[b-m84kq1zobn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1.5rem;
}

.note-type-toggle-label[b-m84kq1zobn] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--muted);
}

.note-type-toggle .btn[b-m84kq1zobn] {
    padding: 0.5rem 0.9rem;
}

.note-type-toggle .btn.active[b-m84kq1zobn] {
    border-color: var(--accent);
    color: var(--accent-dark);
}

.tag-filters[b-m84kq1zobn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 1.25rem 0;
}

.filter-chip[b-m84kq1zobn] {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--muted);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 0.35rem 0.9rem;
    background: none;
    font-family: inherit;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.filter-chip:hover[b-m84kq1zobn] {
    border-color: var(--accent);
    color: var(--text);
}

.filter-chip.active[b-m84kq1zobn] {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}

.note-card-tags[b-m84kq1zobn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.6rem;
}

.note-card-tags .tag[b-m84kq1zobn] {
    display: inline-block;
}

.tag-muted[b-m84kq1zobn] {
    color: var(--muted);
    background: var(--bg);
}

.note-grid[b-m84kq1zobn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1.25rem;
}

.note-card[b-m84kq1zobn] {
    display: block;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    padding: 1.5rem;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.note-card:hover[b-m84kq1zobn] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
}

.note-card h2[b-m84kq1zobn] {
    font-size: 0.9rem;
    line-height: 1.6;
    margin-bottom: 0.4rem;
}

.note-card p[b-m84kq1zobn] {
    color: var(--muted);
    font-size: 0.85rem;
    margin: 0;
}

@media (max-width: 40rem) {
    .notes-list-main[b-m84kq1zobn] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/NotFound.razor.rz.scp.css */
.list-page[b-rvsve87pgo] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.list-main[b-rvsve87pgo] {
    flex: 1;
    max-width: 42rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.list-main h1[b-rvsve87pgo] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.75rem;
}

.list-main .section-sub[b-rvsve87pgo] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin: 0.75rem 0 1.5rem;
}

@media (max-width: 40rem) {
    .list-main[b-rvsve87pgo] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/UsersAdmin.razor.rz.scp.css */
.content-list-page[b-mh22luz6av] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.content-list-main[b-mh22luz6av] {
    flex: 1;
    max-width: 56rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.content-list-main h1[b-mh22luz6av] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.75rem;
}

.content-list-main .eyebrow[b-mh22luz6av] {
    display: inline-block;
    margin-top: 1.5rem;
}

.section-sub[b-mh22luz6av] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

[b-mh22luz6av] .inline-add-form {
    max-width: 26rem;
    margin: 1.5rem 0 2rem;
}

.users-status[b-mh22luz6av] {
    font-size: 0.85rem;
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.12);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.9rem;
    margin: 0 0 1.5rem;
}

.users-status-error[b-mh22luz6av] {
    color: var(--accent-game);
    background: rgba(226, 27, 60, 0.1);
}

.setup-link-banner[b-mh22luz6av] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    font-size: 0.85rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    padding: 1rem 1.25rem;
    margin: 0 0 2rem;
}

.setup-link-banner code[b-mh22luz6av] {
    display: block;
    font-size: 0.8rem;
    word-break: break-all;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.8rem;
    user-select: all;
}

.users-table-wrap[b-mh22luz6av] {
    overflow-x: auto;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
}

.users-table[b-mh22luz6av] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.users-table th[b-mh22luz6av] {
    text-align: left;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.users-table td[b-mh22luz6av] {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}

.users-table tr:last-child td[b-mh22luz6av] {
    border-bottom: none;
}

.users-role-cell[b-mh22luz6av] {
    display: flex;
    gap: 0.4rem;
}

.role-tag[b-mh22luz6av] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-radius: var(--radius-sm);
    padding: 0.2rem 0.6rem;
}

.role-tag-owner[b-mh22luz6av] {
    color: var(--accent-art);
    background: rgba(232, 160, 32, 0.12);
}

.role-tag-admin[b-mh22luz6av] {
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.12);
}

.users-created-cell[b-mh22luz6av] {
    color: var(--muted);
    white-space: nowrap;
}

.users-actions[b-mh22luz6av] {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    white-space: nowrap;
}

.users-actions .btn[b-mh22luz6av] {
    padding: 0.5rem 0.9rem;
    font-size: 0.65rem;
}

@media (max-width: 40rem) {
    .content-list-main[b-mh22luz6av] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/WorkItemEditor.razor.rz.scp.css */
.content-editor-page[b-2ha2catof8] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-2ha2catof8] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.content-editor-main[b-2ha2catof8] {
    flex: 1;
    max-width: 42rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.content-editor-main h1[b-2ha2catof8] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin: 0.75rem 0;
}

.editor-toolbar[b-2ha2catof8] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.5rem 0 1.25rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--border);
}

.toolbar-actions[b-2ha2catof8] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.btn.danger[b-2ha2catof8] {
    color: var(--accent-game);
}

.status-badge[b-2ha2catof8] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-radius: var(--radius-sm);
    padding: 0.2rem 0.6rem;
}

.status-draft[b-2ha2catof8] {
    color: var(--muted);
    background: var(--bg-alt);
}

.status-published[b-2ha2catof8] {
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.12);
}

.editor-status[b-2ha2catof8] {
    font-size: 0.85rem;
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.12);
    border-radius: var(--radius-sm);
    padding: 0.6rem 0.9rem;
    margin: 0 0 1.25rem;
}

.field[b-2ha2catof8] {
    display: block;
    margin-bottom: 1.25rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
}

.field span[b-2ha2catof8] {
    display: block;
    margin-bottom: 0.4rem;
}

.field input[b-2ha2catof8],
.field select[b-2ha2catof8] {
    width: 100%;
    box-sizing: border-box;
    font-family: "Inter", sans-serif;
    font-size: 0.95rem;
    font-weight: 400;
    padding: 0.65rem 0.9rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    color: var(--text);
}

.field input:focus[b-2ha2catof8],
.field select:focus[b-2ha2catof8] {
    outline: none;
    border-color: var(--accent);
}

.field-row[b-2ha2catof8] {
    display: flex;
    gap: 1.25rem;
}

.field-row .field[b-2ha2catof8] {
    flex: 1;
    min-width: 0;
}

.field-date[b-2ha2catof8] {
    flex: 0 0 10rem;
}

.thumbnail-preview[b-2ha2catof8] {
    display: block;
    width: 100%;
    max-width: 20rem;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    margin-bottom: 0.75rem;
}

.popover-error[b-2ha2catof8] {
    margin: 0.5rem 0 0;
    color: var(--accent-game);
    font-size: 0.8rem;
}

.body-textarea[b-2ha2catof8] {
    width: 100%;
    box-sizing: border-box;
    min-height: 24rem;
    resize: vertical;
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    color: var(--text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.9rem;
    line-height: 1.6;
}

.body-textarea:focus[b-2ha2catof8] {
    outline: none;
    border-color: var(--accent);
}

/* Rendered markdown preview — injected via MarkupString, so ::deep is
   required for every rule here (same pattern as BlogPostPage.razor.css). */

.prose[b-2ha2catof8] {
    color: var(--text);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.75;
    min-height: 24rem;
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    box-sizing: border-box;
}

.prose[b-2ha2catof8]  p {
    margin: 0 0 1.2rem;
}

.prose[b-2ha2catof8]  a {
    color: var(--accent-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.prose[b-2ha2catof8]  h2,
.prose[b-2ha2catof8]  h3 {
    margin-top: 2rem;
}

.prose[b-2ha2catof8]  img {
    max-width: 100%;
    border-radius: 0.75rem;
    margin: 1.5rem 0;
}

.prose[b-2ha2catof8]  code {
    background: var(--bg);
    padding: 0.15rem 0.4rem;
    border-radius: 0.35rem;
    font-size: 0.9em;
}

.prose[b-2ha2catof8]  pre {
    background: var(--navy);
    color: #f3f1ec;
    padding: 1rem 1.25rem;
    border-radius: 0.75rem;
    overflow-x: auto;
    margin: 0 0 1.2rem;
}

.prose[b-2ha2catof8]  pre code {
    background: none;
    padding: 0;
    color: inherit;
}

@media (max-width: 40rem) {
    .content-editor-main[b-2ha2catof8] {
        padding: 3rem 1.25rem 3.5rem;
    }

    .field-row[b-2ha2catof8] {
        flex-direction: column;
        gap: 0;
    }

    .field-date[b-2ha2catof8] {
        flex: none;
    }
}
/* /Components/Pages/WorkItemPage.razor.rz.scp.css */
.work-item-page[b-m0ogena7y0] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.work-item-main[b-m0ogena7y0] {
    flex: 1;
}

.work-item[b-m0ogena7y0],
.work-item-missing[b-m0ogena7y0] {
    max-width: 42rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
}

.work-item h1[b-m0ogena7y0] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.5rem;
}

.work-item .card-tag[b-m0ogena7y0] {
    display: inline-block;
    margin-top: 1rem;
    font-size: 0.8rem;
    font-weight: 600;
}

.card-tag-dev[b-m0ogena7y0] { color: var(--accent-dev); }
.card-tag-game[b-m0ogena7y0] { color: var(--accent-game); }
.card-tag-art[b-m0ogena7y0] { color: var(--accent-art); }

.work-item .post-tags[b-m0ogena7y0] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin: 1rem 0 0.5rem;
}

.work-item-image[b-m0ogena7y0] {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    border-radius: var(--radius-md);
    margin-top: 1.5rem;
}

.work-item-missing p[b-m0ogena7y0] {
    color: var(--muted);
    margin: 0.75rem 0 1.5rem;
}

/* Rendered markdown content — injected via MarkupString, so these elements
   never receive a scope attribute at all; ::deep is required for every rule
   here (same pattern as BlogPostPage.razor.css). */

.prose[b-m0ogena7y0] {
    margin-top: 2rem;
    color: var(--text);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.75;
}

.prose[b-m0ogena7y0]  p {
    margin: 0 0 1.2rem;
}

.prose[b-m0ogena7y0]  a {
    color: var(--accent-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.prose[b-m0ogena7y0]  h2,
.prose[b-m0ogena7y0]  h3 {
    margin-top: 2rem;
}

.prose[b-m0ogena7y0]  code {
    background: var(--bg-alt);
    padding: 0.15rem 0.4rem;
    border-radius: 0.35rem;
    font-size: 0.9em;
}

.prose[b-m0ogena7y0]  pre {
    background: var(--navy);
    color: #f3f1ec;
    padding: 1rem 1.25rem;
    border-radius: 0.75rem;
    overflow-x: auto;
    margin: 0 0 1.2rem;
}

.prose[b-m0ogena7y0]  pre code {
    background: none;
    padding: 0;
    color: inherit;
}

.prose[b-m0ogena7y0]  blockquote {
    border-left: 3px solid var(--accent);
    margin: 0 0 1.2rem;
    padding: 0.25rem 1.25rem;
    color: var(--muted);
    font-style: italic;
}

.prose[b-m0ogena7y0]  ul,
.prose[b-m0ogena7y0]  ol {
    margin: 0 0 1.2rem;
    padding-left: 1.4rem;
}

.prose[b-m0ogena7y0]  li {
    margin-bottom: 0.4rem;
}

.prose[b-m0ogena7y0]  img {
    max-width: 100%;
    border-radius: 0.75rem;
    margin: 1.5rem 0;
}

.prose[b-m0ogena7y0]  hr {
    border: none;
    border-top: 1px solid var(--border);
    margin: 2rem 0;
}

@media (max-width: 40rem) {
    .work-item[b-m0ogena7y0],
    .work-item-missing[b-m0ogena7y0] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/WorkItemsAdmin.razor.rz.scp.css */
.content-list-page[b-whesd4vjro] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-whesd4vjro] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.content-list-main[b-whesd4vjro] {
    flex: 1;
    max-width: 56rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.content-list-main h1[b-whesd4vjro] {
    font-size: 1.5rem;
    line-height: 1.6;
    margin-top: 0.75rem;
}

.content-list-main .eyebrow[b-whesd4vjro] {
    display: inline-block;
    margin-top: 1.5rem;
}

[b-whesd4vjro] .inline-add-form {
    max-width: 26rem;
    margin: 1.5rem 0 2.5rem;
}

.content-grid[b-whesd4vjro] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1.25rem;
}

.content-card[b-whesd4vjro] {
    display: block;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
    padding: 1.5rem;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.content-card:hover[b-whesd4vjro] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
}

.content-card-badges[b-whesd4vjro] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.content-card h2[b-whesd4vjro] {
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 0.75rem 0 0.4rem;
}

.content-card p[b-whesd4vjro] {
    color: var(--muted);
    font-size: 0.85rem;
    margin: 0;
}

.status-badge[b-whesd4vjro] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-radius: var(--radius-sm);
    padding: 0.2rem 0.6rem;
}

.status-draft[b-whesd4vjro] {
    color: var(--muted);
    background: var(--bg);
}

.status-published[b-whesd4vjro] {
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.12);
}

.category-tag[b-whesd4vjro] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    border-radius: var(--radius-sm);
    padding: 0.2rem 0.6rem;
}

.category-tag-dev[b-whesd4vjro] { color: #fff; background: var(--accent-dev); }
.category-tag-game[b-whesd4vjro] { color: #fff; background: var(--accent-game); }
.category-tag-art[b-whesd4vjro] { color: #fff; background: var(--accent-art); }

@media (max-width: 40rem) {
    .content-list-main[b-whesd4vjro] {
        padding: 3rem 1.25rem 3.5rem;
    }
}
/* /Components/Pages/Works.razor.rz.scp.css */
.list-page[b-ysrvkew76a] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.section-sub[b-ysrvkew76a] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.list-main[b-ysrvkew76a] {
    flex: 1;
    max-width: 64rem;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
    width: 100%;
    box-sizing: border-box;
}

.list-main h1[b-ysrvkew76a] {
    font-size: 1.5rem;
    line-height: 1.6;
}

.search-form[b-ysrvkew76a] {
    display: flex;
    gap: 0.75rem;
    margin: 2rem 0 1.5rem;
    max-width: 32rem;
}

.search-form input[type="search"][b-ysrvkew76a] {
    flex: 1;
    font-family: "Inter", sans-serif;
    font-size: 1rem;
    padding: 0.75rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    color: var(--text);
}

.search-form input[type="search"]:focus[b-ysrvkew76a] {
    outline: none;
    border-color: var(--accent);
}

.category-filters[b-ysrvkew76a] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 2.5rem;
}

.filter-chip[b-ysrvkew76a] {
    display: inline-block;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--muted);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 0.4rem 1rem;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.filter-chip:hover[b-ysrvkew76a] {
    border-color: var(--accent);
    color: var(--text);
}

.filter-chip.active[b-ysrvkew76a] {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}

.work-grid[b-ysrvkew76a] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    gap: 2rem;
}

@media (max-width: 40rem) {
    .list-main[b-ysrvkew76a] {
        padding: 3rem 1.25rem 3.5rem;
    }

    .search-form[b-ysrvkew76a] {
        flex-direction: column;
        max-width: none;
    }
}
/* /Components/Shared/AssetPicker.razor.rz.scp.css */
.modal-backdrop[b-yel152k7ov] {
    position: fixed;
    inset: 0;
    background: rgba(25, 26, 35, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 50;
    padding: 2rem;
    box-sizing: border-box;
}

.modal-panel[b-yel152k7ov] {
    position: relative;
    width: 100%;
    max-width: 32rem;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 2rem;
    box-sizing: border-box;
}

.modal-close[b-yel152k7ov] {
    position: absolute;
    top: 1rem;
    right: 1rem;
}

.icon-btn[b-yel152k7ov] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border: none;
    border-radius: 999px;
    background: none;
    color: var(--muted);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    flex: none;
}

.icon-btn:hover[b-yel152k7ov] {
    background: rgba(226, 27, 60, 0.1);
    color: var(--accent-game);
}

.asset-picker-panel h3[b-yel152k7ov] {
    margin: 0 0 1rem;
}

.asset-picker-upload[b-yel152k7ov] {
    margin-bottom: 1.25rem;
}

.popover-error[b-yel152k7ov] {
    color: var(--accent-game, #c0392b);
    font-size: 0.85rem;
    margin: 0.5rem 0 0;
}

.asset-picker-grid[b-yel152k7ov] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(6rem, 1fr));
    gap: 0.6rem;
}

.asset-picker-thumb[b-yel152k7ov] {
    padding: 0;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm, 0.4rem);
    overflow: hidden;
    background: var(--bg-alt);
    cursor: pointer;
    aspect-ratio: 1;
    transition: border-color 0.15s ease;
}

.asset-picker-thumb:hover[b-yel152k7ov] {
    border-color: var(--accent);
}

.asset-picker-thumb img[b-yel152k7ov] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* /Components/Shared/BacklinksPanel.razor.rz.scp.css */
.backlinks-panel[b-0c0pq4rzu1] {
    border-top: 1px solid var(--border);
    padding-top: 1.5rem;
    margin-top: 2.5rem;
}

.section-sub[b-0c0pq4rzu1] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.backlinks-panel h3[b-0c0pq4rzu1] {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
    margin-bottom: 0.75rem;
}

.backlinks-panel ul[b-0c0pq4rzu1] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.backlinks-panel a[b-0c0pq4rzu1] {
    color: var(--accent-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
    font-size: 0.9rem;
}
/* /Components/Shared/CardDetailModal.razor.rz.scp.css */
.modal-backdrop[b-buynxyim7h] {
    position: fixed;
    inset: 0;
    background: rgba(25, 26, 35, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 50;
    padding: 2rem;
    box-sizing: border-box;
}

.modal-panel[b-buynxyim7h] {
    position: relative;
    width: 100%;
    max-width: 32rem;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 2rem;
    box-sizing: border-box;
}

.modal-close[b-buynxyim7h] {
    position: absolute;
    top: 1rem;
    right: 1rem;
}

.icon-btn[b-buynxyim7h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border: none;
    border-radius: 999px;
    background: none;
    color: var(--muted);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    flex: none;
}

.icon-btn:hover[b-buynxyim7h] {
    background: rgba(226, 27, 60, 0.1);
    color: var(--accent-game);
}

.modal-title[b-buynxyim7h] {
    display: block;
    width: 100%;
    font-family: "Press Start 2P", "Inter", sans-serif;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.6;
    letter-spacing: -0.05em;
    word-spacing: -0.3em;
    border: none;
    border-bottom: 1px solid transparent;
    background: none;
    color: var(--text);
    padding: 0 0 0.4rem;
    margin: 0 2.5rem 1.5rem 0;
    box-sizing: border-box;
}

.modal-title:focus[b-buynxyim7h] {
    outline: none;
    border-bottom-color: var(--accent);
}

.modal-section[b-buynxyim7h] {
    margin-bottom: 1.5rem;
}

.modal-label[b-buynxyim7h] {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.5rem;
}

.color-swatches[b-buynxyim7h] {
    display: flex;
    gap: 0.5rem;
}

.color-swatch[b-buynxyim7h] {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 3px;
    border: 2px solid transparent;
    cursor: pointer;
    padding: 0;
}

.color-swatch.active[b-buynxyim7h] {
    border-color: var(--text);
}

.color-swatch-none[b-buynxyim7h] {
    background: var(--bg-alt);
    border: 1px solid var(--border);
}

.color-swatch-none.active[b-buynxyim7h] {
    border: 2px solid var(--text);
}

.modal-description[b-buynxyim7h] {
    display: block;
    width: 100%;
    min-height: 5rem;
    font-family: "Inter", sans-serif;
    font-size: 0.9rem;
    padding: 0.75rem 1rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    color: var(--text);
    box-sizing: border-box;
    resize: vertical;
}

.modal-description:focus[b-buynxyim7h] {
    outline: none;
    border-color: var(--accent);
}

.modal-tags[b-buynxyim7h] {
    display: block;
    width: 100%;
    font-family: "Inter", sans-serif;
    font-size: 0.9rem;
    padding: 0.6rem 0.9rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    color: var(--text);
    box-sizing: border-box;
    margin-bottom: 0.6rem;
}

.modal-tags:focus[b-buynxyim7h] {
    outline: none;
    border-color: var(--accent);
}

.modal-tag-list[b-buynxyim7h] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.checklist[b-buynxyim7h] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.checklist-item[b-buynxyim7h] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.9rem;
}

.checklist-item input[type="checkbox"][b-buynxyim7h] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--accent);
}

.checklist-item span[b-buynxyim7h] {
    flex: 1;
    color: var(--text);
}

.checklist-item span.done[b-buynxyim7h] {
    color: var(--muted);
    text-decoration: line-through;
}
/* /Components/Shared/InlineAddForm.razor.rz.scp.css */
.inline-add-form[b-xtbcok3dz9] {
    display: flex;
    gap: 0.5rem;
}

.inline-add-form input[b-xtbcok3dz9] {
    flex: 1;
    font-family: "Inter", sans-serif;
    font-size: 0.9rem;
    padding: 0.6rem 0.9rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg);
    color: var(--text);
}

.inline-add-form input:focus[b-xtbcok3dz9] {
    outline: none;
    border-color: var(--accent);
}

.inline-add-form button:disabled[b-xtbcok3dz9] {
    opacity: 0.5;
    cursor: default;
}
/* /Components/Shared/NotePreviewDrawer.razor.rz.scp.css */
.note-preview-drawer[b-rpdupy0pgn] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 22rem;
    max-width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 1.25rem 1.5rem;
    border-left: 1px solid var(--border);
    background: var(--bg);
    overflow-y: auto;
    flex: none;
}

.section-sub[b-rpdupy0pgn] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.drawer-resize-handle[b-rpdupy0pgn] {
    position: absolute;
    top: 0;
    left: -0.25rem;
    width: 0.5rem;
    height: 100%;
    cursor: ew-resize;
    touch-action: none;
    z-index: 1;
}

.drawer-resize-handle:hover[b-rpdupy0pgn],
.drawer-resize-handle:active[b-rpdupy0pgn] {
    background: var(--accent);
    opacity: 0.3;
}

.drawer-header[b-rpdupy0pgn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.drawer-header h3[b-rpdupy0pgn] {
    font-size: 0.85rem;
    line-height: 1.5;
    margin: 0;
}

.icon-btn[b-rpdupy0pgn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border: none;
    border-radius: 999px;
    background: none;
    color: var(--muted);
    cursor: pointer;
    flex: none;
}

.icon-btn:hover[b-rpdupy0pgn] {
    background: rgba(226, 27, 60, 0.1);
    color: var(--accent-game);
}

.open-note-link[b-rpdupy0pgn] {
    display: inline-block;
    margin-bottom: 1rem;
    padding: 0.4rem 0.9rem;
    font-size: 0.6rem;
}

.drawer-card-overrides[b-rpdupy0pgn] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 1.25rem;
    padding: 0.85rem 0.9rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--bg-alt);
}

.drawer-card-overrides h4[b-rpdupy0pgn] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
    margin: 0 0 0.3rem;
}

.drawer-card-overrides label[b-rpdupy0pgn],
.drawer-override-label[b-rpdupy0pgn] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--muted);
}

.drawer-override-label[b-rpdupy0pgn] {
    display: block;
}

.drawer-fit-toggle[b-rpdupy0pgn] {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 0.5rem;
}

.drawer-fit-toggle button[b-rpdupy0pgn] {
    flex: 1;
    padding: 0.35rem 0;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: 0.78rem;
    cursor: pointer;
}

.drawer-fit-toggle button.active[b-rpdupy0pgn] {
    border-color: var(--accent);
    color: var(--accent-dark);
    background: rgba(77, 155, 245, 0.1);
}

.drawer-card-overrides input[b-rpdupy0pgn] {
    box-sizing: border-box;
    width: 100%;
    padding: 0.4rem 0.6rem;
    margin-bottom: 0.5rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: 0.85rem;
}

.drawer-card-overrides input:last-child[b-rpdupy0pgn] {
    margin-bottom: 0;
}

/* Rendered markdown content — injected via MarkupString, so ::deep is
   required for every rule here (same pattern as NoteEditor.razor.css). */

.drawer-prose[b-rpdupy0pgn] {
    color: var(--text);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.7;
    font-size: 0.9rem;
}

.drawer-prose[b-rpdupy0pgn]  p {
    margin: 0 0 1rem;
}

.drawer-prose[b-rpdupy0pgn]  a.wikilink {
    color: var(--accent-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* Same reasoning as NoteEditor.razor.css/CharacterSheetEditor.razor.css's
   identical rule — an inserted image had no size cap here at all, so a
   portrait/high-resolution upload could blow out this drawer's narrow
   (280-640px) width far past what's needed to preview it. */
.drawer-prose[b-rpdupy0pgn]  img {
    max-width: 100%;
    max-height: 18rem;
    border-radius: 0.6rem;
    margin: 1rem 0;
}

.drawer-prose[b-rpdupy0pgn]  code {
    background: var(--bg-alt);
    padding: 0.15rem 0.4rem;
    border-radius: 0.35rem;
    font-size: 0.9em;
}

.drawer-prose[b-rpdupy0pgn]  pre {
    background: var(--navy);
    color: #f3f1ec;
    padding: 0.85rem 1rem;
    border-radius: 0.6rem;
    overflow-x: auto;
    margin: 0 0 1rem;
}

.drawer-prose[b-rpdupy0pgn]  pre code {
    background: none;
    padding: 0;
    color: inherit;
}

.drawer-prose[b-rpdupy0pgn]  ul,
.drawer-prose[b-rpdupy0pgn]  ol {
    margin: 0 0 1rem;
    padding-left: 1.25rem;
}
/* /Components/Shared/NoteSearchBox.razor.rz.scp.css */
.note-search-box[b-bndfvs22lu] {
    position: relative;
    max-width: 26rem;
}

.note-search-box input[b-bndfvs22lu] {
    width: 100%;
    box-sizing: border-box;
    padding: 0.6rem 0.9rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-alt);
    color: var(--text);
    font-size: 0.9rem;
}

.note-search-results[b-bndfvs22lu] {
    position: absolute;
    z-index: 10;
    top: calc(100% + 0.35rem);
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    background: var(--bg-alt);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    box-shadow: 0 8px 24px rgba(43, 43, 43, 0.12);
    overflow: hidden;
}

.note-search-recent-label[b-bndfvs22lu] {
    display: block;
    padding: 0.5rem 0.9rem 0.3rem;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
}

.note-search-results a[b-bndfvs22lu],
.note-search-results button[b-bndfvs22lu] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    width: 100%;
    box-sizing: border-box;
    padding: 0.6rem 0.9rem;
    border: none;
    border-bottom: 1px solid var(--border);
    background: none;
    color: var(--text);
    text-decoration: none;
    text-align: left;
    font-family: inherit;
    cursor: pointer;
}

.note-search-results a:last-child[b-bndfvs22lu],
.note-search-results button:last-child[b-bndfvs22lu] {
    border-bottom: none;
}

.note-search-results a:hover[b-bndfvs22lu],
.note-search-results button:hover[b-bndfvs22lu] {
    background: var(--bg);
}

.note-search-results span[b-bndfvs22lu] {
    color: var(--muted);
    font-size: 0.8rem;
}
/* /Components/Shared/PostRow.razor.rz.scp.css */
.post-row[b-f3fkresg8l] {
    display: block;
    padding: 1.25rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.post-row:hover[b-f3fkresg8l] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
}

.post-content h3[b-f3fkresg8l] {
    font-size: 0.85rem;
    line-height: 1.6;
    margin-bottom: 0.5rem;
}

.post-content p[b-f3fkresg8l] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin: 0 0 0.75rem;
    font-size: 0.95rem;
}

.post-tags[b-f3fkresg8l] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}
/* /Components/Shared/WorkCard.razor.rz.scp.css */
.work-card[b-p8nmwiwgz9] {
    display: block;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--bg);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.work-card:hover[b-p8nmwiwgz9] {
    box-shadow: var(--shadow-pixel-hover);
    transform: translate(-2px, -2px);
}

.work-thumb[b-p8nmwiwgz9] {
    aspect-ratio: 16 / 10;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Press Start 2P", sans-serif;
    font-weight: 400;
    font-size: 1rem;
    color: #fff;
    opacity: 0.9;
}

.work-thumb-dev[b-p8nmwiwgz9] { background: var(--accent-dev); }
.work-thumb-game[b-p8nmwiwgz9] { background: var(--accent-game); }
.work-thumb-art[b-p8nmwiwgz9] { background: var(--accent-art); }

.work-thumb-image[b-p8nmwiwgz9] {
    padding: 0;
}

.work-thumb-image img[b-p8nmwiwgz9] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.work-body[b-p8nmwiwgz9] {
    padding: 1.75rem;
}

.work-body h3[b-p8nmwiwgz9] {
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 0.4rem;
}

.work-body p[b-p8nmwiwgz9] {
    color: var(--muted);
    font-family: "Silkscreen", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin: 0 0 1rem;
}

.card-tag[b-p8nmwiwgz9] {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 0.6rem;
}

.card-tag-dev[b-p8nmwiwgz9] { color: var(--accent-dev); }
.card-tag-game[b-p8nmwiwgz9] { color: var(--accent-game); }
.card-tag-art[b-p8nmwiwgz9] { color: var(--accent-art); }

.work-tags[b-p8nmwiwgz9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}