/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-8zde79rfs8] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-8zde79rfs8] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-8zde79rfs8] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-8zde79rfs8] {
    font-size: 1.1rem;
}

.bi[b-8zde79rfs8] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-8zde79rfs8] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-8zde79rfs8] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-8zde79rfs8] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-8zde79rfs8] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-8zde79rfs8] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-8zde79rfs8] {
        padding-bottom: 1rem;
    }

    .nav-item[b-8zde79rfs8]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-8zde79rfs8]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-8zde79rfs8]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-8zde79rfs8] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-8zde79rfs8] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-8zde79rfs8] {
        display: none;
    }

    .nav-scrollable[b-8zde79rfs8] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-tgawq38rvs],
.components-reconnect-repeated-attempt-visible[b-tgawq38rvs],
.components-reconnect-failed-visible[b-tgawq38rvs],
.components-pause-visible[b-tgawq38rvs],
.components-resume-failed-visible[b-tgawq38rvs],
.components-rejoining-animation[b-tgawq38rvs] {
    display: none;
}

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


#components-reconnect-modal[b-tgawq38rvs] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-tgawq38rvs 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

#components-reconnect-modal button[b-tgawq38rvs] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-tgawq38rvs] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-tgawq38rvs] {
        background-color: #6b9ed2;
    }

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

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

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

@keyframes components-rejoining-animation-b-tgawq38rvs {
    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/TopBarLayout.razor.rz.scp.css */
.page[b-piyxkk4pcj] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-piyxkk4pcj] {
    flex: 1;
}

.app[b-piyxkk4pcj] {
    min-height: 100vh;
    background: #f7f4ec;
}

/* TOPBAR */

.topbar[b-piyxkk4pcj] {
    position: sticky;
    top: 0;
    z-index: 50;
    height: 64px;
    border-bottom: 1px solid #d8d2c4;
    display: grid;
    grid-template-columns: 220px 1fr 220px;
    align-items: center;
    padding: 0 28px;
    background-color: #f7f4ec;
}

.logo[b-piyxkk4pcj] {
    font-weight: 800;
    letter-spacing: -.04em;
    font-size: 22px;
}

nav[b-piyxkk4pcj] {
    display: flex;
    justify-content: center;
    gap: 24px;
}

.login[b-piyxkk4pcj] {
    justify-self: end;
    display: inline-flex;
    align-items: center;
    font-size: 16px;
    font-weight: 700;
    color: var(--black);
}

/* AUTHORIZED ACTIONS */

.topbar-actions[b-piyxkk4pcj] {
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 12px;
}

/* NOTIFICATIONS */

.notifications-trigger[b-piyxkk4pcj] {
    position: relative;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    background: #fffdf8;
    cursor: pointer;
    transition: all .2s;
}

    .notifications-trigger:hover[b-piyxkk4pcj] {
        transform: translate(-2px, -2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

.badge[b-piyxkk4pcj] {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--red);
    color: white;
    font-size: 11px;
    font-weight: 700;
    border-radius: 50%;
}

/* SCORE */

.score-link[b-piyxkk4pcj] {
    height: 42px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--line);
    background: #fffdf8;
    font-family: var(--mono);
    font-weight: 700;
    transition: all .2s;
}

    .score-link:hover[b-piyxkk4pcj] {
        transform: translate(-2px, -2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

/* PROFILE */

.profile-link[b-piyxkk4pcj] {
    display: flex;
    align-items: center;
}

.avatar-topbar[b-piyxkk4pcj] {
    width: 42px;
    height: 42px;
    object-fit: cover;
    border: 1px solid var(--line);
    background: #fffdf8;
}

/* CONTENT */

.content[b-piyxkk4pcj] {
    width: 100%;
}

/* NOTIFICATIONS OVERLAY */

.notifications-overlay[b-piyxkk4pcj] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .3);
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    z-index: 2000;
}

/* NOTIFICATIONS MODAL */

.notifications-modal[b-piyxkk4pcj] {
    width: 440px;
    max-width: calc(100vw - 24px);
    margin-top: 76px;
    margin-right: 20px;
    background: #fffdf8;
    border: 1px solid var(--line);
    animation: notifications-show-b-piyxkk4pcj .2s ease;
}

@keyframes notifications-show-b-piyxkk4pcj {

    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* HEADER */

.notifications-header[b-piyxkk4pcj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid var(--line);
}

    .notifications-header h3[b-piyxkk4pcj] {
        margin: 0;
        font-size: 22px;
        font-weight: 800;
        letter-spacing: -.03em;
    }

.close-btn[b-piyxkk4pcj] {
    width: 38px;
    height: 38px;
    border: 1px solid var(--line);
    background: #fffdf8;
    cursor: pointer;
    transition: all .2s;
}

    .close-btn:hover[b-piyxkk4pcj] {
        transform: translate(-2px, -2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

/* LIST */

.notifications-list[b-piyxkk4pcj] {
    max-height: 520px;
    overflow-y: auto;
}

/* ITEM */

.notification-item[b-piyxkk4pcj] {
    width: 100%;
    border: none;
    border-bottom: 1px solid var(--line);
    background: transparent;
    padding: 18px 20px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    cursor: pointer;
    text-align: left;
    transition: all .2s;
}

    .notification-item:hover[b-piyxkk4pcj] {
        background: #f8f4ea;
    }

.notification-content[b-piyxkk4pcj] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.notification-title[b-piyxkk4pcj] {
    font-size: 14px;
    font-weight: 700;
    color: var(--black);
}

.notification-date[b-piyxkk4pcj] {
    font-size: 12px;
    color: #5f5b53;
    font-family: var(--mono);
}

/* EMPTY */

.empty-notifications[b-piyxkk4pcj] {
    padding: 40px;
    text-align: center;
    color: #5f5b53;
}

/* ERROR UI */

#blazor-error-ui[b-piyxkk4pcj] {
    color-scheme: light only;
    background: #f7e9ea;
    border-top: 1px solid var(--red);
    bottom: 0;
    display: none;
    left: 0;
    padding: 12px 20px;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-piyxkk4pcj] {
        cursor: pointer;
        position: absolute;
        right: 16px;
        top: 12px;
    }
/* MOBILE */

@media (max-width: 768px) {

    .topbar[b-piyxkk4pcj] {
        grid-template-columns: auto 1fr auto;
        padding: 0 16px;
    }

    .logo[b-piyxkk4pcj] {
        font-size: 18px;
    }

    .notifications-modal[b-piyxkk4pcj] {
        width: calc(100vw - 20px);
        margin-right: 10px;
    }

    .topbar-actions[b-piyxkk4pcj] {
        gap: 8px;
    }

    .score-link[b-piyxkk4pcj] {
        padding: 0 10px;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
.content[b-e5jstwm6ag] {
}

.market[b-e5jstwm6ag] {
    min-height: 100vh;
    color: var(--black);
}

.topbar[b-e5jstwm6ag] {
    position: sticky;
    top: 0;
    z-index: 50;
    height: 64px;
    border-bottom: 1px solid #d8d2c4;
    display: grid;
    grid-template-columns: 220px 1fr 220px;
    align-items: center;
    padding: 0 28px;
    background-color: #f7f4ec;
}

.logo[b-e5jstwm6ag] {
    font-weight: 800;
    letter-spacing: -0.04em;
    font-size: 22px;
}

nav[b-e5jstwm6ag] {
    display: flex;
    justify-content: center;
    gap: 26px;
    color: #555;
    font-size: 14px;
}

.login[b-e5jstwm6ag] {
    justify-self: end;
    display: inline-flex;
    align-items: center;
    text-align: right;
    font-size: 16px;
    font-weight: 700;
    color: var(--black);
}

.hero[b-e5jstwm6ag] {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(520px, 1.05fr);
    min-height: calc(100vh - 64px);
}

.pitch[b-e5jstwm6ag] {
    padding: 30px 52px 0px 52px;
    border-right: 1px solid #d8d2c4;
}

h1[b-e5jstwm6ag] {
    font-size: clamp(48px, 7vw, 96px);
    line-height: .9;
    letter-spacing: -0.075em;
    margin: 30px 0 28px;
    max-width: 760px;
}

.lead[b-e5jstwm6ag] {
    font-size: 21px;
    line-height: 1.42;
    color: #3f3d39;
    max-width: 650px;
    margin-bottom: 44px;
}

.actions[b-e5jstwm6ag] {
    display: flex;
    gap: 12px;
    align-items: center;
}

.hero-showcase[b-e5jstwm6ag] {
    position: relative;
    min-height: 520px;
    padding-bottom: 40px;
}

.info-card[b-e5jstwm6ag] {
    padding: 38px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-content: start;
}

    .info-card .head[b-e5jstwm6ag] {
        display: flex;
        justify-content: space-between;
        align-items: end;
        border-bottom: 1px solid #d8d2c4;
        padding-bottom: 18px;
        font-size: 32px;
        letter-spacing: -.045em;
        font-weight: 780;
    }

h3[b-e5jstwm6ag] {
    margin: 0 0 10px;
    letter-spacing: -.03em;
    font-size: 21px;
}

p[b-e5jstwm6ag] {
    margin: 0 0 16px;
    color: #5f5b53;
    line-height: 1.45;
}

.task-card[b-e5jstwm6ag] {
    background: #fffdf8;
    border: 1px solid var(--line);
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    padding: 20px;
    transition: all 0.2s;
    cursor: pointer;
}

    .task-card:hover[b-e5jstwm6ag] {
        transform: translate(-4px, -4px);
/*        border-color: #171615;*/
        box-shadow: 8px 8px 0 #d8d2c4;
    }

.tags[b-e5jstwm6ag] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.tag[b-e5jstwm6ag] {
    border: 1px solid #d8d2c4;
    padding: 4px 7px;
    font: 650 12px var(--mono);
    color: #514d45;
    background: #f8f4ea;
}

.difficulty[b-e5jstwm6ag] {
    text-align: right;
    min-width: 120px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
}

    .difficulty strong[b-e5jstwm6ag] {
        font-size: 14px;
        font-weight: 800;
        letter-spacing: .02em;
        padding: 6px 10px;
        border: 1px solid var(--line);
        font-family: var(--mono);
        text-transform: uppercase;
    }

/* LEVELS */

.difficulty-0[b-e5jstwm6ag] {
    background: #e8f3ec;
    border-color: var(--accent);
    color: var(--accent);
}

.difficulty-1[b-e5jstwm6ag] {
    background: #f6f2e9;
    border-color: var(--yellow);
    color: #8a6a1f;
}

.difficulty-2[b-e5jstwm6ag] {
    background: #f7e9ea;
    border-color: var(--red);
    color: var(--red);
}


.workflow[b-e5jstwm6ag] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.step-num[b-e5jstwm6ag] {
    font-size: 52px;
    line-height: 1;
    font-weight: 700;
    color: #d8d2c4;
    font-family: var(--mono);
}

.step[b-e5jstwm6ag] {
    position: relative;
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 28px;
    min-height: 280px;
    display: flex;
    flex-direction: column;
    transition: all .2s;
}


.review-header[b-e5jstwm6ag] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.file-name[b-e5jstwm6ag] {
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -.03em;
}

.review-meta[b-e5jstwm6ag] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.file-subtitle[b-e5jstwm6ag] {
    font-size: 13px;
    color: #5f5b53;
    margin-top: 6px;
}

.quality-box[b-e5jstwm6ag] {
    border: 1px solid #171615;
    padding: 10px 14px;
    text-align: center;
    min-width: 90px;
}

.quality-value[b-e5jstwm6ag] {
    font-size: 26px;
    font-weight: 800;
}

.quality-label[b-e5jstwm6ag] {
    font-size: 11px;
    letter-spacing: .08em;
    color: #5f5b53;
}

.review-body[b-e5jstwm6ag] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 16px;
}

.editor-panel[b-e5jstwm6ag] {
    border: 1px solid #d8d2c4;
    display: flex;
}

.comments-panel[b-e5jstwm6ag] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.comment[b-e5jstwm6ag] {
    border: 1px solid #d8d2c4;
    background: #fffdf8;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: all 0.2s;
    cursor: pointer;
}

    .comment:hover[b-e5jstwm6ag] {
        transform: translate(-4px, -4px);
        box-shadow: 8px 8px 0 #d8d2c4;
    }

.comment-badge[b-e5jstwm6ag] {
    font-family: var(--mono);
    font-size: 11px;
    border: 1px solid #171615;
    padding: 2px 6px;
    height: fit-content;
    align-self: flex-start;
    width: fit-content;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .02em;
    padding: 6px 10px;
    border: 1px solid var(--line);
    font-family: var(--mono);
    text-transform: uppercase;
}

.comment-text[b-e5jstwm6ag] {
    font-size: 13px;
    color: #5f5b53;
    line-height: 1.4;
    white-space: pre-line;
}

.review-footer[b-e5jstwm6ag] {
    margin-top: 16px;
    border-top: 1px solid #d8d2c4;
    padding-top: 12px;
    display: flex;
    justify-content: flex-end;
}

.review-score[b-e5jstwm6ag] {
    font-size: 14px;
    color: #171615;
}



.slide-in[b-e5jstwm6ag] {
    animation: slideFade-b-e5jstwm6ag .4s ease;
}

.slider-nav[b-e5jstwm6ag] {
    position: absolute;
    left: 50%;
    bottom: 40px;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
}

.slider-segment[b-e5jstwm6ag] {
    width: 40px;
    height: 4px;
    background: var(--line);
    overflow: hidden;
}

.slider-segment-fill[b-e5jstwm6ag] {
    height: 100%;
    width: 0;
    background: var(--black);
}

@keyframes slideFade-b-e5jstwm6ag {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/Pages/Login.razor.rz.scp.css */
.auth-container[b-3060a6355a] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    background: #f7f4ec;
}

.auth-card[b-3060a6355a] {
    width: 100%;
    max-width: 560px;
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 40px;
    display: flex;
    flex-direction: column;
}

/*.auth-brand {
    margin-bottom: 24px;
    font-family: var(--mono);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #5f5b53;
}*/

.auth-title[b-3060a6355a] {
    margin: 0;
    font-size: 56px;
    line-height: .9;
    letter-spacing: -.06em;
    font-weight: 800;
    color: var(--black);
}

.auth-subtitle[b-3060a6355a] {
    margin: 18px 0 36px;
    font-size: 17px;
    line-height: 1.5;
    color: #5f5b53;
}

.field[b-3060a6355a] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 24px;
}

    .field label[b-3060a6355a] {
        font-family: var(--mono);
        font-size: 12px;
        font-weight: 700;
        letter-spacing: .06em;
        text-transform: uppercase;
        color: #514d45;
    }

.field-header[b-3060a6355a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.input[b-3060a6355a] {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid var(--line);
    background: #fffdf8;
    font-size: 15px;
    font-family: var(--sans);
    color: var(--black);
}

    .input[b-3060a6355a]::placeholder {
        color: #9a9588;
    }

    .input:focus[b-3060a6355a] {
        outline: none;
        border-color: var(--black);
    }

.password-field[b-3060a6355a] {
    position: relative;
}

.password-toggle[b-3060a6355a] {
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #5f5b53;
}

    .password-toggle:hover[b-3060a6355a] {
        color: var(--black);
    }

.forgot-link[b-3060a6355a] {
    font-size: 12px;
    font-family: var(--mono);
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #5f5b53;
}

    .forgot-link:hover[b-3060a6355a] {
        color: var(--black);
    }

.auth-error[b-3060a6355a] {
    margin-top: 8px;
    text-align: left;
}

.btn-login[b-3060a6355a] {
    width: 100%;
    margin-top: 8px;
}

.divider[b-3060a6355a] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 32px 0;
    color: #7b7568;
    font-family: var(--mono);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
}

    .divider[b-3060a6355a]::before,
    .divider[b-3060a6355a]::after {
        content: "";
        flex: 1;
        border-top: 1px solid var(--line);
    }

.oauth-buttons[b-3060a6355a] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.btn-oauth[b-3060a6355a] {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid var(--line);
    background: #fffdf8;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 700;
    color: var(--black);
    transition: all .2s;
}

    .btn-oauth i[b-3060a6355a] {
        font-size: 18px;
    }

    .btn-oauth:hover:not(:disabled)[b-3060a6355a] {
        transform: translate(-4px, -4px);
        box-shadow: 8px 8px 0 #d8d2c4;
    }

    .btn-oauth:disabled[b-3060a6355a] {
        opacity: .45;
        cursor: not-allowed;
    }

.register-link[b-3060a6355a] {
    margin-top: 28px;
    text-align: center;
    font-size: 14px;
    color: #5f5b53;
}

    .register-link a[b-3060a6355a] {
        color: var(--black);
        font-weight: 700;
    }

        .register-link a:hover[b-3060a6355a] {
            text-decoration: underline;
        }

@media (max-width: 768px) {

    .auth-container[b-3060a6355a] {
        padding: 20px;
    }

    .auth-card[b-3060a6355a] {
        padding: 28px;
    }

    .auth-title[b-3060a6355a] {
        font-size: 42px;
    }

    .auth-subtitle[b-3060a6355a] {
        font-size: 15px;
    }
}
/* /Components/Pages/Profile.razor.rz.scp.css */
.profile-page[b-9dehzbh8al] {
    display: grid;
    grid-template-columns: 360px minmax(0, 1fr);
    gap: 24px;
    padding: 24px;
    align-items: start;
}

/* LEFT */

.profile-card[b-9dehzbh8al] {
    position: sticky;
    top: 88px;
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 28px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.profile-avatar[b-9dehzbh8al] {
    width: 160px;
    height: 160px;
    object-fit: cover;
    border: 1px solid var(--line);
    background: #f8f4ea;
}

.username[b-9dehzbh8al] {
    margin: 20px 0 0;
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -.04em;
    text-align: center;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.xp-block[b-9dehzbh8al] {
    margin-top: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--mono);
    font-weight: 700;
    font-size: 15px;
    padding: 8px 12px;
    border: 1px solid var(--line);
    background: #f8f4ea;
}

.profile-meta[b-9dehzbh8al] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    font-size: 14px;
}

    .profile-meta a[b-9dehzbh8al] {
        color: var(--black);
    }

    .profile-meta i[b-9dehzbh8al] {
        width: 20px;
    }

.profile-score[b-9dehzbh8al] {
    margin-top: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 14px;
    border: 1px solid var(--line);
    background: #fffdf8;
}

.score-title[b-9dehzbh8al] {
    font-size: 14px;
    font-weight: 700;
    color: var(--black);
    letter-spacing: -0.02em;
    white-space: pre;
}

.score-value[b-9dehzbh8al] {
    font-size: 16px;
    font-weight: 800;
    font-family: var(--mono);
    color: var(--black);
}


.profile-links[b-9dehzbh8al] {
    margin-top: 12px;
    display: flex;
    flex-direction: row;
    gap: 8px;
}

    .profile-links a[b-9dehzbh8al] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 12px;
        border: 1px solid var(--line);
        background: #f8f4ea;
        font-size: 14px;
        font-weight: 700;
        color: var(--black);
        text-decoration: none;
        transition: all .2s;
    }

        .profile-links a:hover[b-9dehzbh8al] {
            transform: translate(-2px, -2px);
            box-shadow: 4px 4px 0 #d8d2c4;
        }

.profile-tags[b-9dehzbh8al] {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}


.stats-box[b-9dehzbh8al] {
    width: 100%;
    margin-top: 24px;
    border-top: 1px solid var(--line);
    padding-top: 20px;
}

.stats-title[b-9dehzbh8al] {
    margin-bottom: 16px;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -.03em;
}

.metrics-grid[b-9dehzbh8al] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.metric[b-9dehzbh8al] {
    border: 1px solid var(--line);
    background: #f8f4ea;
    padding: 14px;
}

.metric-value[b-9dehzbh8al] {
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -.04em;
}

.metric-label[b-9dehzbh8al] {
    margin-top: 4px;
    color: #5f5b53;
    font-size: 13px;
    font-family: var(--mono);
    text-transform: uppercase;
}


/* ACTIONS */

.logout-icon[b-9dehzbh8al],
.edit-icon[b-9dehzbh8al] {
    position: absolute;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    background: #fffdf8;
    transition: all .2s;
}

.logout-icon[b-9dehzbh8al] {
    top: 16px;
    left: 16px;
}

.edit-icon[b-9dehzbh8al] {
    top: 16px;
    right: 16px;
}

    .logout-icon:hover[b-9dehzbh8al],
    .edit-icon:hover[b-9dehzbh8al] {
        transform: translate(-2px,-2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

/* STATS */

.stats-box[b-9dehzbh8al] {
    width: 100%;
    margin-top: 24px;
    border-top: 1px solid var(--line);
    padding-top: 20px;
}

.stats-title[b-9dehzbh8al] {
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -.03em;
}

.stats-content[b-9dehzbh8al] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.circle[b-9dehzbh8al] {
    width: 140px;
    height: 140px;
    margin: 0 auto;
    border-radius: 50%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .circle[b-9dehzbh8al]::before {
        content: "";
        position: absolute;
        width: 108px;
        height: 108px;
        background: #fffdf8;
        border-radius: 50%;
    }

.center[b-9dehzbh8al] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.big[b-9dehzbh8al] {
    font-size: 32px;
    font-weight: 800;
}

.small[b-9dehzbh8al] {
    font-size: 12px;
    color: #5f5b53;
    font-family: var(--mono);
}

.legend[b-9dehzbh8al] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.description-container[b-9dehzbh8al] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    border: 1px solid var(--line);
    font-size: 14px;
    font-weight: 600;
}

.description[b-9dehzbh8al] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.value[b-9dehzbh8al] {
    font-family: var(--mono);
    font-weight: 800;
}

.dot[b-9dehzbh8al] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

    .dot.easy[b-9dehzbh8al] {
        background: var(--accent);
    }

    .dot.normal[b-9dehzbh8al] {
        background: var(--yellow);
    }

/* RIGHT */

.profile-content[b-9dehzbh8al] {
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 28px;
    min-width: 0;
}

/* TABS */

.tabs[b-9dehzbh8al] {
    display: flex;
    gap: 10px;
    margin-bottom: 28px;
}

.tab[b-9dehzbh8al] {
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: all .2s;
}

    .tab:hover[b-9dehzbh8al] {
        transform: translate(-2px,-2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

    .tab.active[b-9dehzbh8al] {
        background: var(--black);
        color: white;
        border-color: var(--black);
    }

/* BUTTON */

.new-review-request-btn[b-9dehzbh8al] {
    width: fit-content;
    padding: 10px 16px;
    border: 1px solid var(--black);
    background: var(--black);
    color: white;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 20px;
    transition: all .2s;
}

    .new-review-request-btn:hover[b-9dehzbh8al] {
        transform: translate(-2px,-2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

/* LIST */

.reviews-list[b-9dehzbh8al] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* CARD */

.review-card[b-9dehzbh8al] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 20px;
    text-decoration: none;
    color: inherit;
    transition: all .2s;
}

    .review-card:hover[b-9dehzbh8al] {
        transform: translate(-4px,-4px);
        box-shadow: 8px 8px 0 #d8d2c4;
    }

.review-header[b-9dehzbh8al] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}



.review-title[b-9dehzbh8al] {
    font-size: 21px;
    font-weight: 800;
    letter-spacing: -.03em;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.review-description[b-9dehzbh8al] {
    color: #5f5b53;
    line-height: 1.45;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.review-footer[b-9dehzbh8al] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

/* TECH */

.review-tech[b-9dehzbh8al] {
    border: 1px solid var(--line);
    padding: 5px 8px;
    background: #f8f4ea;
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 700;
}

/* DEADLINE */

.review-deadline-label[b-9dehzbh8al] {
    color: #5f5b53;
    font-size: 13px;
}

/* DIFFICULTY */

.difficulty[b-9dehzbh8al] {
    padding: 6px 10px;
    border: 1px solid var(--line);
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    font-family: var(--mono);
}


.difficulty-0[b-9dehzbh8al] {
    background: #e8f3ec;
    color: var(--accent);
}

.difficulty-1[b-9dehzbh8al] {
    background: #f6f2e9;
    color: #8a6a1f;
}

.difficulty-2[b-9dehzbh8al] {
    background: #f7e9ea;
    color: var(--red);
}

/* STATUS */

.status-banner[b-9dehzbh8al] {
    padding: 6px 10px;
    border: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    font-family: var(--mono);
    white-space: nowrap;
}

    .status-banner.inprogress[b-9dehzbh8al] {
        background: #eef2ff;
        color: var(--blue);
    }

    .status-banner.submitted[b-9dehzbh8al] {
        background: #f6f2e9;
        color: #8a6a1f;
    }

    .status-banner.accepted[b-9dehzbh8al] {
        background: #e8f3ec;
        color: var(--accent);
    }

    .status-banner.rejected[b-9dehzbh8al] {
        background: #f7e9ea;
        color: var(--red);
    }

/* EMPTY */

.empty-state[b-9dehzbh8al] {
    padding: 80px 20px;
    text-align: center;
    color: #5f5b53;
    font-size: 18px;
}

/* MOBILE */

@media (max-width: 1100px) {

    .profile-page[b-9dehzbh8al] {
        grid-template-columns: 1fr;
    }

    .profile-card[b-9dehzbh8al] {
        position: static;
    }
}

@media (max-width: 768px) {

    .profile-page[b-9dehzbh8al] {
        padding: 16px;
    }

    .profile-content[b-9dehzbh8al],
    .profile-card[b-9dehzbh8al] {
        padding: 20px;
    }

    .review-header[b-9dehzbh8al],
    .review-footer[b-9dehzbh8al] {
        flex-direction: column;
        align-items: flex-start;
    }

    .tabs[b-9dehzbh8al] {
        flex-wrap: wrap;
    }

    .username[b-9dehzbh8al] {
        font-size: 28px;
    }
}
/* /Components/Pages/ProfileSettings.razor.rz.scp.css */
.container[b-s2egrfxvtn] {
    display: flex;
    justify-content: center;
    padding: 24px;
    background: #f8f4ea;
    color: var(--black);
}

.form[b-s2egrfxvtn] {
    width: 100%;
    max-width: 520px;
}

.card[b-s2egrfxvtn] {
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 28px;
}

/* AVATAR */

.avatar-block[b-s2egrfxvtn] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
}

    .avatar-block .group[b-s2egrfxvtn] {
        margin-bottom: 0;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

.avatar-upload[b-s2egrfxvtn] {
    width: 128px;
    height: 128px;
    border: 1px solid var(--line);
    background: #f8f4ea;
    overflow: hidden;
    cursor: pointer;
    transition: all .2s;
}

    .avatar-upload:hover[b-s2egrfxvtn] {
        transform: translate(-2px, -2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

.avatar-img[b-s2egrfxvtn] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.avatar-hint[b-s2egrfxvtn] {
    font-size: 12px;
    font-family: var(--mono);
    color: #5f5b53;
    text-transform: uppercase;
}

/* FORM */

.group[b-s2egrfxvtn] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 18px;
}

    .group label[b-s2egrfxvtn] {
        font-size: 14px;
        font-weight: 700;
        letter-spacing: -.02em;
    }

[b-s2egrfxvtn] input.input-field {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--line);
    background: #fffdf8;
    color: var(--black);
    font-size: 15px;
    font-family: inherit;
    transition: all .2s;
}

    [b-s2egrfxvtn] input.input-field:focus {
        outline: none;
        border-color: var(--black);
        box-shadow: inset 0 0 0 1px var(--black);
    }

    [b-s2egrfxvtn] input.input-field:disabled {
        background: #f8f4ea;
        color: #5f5b53;
        cursor: not-allowed;
    }

/* ICON INPUTS */

.input-with-icon[b-s2egrfxvtn] {
    position: relative;
    display: flex;
    align-items: center;
}

    .input-with-icon i[b-s2egrfxvtn] {
        position: absolute;
        left: 12px;
        z-index: 1;
        font-size: 16px;
    }

    .input-with-icon[b-s2egrfxvtn]  input.input-field {
        padding-left: 38px;
    }

/* VALIDATION */

[b-s2egrfxvtn] .validation-message,
[b-s2egrfxvtn] .validation-errors,
[b-s2egrfxvtn] .validation-message {
    color: var(--red);
    font-size: 13px;
    font-weight: 600;
    margin-top: 2px;
}

/* ACTIONS */

.actions[b-s2egrfxvtn] {
    display: flex;
    gap: 12px;
    margin-top: 28px;
}

.btn-save[b-s2egrfxvtn],
.btn-cancel[b-s2egrfxvtn] {
    flex: 1;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: all .2s;
}

/* PRIMARY */

.btn-save[b-s2egrfxvtn] {
    border: 1px solid var(--black);
    background: var(--black);
    color: white;
}

    .btn-save:hover[b-s2egrfxvtn] {
        transform: translate(-3px, -3px);
        box-shadow: 6px 6px 0 #d8d2c4;
    }

/* SECONDARY */

.btn-cancel[b-s2egrfxvtn] {
    border: 1px solid var(--line);
    background: #fffdf8;
    color: var(--black);
}

    .btn-cancel:hover[b-s2egrfxvtn] {
        transform: translate(-3px, -3px);
        box-shadow: 6px 6px 0 #d8d2c4;
    }

/* MOBILE */

@media (max-width: 768px) {

    .container[b-s2egrfxvtn] {
        padding: 16px;
    }

    .card[b-s2egrfxvtn] {
        padding: 20px;
    }

    .actions[b-s2egrfxvtn] {
        flex-direction: column;
    }

    .avatar-upload[b-s2egrfxvtn] {
        width: 110px;
        height: 110px;
    }

    .avatar-block .group[b-s2egrfxvtn] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
}


.tags-picker[b-s2egrfxvtn] {
    width: 100%;
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 12px 14px;
    font-size: 15px;
    color: var(--black);
    font-family: inherit;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

    .tags-picker:focus-within[b-s2egrfxvtn] {
        outline: none;
        border-color: var(--black);
        box-shadow: inset 0 0 0 1px var(--black);
    }

/* TAG CHIP */
.selected-tag[b-s2egrfxvtn] {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #d8d2c4;
    padding: 4px 7px;
    font: 650 12px var(--mono);
    color: #514d45;
    background: #f8f4ea;
    transition: 0.15s ease;
}

    .selected-tag:hover[b-s2egrfxvtn] {
        transform: translate(-1px, -1px);
        box-shadow: 2px 2px 0 #d8d2c4;
    }

    .selected-tag button[b-s2egrfxvtn] {
        border: none;
        background: transparent;
        cursor: pointer;
        color: #5f5b53;
        padding: 0;
        display: flex;
        align-items: center;
        font-size: 16px;
    }

        .selected-tag button:hover[b-s2egrfxvtn] {
            color: var(--red);
        }

/* TOGGLES */

.toggle-label[b-s2egrfxvtn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.label-text[b-s2egrfxvtn] {
    flex: 1;
}

.switch[b-s2egrfxvtn] {
    position: relative;
    width: 48px;
    height: 26px;
}

    .switch input[b-s2egrfxvtn] {
        opacity: 0;
        width: 0;
        height: 0;
    }

        .switch input:checked + .slider[b-s2egrfxvtn]::before {
            background: var(--accent);
            transform: translateX(22px);
        }

.slider[b-s2egrfxvtn] {
    position: absolute;
    inset: 0;
    border: 1px solid var(--line);
    background: #f8f4ea;
    cursor: pointer;
    transition: .2s;
}

    .slider[b-s2egrfxvtn]::before {
        content: "";
        position: absolute;
        width: 18px;
        height: 18px;
        left: 3px;
        top: 3px;
        background: var(--black);
        transition: .2s;
    }

.switch input:checked + .slider[b-s2egrfxvtn]::before {
    transform: translateX(22px);
}


/* INPUT */
.tag-input[b-s2egrfxvtn] {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    /*    padding: 6px !important;*/
    min-width: 160px;
    flex: 1;
    background: transparent !important;
    font-size: 14px;
    color: var(--black);
    flex: 1 1 120px;
}

    .tag-input[b-s2egrfxvtn]::placeholder {
        color: #9a958c;
    }

/* SUGGESTIONS */
.tags-suggestions[b-s2egrfxvtn] {
    margin-top: 10px;
    border: 1px solid var(--line);
    background: #fffdf8;
    overflow: hidden;
}

/* ITEM */
.suggestion-item[b-s2egrfxvtn] {
    width: 100%;
    border: none;
    background: #fffdf8;
    padding: 10px 12px;
    text-align: left;
    cursor: pointer;
    font-size: 14px;
    color: var(--black);
    font-weight: 600;
    transition: 0.15s ease;
}

    .suggestion-item:hover[b-s2egrfxvtn] {
        background: #f8f4ea;
    }
/* /Components/Pages/Register.razor.rz.scp.css */
.auth-container[b-iztdtsovli] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    background: #f7f4ec;
}

.auth-card[b-iztdtsovli] {
    width: 100%;
    max-width: 560px;
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 40px;
    display: flex;
    flex-direction: column;
}

.auth-brand[b-iztdtsovli] {
    margin-bottom: 24px;
    font-family: var(--mono);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #5f5b53;
}

.auth-title[b-iztdtsovli] {
    margin: 0;
    font-size: 56px;
    line-height: .9;
    letter-spacing: -.06em;
    font-weight: 800;
    color: var(--black);
}

.auth-subtitle[b-iztdtsovli] {
    margin: 18px 0 36px;
    font-size: 17px;
    line-height: 1.5;
    color: #5f5b53;
}

.field[b-iztdtsovli] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 24px;
}

    .field label[b-iztdtsovli] {
        font-family: var(--mono);
        font-size: 12px;
        font-weight: 700;
        letter-spacing: .06em;
        text-transform: uppercase;
        color: #514d45;
    }

.input[b-iztdtsovli] {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid var(--line);
    background: #fffdf8;
    font-size: 15px;
    color: var(--black);
    font-family: var(--sans);
}

[b-iztdtsovli] .input {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid var(--line);
    background: #fffdf8;
    font-size: 15px;
    color: var(--black);
    font-family: var(--sans);
}

    [b-iztdtsovli] .input:focus {
        outline: none;
        border-color: var(--black);
    }

.input[b-iztdtsovli]::placeholder,
[b-iztdtsovli] input::placeholder {
    color: #9a9588;
}

.password-field[b-iztdtsovli] {
    position: relative;
}

.password-toggle[b-iztdtsovli] {
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    font-family: var(--mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #5f5b53;
    cursor: pointer;
}

    .password-toggle:hover[b-iztdtsovli] {
        color: var(--black);
    }

.auth-error[b-iztdtsovli] {
    margin-bottom: 16px;
}

.btn-login[b-iztdtsovli] {
    width: 100%;
    margin-top: 8px;
}

.divider[b-iztdtsovli] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 32px 0;
    color: #7b7568;
    font-family: var(--mono);
    font-size: 12px;
    letter-spacing: .06em;
    text-transform: uppercase;
}

    .divider[b-iztdtsovli]::before,
    .divider[b-iztdtsovli]::after {
        content: "";
        flex: 1;
        border-top: 1px solid var(--line);
    }

.register-link[b-iztdtsovli] {
    margin-top: 8px;
    text-align: center;
    font-size: 14px;
    color: #5f5b53;
}

    .register-link a[b-iztdtsovli] {
        color: var(--black);
        font-weight: 700;
    }

        .register-link a:hover[b-iztdtsovli] {
            text-decoration: underline;
        }

[b-iztdtsovli] .validation-message {
    margin-top: 4px;
    font-size: 13px;
    color: var(--red);
}

@media (max-width: 768px) {

    .auth-container[b-iztdtsovli] {
        padding: 20px;
    }

    .auth-card[b-iztdtsovli] {
        padding: 28px;
    }

    .auth-title[b-iztdtsovli] {
        font-size: 42px;
    }

    .auth-subtitle[b-iztdtsovli] {
        font-size: 15px;
    }
}
/* /Components/Pages/ReviewPool.razor.rz.scp.css */
.home-page[b-epap2et7hy] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    padding: 24px;
    align-items: start;
}

/* PANELS */

.reviews-panel[b-epap2et7hy],
.leaderboard-panel[b-epap2et7hy] {
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 24px;
}

/* TABS */

.tabs[b-epap2et7hy] {
    display: flex;
    gap: 10px;
    margin-bottom: 24px;
}

.tab[b-epap2et7hy] {
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: all .2s;
}

    .tab:hover[b-epap2et7hy] {
        transform: translate(-2px, -2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

    .tab.active[b-epap2et7hy] {
        background: var(--black);
        color: white;
        border-color: var(--black);
    }

/* LIST */

.reviews-list[b-epap2et7hy] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* CARD */

.review-card[b-epap2et7hy] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 20px;
    text-decoration: none;
    color: inherit;
    transition: all .2s;
}

    .review-card:hover[b-epap2et7hy] {
        transform: translate(-4px, -4px);
        box-shadow: 8px 8px 0 #d8d2c4;
    }

.review-header[b-epap2et7hy] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.review-title[b-epap2et7hy] {
    font-size: 21px;
    font-weight: 800;
    letter-spacing: -.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.review-description[b-epap2et7hy] {
    color: #5f5b53;
    font-size: 16px;
    line-height: 1.4;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.review-footer[b-epap2et7hy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

/* TECH */

.review-tech[b-epap2et7hy] {
    border: 1px solid var(--line);
    padding: 4px 8px;
    background: #f8f4ea;
    font-size: 12px;
    font-weight: 700;
    font-family: var(--mono);
}

/* DEADLINE */

.review-deadline-label[b-epap2et7hy] {
    font-size: 13px;
    color: #5f5b53;
}

/* DIFFICULTY */

.difficulty[b-epap2et7hy] {
    border: 1px solid var(--line);
    padding: 6px 10px;
    font-size: 14px;
    font-weight: 800;
    font-family: var(--mono);
    text-transform: uppercase;
}

.difficulty-0[b-epap2et7hy] {
    background: #e8f3ec;
    color: var(--accent);
}

.difficulty-1[b-epap2et7hy] {
    background: #f6f2e9;
    color: #8a6a1f;
}

.difficulty-2[b-epap2et7hy] {
    background: #f7e9ea;
    color: var(--red);
}

/* RIGHT PANEL */

.leaderboard-title[b-epap2et7hy] {
    font-size: 18px;
    font-weight: 800;
    margin-bottom: 16px;
}

.leaderboard-list[b-epap2et7hy] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* LEADER CARD */

.leader-card[b-epap2et7hy] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 14px;
    border: 1px solid var(--line);
    background: #fffdf8;
    text-decoration: none;
    color: inherit;
    transition: all .2s;
}

    .leader-card:hover[b-epap2et7hy] {
        transform: translate(-2px, -2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

    .leader-card.auth[b-epap2et7hy] {
        border-color: var(--black);
    }

.leader-user[b-epap2et7hy] {
    min-width: 0;
}

.leader-name[b-epap2et7hy] {
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    min-width: 0;
}

.leader-xp[b-epap2et7hy] {
    border: 1px solid var(--line);
    background: #f8f4ea;
    padding: 4px 8px;
    font-family: var(--mono);
    font-weight: 800;
}

.leader-place[b-epap2et7hy] {
    font-weight: 800;
}

.leader-separator[b-epap2et7hy] {
    text-align: center;
    padding: 10px;
    color: #5f5b53;
}
/* /Components/Pages/ReviewRequest.razor.rz.scp.css */
.review-page[b-2btw596sf0] {
    padding: 24px;
    background: #f8f4ea;
}

/* CONTAINER */

.review-container[b-2btw596sf0] {
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 28px;
}

/* HEADER */

.review-header[b-2btw596sf0] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.review-header-top[b-2btw596sf0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}

/* TITLE */

.review-title-group[b-2btw596sf0] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.review-title[b-2btw596sf0] {
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -.03em;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* DESCRIPTION */

.review-description[b-2btw596sf0] {
    color: #5f5b53;
    font-size: 15px;
    line-height: 1.6;
}

/* BUTTONS */

.buttons[b-2btw596sf0] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

    .buttons button[b-2btw596sf0] {
        border: 1px solid var(--line);
        background: #fffdf8;
        padding: 10px 14px;
        font-weight: 700;
        font-size: 14px;
    }

        .buttons button:hover[b-2btw596sf0] {
            transform: translate(-2px, -2px);
            box-shadow: 4px 4px 0 #d8d2c4;
        }

/* primary action */

.review-btn[b-2btw596sf0] {
    background: var(--black);
    color: var(--black);
    border-color: var(--black);
}

/* delete */

.delete-btn[b-2btw596sf0] {
    background: #f7e9ea;
    color: var(--red);
}

/* META */

.review-meta[b-2btw596sf0] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.meta-chip[b-2btw596sf0] {
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 8px 12px;
    font-size: 14px;
    display: flex;
    gap: 6px;
    align-items: center;
}

.meta-label[b-2btw596sf0] {
    color: #5f5b53;
    font-family: var(--mono);
    font-size: 14px;
}

.meta-value[b-2btw596sf0] {
    font-weight: 700;
}

/* FILES */

.files-section[b-2btw596sf0] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.files-header[b-2btw596sf0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.files-title[b-2btw596sf0] {
    font-size: 18px;
    font-weight: 800;
}

.files-count[b-2btw596sf0] {
    font-size: 14px;
    color: #5f5b53;
}

/* LAYOUT */

.editor-layout[b-2btw596sf0] {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 16px;
}

/* SIDEBAR */

.files-sidebar[b-2btw596sf0] {
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 650px;
    overflow: auto;
}

.file-tab[b-2btw596sf0] {
    border: 1px solid transparent;
    background: transparent;
    padding: 10px;
    cursor: pointer;
    text-align: left;
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 14px;
    color: #5f5b53;
    transition: all .2s;
}

    .file-tab:hover[b-2btw596sf0] {
        background: #f8f4ea;
    }

    .file-tab.active[b-2btw596sf0] {
        border: 1px solid var(--black);
        color: var(--black);
        font-weight: 700;
        background: #f8f4ea;
    }

/* EDITOR */

.editor-container[b-2btw596sf0] {
    border: 1px solid var(--line);
    background: #fffdf8;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.editor-header[b-2btw596sf0] {
    height: 52px;
    padding: 0 16px;
    border-bottom: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f8f4ea;
}

.editor-file[b-2btw596sf0] {
    display: flex;
    gap: 8px;
    align-items: center;
    font-weight: 700;
}

.editor-language[b-2btw596sf0] {
    font-family: var(--mono);
    font-size: 14px;
    font-weight: 800;
}

/* MONACO */

.editor-panel[b-2btw596sf0] {
    min-height: 600px;
    border-top: 1px solid var(--line);
}

/* EMPTY */

.empty-files[b-2btw596sf0] {
    border: 1px dashed var(--line);
    padding: 40px;
    text-align: center;
    color: #5f5b53;
}

/* DIFFICULTY */

.difficulty[b-2btw596sf0] {
    border: 1px solid var(--line);
    padding: 6px 10px;
    font-size: 14px;
    font-weight: 800;
    font-family: var(--mono);
}

.difficulty-0[b-2btw596sf0] {
    background: #e8f3ec;
    color: var(--accent);
}

.difficulty-1[b-2btw596sf0] {
    background: #f6f2e9;
    color: #8a6a1f;
}

.difficulty-2[b-2btw596sf0] {
    background: #f7e9ea;
    color: var(--red);
}
/* /Components/Pages/ReviewRequestCreate.razor.rz.scp.css */
.review-request-create-page[b-qtobo60ok9] {
    max-width: 1100px;
    margin: 0 auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    background: #f8f4ea;
    color: var(--black);
}

/* HEADER */

.page-header h1[b-qtobo60ok9] {
    margin: 0;
    font-size: 36px;
    font-weight: 800;
    letter-spacing: -.04em;
}

/* CARD */

.card[b-qtobo60ok9] {
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 28px;
}

/* SECTION */

.section-title[b-qtobo60ok9] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.03em;
}

/* FORM */

.form-group[b-qtobo60ok9] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 20px;
}

    .form-group label[b-qtobo60ok9] {
        font-size: 16px;
        font-weight: 700;
    }

.hint[b-qtobo60ok9] {
    color: #5f5b53;
    font-size: 15px;
    font-family: var(--mono);
}

.validation-error[b-qtobo60ok9] {
    color: var(--red);
    font-size: 13px;
    font-weight: 700;
}

.required[b-qtobo60ok9] {
    color: var(--red);
}

/* INPUTS */

[b-qtobo60ok9] input,
[b-qtobo60ok9] textarea,
[b-qtobo60ok9] select {
    width: 100%;
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 12px 14px;
    font-size: 15px;
    color: var(--black);
    font-family: inherit;
}

    [b-qtobo60ok9] input:focus,
    [b-qtobo60ok9] textarea:focus,
    [b-qtobo60ok9] select:focus {
        outline: none;
        border-color: var(--black);
        box-shadow: inset 0 0 0 1px var(--black);
    }

[b-qtobo60ok9] textarea {
    resize: vertical;
    min-height: 140px;
}

/* TABS */

.select-tabs[b-qtobo60ok9] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}


.tab[b-qtobo60ok9] {
    font-size: 14px;
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 10px 16px;
    cursor: pointer;
    font-weight: 700;
    transition: all .2s;
    letter-spacing: .02em;
    font-family: var(--mono);
    text-transform: uppercase;
}

    .tab:hover[b-qtobo60ok9] {
        transform: translate(-2px,-2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

    .tab.active[b-qtobo60ok9] {
        background: var(--black);
        color: white;
        border-color: var(--black);
    }

    .tab.digit[b-qtobo60ok9] {
        font-size: 16px;
        padding: 8px 14px;
    }

    .tab.easy.active[b-qtobo60ok9] {
        background: #e8f3ec;
        color: var(--accent);
        border-color: var(--accent);
    }

    .tab.norm.active[b-qtobo60ok9] {
        background: #f6f2e9;
        border-color: var(--yellow);
        color: #8a6a1f;
    }

    .tab.hard.active[b-qtobo60ok9] {
        background: #f7e9ea;
        border-color: var(--red);
        color: var(--red);
    }

.difficulty-0[b-qtobo60ok9] {
    background: #e8f3ec;
    border-color: var(--accent);
    color: var(--accent);
}

.difficulty-1[b-qtobo60ok9] {
    background: #f6f2e9;
    border-color: var(--yellow);
    color: #8a6a1f;
}

.difficulty-2[b-qtobo60ok9] {
    background: #f7e9ea;
    border-color: var(--red);
    color: var(--red);
}

/* UPLOAD */

.editor-panel[b-qtobo60ok9] {
    min-height: 600px;
    border-top: 1px solid var(--line);
}

.upload-box[b-qtobo60ok9] {
    position: relative;
    border: 2px dashed var(--line);
    background: #f8f4ea;
    padding: 60px 24px;
    text-align: center;
    transition: all .2s;
}

    .upload-box:hover[b-qtobo60ok9] {
        transform: translate(-2px,-2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

[b-qtobo60ok9] input.file-input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.upload-icon[b-qtobo60ok9] {
    font-size: 32px;
    margin-bottom: 12px;
}

.upload-text[b-qtobo60ok9] {
    color: #5f5b53;
    font-size: 15px;
}

/* FILES */

.file-list[b-qtobo60ok9] {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.file-item[b-qtobo60ok9] {
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 12px 14px;
}

.file-header[b-qtobo60ok9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    font-weight: 700;
}

.remove-btn[b-qtobo60ok9] {
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 18px;
    color: var(--red);
}

/* TOGGLES */

.toggle-label[b-qtobo60ok9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.label-text[b-qtobo60ok9] {
    flex: 1;
}

.switch[b-qtobo60ok9] {
    position: relative;
    width: 48px;
    height: 26px;
}

    .switch input[b-qtobo60ok9] {
        opacity: 0;
        width: 0;
        height: 0;
    }

        .switch input:checked + .slider[b-qtobo60ok9]::before {
            background: var(--accent);
            transform: translateX(22px);
        }

.slider[b-qtobo60ok9] {
    position: absolute;
    inset: 0;
    border: 1px solid var(--line);
    background: #f8f4ea;
    cursor: pointer;
    transition: .2s;
}

    .slider[b-qtobo60ok9]::before {
        content: "";
        position: absolute;
        width: 18px;
        height: 18px;
        left: 3px;
        top: 3px;
        background: var(--black);
        transition: .2s;
    }

.switch input:checked + .slider[b-qtobo60ok9]::before {
    transform: translateX(22px);
}

/* ACTIONS */

.actions[b-qtobo60ok9] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.btn-save[b-qtobo60ok9],
.btn-cancel[b-qtobo60ok9] {
    padding: 12px 20px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: all .2s;
}

.btn-save[b-qtobo60ok9] {
    border: 1px solid var(--black);
    background: var(--black);
    color: white;
}

.btn-cancel[b-qtobo60ok9] {
    border: 1px solid var(--line);
    background: #fffdf8;
    color: var(--black);
}

    .btn-save:hover[b-qtobo60ok9],
    .btn-cancel:hover[b-qtobo60ok9] {
        transform: translate(-3px,-3px);
        box-shadow: 6px 6px 0 #d8d2c4;
    }

/* MISC */

.not-implemented[b-qtobo60ok9] {
    opacity: .6;
}

/* MOBILE */

@media (max-width: 768px) {

    .review-request-create-page[b-qtobo60ok9] {
        padding: 16px;
    }

    .card[b-qtobo60ok9] {
        padding: 20px;
    }

    .actions[b-qtobo60ok9] {
        flex-direction: column;
    }

    .btn-save[b-qtobo60ok9],
    .btn-cancel[b-qtobo60ok9] {
        width: 100%;
    }
}


.tags-counter[b-qtobo60ok9] {
    color: #5f5b53;
    font-size: 14px;
    font-weight: 600;
    margin-left: 6px;
}

/* WRAPPER */
.tags-picker[b-qtobo60ok9] {
    width: 100%;
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 12px 14px;
    font-size: 15px;
    color: var(--black);
    font-family: inherit;
    display: flex;
    gap: 6px;
}

    .tags-picker:focus-within[b-qtobo60ok9] {
        outline: none;
        border-color: var(--black);
        box-shadow: inset 0 0 0 1px var(--black);
    }

/* TAG CHIP */
.selected-tag[b-qtobo60ok9] {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #d8d2c4;
    padding: 4px 7px;
    font: 650 12px var(--mono);
    color: #514d45;
    background: #f8f4ea;
    transition: 0.15s ease;
}

    .selected-tag:hover[b-qtobo60ok9] {
        transform: translate(-1px, -1px);
        box-shadow: 2px 2px 0 #d8d2c4;
    }

    .selected-tag button[b-qtobo60ok9] {
        border: none;
        background: transparent;
        cursor: pointer;
        color: #5f5b53;
        padding: 0;
        display: flex;
        align-items: center;
        font-size: 16px;
    }

        .selected-tag button:hover[b-qtobo60ok9] {
            color: var(--red);
        }

/* INPUT */
.tag-input[b-qtobo60ok9] {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    padding: 6px !important;
    min-width: 160px;
    flex: 1;
    background: transparent !important;
    font-size: 14px;
    color: var(--black);
}

    .tag-input[b-qtobo60ok9]::placeholder {
        color: #9a958c;
    }

/* SUGGESTIONS */
.tags-suggestions[b-qtobo60ok9] {
    margin-top: 10px;
    border: 1px solid var(--line);
    background: #fffdf8;
    overflow: hidden;
}

/* ITEM */
.suggestion-item[b-qtobo60ok9] {
    width: 100%;
    border: none;
    background: #fffdf8;
    padding: 10px 12px;
    text-align: left;
    cursor: pointer;
    font-size: 14px;
    color: var(--black);
    font-weight: 600;
    transition: 0.15s ease;
}

    .suggestion-item:hover[b-qtobo60ok9] {
        background: #f8f4ea;
    }
/* /Components/Pages/ReviewResponse.razor.rz.scp.css */
.review-page[b-pxq9spfllq] {
    padding: 24px;
    background: #f8f4ea;
}

/* CONTAINER */
.review-container[b-pxq9spfllq] {
    background: #fffdf8;
    border: 1px solid var(--line);
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.review-header[b-pxq9spfllq] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.review-header-top[b-pxq9spfllq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}

.review-title-group[b-pxq9spfllq] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.review-title[b-pxq9spfllq] {
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -.03em;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.review-description[b-pxq9spfllq] {
    color: #5f5b53;
    font-size: 15px;
    line-height: 1.6;
}


.editor-panel[b-pxq9spfllq] {
    height: 600px;
    border: 1px solid #d8d2c4;
    overflow: hidden;
}


.review-body[b-pxq9spfllq] {
    display: grid;
    gap: 12px;
    background: #F7F4EC;
    grid-template-columns: minmax(0, 2fr) 340px;
    align-items: stretch;
}

.comments-panel[b-pxq9spfllq] {
    height: 600px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 4px;
}

.comment-create[b-pxq9spfllq] {
    border: 1px solid #d8d2c4;
    background: #fffdf8;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: sticky;
    top: 0;
    z-index: 2;
}

    .comment-create .footer[b-pxq9spfllq] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

.line-info[b-pxq9spfllq] {
    font-size: 14px;
    color: #5f5b53;
    font-family: var(--mono);
}

.comment-types[b-pxq9spfllq] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.comment-create textarea[b-pxq9spfllq] {
    resize: vertical;
    min-height: 90px;
    border: 1px solid #d8d2c4;
    background: #fffdf8;
    padding: 10px 12px;
    font-size: 14px;
    font-family: inherit;
}

    .comment-create textarea:focus[b-pxq9spfllq] {
        outline: none;
        border-color: #171615;
    }

.add-comment-btn[b-pxq9spfllq] {
    align-self: flex-start;
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 10px 14px;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    transition: all .2s;
}

    .add-comment-btn:hover[b-pxq9spfllq] {
        transform: translate(-2px,-2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }



.comment[b-pxq9spfllq] {
    border: 1px solid #d8d2c4;
    background: #fffdf8;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: all 0.2s;
    cursor: pointer;
}

    .comment:hover[b-pxq9spfllq] {
        transform: translate(-2px, -2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

.comment-header[b-pxq9spfllq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.comment-badge[b-pxq9spfllq] {
    font-family: var(--mono);
    font-size: 11px;
    border: 1px solid #171615;
    padding: 2px 6px;
    height: fit-content;
    align-self: flex-start;
    width: fit-content;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .02em;
    padding: 6px 10px;
    border: 1px solid var(--line);
    font-family: var(--mono);
    text-transform: uppercase;
}

.comment-text[b-pxq9spfllq] {
    font-size: 13px;
    color: #5f5b53;
    line-height: 1.4;
    white-space: pre-line;
}

.comment-delete-btn[b-pxq9spfllq] {
    border: none;
    background: transparent;
    width: 28px;
    height: 28px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    color: #8c8577;
    transition: .15s;
}

    .comment-delete-btn:hover[b-pxq9spfllq] {
        color: var(--red);
    }

.buttons[b-pxq9spfllq] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

    .buttons button[b-pxq9spfllq] {
        border: 1px solid var(--line);
        background: #fffdf8;
        padding: 10px 14px;
        font-weight: 700;
        font-size: 14px;
        cursor: pointer;
        transition: all .2s;
    }

        .buttons button:hover[b-pxq9spfllq] {
            transform: translate(-2px, -2px);
            box-shadow: 4px 4px 0 #d8d2c4;
        }

/* variants */
.delete-btn[b-pxq9spfllq] {
    background: #f7e9ea;
    color: var(--red);
}

.save-btn[b-pxq9spfllq] {
    background: #e8f3ec;
    color: var(--accent);
}

.submit-btn[b-pxq9spfllq] {
    background: #f6f2e9;
    color: #8a6a1f;
}

.status-banner[b-pxq9spfllq] {
    padding: 8px 12px;
    border: 1px solid var(--line);
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    font-family: var(--mono);
    background: #fffdf8;
    color: #5f5b53;
}

    .status-banner.submitted[b-pxq9spfllq] {
        background: #f6f2e9;
        color: #8a6a1f;
    }

    .status-banner.accepted[b-pxq9spfllq] {
        background: #e8f3ec;
        color: var(--accent);
    }

    .status-banner.rejected[b-pxq9spfllq] {
        background: #f7e9ea;
        color: var(--red);
    }

.review-meta[b-pxq9spfllq] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.meta-chip[b-pxq9spfllq] {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--line);
    background: #f8f4ea;
    padding: 8px 12px;
    font-size: 14px;
}

.meta-label[b-pxq9spfllq] {
    color: #5f5b53;
    font-family: var(--mono);
}

.meta-value[b-pxq9spfllq] {
    font-weight: 700;
}

.files-section[b-pxq9spfllq] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.files-header[b-pxq9spfllq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.files-title[b-pxq9spfllq] {
    font-size: 18px;
    font-weight: 800;
}

.files-count[b-pxq9spfllq] {
    color: #5f5b53;
    font-size: 14px;
}

.editor-layout[b-pxq9spfllq] {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 16px;
}

.files-sidebar[b-pxq9spfllq] {
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 650px;
    overflow: auto;
}

.file-tab[b-pxq9spfllq] {
    border: 1px solid transparent;
    background: transparent;
    padding: 10px;
    cursor: pointer;
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 14px;
    color: #5f5b53;
    transition: all .2s;
}

    .file-tab:hover[b-pxq9spfllq] {
        background: #f8f4ea;
    }

    .file-tab.active[b-pxq9spfllq] {
        border: 1px solid var(--black);
        background: #f8f4ea;
        color: var(--black);
        font-weight: 700;
    }

.editor-container[b-pxq9spfllq] {
    border: 1px solid var(--line);
    background: #fffdf8;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.editor-header[b-pxq9spfllq] {
    height: 52px;
    padding: 0 16px;
    border-bottom: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f8f4ea;
}

.editor-file[b-pxq9spfllq] {
    display: flex;
    gap: 8px;
    align-items: center;
    font-weight: 700;
}

.editor-language[b-pxq9spfllq] {
    font-family: var(--mono);
    font-size: 14px;
    font-weight: 800;
}


.rating-row[b-pxq9spfllq] {
    display: flex;
    gap: 8px;
}

.rating-btn[b-pxq9spfllq] {
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 8px 12px;
    cursor: pointer;
    font-weight: 800;
    font-family: var(--mono);
    transition: all .2s;
}

    .rating-btn:hover[b-pxq9spfllq] {
        transform: translate(-2px, -2px);
        box-shadow: 4px 4px 0 #d8d2c4;
    }

    .rating-btn.active[b-pxq9spfllq] {
        background: var(--black);
        color: white;
        border-color: var(--black);
    }

.review-evaluation[b-pxq9spfllq] {
    margin-top: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.evaluation-block[b-pxq9spfllq] {
    border: 1px solid var(--line);
    background: #fffdf8;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.evaluation-label[b-pxq9spfllq] {
    font-size: 18px;
    font-weight: 800;
}


.comment-badge.Comment[b-pxq9spfllq] {
    background: #eaf2fb;
    color: var(--blue);
}


.Praise[b-pxq9spfllq] {
    background: #e8f3ec;
    color: var(--accent);
}

.Suggestion[b-pxq9spfllq] {
    background: #f6f2e9;
    color: #8a6a1f;
}

.Issue[b-pxq9spfllq] {
    background: #f7e9ea;
    color: var(--red);
}

.not-active[b-pxq9spfllq] {
    background: #FFFDF8;
    color: #5f5b53;
}
/* /Components/Shared/MonacoEditor.razor.rz.scp.css */
.monaco-host[b-qvtkxau5no] {
    width: 100%;
    height: 100%;
}