/*
site.css — safe extracted CSS from inline <style> blocks.
Generated as a first migration step: rules are scoped by body.page-* to avoid selector collisions.
After visual checking, duplicated blocks can be merged into common components.
*/

:root {
    --color-bg: #111;
    --color-panel: #1b1b1b;
    --color-panel-2: #181818;
    --color-border: #333;
    --color-text: #eee;
    --color-muted: #999;
    --color-link: #7cc7ff;
    --color-primary: #2e7d32;
}

.u-mt-12 { margin-top: 12px; }
.u-mt-14 { margin-top: 14px; }
.u-mt-16 { margin-top: 16px; }
.u-mb-8 { margin-bottom: 8px; }
.u-ml-8 { margin-left: 8px; }
.u-w-100 { width: 100%; }
.u-inline-form { display: inline; }
.u-panel-dark { background: #181818; }
.is-hidden { display: none; }



/* ===== index.php ===== */

body.page-index * {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body.page-index {
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
    background: radial-gradient(circle at 50% 0, rgba(46, 125, 50, 0.13), transparent 520px),
                #111;
    color: #eee;
}

body.page-index a {
    color: #7cc7ff;
}

body.page-index .page-hero {
    position: relative;
    min-height: 560px;
    overflow: hidden;
    background-color: #111;
    background-image: linear-gradient(90deg,
                    #111 0%,
                    rgba(17, 17, 17, 0.96) 7%,
                    rgba(17, 17, 17, 0.72) 24%,
                    rgba(17, 17, 17, 0.28) 50%,
                    rgba(17, 17, 17, 0.78) 84%,
                    #111 100%
                ),
                linear-gradient(180deg,
                    rgba(17, 17, 17, 0.18) 0%,
                    rgba(17, 17, 17, 0.2) 52%,
                    #111 100%
                ),
                url('/img/main/header-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    border-bottom: 1px solid #222;
}

body.page-index .page-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at 72% 46%, transparent 0, rgba(17, 17, 17, 0.08) 34%, rgba(17, 17, 17, 0.62) 100%),
                linear-gradient(180deg, transparent 0%, transparent 66%, #111 100%);
}

body.page-index .page-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 1320px;
    min-height: 560px;
    margin: 0 auto;
    padding: 22px 34px 58px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 54px;
}

body.page-index .top {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

body.page-index .brand {
    display: flex;
    flex-direction: column;
    gap: 4px;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.95);
}

body.page-index .brand-title {
    margin: 0;
    font-size: 25px;
    line-height: 1.1;
}

body.page-index .brand-subtitle {
    color: #ccc;
    font-size: 13px;
}

body.page-index .top-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

body.page-index .actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

body.page-index .hero-text {
    max-width: 720px;
    padding: 24px 0 14px;
    text-shadow: 0 3px 20px rgba(0, 0, 0, 0.98);
}

body.page-index .hero-text h1 {
    margin: 0 0 16px;
    font-size: 52px;
    line-height: 1.04;
    letter-spacing: -0.7px;
}

body.page-index .hero-text p {
    margin: 0;
    color: #e5e5e5;
    font-size: 20px;
    line-height: 1.45;
}

body.page-index .hero-note {
    display: inline-block;
    margin-top: 20px;
    padding: 11px 13px;
    border: 1px solid #2f7d32;
    border-radius: 10px;
    background: rgba(20, 30, 20, 0.72);
    color: #d8ffd8;
    text-shadow: none;
}

body.page-index .hero-buttons {
    margin-top: 22px;
}

body.page-index .wrap {
    max-width: 1320px;
    margin: 0 auto;
    padding: 18px 34px 28px;
}

body.page-index .box {
    background: #1b1b1b;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 18px;
}

body.page-index .intro-box {
    border-color: #2e7d32;
    background: linear-gradient(180deg, #1d251d, #1b1b1b);
    padding: 20px;
}

body.page-index .intro-box h2 {
    margin: 0 0 10px;
}

body.page-index .box h2 {
    margin: 0 0 10px;
}

body.page-index .intro-box p {
    line-height: 1.5;
}

body.page-index .box p {
    line-height: 1.5;
}

body.page-index .muted {
    color: #aaa;
    font-size: 13px;
    line-height: 1.45;
}

body.page-index .button-link {
    cursor: pointer;
    background: #2e7d32;
    color: white;
    border: 0;
    text-decoration: none;
    display: inline-block;
    padding: 11px 14px;
    border-radius: 8px;
    font-size: 16px;
    line-height: 1.2;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.24);
}

body.page-index .button-link:hover {
    background: #388e3c;
}

body.page-index .button-link.secondary {
    background: #333;
}

body.page-index .button-link.secondary:hover {
    background: #3d3d3d;
}

body.page-index .button-link.ghost {
    background: transparent;
    border: 1px solid #444;
    color: #eee;
}

body.page-index .button-link.ghost:hover {
    background: #222;
}

body.page-index .status-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}

body.page-index .status-item {
    background: #181818;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 14px;
}

body.page-index .step {
    background: #181818;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 14px;
}

body.page-index .mode-card {
    background: #181818;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 14px;
}

body.page-index .feature-card {
    background: #181818;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 14px;
}

body.page-index .status-pill {
    display: inline-block;
    border-radius: 999px;
    padding: 7px 11px;
    font-weight: bold;
    background: #2e7d32;
    color: #fff;
    margin-bottom: 8px;
}

body.page-index .status-pill.soon {
    background: #333;
    color: #ccc;
}

body.page-index .steps {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-top: 14px;
}

body.page-index .step-num {
    display: inline-block;
    background: #2e7d32;
    color: #fff;
    border-radius: 999px;
    padding: 4px 9px;
    font-weight: bold;
    margin-bottom: 8px;
}

body.page-index .step h3 {
    margin: 4px 0 8px;
    font-size: 17px;
}

body.page-index .mode-card h3 {
    margin: 4px 0 8px;
    font-size: 17px;
}

body.page-index .feature-card h3 {
    margin: 4px 0 8px;
    font-size: 17px;
}

body.page-index .grid2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

body.page-index .grid3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

body.page-index .mode-card.green {
    border-color: #2e7d32;
    background: linear-gradient(180deg, #1d251d, #181818);
}

body.page-index .check-list {
    margin: 10px 0 0;
    padding-left: 20px;
    color: #ccc;
    line-height: 1.5;
}

body.page-index .feature-image {
    min-height: 155px;
    margin-bottom: 12px;
    background: #111;
    border: 1px dashed #444;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #777;
    overflow: hidden;
}

body.page-index .feature-image img {
    width: 100%;
    height: 155px;
    object-fit: cover;
    display: block;
}

body.page-index .warning-note {
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid #5a4a2a;
    border-radius: 10px;
    background: rgba(150, 110, 30, 0.13);
    color: #ffe3a3;
}

body.page-index .footer {
    color: #777;
    font-size: 13px;
    text-align: center;
    padding: 10px 0 4px;
}

body.page-index code {
    color: #ddd;
    background: #111;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 2px 5px;
}

@media (min-width: 1800px) {

    body.page-index .page-hero {
        min-height: 640px;
    }

    body.page-index .page-hero-inner {
        min-height: 640px;
    }

}

@media (max-width: 1080px) {

    body.page-index .steps {
        grid-template-columns: repeat(2, 1fr);
    }

    body.page-index .status-row {
        grid-template-columns: 1fr;
    }

    body.page-index .grid3 {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 900px) {

    body.page-index .grid2 {
        grid-template-columns: 1fr;
    }

    body.page-index .hero-text h1 {
        font-size: 38px;
    }

    body.page-index .hero-text p {
        font-size: 17px;
    }

}

@media (max-width: 760px) {

    body.page-index .page-hero {
        min-height: auto;
        background-position: center top;
    }

    body.page-index .page-hero-inner {
        min-height: auto;
        padding: 16px 12px 32px;
        gap: 44px;
    }

    body.page-index .wrap {
        padding: 12px;
    }

    body.page-index .top-actions {
        width: 100%;
        text-align: center;
    }

    body.page-index .hero-buttons {
        width: 100%;
        text-align: center;
    }

    body.page-index .button-link {
        width: 100%;
        text-align: center;
    }

    body.page-index .steps {
        grid-template-columns: 1fr;
    }

    body.page-index .hero-text h1 {
        font-size: 31px;
    }

    body.page-index .hero-text p {
        font-size: 16px;
    }

}

/* Общий правый блок шапки: язык + действия пользователя. */
.top-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-left: auto;
}

.top-actions select,
.top-actions .top-actions-locale-select {
    color: #111;
    background: #fff;
    border: 1px solid #cfcfcf;
    border-radius: 8px;
    padding: 6px 10px;
    height: 32px;
    line-height: 20px;
    font-size: 14px;
    color-scheme: light;
}

.top-actions select option,
.top-actions .top-actions-locale-select option {
    color: #111;
    background: #fff;
}

.top-language-form {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}

.top-language-label {
    font-size: 13px;
    line-height: 1;
    opacity: 0.8;
}

.top-language-select {
    width: auto;
    min-width: 104px;
    max-width: 150px;
    height: 30px;
    padding: 3px 8px;
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.2;
}

.top-language-submit {
    height: 30px;
    padding: 3px 8px;
    border-radius: 8px;
    font-size: 13px;
}

.top-action-link {
    white-space: nowrap;
}

@media (max-width: 640px) {
    .top-actions {
        width: 100%;
        justify-content: flex-start;
        margin-left: 0;
    }

    .top-language-select {
        max-width: 130px;
    }
}



/* ===== cabinet.php ===== */

body.page-cabinet {
    margin: 0;
    padding: 20px;
    font-family: Arial, sans-serif;
    background: #111;
    color: #eee;
}

body.page-cabinet a {
    color: #7cc7ff;
}

body.page-cabinet .wrap {
    max-width: 1120px;
    margin: 0 auto;
}

body.page-cabinet .top {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

body.page-cabinet .top h1 {
    margin-bottom: 8px;
}

body.page-cabinet .box {
    background: #1b1b1b;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 18px;
}

body.page-cabinet .box.u-panel-dark {
    background: #181818;
}

body.page-cabinet .hero {
    border-color: #2e7d32;
    background: linear-gradient(180deg, #1d251d, #1b1b1b);
}

body.page-cabinet .hero h2 {
    margin-top: 0;
    font-size: 26px;
}

body.page-cabinet .tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

body.page-cabinet .tab-btn {
    background: #1b1b1b;
    color: #ccc;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 12px 18px;
    font-size: 16px;
    cursor: pointer;
}

body.page-cabinet .tab-btn.active-tab {
    background: #2e7d32;
    color: #fff;
    border-color: #2e7d32;
    font-weight: bold;
}

body.page-cabinet .tab-panel {
    display: none;
}

body.page-cabinet .tab-panel.active-panel {
    display: block;
}

body.page-cabinet input {
    font-size: 16px;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #444;
}

body.page-cabinet button {
    font-size: 16px;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #444;
}

body.page-cabinet select {
    font-size: 16px;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #444;
}

body.page-cabinet input {
    background: #111;
    color: #eee;
}

body.page-cabinet select {
    background: #111;
    color: #eee;
}

body.page-cabinet button {
    cursor: pointer;
    background: #2e7d32;
    color: white;
    border: 0;
    text-decoration: none;
    display: inline-block;
    padding: 11px 14px;
    border-radius: 8px;
    font-size: 16px;
    line-height: 1.2;
}

body.page-cabinet .button-link {
    cursor: pointer;
    background: #2e7d32;
    color: white;
    border: 0;
    text-decoration: none;
    display: inline-block;
    padding: 11px 14px;
    border-radius: 8px;
    font-size: 16px;
    line-height: 1.2;
}

body.page-cabinet .button-link.secondary {
    background: #333;
}

body.page-cabinet button.secondary {
    background: #333;
}

body.page-cabinet .button-link.disabled {
    background: #333;
    color: #888;
    cursor: default;
    pointer-events: none;
}

body.page-cabinet table {
    width: 100%;
    border-collapse: collapse;
    background: #181818;
}

body.page-cabinet th {
    border-bottom: 1px solid #333;
    padding: 10px;
    text-align: left;
    vertical-align: top;
}

body.page-cabinet td {
    border-bottom: 1px solid #333;
    padding: 10px;
    text-align: left;
    vertical-align: top;
}

body.page-cabinet th {
    color: #aaa;
    font-weight: normal;
}

body.page-cabinet .active {
    color: #6ee36e;
    font-weight: bold;
}

body.page-cabinet .danger {
    color: #ff8b8b;
    font-weight: bold;
}

body.page-cabinet .muted {
    color: #aaa;
    font-size: 13px;
}

body.page-cabinet .token {
    font-family: monospace;
    font-size: 12px;
    word-break: break-all;
    color: #bbb;
}

body.page-cabinet .btn-small {
    font-size: 13px;
    padding: 7px 10px;
}

body.page-cabinet .steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 14px;
}

body.page-cabinet .step {
    background: #181818;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 14px;
}

body.page-cabinet .step-num {
    display: inline-block;
    background: #2e7d32;
    color: #fff;
    border-radius: 999px;
    padding: 4px 9px;
    font-weight: bold;
    margin-bottom: 8px;
}

body.page-cabinet .step h3 {
    margin: 4px 0 8px;
}

body.page-cabinet .actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 12px;
}

body.page-cabinet .grid2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

body.page-cabinet .copy {
    width: 100%;
    box-sizing: border-box;
    margin-top: 6px;
    font-family: monospace;
    font-size: 13px;
}

body.page-cabinet .create-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

body.page-cabinet .create-row input[type="text"] {
    min-width: 280px;
}

body.page-cabinet .create-session-row {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(320px, 1.4fr) auto;
    gap: 12px;
    align-items: end;
    margin-top: 12px;
}

body.page-cabinet .create-session-row b {
    display: block;
    margin-bottom: 6px;
}

body.page-cabinet .create-session-row input {
    width: 100%;
    box-sizing: border-box;
}

body.page-cabinet .create-session-row select {
    width: 100%;
    box-sizing: border-box;
}

body.page-cabinet .create-session-submit button {
    white-space: nowrap;
}

body.page-cabinet .status-pill {
    display: inline-block;
    border-radius: 999px;
    padding: 7px 11px;
    font-weight: bold;
    background: #333;
}

body.page-cabinet .status-pill.ok {
    background: #2e7d32;
    color: #fff;
}

body.page-cabinet .status-pill.bad {
    background: #5a2a2a;
    color: #fff;
}

body.page-cabinet details {
    margin-top: 14px;
}

body.page-cabinet summary {
    cursor: pointer;
    color: #7cc7ff;
}

@media (max-width: 900px) {

    body.page-cabinet .steps {
        grid-template-columns: 1fr;
    }

    body.page-cabinet .grid2 {
        grid-template-columns: 1fr;
    }

    body.page-cabinet .create-session-row {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 760px) {

    body.page-cabinet {
        padding: 12px;
    }

    body.page-cabinet .create-row input[type="text"] {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }

    body.page-cabinet .create-row button {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }

    body.page-cabinet .create-session-submit button {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }

    body.page-cabinet .button-link {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }

    body.page-cabinet table {
        display: block;
    }

    body.page-cabinet thead {
        display: block;
    }

    body.page-cabinet tbody {
        display: block;
    }

    body.page-cabinet th {
        display: block;
    }

    body.page-cabinet td {
        display: block;
    }

    body.page-cabinet tr {
        display: block;
    }

    body.page-cabinet thead {
        display: none;
    }

    body.page-cabinet tr {
        border-bottom: 1px solid #333;
        padding: 10px 0;
    }

    body.page-cabinet td {
        border: 0;
        padding: 6px 0;
    }

}

body.page-cabinet .free-note {
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid #2f7d32;
    border-radius: 10px;
    background: rgba(56, 142, 60, 0.12);
    color: #d8ffd8;
}

body.page-cabinet .disabled-storefront-link {
    color: #777;
    opacity: 0.65;
    text-decoration: none;
    cursor: not-allowed;
}

body.page-cabinet .green-action-link {
    background: none;
    border: 0;
    padding: 0;
    margin: 0;
    color: #6ee76e;
    text-decoration: underline;
    cursor: pointer;
    font: inherit;
    font-weight: 600;
}

body.page-cabinet .green-action-link:hover {
    color: #9cff9c;
}

body.page-cabinet .inline-form {
    display: inline;
    margin: 0;
    padding: 0;
}

body.page-cabinet .mode-select {
    font-size: 13px;
    padding: 7px 8px;
    max-width: 220px;
}

body.page-cabinet .qr-card {
    margin-top: 14px;
    padding: 12px;
    background: #111;
    border: 1px solid #333;
    border-radius: 10px;
    text-align: center;
}

body.page-cabinet .qr-card img {
    width: 180px;
    height: 180px;
    background: #fff;
    padding: 8px;
    border-radius: 8px;
}

body.page-cabinet .qr-card .muted {
    margin-top: 8px;
}

#stream-access-request .stream-access-form {
            margin-top: 14px;
            max-width: 100%;
        }

        #stream-access-request .stream-access-field {
            margin: 14px 0 12px;
        }

        #stream-access-request .stream-access-label {
            display: block;
            margin-bottom: 8px;
            color: #fff;
        }

        #stream-access-request .stream-access-comment {
            display: block;
            width: 100%;
            min-height: 124px;
            box-sizing: border-box;
            resize: vertical;
            padding: 12px 14px;
            border: 1px solid rgba(255,255,255,.16);
            border-radius: 10px;
            background: #0f0f0f;
            color: #f5f5f5;
            font: inherit;
            line-height: 1.45;
        }

        #stream-access-request .stream-access-comment::placeholder {
            color: #9aa0a6;
            opacity: 1;
        }

        #stream-access-request .stream-access-sent-comment {
            box-sizing: border-box;
            width: 100%;
            max-width: 100%;
            white-space: pre-wrap;
            background: #0f0f0f;
            border: 1px solid #2f5f2f;
            border-radius: 8px;
            padding: 12px;
            color: #e5e5e5;
        }

        #stream-access-request .stream-access-comment:focus {
            outline: none;
            border-color: #3b8b38;
            box-shadow: 0 0 0 3px rgba(59,139,56,.25);
        }
		
        .delete-session-form {
            margin-top: 8px;
        }

        .delete-action-link {
            border: 0;
            padding: 0;
            background: transparent;
            color: #ff7777;
            cursor: pointer;
            font: inherit;
            text-decoration: underline;
        }

        .delete-action-link:hover {
            color: #ff9a9a;
        }


/* ===== install_mod.php ===== */

body.page-install-mod {
    margin: 0;
    padding: 24px;
    background: #101010;
    color: #eee;
    font-family: Arial, sans-serif;
    font-size: 16px;
}

body.page-install-mod a {
    color: #7cc7ff;
}

body.page-install-mod .wrap {
    max-width: 1050px;
    margin: 0 auto;
}

body.page-install-mod h1 {
    margin-top: 0;
}

body.page-install-mod h2 {
    margin-top: 0;
}

body.page-install-mod h3 {
    margin-top: 0;
}

body.page-install-mod .top {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 18px;
}

body.page-install-mod .box {
    background: #181818;
    border: 1px solid #333;
    border-radius: 12px;
    padding: 18px;
    margin-bottom: 18px;
}

body.page-install-mod .hero {
    border-color: #2e7d32;
    background: #152016;
}

body.page-install-mod .note {
    padding: 12px 14px;
    border: 1px solid #2f7d32;
    border-radius: 10px;
    background: rgba(56, 142, 60, 0.12);
    color: #d8ffd8;
    margin: 14px 0 0;
}

body.page-install-mod .warn {
    padding: 12px 14px;
    border: 1px solid #7d5b2f;
    border-radius: 10px;
    background: rgba(142, 101, 56, 0.12);
    color: #ffe7c2;
    margin: 14px 0;
}

body.page-install-mod .danger-note {
    padding: 12px 14px;
    border: 1px solid #8b3333;
    border-radius: 10px;
    background: rgba(160, 50, 50, 0.16);
    color: #ffd0d0;
    margin: 14px 0;
}

body.page-install-mod .steps {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

body.page-install-mod .step {
    background: #151515;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 16px;
}

body.page-install-mod .step-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

body.page-install-mod .step-num {
    display: inline-flex;
    width: 30px;
    height: 30px;
    align-items: center;
    justify-content: center;
    background: #2e7d32;
    color: #fff;
    border-radius: 999px;
    font-weight: bold;
    flex: 0 0 auto;
}

body.page-install-mod .step h3 {
    margin: 0;
}

body.page-install-mod .muted {
    color: #aaa;
    font-size: 14px;
}

body.page-install-mod code {
    display: inline-block;
    max-width: 100%;
    box-sizing: border-box;
    padding: 4px 7px;
    border-radius: 6px;
    background: #0d0d0d;
    border: 1px solid #333;
    color: #e8e8e8;
    font-family: Consolas, monospace;
    word-break: break-all;
}

body.page-install-mod .path-block {
    display: block;
    margin: 8px 0;
    padding: 10px;
}

body.page-install-mod .image-box {
    margin-top: 12px;
    border: 1px solid #333;
    border-radius: 12px;
    background: #101010;
    padding: 10px;
}

body.page-install-mod .image-box img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}

body.page-install-mod .check-list {
    margin: 10px 0 0;
    padding-left: 22px;
}

body.page-install-mod .check-list li {
    margin: 7px 0;
}

body.page-install-mod .button-link {
    cursor: pointer;
    background: #2e7d32;
    color: white;
    border: 0;
    text-decoration: none;
    display: inline-block;
    padding: 11px 14px;
    border-radius: 8px;
    font-size: 16px;
    line-height: 1.2;
}

body.page-install-mod .button-link.secondary {
    background: #333;
}

body.page-install-mod .actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 14px;
}

@media (max-width: 760px) {

    body.page-install-mod {
        padding: 12px;
    }

    body.page-install-mod .top {
        display: block;
    }

    body.page-install-mod .button-link {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }

}


/* ===== login.php ===== */

body.page-login {
    font-family: Arial, sans-serif;
    max-width: 720px;
    margin: 40px auto;
    padding: 0 16px;
    line-height: 1.5;
    background: #111;
    color: #eee;
}

body.page-login input {
    font-size: 16px;
    padding: 10px;
}

body.page-login button {
    font-size: 16px;
    padding: 10px;
}

body.page-login input {
    width: 100%;
    box-sizing: border-box;
    margin: 8px 0 16px;
    background: #181818;
    color: #eee;
    border: 1px solid #444;
    border-radius: 6px;
}

body.page-login button {
    cursor: pointer;
    background: #2e7d32;
    color: white;
    border: 0;
    border-radius: 6px;
}

body.page-login .box {
    border: 1px solid #333;
    padding: 20px;
    border-radius: 8px;
    background: #1b1b1b;
}

body.page-login .error {
    color: #ff7777;
}

body.page-login .ok {
    color: #7dff91;
}

body.page-login a {
    color: #7cc7ff;
}

body.page-login .muted {
    color: #999;
    font-size: 14px;
}


/* ===== register.php ===== */

body.page-register {
    margin: 0;
    padding: 20px;
    font-family: Arial, sans-serif;
    background: #111;
    color: #eee;
}

body.page-register .wrap {
    max-width: 520px;
    margin: 0 auto;
}

body.page-register .box {
    background: #1b1b1b;
    border: 1px solid #333;
    border-radius: 12px;
    padding: 20px;
}

body.page-register input {
    width: 100%;
    box-sizing: border-box;
    font-size: 16px;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 12px;
}

body.page-register button {
    width: 100%;
    box-sizing: border-box;
    font-size: 16px;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 12px;
}

body.page-register input {
    background: #111;
    color: #eee;
    border: 1px solid #444;
}

body.page-register button {
    background: #2e7d32;
    color: white;
    border: 0;
    cursor: pointer;
}

body.page-register .err {
    background: #4a1d1d;
    border: 1px solid #8a3333;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 12px;
}

body.page-register .muted {
    color: #999;
    font-size: 14px;
}

body.page-register a {
    color: #7cc7ff;
}


/* ===== verify_email.php ===== */

body.page-verify-email {
    margin: 0;
    padding: 20px;
    font-family: Arial, sans-serif;
    background: #111;
    color: #eee;
}

body.page-verify-email .wrap {
    max-width: 520px;
    margin: 0 auto;
}

body.page-verify-email .box {
    background: #1b1b1b;
    border: 1px solid #333;
    border-radius: 12px;
    padding: 20px;
}

body.page-verify-email input {
    width: 100%;
    box-sizing: border-box;
    font-size: 16px;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 12px;
}

body.page-verify-email button {
    width: 100%;
    box-sizing: border-box;
    font-size: 16px;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 12px;
}

body.page-verify-email input {
    background: #111;
    color: #eee;
    border: 1px solid #444;
}

body.page-verify-email button {
    background: #2e7d32;
    color: white;
    border: 0;
    cursor: pointer;
}

body.page-verify-email .err {
    background: #4a1d1d;
    border: 1px solid #8a3333;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 12px;
}

body.page-verify-email .ok {
    background: #1e4a24;
    border: 1px solid #348a3e;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 12px;
}

body.page-verify-email a {
    color: #7cc7ff;
}

body.page-verify-email .muted {
    color: #999;
    font-size: 14px;
}


/* ===== session_events.php ===== */

body.page-session-events * {
    box-sizing: border-box;
}

body.page-session-events {
    margin: 0;
    padding: 20px;
    font-family: Arial, sans-serif;
    background: #111;
    color: #eee;
}

body.page-session-events a {
    color: #7cc7ff;
}

body.page-session-events .wrap {
    max-width: 1180px;
    margin: 0 auto;
}

body.page-session-events .top {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

body.page-session-events .box {
    background: #1b1b1b;
    border: 1px solid #333;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 18px;
}

body.page-session-events .flash {
    border-radius: 10px;
    padding: 12px 14px;
    margin-bottom: 18px;
}

body.page-session-events .flash.ok {
    background: #15351f;
    color: #b7ffca;
    border: 1px solid #2b6a3a;
}

body.page-session-events .flash.err {
    background: #3a1717;
    color: #ffb7b7;
    border: 1px solid #6d2b2b;
}

body.page-session-events input {
    font-size: 14px;
    padding: 9px;
    border-radius: 8px;
    border: 1px solid #444;
}

body.page-session-events select {
    font-size: 14px;
    padding: 9px;
    border-radius: 8px;
    border: 1px solid #444;
}

body.page-session-events textarea {
    font-size: 14px;
    padding: 9px;
    border-radius: 8px;
    border: 1px solid #444;
}

body.page-session-events button {
    font-size: 14px;
    padding: 9px;
    border-radius: 8px;
    border: 1px solid #444;
}

body.page-session-events input {
    background: #111;
    color: #eee;
    width: 100%;
}

body.page-session-events select {
    background: #111;
    color: #eee;
    width: 100%;
}

body.page-session-events textarea {
    background: #111;
    color: #eee;
    width: 100%;
}

body.page-session-events textarea {
    min-height: 76px;
    resize: vertical;
    font-family: Consolas, monospace;
    font-size: 13px;
}

body.page-session-events button {
    cursor: pointer;
    background: #2e7d32;
    color: white;
    border: 0;
    white-space: nowrap;
}

body.page-session-events .btn-muted {
    background: #333;
}

body.page-session-events .btn-danger {
    background: #7d2e2e;
}

body.page-session-events .muted {
    color: #999;
    font-size: 13px;
}

body.page-session-events .token {
    font-family: monospace;
    font-size: 12px;
    word-break: break-all;
    color: #bbb;
}

body.page-session-events .token a {
    margin-left: 10px;
    font-family: Arial, sans-serif;
    font-size: 13px;
    white-space: nowrap;
}

body.page-session-events .active {
    color: #6ee36e;
    font-weight: bold;
}

body.page-session-events .inactive {
    color: #aaa;
}

body.page-session-events .toolbar {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

body.page-session-events .toolbar form {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

body.page-session-events .toolbar input[type="text"] {
    width: 260px;
}

body.page-session-events .filters {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
}

body.page-session-events .filter-link {
    display: inline-block;
    padding: 7px 10px;
    border: 1px solid #333;
    border-radius: 999px;
    text-decoration: none;
    color: #ccc;
    background: #181818;
}

body.page-session-events .filter-link.active-filter {
    color: #fff;
    background: #2e7d32;
    border-color: #2e7d32;
    font-weight: bold;
}

body.page-session-events .events-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

body.page-session-events .event-card {
    background: #181818;
    border: 1px solid #333;
    border-radius: 12px;
    padding: 14px;
}

body.page-session-events .event-card.enabled-card {
    border-color: #2e7d32;
}

body.page-session-events .event-image {
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #101010;
    border: 1px solid #2a2a2a;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 12px;
}

body.page-session-events .event-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

body.page-session-events .event-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 12px;
}

body.page-session-events .event-title {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.25;
}

body.page-session-events .grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: end;
}

body.page-session-events .two-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    align-items: end;
}

body.page-session-events .spawn-head {
    display: grid;
    grid-template-columns: 0.8fr 1fr 1fr;
    gap: 10px;
    margin-top: 2px;
}

body.page-session-events .distance-title {
    grid-column: 2 / 4;
    color: #aaa;
    font-size: 12px;
}

body.page-session-events .spawn-row {
    display: grid;
    grid-template-columns: 0.8fr 1fr 1fr;
    gap: 10px;
    align-items: end;
}

body.page-session-events .field label {
    display: block;
    margin-bottom: 5px;
    color: #aaa;
    font-size: 12px;
}

body.page-session-events .message-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: end;
    margin-top: 10px;
}

body.page-session-events .message-fields {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

body.page-session-events .message-fields.one-field {
    grid-template-columns: 1fr;
}

body.page-session-events .message-fields .two-cols {
    margin-top: 0;
}

body.page-session-events .readonly {
    opacity: 0.75;
}

body.page-session-events .checkbox-line {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 22px;
}

body.page-session-events .checkbox-line input {
    width: auto;
}

body.page-session-events .quick-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

body.page-session-events .quick-actions form {
    display: inline;
}

body.page-session-events .quick-actions button {
    padding: 7px 9px;
    font-size: 13px;
}

@media (max-width: 1180px) {

    body.page-session-events .events-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

}

@media (max-width: 900px) {

    body.page-session-events .events-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 620px) {

    body.page-session-events {
        padding: 12px;
    }

    body.page-session-events .events-grid {
        grid-template-columns: 1fr;
    }

    body.page-session-events .toolbar input[type="text"] {
        width: 100%;
    }

    body.page-session-events .spawn-head {
        grid-template-columns: 1fr;
    }

    body.page-session-events .distance-title {
        grid-column: 1;
    }

    body.page-session-events .spawn-row {
        grid-template-columns: 1fr;
    }

    body.page-session-events .toolbar form {
        width: 100%;
    }

    body.page-session-events .toolbar button {
        width: 100%;
    }

    body.page-session-events .toolbar select {
        width: 100%;
    }

    body.page-session-events .toolbar input {
        width: 100%;
    }

}


/* ===== storefront.php ===== */

.store-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 14px 0 16px;
}

   .store-tab {
	border: 1px solid rgba(255,255,255,.16);
	background: rgba(255,255,255,.06);
	color: inherit;
	border-radius: 999px;
	padding: 8px 12px;
	cursor: pointer;
	font: inherit;
	line-height: 1.2;
}

    .store-tab.active {
        background: rgba(255,255,255,.18);
        border-color: rgba(255,255,255,.38);
    }

    .store-tab-count {
        opacity: .72;
        margin-left: 4px;
    }

body.page-storefront * {
    box-sizing: border-box;
}

body.page-storefront {
    margin: 0;
    padding: 16px;
    font-family: Arial, Helvetica, sans-serif;
    background: #111;
    color: #fff;
}

body.page-storefront .wrap {
    max-width: 1120px;
    margin: 0 auto;
}

body.page-storefront.storefront-log-enabled .wrap {
    max-width: 1120px;
}

body.page-storefront h1 {
    margin: 0 0 6px 0;
    font-size: 26px;
}

body.page-storefront .sub {
    margin-bottom: 16px;
    color: #bbb;
    font-size: 14px;
    line-height: 1.4;
}

body.page-storefront .free-note {
    margin-bottom: 16px;
    padding: 10px 12px;
    border: 1px solid #2f7d32;
    border-radius: 10px;
    background: rgba(56, 142, 60, 0.12);
    color: #d8ffd8;
    font-size: 14px;
    line-height: 1.35;
}

body.page-storefront .status {
    margin-bottom: 14px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #1f1f1f;
    color: #ddd;
    font-size: 14px;
    min-height: 40px;
}

body.page-storefront .status.ok {
    background: #15351f;
    color: #b7ffca;
}

body.page-storefront .status.err {
    background: #3a1717;
    color: #ffb7b7;
}

body.page-storefront .donor-box {
    display: none;
    margin-bottom: 16px;
}

body.page-storefront .donor-box label {
    display: block;
    margin-bottom: 6px;
    color: #ccc;
    font-size: 13px;
}

body.page-storefront .donor-box input {
    width: 100%;
    max-width: 420px;
    padding: 12px;
    border-radius: 10px;
    border: 1px solid #333;
    background: #181818;
    color: #fff;
    font-size: 16px;
}

body.page-storefront .grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch;
}

body.page-storefront.storefront-log-enabled .grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.page-storefront .card {
    border: 1px solid #2e7d32;
    background: #181818;
    border-radius: 14px;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    min-height: 100%;
}

body.page-storefront .card:active {
    transform: scale(0.98);
}

body.page-storefront .card.disabled {
    opacity: 0.45;
    cursor: not-allowed;
    border-color: #333;
}

body.page-storefront .image-box {
    width: 100%;
    aspect-ratio: 1 / 1;
    border: 1px solid #2f2f2f;
    border-radius: 10px;
    background: #111;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

body.page-storefront .image-box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

body.page-storefront .title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

body.page-storefront .title {
    font-size: 17px;
    /*font-weight: 800;*/
    line-height: 1.15;
    min-height: 39px;
}

body.page-storefront .amount {
    color: #ffd36b;
    font-size: 15px;
    font-weight: 800;
    white-space: nowrap;
}

body.page-storefront .desc {
    min-height: 18px;
    color: #aaa;
    font-size: 12px;
    line-height: 1.25;
}

body.page-storefront .badge {
    display: inline-block;
    padding: 3px 7px;
    border-radius: 999px;
    background: #2a2a2a;
    color: #bbb;
    font-size: 11px;
}

body.page-storefront .run-btn {
    width: 100%;
    margin-top: auto;
    border: 0;
    border-radius: 8px;
    background: #2e7d32;
    color: #fff;
    padding: 11px 14px;
    font-size: 16px;
    cursor: pointer;
}

body.page-storefront .card.disabled .run-btn {
    background: #333;
    color: #aaa;
    cursor: not-allowed;
}

body.page-storefront .footer {
    margin-top: 18px;
    color: #777;
    font-size: 12px;
    line-height: 1.35;
}

@media (max-width: 1180px) {

    body.page-storefront .grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

}

@media (max-width: 900px) {

    body.page-storefront .grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 620px) {

    body.page-storefront {
        padding: 10px;
    }

    body.page-storefront .grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    body.page-storefront .card {
        padding: 10px;
        border-radius: 12px;
        gap: 8px;
    }

    body.page-storefront .title {
        font-size: 14px;
        min-height: 34px;
    }

    body.page-storefront .desc {
        font-size: 11px;
        min-height: 16px;
    }

    body.page-storefront .badge {
        font-size: 10px;
        padding: 2px 6px;
    }

    body.page-storefront .run-btn {
        padding: 9px 8px;
        font-size: 14px;
    }

    body.page-storefront h1 {
        font-size: 22px;
    }

}


/* ===== verify.php ===== */

body.page-verify {
    font-family: Arial, sans-serif;
    max-width: 720px;
    margin: 40px auto;
    padding: 0 16px;
    line-height: 1.5;
    background: #111;
    color: #eee;
}

body.page-verify input,
body.page-verify button {
    font-size: 16px;
    padding: 10px;
}

body.page-verify input {
    width: 100%;
    box-sizing: border-box;
    margin: 8px 0 16px;
    background: #181818;
    color: #eee;
    border: 1px solid #444;
    border-radius: 6px;
}

body.page-verify button {
    cursor: pointer;
    background: #2e7d32;
    color: white;
    border: 0;
    border-radius: 6px;
}

body.page-verify .box {
    border: 1px solid #333;
    padding: 20px;
    border-radius: 8px;
    background: #1b1b1b;
}

body.page-verify .error {
    color: #ff7777;
}

body.page-verify a {
    color: #7cc7ff;
}







/* ===== session_events.php ajax actions ===== */

body.page-session-events .event-actions-row {
    display: grid;
    grid-template-columns: 76px 1fr;
    gap: 10px;
    align-items: center;
    margin-top: 12px;
}

body.page-session-events .event-actions-row button {
    width: 100%;
}

body.page-session-events button.is-busy {
    opacity: 0.65;
    cursor: wait;
}

body.page-session-events .ajax-toast {
    position: fixed;
    top: 16px;
    left: 50%;
    z-index: 10000;
    transform: translate(-50%, -18px);
    opacity: 0;
    pointer-events: none;
    min-width: 220px;
    max-width: calc(100vw - 28px);
    padding: 12px 16px;
    border-radius: 10px;
    text-align: center;
    font-weight: bold;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.42);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

body.page-session-events .ajax-toast.visible {
    opacity: 1;
    transform: translate(-50%, 0);
}

body.page-session-events .ajax-toast.ok {
    background: #15351f;
    color: #b7ffca;
    border: 1px solid #2b6a3a;
}

body.page-session-events .ajax-toast.err {
    background: #3a1717;
    color: #ffb7b7;
    border: 1px solid #6d2b2b;
}


/* ===== session_events.php nameplate tooltip ===== */

body.page-session-events .nameplate-toggle {
    position: relative;
    align-items: flex-start;
    margin-top: 16px;
}

body.page-session-events .nameplate-tooltip {
    position: relative;
    cursor: help;
    line-height: 1.25;
    text-decoration: underline dotted rgba(255, 255, 255, 0.35);
    text-underline-offset: 3px;
}

body.page-session-events .nameplate-tooltip::before,
body.page-session-events .nameplate-tooltip::after {
    position: absolute;
    left: 50%;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease, transform 0.15s ease;
}

body.page-session-events .nameplate-tooltip::before {
    content: attr(data-tooltip);
    bottom: calc(100% + 10px);
    z-index: 10001;
    width: max-content;
    max-width: 260px;
    padding: 8px 10px;
    border: 1px solid #444;
    border-radius: 8px;
    background: #0f0f0f;
    color: #eee;
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45);
    font-size: 12px;
    font-weight: normal;
    line-height: 1.35;
    text-align: left;
    transform: translate(-50%, 4px);
}

body.page-session-events .nameplate-tooltip::after {
    content: "";
    bottom: calc(100% + 4px);
    z-index: 10002;
    border: 6px solid transparent;
    border-top-color: #0f0f0f;
    transform: translate(-50%, 4px);
}

body.page-session-events .nameplate-tooltip:hover::before,
body.page-session-events .nameplate-tooltip:hover::after,
body.page-session-events .nameplate-tooltip:focus::before,
body.page-session-events .nameplate-tooltip:focus::after {
    opacity: 1;
    transform: translate(-50%, 0);
}


/* ===== storefront visual strength cards ===== */
body.page-storefront .card {
    position: relative;
    overflow: hidden;
    gap: 12px;
    padding: 14px 14px 16px 16px;
    border-color: rgba(46, 125, 50, 0.55);
    transition: transform .16s ease, box-shadow .18s ease, border-color .18s ease;
}

body.page-storefront .card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-radius: 14px 0 0 14px;
    background: rgba(120, 146, 170, 0.9);
    box-shadow: 0 0 14px rgba(120, 146, 170, 0.35);
}

body.page-storefront .card.card-help::before {
    background: #49b95a;
    box-shadow: 0 0 16px rgba(73, 185, 90, 0.38);
}

body.page-storefront .card.card-harm::before {
    background: #db463e;
    box-shadow: 0 0 16px rgba(219, 70, 62, 0.42);
}

body.page-storefront .card.card-neutral::before {
    background: #88a6c7;
    box-shadow: 0 0 14px rgba(136, 166, 199, 0.28);
}

body.page-storefront .card:hover {
    transform: translateY(-2px);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.04), 0 12px 28px rgba(0,0,0,0.36);
}

body.page-storefront .card.card-help:hover {
    border-color: rgba(73, 185, 90, 0.9);
    box-shadow: 0 0 0 1px rgba(73, 185, 90, 0.10), 0 0 22px rgba(73, 185, 90, 0.18), 0 12px 28px rgba(0,0,0,0.38);
}

body.page-storefront .card.card-harm:hover {
    border-color: rgba(219, 70, 62, 0.92);
    box-shadow: 0 0 0 1px rgba(219, 70, 62, 0.10), 0 0 24px rgba(219, 70, 62, 0.22), 0 12px 28px rgba(0,0,0,0.38);
}

body.page-storefront .card.card-neutral:hover {
    border-color: rgba(136, 166, 199, 0.9);
    box-shadow: 0 0 0 1px rgba(136, 166, 199, 0.10), 0 0 20px rgba(136, 166, 199, 0.18), 0 12px 28px rgba(0,0,0,0.38);
}

body.page-storefront .image-box {
    position: relative;
}

body.page-storefront .image-amount {
    position: absolute;
    right: 8px;
    bottom: 8px;
    z-index: 3;
    max-width: calc(100% - 16px);
    padding: 5px 8px;
    border-radius: 9px;
    background: linear-gradient(180deg, rgba(34, 24, 8, 0.86), rgba(13, 13, 13, 0.92));
    border: 1px solid rgba(255, 211, 107, 0.54);
    color: #ffe08a;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    text-shadow: 0 2px 5px rgba(0,0,0,0.86);
    box-shadow: 0 6px 18px rgba(0,0,0,0.34);
    pointer-events: none;
}

body.page-storefront .effect-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
    border: 1px solid rgba(255,255,255,0.14);
    background: rgba(17,17,17,0.72);
    backdrop-filter: blur(3px);
}

body.page-storefront .effect-badge.effect-help {
    color: #d7ffd8;
    background: rgba(50, 126, 58, 0.72);
    box-shadow: 0 0 16px rgba(73, 185, 90, 0.25);
}

body.page-storefront .effect-badge.effect-harm {
    color: #ffe0de;
    background: rgba(126, 39, 39, 0.74);
    box-shadow: 0 0 16px rgba(219, 70, 62, 0.28);
}

body.page-storefront .effect-badge.effect-neutral {
    color: #eef5ff;
    background: rgba(60, 74, 92, 0.75);
    box-shadow: 0 0 14px rgba(136, 166, 199, 0.22);
}

body.page-storefront .title {
    min-height: 0;
}

body.page-storefront .impact-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 12px;
}

body.page-storefront .impact-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.06);
    flex: 0 0 auto;
}

body.page-storefront .impact-dot.harm.filled {
    background: #e34d43;
    border-color: rgba(227, 77, 67, 0.85);
    box-shadow: 0 0 8px rgba(227, 77, 67, 0.22);
}

body.page-storefront .impact-dot.help.filled {
    background: #67c96f;
    border-color: rgba(103, 201, 111, 0.85);
    box-shadow: 0 0 8px rgba(103, 201, 111, 0.22);
}

body.page-storefront .impact-dot.neutral.filled {
    background: #96afd0;
    border-color: rgba(150, 175, 208, 0.85);
    box-shadow: 0 0 8px rgba(150, 175, 208, 0.18);
}

body.page-storefront .card-divider {
    height: 1px;
    width: 100%;
    background: rgba(255,255,255,0.14);
    margin-top: -2px;
}

body.page-storefront .card-divider.divider-help {
    background: rgba(103, 201, 111, 0.9);
}

body.page-storefront .card-divider.divider-harm {
    background: rgba(227, 77, 67, 0.92);
}

body.page-storefront .card-divider.divider-neutral {
    background: rgba(150, 175, 208, 0.88);
}

body.page-storefront .desc {
    min-height: 34px;
}

body.page-storefront .run-btn {
    display: none !important;
}


/* ===== storefront visual strength fix: border color by event side ===== */
body.page-storefront .card {
    border-color: rgba(136, 166, 199, 0.42);
}

body.page-storefront .card.card-help {
    border-color: rgba(73, 185, 90, 0.62);
}

body.page-storefront .card.card-harm {
    border-color: rgba(219, 70, 62, 0.66);
}

body.page-storefront .card.card-neutral {
    border-color: rgba(136, 166, 199, 0.48);
}

body.page-storefront .card.disabled {
    border-color: #333;
}

/* ===== common top actions locale select override ===== */
/* Держим верхний выбор языка светлым даже на страницах с тёмными общими select. */
body .top-actions .top-language-select,
body.page-cabinet .top-actions .top-language-select,
body.page-session-events .top-actions .top-language-select,
body.page-install-mod .top-actions .top-language-select,
body.page-login .top-actions .top-language-select,
body.page-register .top-actions .top-language-select,
body.page-storefront .top-actions .top-language-select {
    width: auto;
    min-width: 104px;
    max-width: 150px;
    height: 30px;
    box-sizing: border-box;
    padding: 3px 8px;
    border: 1px solid #cfcfcf;
    border-radius: 8px;
    background: #fff;
    color: #111;
    font-size: 13px;
    line-height: 1.2;
    color-scheme: light;
    appearance: auto;
}

body .top-actions .top-language-select option,
body.page-cabinet .top-actions .top-language-select option,
body.page-session-events .top-actions .top-language-select option,
body.page-install-mod .top-actions .top-language-select option,
body.page-login .top-actions .top-language-select option,
body.page-register .top-actions .top-language-select option,
body.page-storefront .top-actions .top-language-select option {
    background: #fff;
    color: #111;
}

/* ===== storefront payment buttons ===== */
/*
    Режим стрима:
    - прямой клик по карточке не запускает событие;
    - событие запускается только после успешной оплаты через платёжную кнопку.
*/
body.page-storefront .card.card-paymode {
    cursor: default;
}

body.page-storefront .card.card-paymode:active {
    transform: none;
}

body.page-storefront .payment-box {
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.08);
}

body.page-storefront .payment-row {
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
}

body.page-storefront .payment-note {
    min-height: 15px;
}

body.page-storefront .payment-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    align-items: stretch;
}

body.page-storefront .pay-btn {
    min-width: 0;
    width: 100%;
    border: 1px solid rgba(255,255,255,0.14);
    border-radius: 9px;
    padding: 9px 8px;
    background: #242424;
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-height: 38px;
    transition: transform .14s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

body.page-storefront .pay-btn-main {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.page-storefront .pay-btn-sub {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: .1px;
    opacity: .9;
}

body.page-storefront .pay-btn:hover {
    transform: translateY(-1px);
}

body.page-storefront .pay-btn-donationalerts {
    color: #ffd38a;
    border-color: rgba(255, 158, 44, 0.68);
    background: linear-gradient(180deg, rgba(117, 69, 16, 0.72), rgba(58, 37, 14, 0.86));
    box-shadow: 0 0 14px rgba(255, 158, 44, 0.12);
}

body.page-storefront .pay-btn-donationalerts:hover {
    border-color: rgba(255, 178, 70, 0.95);
    box-shadow: 0 0 18px rgba(255, 158, 44, 0.22);
}

body.page-storefront .pay-btn-platega {
    color: #cfe4ff;
    border-color: rgba(95, 154, 219, 0.58);
    background: linear-gradient(180deg, rgba(24, 53, 87, 0.72), rgba(13, 31, 55, 0.86));
    box-shadow: 0 0 14px rgba(95, 154, 219, 0.10);
}

body.page-storefront .pay-btn-platega .pay-btn-sub {
    color: #d9f4ff;
}

body.page-storefront .pay-btn-platega:hover {
    border-color: rgba(113, 178, 255, 0.9);
    box-shadow: 0 0 18px rgba(95, 154, 219, 0.20);
}

body.page-storefront .pay-btn.is-disabled,
body.page-storefront .pay-btn:disabled,
body.page-storefront .pay-btn-disabled {
    cursor: not-allowed;
    opacity: 0.48;
    transform: none;
    box-shadow: none;
}

body.page-storefront .payment-note {
    margin-top: 8px;
    color: #777;
    font-size: 11px;
    line-height: 1.28;
}

@media (max-width: 620px) {
    body.page-storefront .payment-row {
        gap: 6px;
    }

    body.page-storefront .pay-btn {
        padding: 8px 6px;
        min-height: 36px;
        font-size: 12px;
    }

    body.page-storefront .pay-btn-sub {
        font-size: 9px;
    }

    body.page-storefront .payment-note {
        font-size: 10px;
    }
}


/* Больше вертикального воздуха между строками карточек витрины. */
body.page-storefront .grid {
    row-gap: 22px;
}

@media (max-width: 620px) {
    body.page-storefront .grid {
        row-gap: 16px;
    }
}

/* ===== storefront payment modal ===== */
body.page-storefront.payment-modal-open {
    overflow: hidden;
}

body.page-storefront .payment-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

body.page-storefront .payment-modal.is-visible {
    display: flex;
}

body.page-storefront .payment-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.72);
    backdrop-filter: blur(3px);
}

body.page-storefront .payment-modal-dialog {
    position: relative;
    z-index: 1;
    width: min(520px, 100%);
    border: 1px solid rgba(255, 211, 107, 0.38);
    border-radius: 16px;
    background: linear-gradient(180deg, #23201a, #151515);
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.66), 0 0 28px rgba(255, 158, 44, 0.12);
    padding: 22px;
    color: #fff;
}

body.page-storefront .payment-modal-close {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,0.08);
    color: #ddd;
    cursor: pointer;
    font-size: 24px;
    line-height: 1;
}

body.page-storefront .payment-modal-close:hover {
    background: rgba(255,255,255,0.14);
    color: #fff;
}

body.page-storefront .payment-modal-title {
    padding-right: 34px;
    margin-bottom: 14px;
    color: #ffd36b;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.2;
}

body.page-storefront .payment-modal-text {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.42;
}

body.page-storefront .payment-modal-note {
    margin-top: 12px;
    color: #bbb;
    font-size: 14px;
    line-height: 1.4;
}

body.page-storefront .payment-modal-actions {
    display: flex;
    gap: 10px;
    margin-top: 20px;
    align-items: center;
    flex-wrap: wrap;
}

body.page-storefront .payment-modal-pay-link,
body.page-storefront .payment-modal-cancel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    border-radius: 10px;
    padding: 11px 16px;
    font: inherit;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.15;
    text-decoration: none;
    cursor: pointer;
}

body.page-storefront .payment-modal-pay-link {
    flex: 1 1 220px;
    border: 1px solid rgba(255, 178, 70, 0.88);
    background: linear-gradient(180deg, rgba(137, 81, 18, 0.95), rgba(72, 45, 15, 0.95));
    color: #ffe2ad;
    box-shadow: 0 0 18px rgba(255, 158, 44, 0.18);
}

body.page-storefront .payment-modal-pay-link:hover {
    border-color: rgba(255, 200, 112, 1);
    box-shadow: 0 0 24px rgba(255, 158, 44, 0.28);
}

body.page-storefront .payment-modal-cancel {
    flex: 0 0 auto;
    border: 1px solid rgba(255,255,255,0.12);
    background: #2a2a2a;
    color: #ddd;
}

body.page-storefront .payment-modal-cancel:hover {
    background: #333;
    color: #fff;
}

@media (max-width: 620px) {
    body.page-storefront .payment-modal-dialog {
        padding: 18px;
        border-radius: 14px;
    }

    body.page-storefront .payment-modal-title {
        font-size: 18px;
    }

    body.page-storefront .payment-modal-text {
        font-size: 16px;
    }

    body.page-storefront .payment-modal-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    body.page-storefront .payment-modal-pay-link,
    body.page-storefront .payment-modal-cancel {
        width: 100%;
    }
}

/* ===== storefront donation log layout ===== */
body.page-storefront .mobile-storefront-view-tabs {
    display: none;
    gap: 8px;
    margin: 0 0 14px;
    padding: 4px;
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 12px;
    background: rgba(255,255,255,0.045);
}

body.page-storefront .storefront-view-tab {
    flex: 1 1 0;
    border: 1px solid transparent;
    border-radius: 9px;
    padding: 10px 12px;
    background: transparent;
    color: #bbb;
    cursor: pointer;
    font: inherit;
    font-size: 15px;
    font-weight: 800;
}

body.page-storefront .storefront-view-tab.is-active {
    border-color: rgba(255,255,255,0.22);
    background: #2e7d32;
    color: #fff;
}

body.page-storefront .storefront-layout {
    display: block;
}

body.page-storefront.storefront-log-enabled .storefront-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 18px;
    align-items: start;
}

body.page-storefront .storefront-catalog-panel {
    min-width: 0;
}

body.page-storefront .donation-log-panel {
    display: none;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 14px;
    background: linear-gradient(180deg, #1d1d1d, #151515);
    padding: 14px;
    box-shadow: 0 14px 34px rgba(0,0,0,0.24);
}

body.page-storefront.storefront-log-enabled .donation-log-panel {
    display: block;
    position: sticky;
    top: 16px;
    max-height: calc(100vh - 32px);
    overflow: auto;
}

body.page-storefront .donation-log-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 12px;
}

body.page-storefront .donation-log-title {
    font-size: 17px;
    font-weight: 900;
    line-height: 1.15;
}

body.page-storefront .donation-log-subtitle {
    margin-top: 3px;
    color: #888;
    font-size: 12px;
    line-height: 1.25;
}

body.page-storefront .donation-log-refresh {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 999px;
    background: rgba(255,255,255,0.06);
    color: #ddd;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
}

body.page-storefront .donation-log-refresh:hover {
    background: rgba(255,255,255,0.12);
    color: #fff;
}

body.page-storefront .donation-log-status {
    padding: 10px 11px;
    border-radius: 10px;
    background: rgba(255,255,255,0.045);
    color: #aaa;
    font-size: 13px;
    line-height: 1.35;
}

body.page-storefront .donation-log-status.err {
    background: #3a1717;
    color: #ffb7b7;
}

body.page-storefront .donation-log-status.is-hidden {
    display: none;
}

body.page-storefront .donation-log {
    display: grid;
    gap: 9px;
}

body.page-storefront .donation-log-item {
    min-width: 0;
    border: 1px solid rgba(255,255,255,0.08);
    border-left: 4px solid #88a6c7;
    border-radius: 11px;
    background: rgba(255,255,255,0.04);
    padding: 10px 10px 9px;
}

body.page-storefront .donation-log-item-help {
    border-left-color: #49b95a;
}

body.page-storefront .donation-log-item-harm {
    border-left-color: #db463e;
}

body.page-storefront .donation-log-item-neutral {
    border-left-color: #88a6c7;
}

body.page-storefront .donation-log-main {
    display: flex;
    align-items: baseline;
    gap: 6px;
    min-width: 0;
    font-size: 13px;
    line-height: 1.25;
}

body.page-storefront .donation-log-donor {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 95px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #e8e8e8;
    font-weight: 900;
}

body.page-storefront .donation-log-arrow {
    flex: 0 0 auto;
    color: #777;
}

body.page-storefront .donation-log-event {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #ddd;
    font-weight: 700;
}

body.page-storefront .donation-log-meta {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-top: 5px;
    color: #888;
    font-size: 12px;
    line-height: 1.2;
}

body.page-storefront .donation-log-amount {
    color: #ffd36b;
    font-weight: 900;
}

body.page-storefront .donation-log-time {
    flex: 0 0 auto;
    color: #777;
}

@media (max-width: 1180px) {
    body.page-storefront.storefront-log-enabled .storefront-layout {
        grid-template-columns: minmax(0, 1fr) 300px;
        gap: 14px;
    }

    body.page-storefront.storefront-log-enabled .grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    body.page-storefront.storefront-log-enabled .mobile-storefront-view-tabs {
        display: flex;
    }

    body.page-storefront.storefront-log-enabled .storefront-layout {
        display: block;
    }

    body.page-storefront.storefront-log-enabled .donation-log-panel {
        display: none;
        position: static;
        max-height: none;
        overflow: visible;
        margin-top: 0;
    }

    body.page-storefront.storefront-log-enabled.storefront-view-log .storefront-catalog-panel {
        display: none;
    }

    body.page-storefront.storefront-log-enabled.storefront-view-log .donation-log-panel {
        display: block;
    }

    body.page-storefront.storefront-log-enabled .grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    body.page-storefront.storefront-log-enabled .grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.page-storefront .donation-log-panel {
        padding: 12px;
        border-radius: 12px;
    }

    body.page-storefront .donation-log-donor {
        max-width: 82px;
    }
}

/* ===== cabinet storefront settings ===== */
body.page-cabinet .setting-checkline {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 12px;
    color: #eee;
    line-height: 1.35;
}

body.page-cabinet .setting-checkline input {
    width: auto;
    margin: 0;
}

/* ===== storefront catalog layout switch ===== */
body.page-storefront .catalog-view-switch {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
}

body.page-storefront .catalog-view-label {
    color: #aaa;
    font-size: 13px;
    line-height: 1.2;
}

body.page-storefront .catalog-layout-btn {
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.06);
    color: #ddd;
    border-radius: 999px;
    padding: 8px 12px;
    cursor: pointer;
    font: inherit;
    font-size: 14px;
    line-height: 1.2;
}

body.page-storefront .catalog-layout-btn:hover {
    background: rgba(255,255,255,.11);
    color: #fff;
}

body.page-storefront .catalog-layout-btn.is-active {
    background: #2e7d32;
    border-color: #2e7d32;
    color: #fff;
    font-weight: 800;
}

body.page-storefront.storefront-list-view .grid,
body.page-storefront.storefront-log-enabled.storefront-list-view .grid {
    grid-template-columns: 1fr;
    gap: 10px;
    row-gap: 10px;
}

body.page-storefront.storefront-list-view .catalog-row-card {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 340px);
    gap: 14px;
    align-items: center;
    padding: 12px 14px 12px 16px;
    cursor: pointer;
}

body.page-storefront.storefront-list-view .catalog-row-card.card-paymode {
    cursor: default;
}

body.page-storefront.storefront-list-view .catalog-row-card::before {
    width: 5px;
}

body.page-storefront.storefront-list-view .catalog-row-main {
    min-width: 0;
}

body.page-storefront.storefront-list-view .catalog-row-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    min-width: 0;
}

body.page-storefront.storefront-list-view .catalog-row-head .title {
    min-width: 0;
    min-height: 0;
    font-size: 16px;
    line-height: 1.25;
}

body.page-storefront.storefront-list-view .catalog-row-head .amount {
    flex: 0 0 auto;
    font-size: 15px;
}

body.page-storefront.storefront-list-view .catalog-row-card .impact-row {
    margin-top: 7px;
}

body.page-storefront.storefront-list-view .catalog-row-card .card-divider {
    margin: 8px 0 0;
}

body.page-storefront.storefront-list-view .catalog-row-card .desc {
    min-height: 0;
    margin-top: 7px;
    font-size: 13px;
    line-height: 1.35;
}

body.page-storefront.storefront-list-view .catalog-row-actions {
    min-width: 0;
}

body.page-storefront.storefront-list-view .catalog-row-actions .payment-box {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

body.page-storefront.storefront-list-view .catalog-row-actions .payment-note {
    margin-top: 6px;
}

@media (max-width: 900px) {
    body.page-storefront.storefront-list-view .catalog-row-card {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
    }

    body.page-storefront.storefront-list-view .catalog-row-actions {
        margin-top: 2px;
    }
}

@media (max-width: 620px) {
    body.page-storefront .catalog-view-switch {
        margin-bottom: 12px;
    }

    body.page-storefront .catalog-layout-btn {
        flex: 1 1 0;
        text-align: center;
    }

    body.page-storefront.storefront-list-view .catalog-row-card {
        padding: 11px 12px 12px 15px;
        gap: 10px;
    }

    body.page-storefront.storefront-list-view .catalog-row-head {
        display: grid;
        grid-template-columns: 1fr;
        gap: 4px;
    }

    body.page-storefront.storefront-list-view .catalog-row-head .title {
        font-size: 15px;
    }

    body.page-storefront.storefront-list-view .payment-row {
        grid-template-columns: 1fr 1fr;
    }
}

/* ===== storefront catalog layout switch v2 ===== */
body.page-storefront .catalog-view-switch {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 4px 0 16px;
    padding: 5px;
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 13px;
    background: rgba(255,255,255,0.045);
}

body.page-storefront .catalog-view-label {
    padding: 0 5px 0 7px;
    color: #aaa;
    font-size: 13px;
    line-height: 1.2;
}

body.page-storefront .catalog-view-switch .catalog-layout-btn {
    appearance: none;
    border: 1px solid rgba(255,255,255,0.14) !important;
    background: #242424 !important;
    color: #ddd !important;
    border-radius: 10px !important;
    padding: 8px 12px !important;
    cursor: pointer;
    font: inherit;
    font-size: 14px !important;
    font-weight: 700;
    line-height: 1.15;
    min-height: 34px;
    transition: background .15s ease, border-color .15s ease, transform .12s ease, box-shadow .15s ease;
}

body.page-storefront .catalog-view-switch .catalog-layout-btn:hover {
    transform: translateY(-1px);
    background: #303030 !important;
    border-color: rgba(255,255,255,0.26) !important;
    color: #fff !important;
}

body.page-storefront .catalog-view-switch .catalog-layout-btn.is-active {
    background: #2e7d32 !important;
    border-color: #3fa346 !important;
    color: #fff !important;
    box-shadow: 0 0 16px rgba(73, 185, 90, 0.16);
}

body.page-storefront .store-tabs {
    margin-top: 10px;
    margin-bottom: 18px;
    row-gap: 10px;
}

body.page-storefront .grid {
    column-gap: 14px;
    row-gap: 24px;
}

body.page-storefront .card {
    padding: 16px 16px 17px 18px;
    gap: 14px;
}

body.page-storefront .card .title-row {
    margin-top: 1px;
}

body.page-storefront .card .impact-row {
    margin: 0 0 1px;
}

body.page-storefront .card .card-divider {
    margin: 0 0 1px;
}

body.page-storefront .card .desc {
    margin-top: 1px;
    line-height: 1.38;
}

body.page-storefront .payment-box {
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.08);
}

body.page-storefront.storefront-list-view .grid,
body.page-storefront.storefront-log-enabled.storefront-list-view .grid {
    grid-template-columns: 1fr;
    gap: 12px;
    row-gap: 12px;
}

body.page-storefront.storefront-list-view .catalog-row-card {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(190px, 0.9fr) minmax(92px, max-content) minmax(260px, 1.25fr) minmax(250px, 340px);
    gap: 18px;
    align-items: center;
    padding: 14px 16px 14px 20px;
    cursor: pointer;
}

body.page-storefront.storefront-list-view .catalog-row-card.card-paymode {
    cursor: default;
}

body.page-storefront.storefront-list-view .catalog-row-card::before {
    width: 5px;
}

body.page-storefront.storefront-list-view .catalog-row-titlecell,
body.page-storefront.storefront-list-view .catalog-row-pricecell,
body.page-storefront.storefront-list-view .catalog-row-desccell,
body.page-storefront.storefront-list-view .catalog-row-actions {
    min-width: 0;
}

body.page-storefront.storefront-list-view .catalog-row-titlecell {
    display: grid;
    gap: 8px;
}

body.page-storefront.storefront-list-view .catalog-row-titlecell .title {
    min-height: 0;
    font-size: 16px;
    line-height: 1.25;
}

body.page-storefront.storefront-list-view .catalog-row-titlecell .impact-row {
    margin: 0;
}

body.page-storefront.storefront-list-view .catalog-row-badge {
    margin-top: -2px;
}

body.page-storefront.storefront-list-view .catalog-row-pricecell {
    color: #ffd36b;
    font-weight: 900;
    white-space: nowrap;
    text-align: right;
}

body.page-storefront.storefront-list-view .catalog-row-pricecell .amount {
    font-size: 15px;
}

body.page-storefront.storefront-list-view .catalog-row-desccell .desc {
    min-height: 0;
    margin: 0;
    font-size: 13px;
    line-height: 1.4;
}

body.page-storefront.storefront-list-view .catalog-row-actions .payment-box {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

body.page-storefront.storefront-list-view .catalog-row-actions .payment-note {
    margin-top: 6px;
}

@media (max-width: 1180px) {
    body.page-storefront.storefront-list-view .catalog-row-card {
        grid-template-columns: minmax(180px, 0.9fr) minmax(86px, max-content) minmax(220px, 1fr) minmax(230px, 320px);
        gap: 14px;
    }
}

@media (max-width: 900px) {
    body.page-storefront.storefront-list-view .catalog-row-card {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        gap: 11px;
    }

    body.page-storefront.storefront-list-view .catalog-row-pricecell {
        text-align: left;
    }

    body.page-storefront.storefront-list-view .catalog-row-actions {
        margin-top: 1px;
    }
}

@media (max-width: 620px) {
    body.page-storefront .catalog-view-switch {
        display: flex;
        margin-bottom: 12px;
    }

    body.page-storefront .catalog-view-label {
        flex: 0 0 100%;
        padding: 2px 5px 0;
    }

    body.page-storefront .catalog-view-switch .catalog-layout-btn {
        flex: 1 1 0;
        text-align: center;
    }

    body.page-storefront .grid {
        row-gap: 18px;
    }

    body.page-storefront .card {
        padding: 12px 11px 13px 14px;
        gap: 10px;
    }

    body.page-storefront.storefront-list-view .catalog-row-card {
        padding: 12px 12px 13px 16px;
    }

    body.page-storefront.storefront-list-view .payment-row {
        grid-template-columns: 1fr 1fr;
    }
}

/* ===== apply.php form cleanup ===== */
body.page-register * {
    box-sizing: border-box;
}

body.page-register .apply-intro {
    margin: 0 0 16px;
    padding: 12px 14px;
    border: 1px solid #2f7d32;
    border-radius: 10px;
    background: rgba(56, 142, 60, 0.12);
    color: #d8ffd8;
    font-size: 14px;
    line-height: 1.45;
}

body.page-register .apply-form {
    margin-top: 14px;
}

body.page-register .apply-label {
    display: block;
    margin: 14px 0 7px;
    color: #f0f0f0;
    font-weight: 700;
    line-height: 1.25;
}

body.page-register textarea.apply-textarea {
    display: block;
    width: 100%;
    min-height: 124px;
    box-sizing: border-box;
    margin: 0 0 14px;
    padding: 12px;
    border: 1px solid #444;
    border-radius: 8px;
    background: #111;
    color: #eee;
    font: inherit;
    line-height: 1.45;
    resize: vertical;
}

body.page-register textarea.apply-textarea::placeholder {
    color: #777;
    opacity: 1;
}

body.page-register textarea.apply-textarea:focus {
    outline: none;
    border-color: #3b8b38;
    box-shadow: 0 0 0 3px rgba(59, 139, 56, 0.25);
}

body.page-register .robotron-label,
body.page-register .apply-checkline {
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
    max-width: 100%;
    margin: 8px 0 16px;
    color: #eee;
    font-weight: 700;
    line-height: 1.25;
    cursor: pointer;
}

body.page-register input.robotron-checkbox,
body.page-register .robotron-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    min-width: 18px;
    margin: 0;
    padding: 0;
    flex: 0 0 auto;
    accent-color: #2e7d32;
}


/* ===== storefront category row: tabs left, sort right ===== */
body.page-storefront .store-tabs-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 14px 0 18px;
}

body.page-storefront .store-tabs-row .store-tabs {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
}

body.page-storefront .store-tabs-row .catalog-sort-btn {
    flex: 0 0 auto;
    margin-left: auto;
}

@media (max-width: 620px) {
    body.page-storefront .store-tabs-row {
        align-items: flex-start;
        gap: 8px;
        margin: 12px 0 16px;
    }

    body.page-storefront .store-tabs-row .store-tabs {
        gap: 7px;
    }
}

/* ===== storefront top events and global price sort ===== */
body.page-storefront .catalog-sort-btn {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 211, 107, 0.38) !important;
    background: linear-gradient(180deg, rgba(74, 55, 24, 0.92), rgba(39, 31, 18, 0.96)) !important;
    color: #ffe29a !important;
    border-radius: 10px !important;
    padding: 8px 10px !important;
    cursor: pointer;
    min-width: 42px;
    min-height: 34px;
    box-shadow: 0 0 14px rgba(255, 190, 72, 0.10);
    transition: background .15s ease, border-color .15s ease, transform .12s ease, box-shadow .15s ease;
}

body.page-storefront .catalog-sort-icon {
    display: block;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    transition: transform .15s ease;
}

body.page-storefront .catalog-sort-icon path {
    fill: none;
    stroke: currentColor;
    stroke-width: 2.3;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

body.page-storefront .catalog-sort-btn:hover {
    transform: translateY(-1px);
    border-color: rgba(255, 211, 107, 0.70) !important;
    box-shadow: 0 0 18px rgba(255, 190, 72, 0.20);
}

body.page-storefront .catalog-sort-btn.is-desc {
    background: linear-gradient(180deg, rgba(96, 64, 18, 0.96), rgba(44, 30, 12, 0.98)) !important;
}

body.page-storefront .catalog-sort-btn.is-desc .catalog-sort-icon {
    transform: scaleY(-1);
}

body.page-storefront .store-tab-top {
    border-color: rgba(255, 211, 107, 0.46);
    color: #ffe29a;
    background: rgba(255, 190, 72, 0.10);
}

body.page-storefront .store-tab-top.active {
    border-color: rgba(255, 211, 107, 0.72);
    background: rgba(255, 190, 72, 0.18);
    color: #fff0bd;
}

body.page-storefront .card.card-top {
    background:
        radial-gradient(circle at 82% 0%, rgba(255, 218, 120, 0.46), transparent 58%),
        radial-gradient(circle at 18% 18%, rgba(255, 176, 50, 0.22), transparent 54%),
        linear-gradient(180deg, rgba(96, 68, 22, 0.98) 0%, rgba(67, 48, 20, 0.98) 46%, rgba(32, 26, 17, 0.99) 82%, #171717 100%);
    box-shadow:
        0 0 38px rgba(255, 190, 72, 0.28),
        0 0 82px rgba(255, 156, 36, 0.16),
        0 12px 28px rgba(0,0,0,0.38);
}

body.page-storefront .card.card-top:hover {
    box-shadow:
        0 0 44px rgba(255, 190, 72, 0.34),
        0 0 92px rgba(255, 156, 36, 0.18),
        0 12px 30px rgba(0,0,0,0.42);
}

body.page-storefront .card.card-top .title {
    color: #ffe8a8;
    text-shadow: 0 2px 7px rgba(0,0,0,0.78);
}

body.page-storefront .card.card-top .amount {
    color: #fff1b8;
    text-shadow: 0 2px 7px rgba(0,0,0,0.72);
}

body.page-storefront .card.card-top .desc {
    color: #d7a64b !important;
}

body.page-storefront .card.card-top .payment-note {
    color: rgba(255, 236, 184, 0.50);
}

body.page-storefront.storefront-list-view .catalog-row-card.card-top .catalog-row-pricecell,
body.page-storefront.storefront-list-view .catalog-row-card.card-top .amount {
    color: #fff1b8;
}

body.page-storefront .card.card-top::after {
    content: "★ Топ";
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    padding: 4px 8px;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(124, 82, 18, .94), rgba(68, 43, 12, .94));
    border: 1px solid rgba(255, 211, 107, .72);
    color: #ffe29a;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 0 16px rgba(255, 190, 72, .20);
    pointer-events: none;
}

body.page-storefront.storefront-list-view .catalog-row-card.card-top {
    padding-right: 72px;
}

@media (max-width: 620px) {
    body.page-storefront .catalog-sort-btn {
        flex: 0 0 46px;
    }

    body.page-storefront .card.card-top::after {
        top: 8px;
        right: 8px;
        padding: 3px 6px;
        font-size: 10px;
    }

    body.page-storefront.storefront-list-view .catalog-row-card.card-top {
        padding-right: 58px;
    }
}

/* ===== session event top marker ===== */
body.page-session-events .event-card.top-card {
    border-color: rgba(255, 211, 107, 0.64);
    box-shadow: 0 0 0 1px rgba(255, 211, 107, 0.16), 0 0 18px rgba(255, 190, 72, 0.10);
}

body.page-session-events .event-card.top-card .event-head::after {
    content: "★ Топ";
    display: inline-flex;
    margin-top: 8px;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(255, 190, 72, 0.12);
    border: 1px solid rgba(255, 211, 107, 0.46);
    color: #ffe29a;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
}


/* ===== storefront mobile cleanup v8 ===== */
@media (max-width: 620px) {
    body.page-storefront {
        padding: 8px;
    }

    body.page-storefront .wrap {
        max-width: 100%;
    }

    body.page-storefront h1 {
        margin-bottom: 6px;
        font-size: 24px;
        line-height: 1.08;
    }

    body.page-storefront .sub {
        margin-bottom: 14px;
        font-size: 14px;
        line-height: 1.45;
    }

    body.page-storefront #catalogViewSwitch.catalog-view-switch,
    body.page-storefront .catalog-view-switch {
        display: grid !important;
        grid-template-columns: auto 1fr 1fr;
        gap: 8px;
        align-items: center;
        width: 100%;
        margin: 0 0 14px;
        padding: 10px;
        border-radius: 12px;
    }

    body.page-storefront .catalog-view-label {
        grid-column: 1;
        padding: 0;
        white-space: nowrap;
    }

    body.page-storefront .catalog-view-switch .catalog-layout-btn {
        min-width: 0;
        width: 100%;
        min-height: 34px;
        padding: 8px 10px !important;
        text-align: center;
    }

    body.page-storefront .stream-archive-box {
        grid-column: 1 / -1;
        width: 100%;
        margin: 0;
    }

    body.page-storefront .stream-archive-link {
        width: 100%;
        min-height: 34px;
        padding: 8px 10px;
        box-sizing: border-box;
        font-size: 14px;
    }

    body.page-storefront .store-tabs-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 42px;
        gap: 8px;
        align-items: start;
        margin: 10px 0 14px;
    }

    body.page-storefront .store-tabs-row .store-tabs {
        display: flex;
        flex-wrap: wrap;
        gap: 7px;
        min-width: 0;
        margin: 0;
    }

    body.page-storefront .store-tab {
        padding: 8px 11px;
        font-size: 14px;
        line-height: 1.12;
    }

    body.page-storefront .store-tabs-row .catalog-sort-btn,
    body.page-storefront .catalog-sort-btn {
        position: sticky;
        top: 8px;
        flex: 0 0 42px;
        width: 42px;
        min-width: 42px;
        min-height: 36px;
        padding: 7px 8px !important;
        border-radius: 10px !important;
        align-self: start;
        justify-self: end;
    }

    body.page-storefront .grid,
    body.page-storefront.storefront-log-enabled .grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        row-gap: 12px;
    }

    body.page-storefront .card {
        padding: 10px 9px 11px 10px;
        gap: 9px;
        border-radius: 12px;
    }

    body.page-storefront .card::before {
        width: 3px;
        border-radius: 12px 0 0 12px;
    }

    body.page-storefront .image-box {
        border-radius: 9px;
    }

    body.page-storefront .effect-badge {
        top: 8px;
        left: 8px;
        width: 31px;
        height: 31px;
        font-size: 17px;
    }

    body.page-storefront .card .title-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 6px;
        align-items: start;
        min-height: 42px;
        margin-top: 0;
    }

    body.page-storefront .card .title {
        display: -webkit-box;
        min-height: 36px;
        max-height: 36px;
        overflow: hidden;
        font-size: 14px;
        line-height: 1.18;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    body.page-storefront .card .amount {
        padding-top: 1px;
        font-size: 14px;
        line-height: 1.15;
        white-space: nowrap;
    }

    body.page-storefront .card .impact-row {
        min-height: 11px;
        gap: 6px;
        margin: 0;
    }

    body.page-storefront .impact-dot {
        width: 9px;
        height: 9px;
    }

    body.page-storefront .card .card-divider {
        margin: 0;
    }

    body.page-storefront .card .desc {
        min-height: 68px;
        max-height: 68px;
        overflow: hidden;
        font-size: 11px;
        line-height: 1.34;
    }

    body.page-storefront .payment-box {
        margin-top: auto;
        padding-top: 9px;
    }

    body.page-storefront .payment-row {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    body.page-storefront .pay-btn {
        min-height: 34px;
        padding: 8px 7px;
        font-size: 12px;
    }

    body.page-storefront .payment-note {
        min-height: 26px;
        font-size: 10px;
        line-height: 1.28;
    }

    body.page-storefront .footer {
        margin-top: 14px;
        font-size: 11px;
    }
}



/* ===== storefront v9: price inside image + mobile payment width ===== */
body.page-storefront:not(.storefront-list-view) .card .title-row {
    display: block;
}

body.page-storefront:not(.storefront-list-view) .card .title-row .title {
    width: 100%;
}

body.page-storefront .card.card-top .image-amount {
    color: #fff1b8;
    border-color: rgba(255, 224, 138, 0.66);
    background: linear-gradient(180deg, rgba(77, 51, 12, 0.92), rgba(24, 19, 12, 0.94));
}

@media (max-width: 620px) {
    body.page-storefront .image-amount {
        right: 6px;
        bottom: 6px;
        max-width: calc(100% - 12px);
        padding: 4px 6px;
        border-radius: 8px;
        font-size: 13px;
        line-height: 1;
    }

    body.page-storefront .card .title-row {
        display: block;
        min-height: 38px;
    }

    body.page-storefront .card .title {
        min-height: 34px;
        max-height: 34px;
        font-size: 14px;
        line-height: 1.18;
    }

    body.page-storefront .payment-row {
        grid-template-columns: 1fr !important;
        width: 100%;
    }

    body.page-storefront .pay-btn {
        width: 100%;
        min-width: 0;
        justify-content: center;
    }

    body.page-storefront .pay-btn-donationalerts {
        font-size: 11px;
        padding-left: 5px;
        padding-right: 5px;
    }

    body.page-storefront .pay-btn-donationalerts .pay-btn-main {
        overflow: visible;
        text-overflow: clip;
        white-space: nowrap;
    }
}


/* ===== storefront v10: mobile price at right under top badge area ===== */
@media (max-width: 620px) {
    body.page-storefront .card .image-amount {
        display: none;
    }

    body.page-storefront:not(.storefront-list-view) .card .title-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 6px;
        align-items: start;
        min-height: 42px;
    }

    body.page-storefront:not(.storefront-list-view) .card .title-row::after {
        content: attr(data-amount);
        justify-self: end;
        align-self: start;
        min-width: 54px;
        max-width: 74px;
        min-height: 23px;
        box-sizing: border-box;
        margin-top: 0;
        padding: 4px 5px;
        border-radius: 7px;
        background: linear-gradient(180deg, rgba(34, 24, 8, 0.86), rgba(13, 13, 13, 0.92));
        border: 1px solid rgba(255, 211, 107, 0.54);
        color: #ffe08a;
        font-size: 13px;
        font-weight: 900;
        line-height: 1.05;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: clip;
        text-shadow: 0 2px 5px rgba(0,0,0,0.86);
        box-shadow: 0 6px 18px rgba(0,0,0,0.24);
    }

    body.page-storefront:not(.storefront-list-view) .card.card-top .title-row::after {
        color: #fff1b8;
        border-color: rgba(255, 224, 138, 0.66);
        background: linear-gradient(180deg, rgba(77, 51, 12, 0.92), rgba(24, 19, 12, 0.94));
    }

    body.page-storefront:not(.storefront-list-view) .card .title {
        min-height: 34px;
        max-height: 34px;
        padding-right: 0;
    }
}



/* ===== storefront v11: fixed mobile price placement ===== */
body.page-storefront:not(.storefront-list-view) .card .mobile-amount {
    display: none;
}

@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .image-amount {
        display: none !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .title-row::after {
        content: none !important;
        display: none !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .title-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 64px !important;
        gap: 6px !important;
        align-items: start !important;
        min-height: 42px !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .title {
        min-width: 0;
        min-height: 34px !important;
        max-height: 34px !important;
        padding-right: 0 !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .mobile-amount {
        display: block;
        justify-self: end;
        align-self: start;
        width: 64px;
        box-sizing: border-box;
        margin-top: 0;
        padding: 4px 4px;
        border-radius: 7px;
        background: linear-gradient(180deg, rgba(34, 24, 8, 0.86), rgba(13, 13, 13, 0.92));
        border: 1px solid rgba(255, 211, 107, 0.54);
        color: #ffe08a;
        font-size: 13px;
        font-weight: 900;
        line-height: 1.05;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: clip;
        text-shadow: 0 2px 5px rgba(0,0,0,0.86);
        box-shadow: 0 6px 18px rgba(0,0,0,0.24);
    }

    body.page-storefront:not(.storefront-list-view) .card.card-top .mobile-amount {
        color: #fff1b8;
        border-color: rgba(255, 224, 138, 0.66);
        background: linear-gradient(180deg, rgba(77, 51, 12, 0.92), rgba(24, 19, 12, 0.94));
    }
}


/* ===== storefront v12: mobile list-view price right + DA alignment fix ===== */
@media (max-width: 620px) {
    body.page-storefront.storefront-list-view .catalog-row-card {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 68px !important;
        gap: 8px 8px !important;
        align-items: start !important;
    }

    body.page-storefront.storefront-list-view .catalog-row-titlecell {
        grid-column: 1;
        grid-row: 1;
        min-width: 0;
    }

    body.page-storefront.storefront-list-view .catalog-row-pricecell {
        grid-column: 2;
        grid-row: 1;
        justify-self: end;
        align-self: start;
        width: 68px;
        min-width: 68px;
        box-sizing: border-box;
        padding: 4px 4px;
        border-radius: 7px;
        background: linear-gradient(180deg, rgba(34, 24, 8, 0.86), rgba(13, 13, 13, 0.92));
        border: 1px solid rgba(255, 211, 107, 0.54);
        text-align: center;
        box-shadow: 0 6px 18px rgba(0,0,0,0.24);
    }

    body.page-storefront.storefront-list-view .catalog-row-pricecell .amount {
        display: block;
        color: #ffe08a;
        font-size: 13px;
        font-weight: 900;
        line-height: 1.05;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: clip;
        text-shadow: 0 2px 5px rgba(0,0,0,0.86);
    }

    body.page-storefront.storefront-list-view .catalog-row-card.card-top .catalog-row-pricecell {
        border-color: rgba(255, 224, 138, 0.66);
        background: linear-gradient(180deg, rgba(77, 51, 12, 0.92), rgba(24, 19, 12, 0.94));
    }

    body.page-storefront.storefront-list-view .catalog-row-card.card-top .catalog-row-pricecell .amount {
        color: #fff1b8;
    }

    body.page-storefront.storefront-list-view .catalog-row-desccell {
        grid-column: 1 / -1;
        grid-row: 2;
        min-width: 0;
    }

    body.page-storefront.storefront-list-view .catalog-row-actions {
        grid-column: 1 / -1;
        grid-row: 3;
        min-width: 0;
        margin-top: 0 !important;
    }

    body.page-storefront.storefront-list-view .catalog-row-actions .payment-box {
        margin-top: 0 !important;
    }

    body.page-storefront .payment-row {
        width: 100%;
    }

    body.page-storefront .pay-btn-donationalerts {
        width: 100%;
        font-size: 12px;
        padding-left: 8px;
        padding-right: 8px;
    }
}


/* ===== storefront v13 cumulative: mobile price back on image + stable list mode ===== */

/*
    Правило проекта:
    - карточный вид: цена всегда лежит на картинке, внизу справа, на ПК и на телефоне;
    - строковый вид на телефоне без картинки: цена стоит справа в верхней зоне строки;
    - кнопка DonationAlerts не съезжает и занимает всю доступную ширину.
*/

body.page-storefront:not(.storefront-list-view) .card .mobile-amount {
    display: none !important;
}

@media (max-width: 620px) {
    /* Карточный мобильный вид: возвращаем цену на изображение. */
    body.page-storefront:not(.storefront-list-view) .card .image-amount {
        display: block !important;
        position: absolute;
        right: 6px;
        bottom: 6px;
        z-index: 4;
        max-width: calc(100% - 12px);
        padding: 4px 6px;
        border-radius: 8px;
        background: linear-gradient(180deg, rgba(34, 24, 8, 0.88), rgba(13, 13, 13, 0.94));
        border: 1px solid rgba(255, 211, 107, 0.58);
        color: #ffe08a;
        font-size: 13px;
        font-weight: 900;
        line-height: 1;
        white-space: nowrap;
        text-shadow: 0 2px 5px rgba(0,0,0,0.86);
        box-shadow: 0 6px 18px rgba(0,0,0,0.34);
        pointer-events: none;
    }

    body.page-storefront:not(.storefront-list-view) .card.card-top .image-amount {
        color: #fff1b8;
        border-color: rgba(255, 224, 138, 0.70);
        background: linear-gradient(180deg, rgba(77, 51, 12, 0.94), rgba(24, 19, 12, 0.96));
    }

    body.page-storefront:not(.storefront-list-view) .card .title-row::after {
        content: none !important;
        display: none !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .title-row {
        display: block !important;
        min-height: 38px !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .title {
        width: 100%;
        min-height: 34px !important;
        max-height: 34px !important;
        padding-right: 0 !important;
    }

    /* Строковый мобильный вид: изображений нет, поэтому цена стабильно справа. */
    body.page-storefront.storefront-list-view .catalog-row-card {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 74px !important;
        grid-template-areas:
            "title price"
            "desc desc"
            "actions actions" !important;
        gap: 8px 8px !important;
        align-items: start !important;
        padding: 12px 12px 13px 16px !important;
    }

    body.page-storefront.storefront-list-view .catalog-row-titlecell {
        grid-area: title !important;
        min-width: 0;
    }

    body.page-storefront.storefront-list-view .catalog-row-titlecell .title {
        min-height: 34px;
        max-height: 38px;
        overflow: hidden;
        line-height: 1.18;
    }

    body.page-storefront.storefront-list-view .catalog-row-titlecell .impact-row {
        margin-top: 5px;
    }

    body.page-storefront.storefront-list-view .catalog-row-pricecell {
        grid-area: price !important;
        justify-self: end !important;
        align-self: start !important;
        width: 74px !important;
        min-width: 74px !important;
        max-width: 74px !important;
        box-sizing: border-box;
        margin: 0 !important;
        padding: 4px 4px !important;
        border-radius: 8px;
        background: linear-gradient(180deg, rgba(34, 24, 8, 0.88), rgba(13, 13, 13, 0.94));
        border: 1px solid rgba(255, 211, 107, 0.58);
        text-align: center !important;
        box-shadow: 0 6px 18px rgba(0,0,0,0.24);
    }

    body.page-storefront.storefront-list-view .catalog-row-pricecell .amount {
        display: block;
        color: #ffe08a;
        font-size: 13px;
        font-weight: 900;
        line-height: 1.05;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: clip;
        text-shadow: 0 2px 5px rgba(0,0,0,0.86);
    }

    body.page-storefront.storefront-list-view .catalog-row-card.card-top .catalog-row-pricecell {
        border-color: rgba(255, 224, 138, 0.70);
        background: linear-gradient(180deg, rgba(77, 51, 12, 0.94), rgba(24, 19, 12, 0.96));
    }

    body.page-storefront.storefront-list-view .catalog-row-card.card-top .catalog-row-pricecell .amount {
        color: #fff1b8;
    }

    body.page-storefront.storefront-list-view .catalog-row-desccell {
        grid-area: desc !important;
        min-width: 0;
        margin: 0 !important;
    }

    body.page-storefront.storefront-list-view .catalog-row-desccell .desc {
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
    }

    body.page-storefront.storefront-list-view .catalog-row-actions {
        grid-area: actions !important;
        min-width: 0;
        margin-top: 0 !important;
    }

    body.page-storefront.storefront-list-view .catalog-row-actions .payment-box {
        width: 100%;
        margin-top: 0 !important;
        padding-top: 10px !important;
    }

    body.page-storefront .payment-row,
    body.page-storefront.storefront-list-view .payment-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100%;
        gap: 6px;
    }

    body.page-storefront .pay-btn,
    body.page-storefront.storefront-list-view .pay-btn {
        width: 100%;
        min-width: 0;
        justify-content: center;
    }

    body.page-storefront .pay-btn-donationalerts,
    body.page-storefront.storefront-list-view .pay-btn-donationalerts {
        width: 100%;
        font-size: 12px;
        padding-left: 8px;
        padding-right: 8px;
    }

    body.page-storefront .pay-btn-donationalerts .pay-btn-main,
    body.page-storefront.storefront-list-view .pay-btn-donationalerts .pay-btn-main {
        overflow: visible;
        text-overflow: clip;
        white-space: nowrap;
    }
}


/* ===== storefront v14: mobile list top badge / price overlap fix ===== */
@media (max-width: 620px) {
    body.page-storefront.storefront-list-view .catalog-row-card.card-top {
        grid-template-columns: minmax(0, 1fr) 86px !important;
        padding-right: 12px !important;
    }

    body.page-storefront.storefront-list-view .catalog-row-card.card-top::after {
        top: 9px;
        right: 10px;
    }

    body.page-storefront.storefront-list-view .catalog-row-card.card-top .catalog-row-pricecell {
        width: 74px !important;
        min-width: 74px !important;
        max-width: 74px !important;
        margin-top: 26px !important;
        margin-right: 0 !important;
        justify-self: end !important;
    }

    body.page-storefront.storefront-list-view .catalog-row-card.card-top .catalog-row-titlecell {
        padding-right: 0 !important;
    }
}


/* ===== storefront v17: cleaner top badges, aligned offsets, mobile top star only ===== */
body.page-storefront:not(.storefront-list-view) .card .image-box {
    position: relative;
    border: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    overflow: visible;
}

body.page-storefront:not(.storefront-list-view) .card .image-box img {
    position: relative;
    z-index: 1;
}

body.page-storefront:not(.storefront-list-view) .card .effect-badge {
    display: none !important;
}

body.page-storefront:not(.storefront-list-view) .card .top-badge,
body.page-storefront:not(.storefront-list-view) .card .image-amount {
    position: absolute;
    top: 14px;
    z-index: 4;
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px;
    border-radius: 14px;
    border: 1px solid rgba(255, 211, 107, 0.56);
    background: linear-gradient(180deg, rgba(34, 24, 8, 0.88), rgba(13, 13, 13, 0.94));
    color: #ffe29a;
    box-shadow: 0 6px 18px rgba(0,0,0,0.34);
    text-shadow: 0 2px 5px rgba(0,0,0,0.86);
    pointer-events: none;
}

body.page-storefront:not(.storefront-list-view) .card .top-badge {
    left: 14px;
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
}

body.page-storefront:not(.storefront-list-view) .card .top-badge-star {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    line-height: 1;
}

body.page-storefront:not(.storefront-list-view) .card .top-badge-text {
    display: inline-block;
    line-height: 1;
}

body.page-storefront:not(.storefront-list-view) .card .image-amount {
    right: 14px;
    max-width: calc(100% - 28px);
    white-space: nowrap;
}

body.page-storefront:not(.storefront-list-view) .card .image-amount-icon {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    flex: 0 0 34px;
    color: #f4fff0;
}

body.page-storefront:not(.storefront-list-view) .card .image-amount-value {
    display: inline-block;
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.02em;
}

body.page-storefront:not(.storefront-list-view) .card .image-amount-help .image-amount-icon {
    background: #4c9a46;
    box-shadow: 0 0 14px rgba(103, 201, 111, 0.26);
}

body.page-storefront:not(.storefront-list-view) .card .image-amount-harm .image-amount-icon {
    background: #963d36;
    box-shadow: 0 0 14px rgba(227, 77, 67, 0.22);
}

body.page-storefront:not(.storefront-list-view) .card .image-amount-neutral .image-amount-icon {
    background: #53647d;
    box-shadow: 0 0 14px rgba(150, 175, 208, 0.18);
}

body.page-storefront:not(.storefront-list-view) .card.card-top::after {
    content: none !important;
    display: none !important;
}

@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .top-badge,
    body.page-storefront:not(.storefront-list-view) .card .image-amount {
        top: 10px;
        min-height: 38px;
        padding: 0 12px;
        border-radius: 12px;
    }

    body.page-storefront:not(.storefront-list-view) .card .top-badge {
        left: 10px;
        gap: 0;
        padding-left: 12px;
        padding-right: 12px;
    }

    body.page-storefront:not(.storefront-list-view) .card .image-amount {
        right: 10px;
        gap: 8px;
        max-width: calc(100% - 20px);
    }

    body.page-storefront:not(.storefront-list-view) .card .top-badge-text {
        display: none !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .top-badge-star {
        font-size: 18px;
    }

    body.page-storefront:not(.storefront-list-view) .card .image-amount-icon {
        width: 28px;
        height: 28px;
        flex-basis: 28px;
        font-size: 18px;
    }

    body.page-storefront:not(.storefront-list-view) .card .image-amount-value {
        font-size: 18px;
    }

    body.page-storefront.storefront-list-view .catalog-row-card.card-top::after {
        content: "★";
        padding-left: 9px;
        padding-right: 9px;
    }
}


/* ===== storefront v18: fix badge stretch, smaller top badge ===== */
body.page-storefront:not(.storefront-list-view) .card .image-amount {
    top: 14px !important;
    right: 14px !important;
    bottom: auto !important;
    left: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 46px;
    max-width: calc(100% - 28px);
    padding: 0 16px !important;
    border-radius: 14px !important;
}

body.page-storefront:not(.storefront-list-view) .card .top-badge {
    top: 14px !important;
    left: 14px !important;
    right: auto !important;
    bottom: auto !important;
    min-height: 30px;
    padding: 0 10px !important;
    gap: 6px;
    border-radius: 11px !important;
    font-size: 13px !important;
    font-weight: 800;
}

body.page-storefront:not(.storefront-list-view) .card .top-badge-star {
    font-size: 15px !important;
}

body.page-storefront:not(.storefront-list-view) .card .top-badge-text {
    font-size: 13px !important;
}

@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .image-amount {
        top: 10px !important;
        right: 10px !important;
        bottom: auto !important;
        left: auto !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .top-badge {
        top: 10px !important;
        left: 10px !important;
        min-height: 30px;
        padding: 0 10px !important;
        gap: 0;
        border-radius: 11px !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .top-badge-star {
        font-size: 15px !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .top-badge-text {
        display: none !important;
    }
}


/* ===== storefront v19: image touches card edges on left/top/right ===== */
/*
    Зафиксированный визуальный вариант:
    - верхняя картинка у карточного вида упирается в края карточки слева, сверху и справа;
    - отдельной внутренней рамки/поля у картинки нет;
    - текстовая часть карточки сохраняет внутренние отступы;
    - плашки цены и "Топ" остаются поверх картинки.
*/
body.page-storefront:not(.storefront-list-view) .card {
    overflow: hidden;
}

body.page-storefront:not(.storefront-list-view) .card .image-box {
    position: relative;
    margin-top: -16px !important;
    margin-right: -16px !important;
    margin-bottom: 14px !important;
    margin-left: -18px !important;
    width: auto !important;
    max-width: none !important;
    border: 0 !important;
    border-radius: 14px 14px 0 0 !important;
    background: transparent !important;
    overflow: hidden !important;
}

body.page-storefront:not(.storefront-list-view) .card .image-box img {
    width: 100% !important;
    height: 100% !important;
    display: block;
    object-fit: cover;
}

/* Плашки позиционируются от краёв самой full-bleed картинки. */
body.page-storefront:not(.storefront-list-view) .card .top-badge {
    top: 14px !important;
    left: 14px !important;
}

body.page-storefront:not(.storefront-list-view) .card .image-amount {
    top: 14px !important;
    right: 14px !important;
    bottom: auto !important;
    left: auto !important;
}

/* Мобильный карточный вид: компенсируем мобильные padding карточки. */
@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .image-box {
        margin-top: -10px !important;
        margin-right: -9px !important;
        margin-bottom: 10px !important;
        margin-left: -10px !important;
        border-radius: 12px 12px 0 0 !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .top-badge {
        top: 10px !important;
        left: 10px !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .image-amount {
        top: 10px !important;
        right: 10px !important;
        bottom: auto !important;
        left: auto !important;
    }
}


/* ===== storefront v20: keep left accent visible + smaller price digits ===== */
/*
    Исправление:
    - картинка больше не залезает на толстую левую акцентную полосу карточки;
    - цифры стоимости уменьшены примерно на 20%.
*/
body.page-storefront:not(.storefront-list-view) .card .image-box {
    /*
        Слева оставляем место под цветную полосу ::before шириной 4px,
        поэтому margin-left делаем на 4px меньше по модулю.
    */
    margin-left: -14px !important;
}

body.page-storefront:not(.storefront-list-view) .card .image-amount-value {
    font-size: 18px !important;
}

@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .image-box {
        /* На мобильном тоже не перекрываем левую полосу. */
        margin-left: -6px !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .image-amount-value {
        font-size: 15px !important;
    }
}


/* ===== storefront v21: compact price badge and smaller icon ===== */
/*
    Правка плашки цены:
    - внутренние отступы уменьшены;
    - значок внутри плашки цены уменьшен примерно на 50%;
    - размер цифр стоимости оставлен как в v20.
*/
body.page-storefront:not(.storefront-list-view) .card .image-amount {
    min-height: 36px !important;
    gap: 7px !important;
    padding: 0 10px !important;
    border-radius: 12px !important;
}

body.page-storefront:not(.storefront-list-view) .card .image-amount-icon {
    width: 17px !important;
    height: 17px !important;
    flex-basis: 17px !important;
    font-size: 12px !important;
}

@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .image-amount {
        min-height: 30px !important;
        gap: 6px !important;
        padding: 0 8px !important;
        border-radius: 10px !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .image-amount-icon {
        width: 14px !important;
        height: 14px !important;
        flex-basis: 14px !important;
        font-size: 10px !important;
    }
}


/* ===== storefront v22: badges closer to top corners ===== */
/*
    Плашки подняты/сдвинуты ближе к верхним углам примерно на половину:
    - цена: сверху/справа 7px вместо 14px;
    - Топ: сверху/слева 7px вместо 14px;
    - мобильная версия: 5px вместо 10px.
*/
body.page-storefront:not(.storefront-list-view) .card .top-badge {
    top: 7px !important;
    left: 7px !important;
}

body.page-storefront:not(.storefront-list-view) .card .image-amount {
    top: 7px !important;
    right: 7px !important;
    bottom: auto !important;
    left: auto !important;
}

@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .top-badge {
        top: 5px !important;
        left: 5px !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .image-amount {
        top: 5px !important;
        right: 5px !important;
        bottom: auto !important;
        left: auto !important;
    }
}


/* ===== storefront v23: stronger title + cleaner image corner ===== */
/*
    Правка:
    - заголовок карточки увеличен примерно на 15% и сделан полужирным;
    - у верхней картинки убрано внутреннее скругление, чтобы в левом верхнем углу
      TOP-карточки не появлялась чрезмерно круглая выемка;
    - внешнее скругление карточки остаётся за счёт самой .card и overflow:hidden.
*/
body.page-storefront:not(.storefront-list-view) .card .image-box {
    border-radius: 0 !important;
}

body.page-storefront:not(.storefront-list-view) .card .title {
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.15;
}

body.page-storefront.storefront-list-view .catalog-row-titlecell .title {
    font-size: 18px !important;
    font-weight: 700 !important;
}

@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .image-box {
        border-radius: 0 !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .title {
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 1.16;
    }

    body.page-storefront.storefront-list-view .catalog-row-titlecell .title {
        font-size: 17px !important;
        font-weight: 700 !important;
    }
}


/* ===== storefront v24: title one-third higher ===== */
/*
    Поднимаем название карточки примерно на треть текущего вертикального зазора:
    - уменьшаем нижний отступ full-bleed картинки;
    - слегка подтягиваем строку заголовка вверх;
    - остальные элементы карточки сохраняют текущий стиль.
*/
body.page-storefront:not(.storefront-list-view) .card .image-box {
    margin-bottom: 5px !important;
}

body.page-storefront:not(.storefront-list-view) .card .title-row {
    margin-top: -3px !important;
}

@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .image-box {
        margin-bottom: 4px !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .title-row {
        margin-top: -2px !important;
    }
}


/* ===== storefront v25: mobile price alignment + dots closer to title ===== */
/*
    Мобильная правка:
    - плашка цены в карточном виде выравнивается ровно в правом верхнем углу;
    - плашка цены получает компактную фиксированную высоту, чтобы не выглядела криво;
    - кругляши под названием подтянуты ближе к заголовку.
*/
@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .image-amount {
        top: 5px !important;
        right: 5px !important;
        bottom: auto !important;
        left: auto !important;

        min-height: 27px !important;
        height: 27px !important;
        max-height: 27px !important;
        box-sizing: border-box;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        padding: 0 7px !important;
        border-radius: 9px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .image-amount-icon {
        width: 13px !important;
        height: 13px !important;
        flex: 0 0 13px !important;
        font-size: 9px !important;
        line-height: 1 !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .image-amount-value {
        display: inline-block !important;
        font-size: 15px !important;
        line-height: 1 !important;
        letter-spacing: 0 !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .title-row {
        min-height: 0 !important;
        margin-top: -4px !important;
        margin-bottom: -2px !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .title {
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        line-height: 1.13 !important;
    }

    body.page-storefront:not(.storefront-list-view) .card .impact-row {
        margin-top: -2px !important;
        margin-bottom: 0 !important;
    }
}


/* ===== storefront v26: price badge without effect icon ===== */
/*
    У плашек стоимости убираем значок: остаётся только цена.
    Правка сделана и в HTML сборке карточки, и защитным CSS-override.
*/
body.page-storefront:not(.storefront-list-view) .card .image-amount-icon {
    display: none !important;
}

body.page-storefront:not(.storefront-list-view) .card .image-amount {
    gap: 0 !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

@media (max-width: 620px) {
    body.page-storefront:not(.storefront-list-view) .card .image-amount {
        gap: 0 !important;
        padding-left: 7px !important;
        padding-right: 7px !important;
    }
}


/* ===== storefront v27: sticky categories row + short mobile labels ===== */
/*
    Строка категорий:
    - остаётся на своём месте при открытии страницы;
    - при скролле вниз прилипает к верхней кромке окна;
    - при скролле вверх возвращается на своё место через position: sticky.
*/
body.page-storefront .store-tabs-row {
    position: sticky;
    top: 0;
    z-index: 50;
    padding: 8px 0;
    background: rgba(17, 17, 17, 0.94);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

body.page-storefront .store-tabs-row::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 1px;
    background: rgba(255,255,255,0.08);
    pointer-events: none;
}

body.page-storefront .store-tab-label-mobile {
    display: none;
}

body.page-storefront .store-tab-label-full {
    display: inline;
}

@media (max-width: 620px) {
    body.page-storefront .store-tabs-row {
        position: sticky !important;
        top: 0 !important;
        z-index: 60;
        margin-top: 8px !important;
        margin-bottom: 12px !important;
        padding: 7px 0 !important;
        background: rgba(17, 17, 17, 0.96);
    }

    body.page-storefront .store-tabs-row .store-tabs {
        gap: 6px !important;
    }

    body.page-storefront .store-tab {
        padding: 7px 9px !important;
        font-size: 13px !important;
        line-height: 1.1 !important;
        white-space: nowrap;
    }

    body.page-storefront .store-tab-label-full {
        display: none;
    }

    body.page-storefront .store-tab-label-mobile {
        display: inline;
    }

    body.page-storefront .store-tab-count {
        margin-left: 3px;
        opacity: .65;
    }

    body.page-storefront .store-tabs-row .catalog-sort-btn,
    body.page-storefront .catalog-sort-btn {
        top: 7px;
    }
}


/* ===== session_events v28: top event card like storefront top card ===== */
/*
    Кабинет / настройка событий:
    TOP-события получают ту же золотистую "топовую" раскраску карточки,
    что и карточки TOP на витрине.
*/
body.page-session-events .event-card.top-card {
    border-color: rgba(255, 211, 107, 0.68) !important;
    background:
        radial-gradient(circle at 82% 0%, rgba(255, 218, 120, 0.42), transparent 58%),
        radial-gradient(circle at 18% 18%, rgba(255, 176, 50, 0.20), transparent 54%),
        linear-gradient(180deg, rgba(96, 68, 22, 0.98) 0%, rgba(67, 48, 20, 0.98) 46%, rgba(32, 26, 17, 0.99) 82%, #171717 100%);
    box-shadow:
        0 0 38px rgba(255, 190, 72, 0.24),
        0 0 82px rgba(255, 156, 36, 0.13),
        0 12px 28px rgba(0,0,0,0.36);
}

body.page-session-events .event-card.top-card:hover {
    box-shadow:
        0 0 44px rgba(255, 190, 72, 0.30),
        0 0 92px rgba(255, 156, 36, 0.16),
        0 12px 30px rgba(0,0,0,0.40);
}

body.page-session-events .event-card.top-card .event-image {
    border-color: rgba(255, 211, 107, 0.34);
    background: rgba(18, 14, 8, 0.72);
}

body.page-session-events .event-card.top-card .event-title {
    color: #ffe8a8;
    text-shadow: 0 2px 7px rgba(0,0,0,0.78);
}

body.page-session-events .event-card.top-card .muted,
body.page-session-events .event-card.top-card .field label,
body.page-session-events .event-card.top-card .distance-title {
    color: rgba(255, 236, 184, 0.70);
}

body.page-session-events .event-card.top-card .event-head::after {
    background: linear-gradient(180deg, rgba(124, 82, 18, .94), rgba(68, 43, 12, .94));
    border-color: rgba(255, 211, 107, .72);
    color: #ffe29a;
    box-shadow: 0 0 16px rgba(255, 190, 72, .20);
}

body.page-session-events .event-card.top-card input,
body.page-session-events .event-card.top-card select,
body.page-session-events .event-card.top-card textarea {
    border-color: rgba(255, 211, 107, 0.22);
    background: rgba(12, 12, 12, 0.72);
}

body.page-session-events .event-card.top-card .btn-muted {
    border: 1px solid rgba(255, 211, 107, 0.22);
    background: rgba(36, 28, 16, 0.90);
}

/* ===== storefront v29: compact donor inside top controls ===== */
/*
    "Имя зрителя" живёт в той же строке, что и переключатель вида.
    Блок прижимается вправо, но не растягивает витрину.
*/
body.page-storefront #catalogViewSwitch.catalog-view-switch {
    width: 100%;
}

body.page-storefront #catalogViewSwitch .donor-box {
    display: none;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin: 0 0 0 auto;
    padding: 0;
    width: auto;
    flex: 0 0 auto;
}

body.page-storefront #catalogViewSwitch .donor-box label {
    display: inline-block;
    margin: 0;
    white-space: nowrap;
    color: #ccc;
    font-size: 13px;
    line-height: 1.2;
}

body.page-storefront #catalogViewSwitch .donor-box input {
    width: 320px;
    max-width: 32vw;
    margin: 0;
    padding: 9px 11px;
    border-radius: 10px;
    border: 1px solid #333;
    background: #181818;
    color: #fff;
    font-size: 16px;
}

@media (max-width: 760px) {
    body.page-storefront #catalogViewSwitch .donor-box {
        order: 10;
        flex: 1 1 100%;
        width: 100%;
        margin: 4px 0 0;
        justify-content: stretch;
    }

    body.page-storefront #catalogViewSwitch .donor-box input {
        flex: 1 1 auto;
        width: auto;
        max-width: none;
    }
}


/* ===== storefront v30: cabinet width ===== */
/*
    Витрина использует такую же ширину контейнера, как кабинет:
    body.page-cabinet .wrap { max-width: 1120px; }
*/
body.page-storefront .wrap,
body.page-storefront.storefront-log-enabled .wrap {
    max-width: 1120px !important;
}


/* ===== cabinet event builder v1 ===== */
body.page-cabinet .builder-box h3 {
    margin-top: 0;
}

body.page-cabinet .builder-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 14px;
    align-items: start;
}

body.page-cabinet .builder-main,
body.page-cabinet .builder-side {
    min-width: 0;
}

body.page-cabinet .builder-section {
    margin-bottom: 14px;
}

body.page-cabinet .builder-sticky {
    position: sticky;
    top: 14px;
}

body.page-cabinet .builder-items {
    display: grid;
    gap: 10px;
}

body.page-cabinet .builder-item-row {
    display: grid;
    grid-template-columns: minmax(180px, 1.3fr) minmax(90px, .55fr) minmax(90px, .55fr) auto;
    gap: 10px;
    align-items: end;
    padding: 10px;
    border: 1px solid #333;
    border-radius: 10px;
    background: #141414;
}

body.page-cabinet .builder-item-row label {
    display: block;
    margin-bottom: 5px;
    color: #aaa;
    font-size: 12px;
}

body.page-cabinet .builder-item-row input,
body.page-cabinet .builder-item-row select {
    width: 100%;
    box-sizing: border-box;
}

body.page-cabinet .builder-remove-row {
    white-space: nowrap;
}

body.page-cabinet .builder-price-card {
    padding: 12px;
    border: 1px solid rgba(255, 211, 107, 0.34);
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(74, 55, 24, 0.72), rgba(22, 22, 22, 0.92));
}

body.page-cabinet .builder-price-value {
    margin-top: 4px;
    color: #ffe08a;
    font-size: 28px;
    font-weight: 900;
    line-height: 1.1;
}

body.page-cabinet .builder-preview pre {
    max-height: 260px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
    margin: 6px 0 0;
    padding: 10px;
    border: 1px solid #333;
    border-radius: 8px;
    background: #0e0e0e;
    color: #ddd;
    font-family: Consolas, monospace;
    font-size: 12px;
    line-height: 1.35;
}

body.page-cabinet .builder-card-list {
    display: grid;
    gap: 10px;
}

body.page-cabinet .builder-card-row {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 10px;
    border: 1px solid #333;
    border-radius: 10px;
    background: #141414;
}

body.page-cabinet .builder-card-thumb {
    width: 72px;
    height: 72px;
    overflow: hidden;
    border: 1px solid #333;
    border-radius: 10px;
    background: #0e0e0e;
}

body.page-cabinet .builder-card-thumb img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

@media (max-width: 980px) {
    body.page-cabinet .builder-layout {
        grid-template-columns: 1fr;
    }

    body.page-cabinet .builder-sticky {
        position: static;
    }
}

@media (max-width: 720px) {
    body.page-cabinet .builder-item-row {
        grid-template-columns: 1fr;
    }

    body.page-cabinet .builder-remove-row {
        width: 100%;
    }

    body.page-cabinet .builder-card-row {
        grid-template-columns: 56px minmax(0, 1fr);
    }

    body.page-cabinet .builder-card-thumb {
        width: 56px;
        height: 56px;
    }
}

/* ===== builder custom picker v2 ===== */
body.page-cabinet .builder-item-cell-main {
    min-width: 0;
}

body.page-cabinet .builder-item-picker {
    position: relative;
}

body.page-cabinet .builder-item-search {
    width: 100%;
}

body.page-cabinet .builder-item-picked-code {
    margin-top: 5px;
    color: #8f8f8f;
    font-size: 12px;
    line-height: 1.2;
    word-break: break-all;
}

body.page-cabinet .builder-item-dropdown {
    position: absolute;
    z-index: 40;
    left: 0;
    right: 0;
    top: calc(100% + 6px);
    max-height: 360px;
    overflow: auto;
    border: 1px solid #333;
    border-radius: 12px;
    background: #101010;
    box-shadow: 0 14px 36px rgba(0,0,0,.45);
}

body.page-cabinet .builder-item-option {
    display: block;
    width: 100%;
    padding: 10px 12px;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.05);
    background: transparent;
    color: #eaeaea;
    text-align: left;
    cursor: pointer;
}

body.page-cabinet .builder-item-option:last-child {
    border-bottom: 0;
}

body.page-cabinet .builder-item-option:hover,
body.page-cabinet .builder-item-option:focus {
    background: rgba(255,255,255,.05);
}

body.page-cabinet .builder-item-option-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

body.page-cabinet .builder-item-option-title {
    font-size: 15px;
    font-weight: 700;
    color: #f4f4f4;
}

body.page-cabinet .builder-item-option-code {
    font-size: 11px;
    color: #9d9d9d;
    white-space: nowrap;
}

body.page-cabinet .builder-item-option-subtitle,
body.page-cabinet .builder-item-empty {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: #8e8e8e;
}

body.page-cabinet .builder-item-empty {
    padding: 10px 12px;
}


/* ===== builder custom picker v3: lighter long dropdown ===== */
body.page-cabinet .builder-item-dropdown {
    max-height: calc(100vh - 155px);
    min-height: 420px;
    border-color: #4b463a;
    background: #2a2823;
    color: #f0eee8;
    box-shadow: 0 18px 46px rgba(0,0,0,.52);
}

body.page-cabinet .builder-item-option {
    border-bottom-color: rgba(255,255,255,.08);
    background: #2a2823;
    color: #f0eee8;
}

body.page-cabinet .builder-item-option:nth-child(even) {
    background: #25231f;
}

body.page-cabinet .builder-item-option:hover,
body.page-cabinet .builder-item-option:focus {
    background: #3a352b;
}

body.page-cabinet .builder-item-option-title {
    color: #fff6df;
    font-size: 16px;
    font-weight: 800;
}

body.page-cabinet .builder-item-option-code {
    color: #b8b1a4;
    font-size: 11px;
    font-family: Consolas, monospace;
}

body.page-cabinet .builder-item-option-subtitle {
    display: none !important;
}

body.page-cabinet .builder-item-empty {
    color: #d0c8ba;
    background: #2a2823;
}

@media (max-width: 720px) {
    body.page-cabinet .builder-item-dropdown {
        max-height: calc(100vh - 115px);
        min-height: 360px;
    }

    body.page-cabinet .builder-item-option-top {
        display: grid;
        grid-template-columns: 1fr;
        gap: 3px;
    }

    body.page-cabinet .builder-item-option-code {
        white-space: normal;
        word-break: break-all;
    }
}


/* ===== builder custom picker v4: viewport dropdown + lighter title weight ===== */
body.page-cabinet .builder-item-dropdown {
    position: fixed !important;
    top: 16px !important;
    bottom: 16px !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow-y: auto;
    overflow-x: hidden;
}

body.page-cabinet .builder-item-option-title {
    font-weight: 600 !important;
    font-size: 15px !important;
    letter-spacing: 0;
}

body.page-cabinet .builder-item-option-code {
    font-size: 10.5px !important;
    opacity: 0.92;
}

@media (max-width: 720px) {
    body.page-cabinet .builder-item-dropdown {
        top: 10px !important;
        bottom: 10px !important;
    }

    body.page-cabinet .builder-item-option-title {
        font-size: 14px !important;
        font-weight: 600 !important;
    }
}


/* ===== builder picker v14: wider, no wraps ===== */
body.page-cabinet .builder-item-dropdown {
    min-width: 450px;
}

body.page-cabinet .builder-item-option {
    overflow: hidden;
}

body.page-cabinet .builder-item-option-top {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    min-width: 0;
}

body.page-cabinet .builder-item-option-title {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: clip;
    font-weight: 600 !important;
}

body.page-cabinet .builder-item-option-code {
    flex: 0 0 auto;
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: clip;
    font-size: 10.5px !important;
}

@media (max-width: 720px) {
    body.page-cabinet .builder-item-dropdown {
        min-width: 0;
    }

    body.page-cabinet .builder-item-option-top {
        grid-template-columns: none !important;
        display: flex !important;
    }
}


/* ===== builder picker v17: streamer friendly list ===== */
body.page-cabinet .builder-item-dropdown {
    min-width: 450px;
}

body.page-cabinet .builder-item-option {
    overflow: hidden;
}

body.page-cabinet .builder-item-option-top {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    min-width: 0;
}

body.page-cabinet .builder-item-option-title {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: clip;
    font-size: 14px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
}

body.page-cabinet .builder-item-option-code {
    flex: 0 0 auto;
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: clip;
    font-size: 10px !important;
    font-weight: 400 !important;
    opacity: 0.7;
}

@media (max-width: 720px) {
    body.page-cabinet .builder-item-dropdown {
        min-width: 0;
    }

    body.page-cabinet .builder-item-option-top {
        grid-template-columns: none !important;
        display: flex !important;
    }

    body.page-cabinet .builder-item-option-title {
        font-size: 13px !important;
    }
}


/* ===== builder edit/delete v18 ===== */
body.page-cabinet .builder-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    align-items: center;
}

body.page-cabinet .builder-delete-card-form {
    display: inline;
    margin: 0;
}

body.page-cabinet .builder-current-image {
    width: 96px;
    height: 96px;
    overflow: hidden;
    border: 1px solid #333;
    border-radius: 10px;
    background: #101010;
}

body.page-cabinet .builder-current-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* ===== builder share links v19 ===== */
body.page-cabinet .builder-share-result {
    border-color: rgba(124, 191, 255, 0.35);
    background: linear-gradient(180deg, rgba(20, 34, 44, 0.88), #181818);
}

body.page-cabinet .builder-share-result h3 {
    margin-top: 0;
}


/* ===== builder share modal v21 ===== */
body.page-cabinet .builder-share-modal {
    position: fixed;
    inset: 0;
    z-index: 20000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

body.page-cabinet .builder-share-modal.is-visible {
    display: flex;
}

body.page-cabinet .builder-share-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.72);
    backdrop-filter: blur(3px);
}

body.page-cabinet .builder-share-modal-dialog {
    position: relative;
    z-index: 1;
    width: min(620px, 100%);
    padding: 22px;
    border: 1px solid rgba(124, 191, 255, 0.38);
    border-radius: 16px;
    background: linear-gradient(180deg, #20262d, #151515);
    box-shadow: 0 24px 80px rgba(0,0,0,.66), 0 0 26px rgba(124,191,255,.11);
}

body.page-cabinet .builder-share-modal-dialog h2 {
    margin-top: 0;
    padding-right: 34px;
}

body.page-cabinet .builder-share-modal-close {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    color: #ddd;
    cursor: pointer;
    font-size: 24px;
    line-height: 1;
}

body.page-cabinet .builder-share-modal-close:hover {
    background: rgba(255,255,255,.14);
    color: #fff;
}

body.page-cabinet .builder-share-modal-dialog input.copy {
    width: 100%;
}

@media (max-width: 620px) {
    body.page-cabinet .builder-share-modal-dialog {
        padding: 18px;
        border-radius: 14px;
    }

    body.page-cabinet .builder-share-modal-dialog .actions {
        display: grid;
        grid-template-columns: 1fr;
    }
}


/* ===== builder item quality/durability v22 ===== */
body.page-cabinet .builder-item-row {
    grid-template-columns: minmax(220px, 1.35fr) minmax(92px, .45fr) minmax(105px, .5fr) minmax(150px, .7fr) auto;
}

@media (max-width: 980px) {
    body.page-cabinet .builder-item-row {
        grid-template-columns: 1fr 120px 120px 160px;
    }

    body.page-cabinet .builder-remove-row {
        grid-column: 1 / -1;
    }
}

@media (max-width: 720px) {
    body.page-cabinet .builder-item-row {
        grid-template-columns: 1fr;
    }
}


/* ===== builder auto description v24 ===== */
body.page-cabinet #builderAutoDescription {
    color: #ddd;
    background: #151515;
}


/* ===== builder mob constructor v27 ===== */
body.page-cabinet .builder-mob-rows {
    display: grid;
    gap: 10px;
}

body.page-cabinet .builder-mob-row {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(100px, .35fr) auto;
    gap: 10px;
    align-items: end;
    padding: 10px;
    border: 1px solid #333;
    border-radius: 10px;
    background: #141414;
}

body.page-cabinet .builder-mob-row label {
    display: block;
    margin-bottom: 5px;
    color: #aaa;
    font-size: 12px;
}

body.page-cabinet .builder-mob-row input {
    width: 100%;
    box-sizing: border-box;
}

@media (max-width: 720px) {
    body.page-cabinet .builder-mob-row {
        grid-template-columns: 1fr;
    }
}


/* ===== builder type tabs v28 ===== */
body.page-cabinet .builder-type-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0 14px;
}

body.page-cabinet .builder-type-tab {
    border: 1px solid #333;
    background: #222;
    color: #ddd;
    border-radius: 9px;
    padding: 10px 14px;
    cursor: pointer;
    font-weight: 600;
}

body.page-cabinet .builder-type-tab.active {
    background: #2e7d32;
    border-color: rgba(140, 255, 140, .45);
    color: #fff;
}

body.page-cabinet .builder-type-panel {
    display: none;
}

body.page-cabinet .builder-type-panel.active {
    display: block;
}

body.page-cabinet .builder-type-panel .builder-side .builder-sticky {
    top: 12px;
}


/* ===== builder effects constructor v36 ===== */
body.page-cabinet .builder-effect-form .builder-item-picker {
    position: relative;
}


/* ===== session_events compact price/top row v37 ===== */
body.page-session-events .session-price-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(96px, .55fr) auto;
    gap: 10px;
    align-items: end;
    margin-top: 10px;
}

body.page-session-events .session-price-row .field {
    min-width: 0;
}

body.page-session-events .session-top-inline {
    margin-top: 0;
    min-height: 38px;
    padding: 8px 0;
    align-self: end;
    white-space: nowrap;
}

@media (max-width: 620px) {
    body.page-session-events .session-price-row {
        grid-template-columns: 1fr;
    }

    body.page-session-events .session-top-inline {
        min-height: 0;
        padding: 0;
    }
}


/* ===== builder effect duration v38 ===== */
body.page-cabinet #builderEffectDurationSeconds { max-width: 180px; }


/* ===== effect bundle builder v39 ===== */
body.page-cabinet .builder-effect-rows {
    display: grid;
    gap: 10px;
}
body.page-cabinet .builder-effect-row {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(130px, .35fr) auto;
    gap: 10px;
    align-items: end;
    padding: 10px;
    border: 1px solid #333;
    border-radius: 10px;
    background: #141414;
}
body.page-cabinet .builder-effect-row label {
    display: block;
    margin-bottom: 5px;
    color: #aaa;
    font-size: 12px;
}
@media (max-width: 720px) {
    body.page-cabinet .builder-effect-row { grid-template-columns: 1fr; }
}

/* ===== storefront v40: dedicated chaos accents without inner background ===== */
/*
    Хаос — отдельная визуальная сторона события.
    Важно: не заливаем тело карточки фиолетовым фоном, чтобы карточки
    оставались в том же стиле, что help/harm/neutral.
    Фиолетовыми становятся только акценты: рамка, левая полоса, точки,
    разделитель, hover и элементы журнала.
*/
body.page-storefront {
    --sf-chaos: #b99cff;
    --sf-chaos-soft: #e2d6ff;
    --sf-chaos-border: rgba(185, 156, 255, 0.72);
    --sf-chaos-glow: rgba(185, 156, 255, 0.24);
}

body.page-storefront .card.card-chaos {
    border-color: var(--sf-chaos-border) !important;
}

body.page-storefront .card.card-chaos::before {
    background: var(--sf-chaos) !important;
    box-shadow: 0 0 16px var(--sf-chaos-glow) !important;
}

body.page-storefront .card.card-chaos:hover {
    border-color: rgba(213, 194, 255, 0.96) !important;
    box-shadow:
        0 0 0 1px rgba(185, 156, 255, 0.12),
        0 0 22px rgba(185, 156, 255, 0.20),
        0 12px 28px rgba(0, 0, 0, 0.38) !important;
}

body.page-storefront .effect-badge.effect-chaos {
    color: var(--sf-chaos-soft);
    background: rgba(83, 52, 132, 0.78);
    box-shadow: 0 0 16px rgba(185, 156, 255, 0.28);
}

body.page-storefront .impact-dot.chaos.filled {
    background: var(--sf-chaos) !important;
    border-color: rgba(185, 156, 255, 0.90) !important;
    box-shadow: 0 0 8px rgba(185, 156, 255, 0.32) !important;
}

body.page-storefront .card-divider.divider-chaos {
    background: rgba(185, 156, 255, 0.92) !important;
    box-shadow: 0 0 9px rgba(185, 156, 255, 0.16);
}

body.page-storefront .donation-log-item-chaos {
    border-left-color: var(--sf-chaos) !important;
}

body.page-storefront .donation-log-item-chaos .donation-log-event {
    color: var(--sf-chaos-soft);
}