:root {
    --ui-green-950: #256f25;
    --ui-green-900: #2d882d;
    --ui-green-800: #34a234;
    --ui-green-700: #34a234;
    --ui-green-600: #34a234;
    --ui-green-100: #d0e5d0;
    --ui-green-50: #e1efe5;
    --ui-blue-700: #235ccf;
    --ui-amber-100: #fff3cd;
    --ui-amber-700: #765300;
    --ui-red-100: #feeceb;
    --ui-red-700: #b42318;
    --ui-ink: #202520;
    --ui-muted: #5f6368;
    --ui-line: #d0e5d0;
    --ui-surface: #ffffff;
    --ui-background: #e1efe5;
    --ui-radius-sm: 10px;
    --ui-radius-md: 16px;
    --ui-radius-lg: 24px;
    --ui-shadow-sm: 0 8px 24px rgba(45, 136, 45, 0.08);
    --ui-shadow-md: 0 20px 50px rgba(45, 136, 45, 0.14);
    --ui-transition: 180ms ease;
}

/* Visible only in the server-generated legal evidence PNG. */
.pretrial-evidence-render .pretrial-evidence-stamp {
    position: fixed;
    right: 18px;
    bottom: 14px;
    z-index: 10000;
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: calc(100vw - 36px);
    padding: 8px 12px;
    border: 1px solid rgba(31, 112, 39, 0.24);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 8px 24px rgba(25, 73, 40, 0.16);
    color: #415248;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.01em;
    white-space: nowrap;
    pointer-events: none;
    backdrop-filter: blur(8px);
}

.pretrial-evidence-render .pretrial-evidence-stamp strong {
    color: #1f7027;
    font-weight: 800;
}

html {
    color: var(--ui-ink);
    background: var(--ui-background);
    scroll-behavior: smooth;
}

body {
    color: var(--ui-ink);
    background: var(--ui-background);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

button,
input,
textarea,
select {
    font: inherit;
}

a,
button {
    -webkit-tap-highlight-color: transparent;
}

:focus-visible {
    outline: 3px solid rgba(52, 162, 52, 0.35);
    outline-offset: 3px;
}

/* System error pages */

.system-error-page {
    min-width: 320px;
    min-height: 100vh;
    min-height: 100svh;
    overflow-x: hidden;
    background:
        radial-gradient(
            circle at 12% 8%,
            rgba(52, 162, 52, 0.18),
            transparent 28rem
        ),
        radial-gradient(
            circle at 88% 92%,
            rgba(52, 162, 52, 0.1),
            transparent 26rem
        ),
        linear-gradient(145deg, #e1efe5 0%, #f7faf7 55%, #e1efe5 100%);
}

.system-error {
    display: grid;
    width: 100%;
    min-height: 100vh;
    min-height: 100svh;
    place-items: center;
    padding: clamp(20px, 5vw, 64px);
}

.system-error__card {
    position: relative;
    width: min(100%, 920px);
    overflow: hidden;
    border: 1px solid rgba(52, 162, 52, 0.16);
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: var(--ui-shadow-md);
}

.system-error__card::before {
    content: "";
    position: absolute;
    top: -150px;
    right: -130px;
    width: 340px;
    height: 340px;
    border: 1px solid rgba(52, 162, 52, 0.12);
    border-radius: 50%;
    box-shadow:
        0 0 0 46px rgba(52, 162, 52, 0.04),
        0 0 0 92px rgba(52, 162, 52, 0.025);
    pointer-events: none;
}

.system-error__brand {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 16px;
    margin: clamp(24px, 4vw, 40px);
    color: var(--ui-green-900);
    font-size: 0.78rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.system-error__brand img {
    display: block;
    width: 78px;
    height: 54px;
    object-fit: contain;
}

.system-error__brand span {
    padding-left: 16px;
    border-left: 1px solid var(--ui-line);
}

.system-error__content {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(220px, 0.72fr) minmax(380px, 1.28fr);
    align-items: center;
    min-height: 390px;
    padding: 0 clamp(32px, 6vw, 72px) clamp(42px, 6vw, 68px);
}

.system-error__code {
    color: var(--ui-green-800);
    font-size: clamp(6.8rem, 17vw, 11rem);
    font-weight: 850;
    letter-spacing: -0.095em;
    line-height: 0.82;
    text-shadow: 0 14px 30px rgba(52, 162, 52, 0.14);
}

.system-error__message {
    max-width: 490px;
    padding-left: clamp(24px, 5vw, 58px);
    border-left: 1px solid var(--ui-line);
}

.system-error__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 15px;
    color: var(--ui-green-900);
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.system-error__eyebrow::before {
    content: "";
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
}

.system-error__message h1 {
    max-width: 480px;
    margin: 0;
    color: var(--ui-ink);
    font-size: clamp(2rem, 4vw, 3.25rem);
    font-weight: 780;
    letter-spacing: -0.05em;
    line-height: 1.02;
}

.system-error__message p {
    max-width: 460px;
    margin-top: 20px;
    color: var(--ui-muted);
    font-size: 1rem;
    line-height: 1.65;
}

.system-error__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.system-error__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 11px 22px;
    border: 1px solid var(--ui-line);
    border-radius: 12px;
    font-size: 0.9rem;
    font-weight: 750;
    transition:
        color var(--ui-transition),
        background-color var(--ui-transition),
        border-color var(--ui-transition),
        box-shadow var(--ui-transition),
        transform var(--ui-transition);
}

.system-error__button:hover {
    transform: translateY(-2px);
}

.system-error__button--primary {
    border-color: var(--ui-green-800);
    background: var(--ui-green-800);
    color: #fff;
    box-shadow: 0 10px 24px rgba(52, 162, 52, 0.2);
}

.system-error__button--primary:hover {
    border-color: var(--ui-green-900);
    background: var(--ui-green-900);
    color: #fff;
}

.system-error__button--secondary {
    background: #fff;
    color: var(--ui-ink);
}

.system-error__button--secondary:hover {
    border-color: var(--ui-green-800);
    color: var(--ui-green-900);
}

.system-error__footer {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 68px;
    padding: 16px 24px;
    border-top: 1px solid var(--ui-line);
    background: rgba(225, 239, 229, 0.62);
    color: var(--ui-muted);
    font-size: 0.88rem;
}

.system-error__footer a {
    color: var(--ui-green-900);
    font-size: 1rem;
    font-weight: 850;
}

@media (max-width: 700px) {
    .system-error {
        align-items: stretch;
        padding: 0;
    }

    .system-error__card {
        min-height: 100vh;
        min-height: 100svh;
        border: 0;
        border-radius: 0;
    }

    .system-error__brand {
        margin: 22px;
    }

    .system-error__brand img {
        width: 66px;
        height: 46px;
    }

    .system-error__content {
        grid-template-columns: 1fr;
        align-content: center;
        min-height: calc(100svh - 180px);
        padding: 10px 24px 44px;
    }

    .system-error__code {
        margin-bottom: 30px;
        font-size: clamp(6rem, 32vw, 8.4rem);
    }

    .system-error__message {
        padding-top: 28px;
        padding-left: 0;
        border-top: 1px solid var(--ui-line);
        border-left: 0;
    }

    .system-error__message h1 {
        font-size: clamp(2rem, 10vw, 2.8rem);
    }

    .system-error__actions {
        display: grid;
    }

    .system-error__button {
        width: 100%;
        min-height: 52px;
    }
}

/* Authentication */

.auth-page {
    min-height: 100vh;
    overflow-x: hidden;
    background:
        radial-gradient(circle at 18% 0%, rgba(52, 162, 52, 0.14), transparent 38rem),
        linear-gradient(180deg, #e1efe5 0%, #f2f7f3 54%, #e1efe5 100%);
    background-attachment: fixed;
}

.auth-page > .cabinet-banner--auth {
    width: 100%;
    margin: 0;
    padding-right: 20px;
    padding-left: 20px;
}

.auth-page > .cabinet-banner--auth .banner-content {
    width: min(100%, 1280px);
}

.auth-page--with-banner .auth-layout {
    min-height: min(760px, calc(100vh - 116px));
}

.auth-layout {
    --auth-wave-x: calc(clamp(34px, 5vw, 64px) + 111px);
    --auth-wave-y: calc(clamp(34px, 5vw, 64px) + 45px);
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(360px, 0.9fr) minmax(440px, 1.1fr);
    width: min(1180px, calc(100% - 48px));
    min-height: min(760px, calc(100vh - 64px));
    margin: 32px auto;
    overflow: hidden;
    border: 1px solid rgba(52, 162, 52, 0.14);
    border-radius: 32px;
    background: var(--ui-surface);
    box-shadow: var(--ui-shadow-md);
}

.auth-layout::before,
.auth-layout::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    border-radius: inherit;
    background: repeating-radial-gradient(
        circle at var(--auth-wave-x) var(--auth-wave-y),
        transparent 0 74px,
        var(--auth-wave-color) 75px 76px,
        transparent 77px 132px
    );
    pointer-events: none;
}

.auth-layout::before {
    --auth-wave-color: rgba(255, 255, 255, 0.1);
    clip-path: inset(0 55% 0 0);
}

.auth-layout::after {
    --auth-wave-color: rgba(52, 162, 52, 0.065);
    clip-path: inset(0 0 0 45%);
}

.auth-page .auth-showcase,
.auth-page .auth-panel {
    display: flex;
    width: auto;
    height: auto;
}

.auth-showcase {
    position: relative;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(34px, 5vw, 64px);
    overflow: hidden;
    background:
        linear-gradient(145deg, rgba(52, 162, 52, 0.98), rgba(45, 136, 45, 0.98)),
        var(--ui-green-900);
    color: #fff;
}

.auth-showcase::before,
.auth-showcase::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.auth-showcase::before {
    display: none;
}

.auth-showcase::after {
    right: 48px;
    bottom: 95px;
    width: 12px;
    height: 12px;
    background: #b1edc2;
    box-shadow:
        34px 18px 0 rgba(177, 237, 194, 0.54),
        64px -12px 0 rgba(255, 255, 255, 0.3);
}

.auth-brand {
    position: relative;
    z-index: 3;
    display: inline-flex;
    align-self: flex-start;
    padding: 12px 16px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
}

.auth-brand img {
    display: block;
    width: 190px;
    max-height: 66px;
}

.auth-showcase__content {
    position: relative;
    z-index: 3;
    max-width: 490px;
    margin: 56px 0;
}

.auth-eyebrow,
.page-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    color: #e1efe5;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.auth-eyebrow::before,
.page-eyebrow::before {
    content: "";
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
}

.auth-showcase h1 {
    max-width: 470px;
    margin: 0;
    color: #fff;
    font-size: clamp(2.4rem, 4.6vw, 4.4rem);
    font-weight: 760;
    letter-spacing: -0.055em;
    line-height: 0.98;
}

.auth-showcase__content > p {
    max-width: 470px;
    margin-top: 24px;
    color: rgba(255, 255, 255, 0.74);
    font-size: 1.04rem;
    line-height: 1.65;
}

.auth-benefits {
    display: grid;
    gap: 12px;
    margin-top: 34px;
    padding: 0;
    list-style: none;
}

.auth-benefits li {
    position: relative;
    padding-left: 30px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.94rem;
}

.auth-benefits li::before {
    content: "✓";
    position: absolute;
    top: -1px;
    left: 0;
    display: grid;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 50%;
    background: rgba(225, 239, 229, 0.18);
    color: #e1efe5;
    font-size: 0.72rem;
    font-weight: 900;
}

.auth-support {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-top: 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.9rem;
}

.auth-support a {
    color: #fff;
    font-size: 1.05rem;
    font-weight: 800;
}

.auth-panel {
    align-items: center;
    justify-content: center;
    padding: clamp(30px, 6vw, 84px);
    background:
        linear-gradient(160deg, rgba(225, 239, 229, 0.65), transparent 45%),
        #fff;
}

.auth-card {
    position: relative;
    z-index: 3;
    display: flex;
    flex-direction: column;
    width: min(100%, 430px);
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.auth-card--wide {
    width: min(100%, 600px);
}

.auth-card__header {
    margin-bottom: 32px;
}

.auth-card__logo {
    display: block;
    width: 111px;
    height: 79px;
    margin: 0 auto 22px;
    object-fit: contain;
}

.auth-card__logo--mobile {
    display: none;
}

.auth-card__badge {
    display: inline-flex;
    margin-bottom: 16px;
    padding: 7px 11px;
    border-radius: 999px;
    background: var(--ui-green-50);
    color: var(--ui-green-800);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.auth-card h2 {
    margin: 0;
    color: var(--ui-ink);
    font-size: clamp(2rem, 4vw, 2.7rem);
    letter-spacing: -0.045em;
    line-height: 1.05;
}

.auth-card__header p {
    margin-top: 12px;
    color: var(--ui-muted);
    line-height: 1.55;
}

.auth-field {
    display: grid;
    gap: 8px;
    margin-bottom: 18px;
}

.auth-field label,
.form-label {
    color: #354139;
    font-size: 0.88rem;
    font-weight: 750;
}

.auth-input,
.support-page .form-control {
    width: 100%;
    min-height: 52px;
    padding: 0 15px;
    border: 1px solid #cfdcd3;
    border-radius: 12px;
    background: #fbfdfb;
    color: var(--ui-ink);
    font-size: 1rem;
    font-weight: 500;
    outline: none;
    transition:
        border-color var(--ui-transition),
        box-shadow var(--ui-transition),
        background-color var(--ui-transition);
}

.auth-input::placeholder,
.support-page .form-control::placeholder {
    color: #98a39c;
}

.auth-input:hover,
.support-page .form-control:hover {
    border-color: #9fbbaa;
    background: #fff;
}

.auth-input:focus,
.support-page .form-control:focus {
    border-color: var(--ui-green-600);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(52, 162, 52, 0.14);
}

.auth-options {
    display: flex;
    align-items: center;
    min-height: 24px;
    margin: 0 0 22px;
}

.auth-options .login-remember {
    margin: 0;
    color: #465149;
    font-size: 0.9rem;
}

.auth-options input[type="checkbox"] + label::before {
    top: 0;
    width: 19px;
    height: 19px;
    border: 1px solid #b9c9bf;
    border-radius: 5px;
}

.auth-options input[type="checkbox"]:checked + label::before {
    border-color: var(--ui-green-700);
    background: var(--ui-green-700);
}

.auth-options input[type="checkbox"]:checked + label::after {
    top: 5px;
    left: 5px;
    width: 9px;
    height: 5px;
    border-color: #fff;
}

.auth-submit,
.btn.btn-primary {
    display: inline-flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 12px;
    background: var(--ui-green-800);
    box-shadow: 0 10px 24px rgba(52, 162, 52, 0.22);
    color: #fff;
    font-size: 0.96rem;
    font-weight: 800;
    cursor: pointer;
    transition:
        transform var(--ui-transition),
        background-color var(--ui-transition),
        box-shadow var(--ui-transition);
}

.auth-submit:hover,
.btn.btn-primary:hover {
    border: 0;
    background: var(--ui-green-900);
    box-shadow: 0 14px 30px rgba(45, 136, 45, 0.28);
    transform: translateY(-1px);
}

.auth-submit:active,
.btn.btn-primary:active {
    transform: translateY(0);
}

.auth-card__hint {
    margin-top: 20px;
    color: var(--ui-muted);
    font-size: 0.82rem;
    line-height: 1.55;
    text-align: center;
}

.auth-card__hint a {
    color: var(--ui-green-800);
    font-weight: 800;
}

.auth-alert,
.page-alert {
    margin-bottom: 20px;
    padding: 12px 14px;
    border: 1px solid transparent;
    border-radius: 12px;
    font-size: 0.88rem;
    line-height: 1.45;
}

.auth-alert--error,
.page-alert--error {
    border-color: #f7c8c4;
    background: var(--ui-red-100);
    color: var(--ui-red-700);
}

.auth-alert--success,
.page-alert--success {
    border-color: #bde5ca;
    background: var(--ui-green-50);
    color: var(--ui-green-800);
}

.auth-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 18px;
}

.auth-field--full {
    grid-column: 1 / -1;
}

/* Shared cabinet shell */

.profile_bg {
    min-height: 100vh;
    background:
        radial-gradient(circle at 0 0, rgba(52, 162, 52, 0.08), transparent 34rem),
        var(--ui-background);
}

.wrapper {
    width: min(100%, 1320px);
    max-width: none;
    margin: 0 auto;
    padding: 0 20px 36px;
}

.cabinet-banner {
    position: relative;
    inset: auto;
    width: auto;
    margin: 0 -20px;
    padding: 9px 20px;
    background: var(--ui-green-950);
    box-shadow: none;
    color: #fff;
}

.cabinet-banner.collapsed {
    display: none;
    transform: none;
}

.banner-content {
    width: min(100%, 1280px);
    max-width: none;
    min-height: 34px;
    margin: 0 auto;
    padding: 0;
    justify-content: center;
    gap: 18px;
}

.banner-text {
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.78rem;
    font-weight: 600;
}

.banner-actions {
    gap: 8px;
}

.banner-button {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 11px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.09);
    color: #fff;
    font-size: 0.76rem;
    font-weight: 750;
}

.banner-button:hover {
    background: rgba(255, 255, 255, 0.16);
    box-shadow: none;
    color: #fff;
    transform: none;
}

.banner-toggle {
    width: 30px;
    height: 30px;
    border-radius: 8px;
}

.lk-header {
    position: sticky;
    top: 0;
    z-index: 100;
    width: 100%;
    max-width: none;
    min-height: 82px;
    margin: 0 !important;
    padding: 12px 18px;
    border: 1px solid rgba(52, 162, 52, 0.12);
    border-top: 0;
    border-radius: 0 0 20px 20px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 12px 32px rgba(45, 136, 45, 0.09);
    backdrop-filter: blur(14px);
}

.lk-header:hover {
    box-shadow: 0 12px 32px rgba(45, 136, 45, 0.12);
}

.header-brand-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.header-logo {
    width: auto;
    height: 54px;
}

.header-brand-name {
    padding-left: 12px;
    border-left: 1px solid var(--ui-line);
    color: var(--ui-green-900);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.nav-grid {
    gap: 8px;
}

.lk-buttons {
    display: flex !important;
    flex: 0 0 auto;
    align-items: center;
}

.lk-header .nav-grid a {
    padding: 10px 14px;
    border-radius: 10px;
    color: #455249;
    font-size: 0.92rem;
    font-weight: 700;
    transition:
        color var(--ui-transition),
        background-color var(--ui-transition);
}

.lk-header .nav-grid a:hover,
.lk-header .nav-grid a.is-active {
    background: var(--ui-green-50);
    color: var(--ui-green-800);
}

.hover-underline-animation::after {
    display: none;
}

.logout-btn-icon {
    display: inline-flex;
    width: auto;
    height: 42px;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 13px;
    border: 1px solid var(--ui-line);
    border-radius: 11px;
    background: #fff;
    color: #4c5850 !important;
    overflow: visible;
    transition:
        border-color var(--ui-transition),
        color var(--ui-transition),
        background-color var(--ui-transition);
}

.logout-btn-icon:hover {
    border-color: #efb9b5;
    background: #fff8f7;
    color: var(--ui-red-700) !important;
}

.logout-btn-icon__label {
    font-size: 0.84rem;
    font-weight: 750;
}

.logout-btn-icon__arrow {
    font-size: 1.1rem;
    line-height: 1;
}

.logout-form,
.mobile-logout-form {
    margin: 0;
}

.logout-btn-icon,
.mobile-nav-item--button {
    font: inherit;
    cursor: pointer;
}

.mobile-nav-item--button {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
}

.main-content {
    min-height: auto;
    padding: 20px 0 0 !important;
}

.main-lk,
.main-lk-two,
.main-lk-three {
    gap: 16px;
}

.pretrial-claim {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 0;
    align-items: start;
    justify-content: stretch;
    gap: 18px;
    margin-top: 16px;
    padding: 22px;
    border: 1px solid #f0c56a;
    border-radius: var(--ui-radius-md);
    background:
        linear-gradient(135deg, rgba(255, 248, 228, 0.98), rgba(255, 253, 247, 0.98));
    box-shadow: 0 12px 30px rgba(123, 84, 0, 0.09);
    color: #4e3908;
    overflow: hidden;
}

.pretrial-claim__icon {
    display: inline-flex;
    width: 48px;
    height: 48px;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: #fff0bc;
    color: #8a5b00;
}

.pretrial-claim__eyebrow {
    color: #8a5b00;
    font-size: 0.75rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.pretrial-claim h2 {
    margin: 5px 0 7px;
    color: #352500;
    font-size: clamp(1.12rem, 2vw, 1.38rem);
    line-height: 1.25;
}

.pretrial-claim p {
    max-width: 760px;
    margin: 0;
    color: #705a25;
    font-size: 0.9rem;
    line-height: 1.55;
}

.pretrial-claim__breakdown {
    display: grid;
    grid-template-columns: repeat(3, minmax(120px, 1fr));
    gap: 10px;
    max-width: 720px;
    margin: 16px 0 0;
}

.pretrial-claim__breakdown > div {
    padding: 11px 13px;
    border: 1px solid rgba(138, 91, 0, 0.14);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.7);
}

.pretrial-claim__breakdown dt {
    margin-bottom: 4px;
    color: #806a36;
    font-size: 0.74rem;
    font-weight: 650;
}

.pretrial-claim__breakdown dd {
    margin: 0;
    color: #4a3400;
    font-size: 1rem;
    font-weight: 800;
}

.pretrial-claim__breakdown .pretrial-claim__total {
    border-color: rgba(138, 91, 0, 0.28);
    background: #fff4ce;
}

.pretrial-claim__actions {
    display: flex;
    min-width: 210px;
    flex-direction: column;
    gap: 9px;
}

.pretrial-claim__pay,
.pretrial-claim__support {
    display: inline-flex;
    min-height: 43px;
    align-items: center;
    justify-content: center;
    padding: 9px 14px;
    border-radius: 11px;
    font-size: 0.82rem;
    font-weight: 800;
    text-align: center;
}

.pretrial-claim__pay {
    background: var(--ui-green-800);
    box-shadow: 0 8px 18px rgba(52, 162, 52, 0.18);
    color: #fff !important;
}

.pretrial-claim__pay:hover {
    background: var(--ui-green-900);
    color: #fff;
}

.pretrial-claim__support {
    border: 1px solid rgba(138, 91, 0, 0.22);
    background: rgba(255, 255, 255, 0.72);
    color: #745100;
}

.pretrial-claim__support:hover {
    border-color: rgba(138, 91, 0, 0.4);
    color: #4a3400;
}

.pretrial-document {
    grid-column: 1 / -1;
    width: 100%;
    margin-top: 2px;
    border: 1px solid rgba(138, 91, 0, 0.16);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.68);
    overflow: hidden;
}

.pretrial-document__summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 64px;
    padding: 10px 13px;
    color: #4a3400;
    cursor: pointer;
    list-style: none;
}

.pretrial-document__summary::-webkit-details-marker {
    display: none;
}

.pretrial-document__summary:hover {
    background: rgba(255, 244, 206, 0.52);
}

.pretrial-document__summary:focus-visible {
    outline: 3px solid rgba(52, 162, 52, 0.24);
    outline-offset: -3px;
}

.pretrial-document__format {
    display: inline-flex;
    min-width: 42px;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #fff0bc;
    color: #855800;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.04em;
}

.pretrial-document__title {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.pretrial-document__title strong {
    color: #4a3400;
    font-size: 0.86rem;
}

.pretrial-document__title small {
    color: #806a36;
    font-size: 0.73rem;
    line-height: 1.35;
}

.pretrial-document__toggle {
    display: inline-flex;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: rgba(138, 91, 0, 0.07);
    transition: transform var(--ui-transition);
}

.pretrial-document[open] .pretrial-document__toggle {
    transform: rotate(180deg);
}

.pretrial-document__viewer {
    padding: 12px;
    border-top: 1px solid rgba(138, 91, 0, 0.13);
    background: #f6f3ea;
}

.pretrial-document__toolbar {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 4px 10px;
    color: #5d4a1d;
    font-size: 0.78rem;
    font-weight: 750;
}

.pretrial-document__toolbar > div {
    display: flex;
    gap: 8px;
}

.pretrial-document__toolbar a,
.pretrial-document__fallback a {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    padding: 6px 10px;
    border: 1px solid rgba(52, 162, 52, 0.24);
    border-radius: 9px;
    background: #fff;
    color: var(--ui-green-800);
    font-weight: 800;
}

.pretrial-document__object {
    display: block;
    width: 100%;
    height: clamp(460px, 68vh, 760px);
    border: 0;
    border-radius: 10px;
    background: #d9d9d9;
}

.pretrial-document__fallback,
.pretrial-document__placeholder {
    display: flex;
    min-height: 280px;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 28px;
    border: 1px dashed rgba(138, 91, 0, 0.25);
    border-radius: 10px;
    background:
        linear-gradient(135deg, #fff, #fbfaf5);
    color: #5d4a1d;
    text-align: left;
}

.pretrial-document__fallback {
    flex-direction: column;
    text-align: center;
}

.pretrial-document__page {
    display: inline-flex;
    width: 78px;
    height: 98px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border: 1px solid #d8cda8;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(76, 57, 13, 0.1);
    color: #8a5b00;
    font-size: 0.78rem;
    font-weight: 900;
}

.pretrial-document__placeholder strong {
    display: block;
    margin-bottom: 5px;
    color: #4a3400;
    font-size: 0.95rem;
}

.pretrial-document__placeholder p {
    max-width: 520px;
    margin: 0;
    color: #806a36;
    font-size: 0.8rem;
    line-height: 1.5;
}

.lk-balance,
.lk-ad,
.lk-service,
.lk-service_finance,
.profile-section {
    border: 1px solid rgba(52, 162, 52, 0.11);
    box-shadow: var(--ui-shadow-sm);
}

.lk-balance,
.lk-service,
.lk-service_finance {
    border-radius: var(--ui-radius-md);
}

.lk-service {
    transition:
        transform var(--ui-transition),
        box-shadow var(--ui-transition),
        border-color var(--ui-transition);
}

.lk-service:not(.lk-service--closed):hover {
    border-color: rgba(52, 162, 52, 0.24);
    box-shadow: 0 14px 34px rgba(45, 136, 45, 0.11);
    transform: translateY(-2px);
}

.lk-service--closed {
    box-shadow: 0 10px 26px rgba(118, 83, 0, 0.08);
}

@media (max-width: 900px) {
    .pretrial-claim {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .pretrial-claim__actions {
        grid-column: 2;
        min-width: 0;
        flex-direction: row;
    }
}

@media (max-width: 620px) {
    .pretrial-claim {
        grid-template-columns: 1fr;
        padding: 18px;
    }

    .pretrial-claim__icon {
        width: 42px;
        height: 42px;
    }

    .pretrial-claim__breakdown {
        grid-template-columns: 1fr;
    }

    .pretrial-claim__actions {
        grid-column: auto;
        flex-direction: column;
    }

    .pretrial-document__summary {
        min-height: 58px;
        padding: 8px 10px;
    }

    .pretrial-document__title small {
        display: none;
    }

    .pretrial-document__toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .pretrial-document__toolbar > div {
        width: 100%;
    }

    .pretrial-document__toolbar a {
        flex: 1;
        justify-content: center;
    }

    .pretrial-document__object {
        height: 72vh;
        min-height: 430px;
    }

    .pretrial-document__placeholder {
        min-height: 240px;
        flex-direction: column;
        padding: 22px;
        text-align: center;
    }

    .pretrial-document__placeholder p {
        text-align: center;
    }
}

/* Compact pretrial notice in the otherwise empty services-grid column. */
.pretrial-claim {
    display: flex;
    width: 100%;
    max-width: 100%;
    height: 344px;
    min-height: 344px;
    align-self: stretch;
    flex-direction: column;
    gap: 10px;
    margin-top: 0;
    padding: 16px;
    overflow: hidden;
}

.pretrial-claim__heading {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pretrial-claim__heading .pretrial-claim__icon {
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    border-radius: 13px;
}

.pretrial-claim h2 {
    margin: 3px 0 0;
    font-size: 1.14rem;
    line-height: 1.2;
}

.pretrial-claim > p {
    max-width: none;
    font-size: 0.82rem;
    line-height: 1.4;
}

.pretrial-claim__amount {
    display: flex;
    width: 100%;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(138, 91, 0, 0.2);
    border-radius: 12px;
    background: #fff4ce;
}

.pretrial-claim__amount span {
    color: #806a36;
    font-size: 0.75rem;
    font-weight: 700;
}

.pretrial-claim__amount strong {
    color: #3f2c00;
    font-size: 1.24rem;
    line-height: 1;
    white-space: nowrap;
}

.pretrial-claim__breakdown {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    max-width: none;
    gap: 8px;
    margin: 0;
}

.pretrial-claim__breakdown > div {
    min-width: 0;
    padding: 7px 9px;
}

.pretrial-claim__breakdown dt {
    font-size: 0.68rem;
}

.pretrial-claim__breakdown dd {
    font-size: 0.84rem;
    white-space: nowrap;
}

.pretrial-claim__actions {
    display: flex;
    width: 100%;
    min-width: 0;
    flex-direction: column;
    grid-column: auto;
    gap: 8px;
    margin-top: auto;
}

.pretrial-claim__open,
.pretrial-claim__pay,
.pretrial-claim__support {
    width: 100%;
    min-height: 38px;
    border-radius: 10px;
}

.pretrial-claim__open {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 13px;
    border: 1px solid rgba(138, 91, 0, 0.3);
    background: #fff;
    color: #6e4c00;
    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 800;
    cursor: pointer;
    transition:
        border-color var(--ui-transition),
        background var(--ui-transition),
        color var(--ui-transition);
}

.pretrial-claim > .pretrial-claim__actions .pretrial-claim__open {
    min-height: 44px;
    font-size: 0.84rem;
}

.pretrial-claim > .pretrial-claim__actions .pretrial-claim__pay {
    min-height: 50px;
    padding: 12px 16px;
    font-size: 0.88rem;
}

.pretrial-claim__open:hover {
    border-color: rgba(138, 91, 0, 0.55);
    background: #fffaf0;
    color: #3f2c00;
}

.pretrial-claim__open:focus-visible,
.pretrial-modal__close:focus-visible {
    outline: 3px solid rgba(52, 162, 52, 0.28);
    outline-offset: 2px;
}

.pretrial-modal {
    width: 100vw;
    max-width: none;
    height: 100vh;
    height: 100dvh;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: 0 28px 80px rgba(18, 36, 20, 0.28);
    color: #1f2921;
    overflow: hidden;
}

.pretrial-modal::backdrop {
    background: rgba(18, 31, 21, 0.68);
    backdrop-filter: blur(3px);
}

.pretrial-modal__card {
    display: flex;
    height: 100vh;
    height: 100dvh;
    max-height: none;
    flex-direction: column;
    background: #f7faf7;
}

.pretrial-modal__card:focus {
    outline: none;
}

.pretrial-modal__header {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 20px 22px 18px;
    border-bottom: 1px solid rgba(52, 162, 52, 0.13);
    background: #fff;
}

.pretrial-modal__header h2 {
    margin: 4px 0 0;
    color: #1f2921;
    font-size: clamp(1.2rem, 2.2vw, 1.55rem);
    line-height: 1.25;
}

.pretrial-modal__close {
    display: inline-flex;
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(52, 162, 52, 0.13);
    border-radius: 11px;
    background: #f5faf5;
    color: #536257;
    font-family: inherit;
    font-size: 1.7rem;
    line-height: 1;
    cursor: pointer;
}

.pretrial-modal__close:hover {
    border-color: rgba(52, 162, 52, 0.25);
    background: var(--ui-green-50);
    color: var(--ui-green-900);
}

.pretrial-modal__close[hidden] {
    display: none;
}

.pretrial-modal__content {
    display: grid;
    grid-template-columns: minmax(250px, 310px) minmax(0, 1fr);
    grid-template-rows: auto auto minmax(0, 1fr);
    flex: 1 1 auto;
    min-height: 0;
    gap: 16px;
    padding: 16px;
    overflow: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
}

.pretrial-modal__summary {
    align-self: start;
    padding: 18px;
    border: 1px solid #f0c56a;
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(255, 248, 228, 0.98), rgba(255, 253, 247, 0.98));
    color: #4e3908;
}

.pretrial-modal__summary p {
    margin: 0;
    color: #705a25;
    font-size: 0.86rem;
    line-height: 1.5;
}

.pretrial-modal__breakdown {
    display: grid;
    gap: 8px;
    margin: 15px 0 0;
}

.pretrial-modal__breakdown > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 11px;
    border: 1px solid rgba(138, 91, 0, 0.14);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.75);
}

.pretrial-modal__breakdown dt {
    color: #806a36;
    font-size: 0.73rem;
    font-weight: 700;
}

.pretrial-modal__breakdown dd {
    margin: 0;
    color: #4a3400;
    font-size: 0.9rem;
    font-weight: 850;
    white-space: nowrap;
}

.pretrial-modal__breakdown .pretrial-modal__total {
    border-color: rgba(138, 91, 0, 0.28);
    background: #fff0bc;
}

.pretrial-modal .pretrial-document {
    display: block;
    grid-column: 2;
    grid-row: 1 / span 3;
    width: 100%;
    min-width: 0;
    min-height: 0;
    margin: 0;
    border: 1px solid rgba(52, 162, 52, 0.12);
    border-radius: 14px;
    background: #eef3ee;
}

.pretrial-modal .pretrial-document__toolbar {
    padding: 10px 12px;
    border-bottom: 1px solid rgba(52, 162, 52, 0.1);
    background: #fff;
}

.pretrial-modal .pretrial-document__object {
    height: calc(100vh - 142px);
    height: calc(100dvh - 142px);
    min-height: 520px;
    border-radius: 0;
}

.pretrial-modal .pretrial-document__placeholder {
    min-height: calc(100vh - 142px);
    min-height: calc(100dvh - 142px);
    border: 0;
    border-radius: 0;
}

.pretrial-modal__actions {
    display: flex;
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    align-self: stretch;
    flex-direction: column;
    gap: 8px;
}

.pretrial-modal__actions .pretrial-claim__pay {
    width: 100%;
    min-height: 58px;
    padding: 14px 18px;
    font-size: 0.92rem;
}

.pretrial-modal__acknowledgement {
    display: grid;
    grid-column: 1;
    grid-row: 3;
    align-self: end;
    gap: 10px;
    padding: 14px;
    border: 1px solid rgba(52, 162, 52, 0.18);
    border-radius: 13px;
    background: #fff;
    box-shadow: var(--ui-shadow-sm);
}

.pretrial-modal__consent {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    color: #39483c;
    font-size: 0.79rem;
    font-weight: 650;
    line-height: 1.45;
    cursor: pointer;
}

.pretrial-modal__consent input[type="checkbox"] {
    position: static !important;
    left: auto !important;
    width: 20px;
    height: 20px;
    margin: 1px 0 0;
    accent-color: var(--ui-green-800);
}

.pretrial-modal__confirm {
    min-height: 44px;
    padding: 9px 12px;
    border: 0;
    border-radius: 10px;
    background: var(--ui-green-800);
    color: #fff;
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 850;
    line-height: 1.3;
    cursor: pointer;
}

.pretrial-modal__confirm:hover:not(:disabled) {
    background: var(--ui-green-900);
}

.pretrial-modal__confirm:disabled {
    background: #aeb9b0;
    cursor: not-allowed;
}

.pretrial-modal__error {
    margin: 0;
    color: #b42318;
    font-size: 0.75rem;
    line-height: 1.4;
}

@media (max-width: 1200px) {
    .pretrial-claim {
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    .pretrial-claim__actions {
        margin-top: 0;
    }
}

@media (max-width: 760px) {
    .pretrial-modal {
        width: 100vw;
        height: 100vh;
        height: 100dvh;
        max-height: none;
        border-radius: 0;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior-y: contain;
        touch-action: pan-y;
        -webkit-overflow-scrolling: touch;
    }

    .pretrial-modal__card {
        height: auto;
        min-height: 100vh;
        min-height: 100dvh;
        max-height: none;
        overflow: visible;
    }

    .pretrial-modal__header {
        padding: 16px;
    }

    .pretrial-modal__content {
        display: flex;
        min-height: auto;
        flex: 0 0 auto;
        flex-direction: column;
        padding: 10px;
        overflow: visible;
    }

    .pretrial-modal__actions,
    .pretrial-modal__acknowledgement,
    .pretrial-modal .pretrial-document {
        grid-column: auto;
        grid-row: auto;
    }

    .pretrial-modal .pretrial-document__object {
        height: 68vh;
        min-height: 430px;
    }

    .pretrial-modal .pretrial-document__placeholder {
        min-height: 360px;
    }

    .pretrial-claim {
        width: 100%;
        align-items: stretch;
        gap: 12px;
        padding: 16px;
    }

    .pretrial-claim__heading,
    .pretrial-claim__amount,
    .pretrial-claim__actions {
        width: 100%;
    }

    .pretrial-claim__amount {
        min-height: 52px;
        align-items: center;
        padding: 11px 13px;
    }

    .pretrial-claim__amount strong {
        font-size: 1.32rem;
    }

    .pretrial-claim__breakdown > div {
        padding: 10px 11px;
    }

    .pretrial-claim__actions {
        gap: 10px;
    }

    .pretrial-claim > .pretrial-claim__actions .pretrial-claim__open {
        min-height: 46px;
        font-size: 0.86rem;
    }

    .pretrial-claim > .pretrial-claim__actions .pretrial-claim__pay {
        width: 100%;
        min-height: 52px;
        padding: 13px 16px;
        font-size: 0.9rem;
    }
}

.lk-ad {
    overflow: hidden;
    border-radius: var(--ui-radius-md);
}

.payment-button,
.link-account-button,
.btn-select-tariff {
    border-radius: 11px;
    background: var(--ui-green-800);
    box-shadow: 0 8px 18px rgba(52, 162, 52, 0.18);
    color: #fff !important;
    transition:
        background-color var(--ui-transition),
        transform var(--ui-transition),
        box-shadow var(--ui-transition);
}

.payment-button *,
.link-account-button *,
.btn-select-tariff * {
    color: inherit !important;
}

.payment-button:hover,
.link-account-button:hover,
.btn-select-tariff:hover {
    background: var(--ui-green-900);
    box-shadow: 0 12px 24px rgba(45, 136, 45, 0.24);
    color: #fff !important;
    transform: translateY(-1px);
}

.tv-payment-notice {
    display: grid;
    width: 100%;
    gap: 4px;
    margin-top: 10px;
    padding: 11px 12px;
    border: 1px solid rgba(52, 162, 52, 0.2);
    border-radius: 11px;
    background: var(--ui-green-50);
    color: #405047;
    text-align: left;
}

.tv-payment-notice strong {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--ui-green-900);
    font-size: 0.78rem;
    line-height: 1.25;
}

.tv-payment-notice strong::before {
    display: inline-flex;
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(52, 162, 52, 0.14);
    content: "i";
    font-size: 0.72rem;
    font-weight: 900;
}

.tv-payment-notice span {
    font-size: 0.72rem;
    line-height: 1.4;
}

.modal-content,
.modal-panel {
    border: 1px solid rgba(52, 162, 52, 0.14);
    border-radius: var(--ui-radius-lg);
    box-shadow: var(--ui-shadow-md);
}

/* Support */

.support-page section {
    display: block;
    width: auto;
    height: auto;
}

.support-hero {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 18px;
    padding: 30px 34px;
    border: 1px solid rgba(52, 162, 52, 0.12);
    border-radius: var(--ui-radius-lg);
    background:
        linear-gradient(125deg, rgba(52, 162, 52, 0.98), rgba(45, 136, 45, 0.96));
    box-shadow: var(--ui-shadow-sm);
    color: #fff;
}

.support-hero .page-eyebrow {
    margin-bottom: 10px;
    color: #e1efe5;
}

.support-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2rem, 4vw, 3.2rem);
    letter-spacing: -0.045em;
    line-height: 1;
}

.support-hero p {
    max-width: 620px;
    margin-top: 12px;
    color: rgba(255, 255, 255, 0.76);
    line-height: 1.55;
}

.support-contact-card {
    display: grid;
    flex: 0 0 auto;
    gap: 2px;
    min-width: 210px;
    padding: 16px 18px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.1);
}

.support-contact-card span,
.support-contact-card small {
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.76rem;
}

.support-contact-card a {
    margin: 3px 0;
    color: #fff;
    font-size: 1.65rem;
    font-weight: 850;
    letter-spacing: -0.03em;
}

.support-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(320px, 0.75fr);
    gap: 18px;
    align-items: stretch;
}

.support-conversation,
.support-compose {
    min-width: 0;
    padding: 24px;
    border: 1px solid var(--ui-line);
    border-radius: var(--ui-radius-lg);
    background: var(--ui-surface);
    box-shadow: var(--ui-shadow-sm);
}

.support-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.support-section-heading > div {
    display: flex;
    align-items: center;
    gap: 11px;
}

.support-section-heading h2 {
    margin: 0;
    font-size: 1.1rem;
    letter-spacing: -0.02em;
}

.support-section-heading__icon {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 11px;
    background: var(--ui-green-50);
    color: var(--ui-green-800);
    font-size: 0.9rem;
    font-weight: 900;
    letter-spacing: -0.1em;
}

.support-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--ui-muted);
    font-size: 0.76rem;
    font-weight: 650;
}

.support-status > span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ui-green-600);
    box-shadow: 0 0 0 4px var(--ui-green-100);
}

.support-page .messages-list {
    display: flex;
    min-height: 360px;
    max-height: 540px;
    flex-direction: column;
    padding: 18px;
    border: 1px solid #e7eee9;
    border-radius: 16px;
    background: #f8fbf9;
    scrollbar-color: #b9c9bf transparent;
}

.support-page .message-item {
    max-width: 76%;
    margin-bottom: 12px;
    padding: 13px 15px;
    border: 0;
    border-radius: 15px;
    box-shadow: none;
}

.support-page .message-item.user-message {
    align-self: flex-end;
    margin-right: 0;
    border: 0;
    border-bottom-right-radius: 5px;
    background: var(--ui-green-800);
    color: #fff;
    text-align: left;
}

.support-page .message-item.admin-message {
    align-self: flex-start;
    margin-left: 0;
    border: 1px solid var(--ui-line);
    border-bottom-left-radius: 5px;
    background: #fff;
    color: var(--ui-ink);
    text-align: left;
}

.support-page .message-header,
.support-page .message-item.admin-message .message-header {
    flex-direction: row;
}

.support-page .user-message .message-header,
.support-page .user-message .message-date {
    color: rgba(255, 255, 255, 0.7);
}

.support-page .message-content {
    line-height: 1.55;
}

.no-messages {
    display: flex;
    min-height: 320px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 30px;
    color: var(--ui-muted);
    font-style: normal;
    text-align: center;
}

.no-messages__icon {
    display: grid;
    width: 52px;
    height: 52px;
    margin-bottom: 16px;
    place-items: center;
    border-radius: 16px;
    background: var(--ui-green-50);
    color: var(--ui-green-800);
    font-size: 1.2rem;
    font-weight: 900;
}

.no-messages h3 {
    margin: 0 0 7px;
    color: var(--ui-ink);
    font-size: 1.05rem;
    font-style: normal;
}

.no-messages p {
    max-width: 360px;
    margin: 0;
    color: var(--ui-muted);
    line-height: 1.55;
}

.support-page .message-form {
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.support-page .form-group {
    display: grid;
    gap: 8px;
}

.support-page textarea.form-control {
    min-height: 172px;
    padding: 13px 14px;
    resize: vertical;
}

.form-hint {
    color: #7c8880;
    font-size: 0.75rem;
    line-height: 1.45;
}

.btn-block {
    width: 100%;
    margin-top: 16px;
}

.support-note {
    display: grid;
    gap: 4px;
    margin-top: 18px;
    padding: 14px;
    border-radius: 12px;
    background: var(--ui-green-50);
}

.support-note strong {
    color: var(--ui-green-900);
    font-size: 0.82rem;
}

.support-note span {
    color: #5e7164;
    font-size: 0.76rem;
    line-height: 1.5;
}

/* Support chat */

.support-hero--chat {
    min-height: 118px;
    margin-bottom: 18px;
    padding: 26px 32px;
}

.support-hero__status {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 9px;
    padding: 11px 14px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 750;
}

.support-hero__status > span,
.support-agent__status > span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #b1edc2;
    box-shadow: 0 0 0 4px rgba(177, 237, 194, 0.17);
}

.support-chat-layout {
    display: block;
}

.support-chat {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--ui-line);
    border-radius: var(--ui-radius-lg);
    background: var(--ui-surface);
    box-shadow: var(--ui-shadow-sm);
}

.support-chat__header {
    display: flex;
    min-height: 82px;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--ui-line);
}

.support-agent {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 12px;
}

.support-agent__avatar {
    display: grid;
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 14px;
    background: var(--ui-green-50);
    overflow: hidden;
}

.support-agent__avatar img {
    width: 35px;
    height: 28px;
    object-fit: contain;
}

.support-agent h2 {
    margin: 0;
    color: var(--ui-ink);
    font-size: 1rem;
    letter-spacing: -0.015em;
}

.support-agent__status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--ui-muted);
    font-size: 0.74rem;
}

.support-agent__status > span {
    width: 7px;
    height: 7px;
    background: var(--ui-green-600);
    box-shadow: 0 0 0 3px var(--ui-green-100);
}

.support-chat__urgent {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-end;
    flex-direction: column;
    gap: 2px;
    padding: 8px 12px;
    border-radius: 10px;
    background: var(--ui-green-50);
}

.support-chat__urgent span {
    color: #657168;
    font-size: 0.68rem;
    font-weight: 650;
}

.support-chat__urgent a {
    color: var(--ui-green-900);
    font-size: 1.08rem;
    font-weight: 900;
    letter-spacing: -0.02em;
}

.support-chat .messages-list {
    display: flex;
    min-height: 390px;
    max-height: 510px;
    overflow-y: auto;
    flex-direction: column;
    padding: 24px;
    border: 0;
    border-radius: 0;
    background:
        radial-gradient(circle at 100% 0%, rgba(52, 162, 52, 0.07), transparent 24rem),
        #f8fbf9;
}

.chat-date-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 20px;
    color: #869189;
    font-size: 0.7rem;
    font-weight: 700;
}

.chat-date-divider::before,
.chat-date-divider::after {
    content: "";
    height: 1px;
    flex: 1;
    background: var(--ui-line);
}

.support-chat .message-item {
    width: fit-content;
    max-width: min(76%, 620px);
    margin-bottom: 14px;
    padding: 13px 15px 9px;
    border-radius: 16px;
}

.support-chat .message-item.admin-message {
    align-self: flex-start;
    border: 1px solid var(--ui-line);
    border-bottom-left-radius: 5px;
    background: #fff;
    color: var(--ui-ink);
}

.support-chat .message-item.user-message {
    align-self: flex-end;
    border-bottom-right-radius: 5px;
    background: var(--ui-green-800);
    color: #fff;
}

.support-chat .message-content {
    font-size: 0.92rem;
    line-height: 1.55;
}

.message-meta {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    margin-top: 6px;
    color: #7c8880;
    font-size: 0.65rem;
}

.support-chat .user-message .message-meta {
    color: rgba(255, 255, 255, 0.7);
}

.support-chat .message-sender {
    font-weight: 750;
}

.message-delivery {
    font-size: 0.72rem;
    font-weight: 900;
}

.support-chat .no-messages {
    min-height: 340px;
}

.support-chat__composer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    padding: 16px 18px 14px;
    border-top: 1px solid var(--ui-line);
    background: #fff;
}

.support-chat__composer textarea {
    width: 100%;
    min-height: 54px;
    max-height: 140px;
    padding: 14px 15px;
    border: 1px solid #cfdcd3;
    border-radius: 12px;
    background: #fbfdfb;
    color: var(--ui-ink);
    font: inherit;
    line-height: 1.45;
    outline: none;
    resize: vertical;
}

.support-chat__composer textarea:focus {
    border-color: var(--ui-green-600);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(52, 162, 52, 0.14);
}

.support-chat__composer button {
    min-width: 126px;
    border: 0;
    border-radius: 12px;
    background: var(--ui-green-800);
    box-shadow: 0 8px 18px rgba(52, 162, 52, 0.18);
    color: #fff;
    font-size: 0.88rem;
    font-weight: 800;
    cursor: pointer;
}

.support-chat__composer button:hover {
    background: var(--ui-green-900);
}

.support-chat__composer small {
    grid-column: 1 / -1;
    color: #7c8880;
    font-size: 0.7rem;
}

.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Mobile navigation */

.mobile-nav {
    background: #fff;
}

.mobile-nav-item {
    border-radius: 10px;
    border-bottom: 0;
}

.mobile-nav-item.is-active {
    background: var(--ui-green-50);
    color: var(--ui-green-800);
}

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

    .support-chat-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 840px) {
    .auth-layout {
        grid-template-columns: 1fr;
        width: min(720px, calc(100% - 32px));
        margin: 16px auto;
    }

    .auth-showcase {
        min-height: 350px;
    }

    .auth-showcase__content {
        margin: 42px 0;
    }

    .auth-showcase h1 {
        font-size: clamp(2.35rem, 8vw, 3.8rem);
    }

    .auth-panel {
        padding: 50px 34px;
    }

    .auth-page--login {
        display: flex;
        height: 100vh;
        height: 100svh;
        min-height: 0;
        flex-direction: column;
        overflow: hidden;
        background: #fff;
    }

    .auth-page--login > .cabinet-banner--auth {
        flex: 0 0 auto;
        margin: 0;
        padding: 7px 12px;
    }

    .auth-page--login > .cabinet-banner--auth .banner-content {
        min-height: 38px;
        gap: 4px;
    }

    .auth-page--login .auth-layout,
    .auth-page--login.auth-page--with-banner .auth-layout {
        flex: 1 1 auto;
        width: 100%;
        height: auto;
        min-height: 0;
        margin: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .auth-page--login .auth-layout::before,
    .auth-page--login .auth-layout::after {
        display: none;
    }

    .auth-page--login .auth-showcase {
        display: none;
    }

    .auth-page--login .auth-panel {
        min-height: 0;
        padding: 24px;
        overflow-y: auto;
        background: #fff;
    }

    .auth-page--login .auth-card__logo--mobile {
        display: block;
    }
}

@media (max-height: 800px) and (min-width: 841px) {
    .auth-layout {
        --auth-wave-x: 140px;
        --auth-wave-y: 70px;
        min-height: calc(100vh - 32px);
        margin-top: 16px;
        margin-bottom: 16px;
    }

    .auth-showcase {
        padding: 32px 44px;
    }

    .auth-brand img {
        width: 160px;
        max-height: 52px;
    }

    .auth-showcase__content {
        margin: 26px 0 22px;
    }

    .auth-showcase h1 {
        font-size: 3.25rem;
    }

    .auth-showcase__content > p {
        margin-top: 16px;
        line-height: 1.5;
    }

    .auth-benefits {
        gap: 8px;
        margin-top: 20px;
    }

    .auth-support {
        padding-top: 14px;
    }

    .auth-panel {
        padding-top: 42px;
        padding-bottom: 42px;
    }
}

@media (max-width: 768px) {
    .wrapper {
        max-width: none;
        padding: 0 12px 90px;
    }

    .cabinet-banner {
        margin: 0 -12px;
        padding: 9px 12px;
    }

    .banner-content {
        flex-direction: column;
        gap: 6px;
        text-align: center;
    }

    .banner-text {
        flex: none;
        margin: 0 !important;
        font-size: 0.7rem;
    }

    .banner-button {
        display: inline-flex;
        min-height: 28px;
        padding: 4px 10px;
        font-size: 0.7rem;
    }

    .lk-header {
        min-height: 70px;
        padding: 9px 14px;
        border-radius: 0 0 16px 16px;
    }

    .header-logo {
        height: 46px;
    }

    .header-brand-name {
        display: none;
    }

    .lk-buttons {
        display: none !important;
    }

    .main-content {
        padding-top: 14px !important;
    }

    .main-lk,
    .main-lk-two,
    .main-lk-three {
        padding-top: 12px;
    }

    .support-hero {
        align-items: flex-start;
        flex-direction: column;
        padding: 24px;
    }

    .support-hero--chat {
        min-height: auto;
    }

    .support-contact-card {
        width: 100%;
    }

    .support-conversation,
    .support-compose {
        padding: 18px;
    }

    .support-page .message-item {
        max-width: 90%;
    }

    .support-chat__header {
        align-items: stretch;
        flex-direction: column;
        gap: 12px;
        padding: 14px;
    }

    .support-chat__urgent {
        align-items: center;
        justify-content: space-between;
        flex-direction: row;
        padding: 10px 12px;
    }

    .support-chat__urgent span {
        font-size: 0.72rem;
    }

    .support-chat__urgent a {
        font-size: 1rem;
    }

    .support-chat .messages-list {
        min-height: 360px;
        max-height: 500px;
        padding: 16px;
    }

    .support-chat .message-item {
        max-width: 88%;
    }

    .support-chat__composer {
        grid-template-columns: 1fr;
        padding: 14px;
    }

    .support-chat__composer button {
        min-height: 48px;
    }

    .support-chat__composer small {
        grid-column: auto;
    }
}

@media (max-width: 560px) {
    .auth-layout {
        width: 100%;
        min-height: 100vh;
        margin: 0;
        border: 0;
        border-radius: 0;
    }

    .auth-showcase {
        min-height: 310px;
        padding: 28px 22px;
    }

    .auth-brand {
        padding: 9px 12px;
    }

    .auth-brand img {
        width: 155px;
    }

    .auth-showcase__content {
        margin: 34px 0 16px;
    }

    .auth-showcase h1 {
        font-size: 2.45rem;
    }

    .auth-showcase__content > p {
        margin-top: 16px;
        font-size: 0.94rem;
    }

    .auth-benefits {
        display: none;
    }

    .auth-support {
        padding-top: 16px;
    }

    .auth-panel {
        padding: 38px 22px 46px;
    }

    .auth-card__header {
        margin-bottom: 26px;
    }

    .auth-form-grid {
        grid-template-columns: 1fr;
    }

    .auth-field--full {
        grid-column: auto;
    }

    .support-hero {
        padding: 21px 18px;
    }

    .support-section-heading {
        align-items: flex-start;
    }

    .support-status {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* --------------------------------------------------------------------------
   Profile dashboard refresh
   Scoped to the personal cabinet so the login and support pages stay intact.
   -------------------------------------------------------------------------- */

.profile-dashboard {
    --dashboard-card-border: rgba(52, 162, 52, 0.13);
    --dashboard-card-shadow: 0 14px 38px rgba(39, 104, 54, 0.09);
    --dashboard-card-shadow-hover: 0 22px 48px rgba(39, 104, 54, 0.14);
    overflow-x: hidden;
    background:
        radial-gradient(circle at 2% 12%, rgba(52, 162, 52, 0.13), transparent 27rem),
        radial-gradient(circle at 96% 52%, rgba(52, 162, 52, 0.08), transparent 30rem),
        linear-gradient(145deg, #eef7f0 0%, #e1efe5 48%, #f5faf6 100%);
}

.profile-dashboard .wrapper {
    width: min(100%, 1380px);
}

.profile-dashboard__content {
    padding-top: 18px !important;
}

.dashboard-overview {
    position: relative;
    display: flex;
    width: 100%;
    height: auto;
    min-height: 126px;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    overflow: hidden;
    padding: 24px 28px;
    border: 1px solid var(--dashboard-card-border);
    border-radius: 22px;
    background:
        linear-gradient(110deg, rgba(255, 255, 255, 0.98), rgba(241, 249, 243, 0.96));
    box-shadow: var(--dashboard-card-shadow);
}

.dashboard-overview::before,
.dashboard-overview::after {
    position: absolute;
    border: 1px solid rgba(52, 162, 52, 0.1);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.dashboard-overview::before {
    top: -155px;
    right: 12%;
    width: 310px;
    height: 310px;
}

.dashboard-overview::after {
    top: -220px;
    right: 4%;
    width: 450px;
    height: 450px;
}

.dashboard-overview__copy,
.dashboard-overview__aside {
    position: relative;
    z-index: 1;
}

.dashboard-overview__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 5px;
    color: var(--ui-green-900);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.dashboard-overview__eyebrow::before {
    width: 20px;
    height: 2px;
    border-radius: 99px;
    background: var(--ui-green-800);
    content: "";
}

.dashboard-overview h1 {
    margin: 0;
    color: #172019;
    font-size: clamp(1.7rem, 3vw, 2.2rem);
    line-height: 1.08;
    letter-spacing: -0.035em;
}

.dashboard-overview p {
    margin: 8px 0 0;
    color: #5a675e;
    font-size: 0.94rem;
}

.dashboard-overview__aside {
    display: flex;
    align-items: center;
    gap: 12px;
}

.dashboard-overview__status,
.dashboard-overview__aside > a {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    font-size: 0.78rem;
    font-weight: 750;
}

.dashboard-overview__status {
    gap: 8px;
    padding: 0 14px;
    border: 1px solid rgba(52, 162, 52, 0.16);
    background: rgba(255, 255, 255, 0.78);
    color: #4c5c51;
}

.dashboard-overview__status > span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ui-green-800);
    box-shadow: 0 0 0 5px rgba(52, 162, 52, 0.12);
}

.dashboard-overview__aside > a {
    padding: 0 16px;
    background: var(--ui-green-800);
    box-shadow: 0 9px 20px rgba(52, 162, 52, 0.19);
    color: #fff;
    text-decoration: none;
    transition:
        background-color var(--ui-transition),
        transform var(--ui-transition),
        box-shadow var(--ui-transition);
}

.dashboard-overview__aside > a:hover {
    background: var(--ui-green-900);
    box-shadow: 0 13px 25px rgba(45, 136, 45, 0.24);
    transform: translateY(-1px);
}

.profile-dashboard .main-lk {
    grid-template-columns: minmax(300px, 338px) minmax(0, 1fr);
    align-items: stretch;
    gap: 18px;
    padding-top: 18px;
}

.profile-dashboard .lk-balance,
.profile-dashboard .lk-ad,
.profile-dashboard .lk-service,
.profile-dashboard .lk-service_finance {
    border: 1px solid var(--dashboard-card-border);
    box-shadow: var(--dashboard-card-shadow);
}

.profile-dashboard .lk-balance {
    min-height: 360px;
    max-height: none;
    padding: 26px;
    border-radius: 20px;
    background:
        linear-gradient(155deg, #fff 0%, #fff 70%, #f4faf5 100%);
}

.profile-dashboard .lk-balance h2 {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-bottom: 17px;
    color: #172019;
    font-size: 1.75rem;
    letter-spacing: -0.035em;
}

.profile-dashboard .lk-balance h2::before {
    color: var(--ui-green-900);
    content: "Состояние счёта";
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.profile-dashboard .balance-tabs {
    gap: 5px;
    margin-bottom: 18px;
    padding: 4px;
    border: 0;
    border-radius: 12px;
    background: var(--ui-green-50);
}

.profile-dashboard .balance-tab {
    display: flex;
    min-height: 35px;
    flex: 1 1 0;
    align-items: center;
    justify-content: center;
    padding: 7px 10px;
    border-radius: 9px;
    color: #657168;
    font-size: 0.76rem;
    font-weight: 720;
    text-align: center;
    transition:
        color var(--ui-transition),
        background-color var(--ui-transition),
        box-shadow var(--ui-transition);
}

.profile-dashboard .balance-tab.active {
    background: #fff;
    box-shadow: 0 5px 14px rgba(45, 136, 45, 0.11);
    color: var(--ui-green-900);
}

.profile-dashboard .balance-tab.active::after {
    display: none;
}

.profile-dashboard .balance-content.active {
    display: flex;
    min-height: 210px;
    flex-direction: column;
}

.profile-dashboard .balance-amount {
    margin: 1px 0 11px;
    color: #172019;
    font-size: clamp(2rem, 3vw, 2.55rem);
    line-height: 1;
    letter-spacing: -0.045em;
}

.profile-dashboard .balance-details {
    margin-bottom: 14px;
    padding: 10px 12px;
    border: 1px solid rgba(52, 162, 52, 0.1);
    border-radius: 11px;
    background: rgba(241, 248, 243, 0.72);
}

.profile-dashboard .balance-details .detail-item {
    gap: 10px;
}

.profile-dashboard .balance-details .detail-label {
    color: #68736b;
    font-size: 0.74rem;
    font-weight: 650;
}

.profile-dashboard .balance-details .detail-value {
    color: #202820;
    font-size: 0.78rem;
    font-weight: 820;
}

.profile-dashboard .balance-content > .payment-button {
    width: 100%;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    padding: 12px 16px;
    border-radius: 12px;
    text-align: center;
}

.profile-dashboard .balance-content > .service_body_info {
    margin: 0 0 9px;
}

.profile-dashboard .balance-content > .service_body_info .btn {
    min-height: 42px;
    border-radius: 11px;
    font-size: 0.78rem;
    font-weight: 780;
}

.profile-dashboard .lk-ad {
    min-height: 360px;
    overflow: hidden;
    border-radius: 20px;
    background: #081126;
}

.profile-dashboard .lk-ad::after {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
    content: "";
    pointer-events: none;
}

.profile-dashboard .lk-ad img {
    display: block;
    object-fit: fill;
    transition: transform 700ms ease;
}

.profile-dashboard .lk-ad:hover img {
    transform: scale(1.015);
}

.profile-dashboard .main-lk-two {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    padding: 18px 0 0;
}

.profile-dashboard .main-lk-two > div:empty {
    display: none;
}

.profile-dashboard .main-lk-two:has(> .pretrial-claim) {
    grid-template-columns:
        minmax(300px, 338px)
        repeat(3, minmax(0, 1fr));
}

.profile-dashboard .lk-service {
    height: auto;
    min-height: 318px;
    overflow: hidden;
    padding: 22px;
    border-radius: 20px;
    background:
        linear-gradient(155deg, #fff 0%, #fff 76%, #f6faf7 100%);
}

.profile-dashboard .lk-service::before {
    position: absolute;
    top: 0;
    left: 22px;
    width: 52px;
    height: 3px;
    border-radius: 0 0 99px 99px;
    background: var(--ui-green-800);
    content: "";
}

.profile-dashboard .lk-service:hover {
    border-color: rgba(52, 162, 52, 0.24);
    box-shadow: var(--dashboard-card-shadow-hover);
}

.profile-dashboard .lk-service--closed::before {
    background: #d79b20;
}

.profile-dashboard .lk-service_header {
    gap: 11px;
    margin-bottom: 14px;
}

.profile-dashboard .service_point {
    display: inline-flex;
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    padding: 9px;
    border-radius: 14px;
    background: linear-gradient(145deg, #e9f5ec, #dceee1);
}

.profile-dashboard .service_point svg {
    width: 27px;
    height: 27px;
}

.profile-dashboard .lk-service_header h2,
.profile-dashboard .service-title {
    color: #172019;
    font-size: 1.16rem;
    line-height: 1.18;
    letter-spacing: -0.02em;
}

.profile-dashboard .service_small {
    min-height: 42px;
    margin-bottom: 15px;
    color: #68736b;
    font-size: 0.76rem;
    line-height: 1.45;
}

.profile-dashboard .tariff-change-button,
.profile-dashboard .tariff-change-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 3px;
    color: var(--ui-green-900);
    font-weight: 800;
    text-decoration: none;
}

.profile-dashboard .service_body_info {
    min-height: 56px;
    gap: 11px;
    margin-bottom: 9px;
    padding: 10px 11px;
    border: 1px solid rgba(52, 162, 52, 0.1);
    border-radius: 12px;
    background: rgba(241, 248, 243, 0.72);
}

.profile-dashboard .service_body_info > svg {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
}

.profile-dashboard .service_body_info p {
    line-height: 1.28;
}

.profile-dashboard .service_body_info p:first-child {
    color: #66716a;
    font-size: 0.73rem;
    font-weight: 680;
}

.profile-dashboard .service_body_info p:last-child,
.profile-dashboard .service_body_info a {
    color: #19231b;
    font-size: 0.82rem;
    font-weight: 780;
}

.profile-dashboard .unlink-button {
    top: 15px;
    right: 15px;
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 9px;
    color: #8b958d;
}

.profile-dashboard .unlink-button:hover {
    border-color: #f3c5c2;
    background: #fff4f3;
    color: var(--ui-red-700);
}

.profile-dashboard .no-account-center {
    min-height: 190px;
    padding: 22px 10px 8px;
}

.profile-dashboard .link-account-button {
    width: min(100%, 210px);
    min-height: 118px;
    gap: 8px;
    padding: 18px;
    border: 1px dashed rgba(52, 162, 52, 0.55);
    background:
        linear-gradient(145deg, var(--ui-green-800), var(--ui-green-900));
    font-size: 0.85rem;
    line-height: 1.35;
}

.profile-dashboard .pretrial-claim {
    height: auto;
    min-height: 318px;
    padding: 20px;
    border-radius: 20px;
    box-shadow: 0 14px 38px rgba(123, 84, 0, 0.1);
}

.profile-dashboard .pretrial-claim__breakdown {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.profile-dashboard .pretrial-claim__actions {
    margin-top: auto;
}

.profile-dashboard .main-lk-three {
    display: block;
    padding: 18px 0 42px;
}

.profile-dashboard .main-lk-three > div:empty {
    display: none;
}

.profile-dashboard .lk-service_finance {
    gap: 20px;
    padding: 22px;
    border-radius: 20px;
    background:
        linear-gradient(155deg, #fff 0%, #fff 82%, #f4faf5 100%);
}

.profile-dashboard .lk-service_header_finance {
    gap: 12px;
    margin: 0;
    padding-bottom: 17px;
    border-bottom: 1px solid rgba(52, 162, 52, 0.11);
}

.profile-dashboard .finance-header {
    color: #172019;
    font-size: 1.2rem;
    letter-spacing: -0.02em;
}

.profile-dashboard .small-finance {
    color: #768079;
    font-size: 0.72rem;
}

.profile-dashboard .lk-service_finance_month {
    padding: 4px;
    border-radius: 11px;
    background: var(--ui-green-50);
}

.profile-dashboard .lk-service_finance_month button {
    min-height: 34px;
    padding: 0 13px;
    border-radius: 8px;
    background: transparent;
    color: #5b685f;
    font-size: 0.74rem;
}

.profile-dashboard .lk-service_finance_month .active {
    background: #fff;
    box-shadow: 0 5px 13px rgba(45, 136, 45, 0.12);
    color: var(--ui-green-900) !important;
}

.profile-dashboard .lk-service_body_finance {
    gap: 16px;
}

.profile-dashboard .lk-service_body_charge {
    min-height: 72px;
    padding: 13px 15px;
    border: 1px solid rgba(52, 162, 52, 0.09);
    border-radius: 14px;
    background: #f1f8f3;
}

.profile-dashboard .service_point-finance {
    display: inline-flex;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    box-shadow: 0 6px 15px rgba(45, 136, 45, 0.08);
}

/* Tariff chooser */

.profile-dashboard #changeTariffModal {
    padding: 20px;
    background: rgba(17, 27, 20, 0.64);
    backdrop-filter: blur(8px);
}

.profile-dashboard .tariff-modal {
    display: flex;
    width: min(1280px, calc(100vw - 40px));
    max-width: 1280px;
    max-height: calc(100vh - 40px);
    max-height: calc(100svh - 40px);
    overflow: hidden;
    flex-direction: column;
    border-radius: 26px;
    background: #f8fbf8;
}

.profile-dashboard .tariff-modal > .modal-header {
    flex: 0 0 auto;
    padding: 22px 26px;
    border-bottom: 1px solid rgba(52, 162, 52, 0.11);
    background: #fff;
}

.profile-dashboard .tariff-modal > .modal-header h2 {
    color: #172019;
    font-size: clamp(1.3rem, 2vw, 1.7rem);
    letter-spacing: -0.03em;
}

.profile-dashboard .tariff-modal > .modal-header h2::before {
    display: block;
    margin-bottom: 4px;
    color: var(--ui-green-900);
    content: "Управление услугами";
    font-size: 0.67rem;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.profile-dashboard .tariff-modal .close {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid var(--ui-line);
    border-radius: 12px;
    background: #fff;
    color: #6c776f;
    cursor: pointer;
    font-size: 1.45rem;
    line-height: 1;
    transition:
        border-color var(--ui-transition),
        color var(--ui-transition),
        background-color var(--ui-transition);
}

.profile-dashboard .tariff-modal .close:hover {
    border-color: #efc3bf;
    background: #fff6f5;
    color: var(--ui-red-700);
}

.profile-dashboard .tariff-modal > .modal-body {
    display: flex;
    min-height: 0;
    overflow: hidden;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 0;
}

.profile-dashboard .tariff-container {
    display: grid;
    min-height: 0;
    overflow: hidden;
    flex: 1 1 auto;
    grid-template-columns: minmax(235px, 0.72fr) minmax(360px, 1.45fr) minmax(270px, 0.83fr);
    gap: 0;
    margin: 0;
}

.profile-dashboard .tariff-container > .current-tariff-section,
.profile-dashboard .tariff-container > .tariff-selection,
.profile-dashboard .tariff-container > .tariff-details {
    min-width: 0;
    min-height: 0;
    padding: 22px;
    border-radius: 0;
}

.profile-dashboard .tariff-container > .current-tariff-section {
    border-right: 1px solid rgba(52, 162, 52, 0.1);
    background: #f3f8f4;
}

.profile-dashboard .tariff-container > .tariff-selection {
    overflow-y: auto;
    background: #fff;
    scrollbar-color: rgba(52, 162, 52, 0.35) transparent;
    scrollbar-width: thin;
}

.profile-dashboard .tariff-container > .tariff-details {
    overflow-y: auto;
    border-left: 1px solid rgba(52, 162, 52, 0.1);
    background:
        linear-gradient(145deg, #f3f8f4, #f8fbf8);
}

.profile-dashboard .tariff-container > div > h3 {
    margin: 0 0 16px;
    color: #263129;
    font-size: 0.82rem;
    font-weight: 820;
    letter-spacing: 0.02em;
}

.profile-dashboard .tariff-filters {
    gap: 7px;
    margin-bottom: 16px;
    padding: 4px;
    border-radius: 12px;
    background: var(--ui-green-50);
}

.profile-dashboard .filter-btn {
    display: inline-flex;
    min-height: 35px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 12px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #5d6961;
    font-size: 0.74rem;
    font-weight: 760;
}

.profile-dashboard .filter-btn.active {
    background: #fff;
    box-shadow: 0 5px 13px rgba(45, 136, 45, 0.12);
    color: var(--ui-green-900);
}

.profile-dashboard .tariffs-grid {
    display: grid;
    max-height: none;
    overflow: visible;
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 1px;
}

.profile-dashboard .tariff-card {
    position: relative;
    padding: 15px;
    border: 1px solid #dce8df;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 5px 15px rgba(39, 104, 54, 0.045);
    transition:
        border-color var(--ui-transition),
        background-color var(--ui-transition),
        box-shadow var(--ui-transition),
        transform var(--ui-transition);
}

.profile-dashboard .tariff-card:hover {
    border-color: rgba(52, 162, 52, 0.42);
    box-shadow: 0 10px 22px rgba(45, 136, 45, 0.1);
    transform: translateY(-1px);
}

.profile-dashboard .tariff-card.selected {
    border-color: var(--ui-green-800);
    background: #f3faf4;
    box-shadow:
        0 0 0 2px rgba(52, 162, 52, 0.11),
        0 12px 25px rgba(45, 136, 45, 0.1);
}

.profile-dashboard .tariff-card.current {
    border-color: rgba(52, 162, 52, 0.34);
    background:
        linear-gradient(145deg, #fff, #ebf6ed);
    cursor: pointer;
}

.profile-dashboard .tariff-card.current:focus-visible {
    outline: 3px solid rgba(52, 162, 52, 0.25);
    outline-offset: 3px;
}

.profile-dashboard .tariff-card .tariff-header {
    gap: 10px;
    margin-bottom: 11px;
}

.profile-dashboard .tariff-card .tariff-header h4 {
    color: #27322a;
    font-size: 0.9rem;
    line-height: 1.3;
}

.profile-dashboard .tariff-card .badges {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 4px;
}

.profile-dashboard .tariff-badge,
.profile-dashboard .tv-badge {
    display: inline-flex;
    min-height: 22px;
    align-items: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 0.61rem;
    font-weight: 850;
}

.profile-dashboard .tariff-badge {
    background: var(--ui-green-800);
    color: #fff;
}

.profile-dashboard .tv-badge {
    background: #f4eafb;
    color: #7a319b;
}

.profile-dashboard .tariff-card .tariff-details,
.profile-dashboard .tariff-card .next-tariff-section .tariff-details {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.profile-dashboard .tariff-speed {
    color: #4f5d53;
    font-size: 0.76rem;
    font-weight: 720;
}

.profile-dashboard .tariff-tv {
    margin-top: 4px;
    color: #7a319b;
    font-size: 0.72rem;
}

.profile-dashboard .tariff-price {
    margin-top: 6px;
    color: var(--ui-green-900);
    font-size: 1.05rem;
    font-weight: 850;
}

.profile-dashboard .next-tariff-section {
    margin-top: 15px;
    padding-top: 15px;
    border-top-color: rgba(52, 162, 52, 0.2);
}

.profile-dashboard .next-tariff-section > h4 {
    margin-bottom: 10px;
    color: #647067;
    font-size: 0.68rem;
    line-height: 1.4;
}

.profile-dashboard .details-placeholder {
    display: grid;
    min-height: 230px;
    place-items: center;
    padding: 24px;
    border: 1px dashed rgba(52, 162, 52, 0.25);
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.65);
    text-align: center;
}

.profile-dashboard .details-placeholder p {
    max-width: 220px;
    color: #748078;
    font-size: 0.78rem;
    line-height: 1.55;
}

.profile-dashboard .tariff-details-content {
    margin-top: 0;
}

.profile-dashboard .tariff-details-content > h4 {
    margin: 0 0 18px;
    color: #172019;
    font-size: 1.25rem;
    letter-spacing: -0.025em;
}

.profile-dashboard .tariff-container > .tariff-details .detail-row {
    gap: 12px;
    margin: 0;
    padding: 11px 0;
    border-bottom-color: rgba(52, 162, 52, 0.11);
    font-size: 0.76rem;
}

.profile-dashboard .tariff-container > .tariff-details .detail-label {
    color: #69756d;
    text-align: left;
}

.profile-dashboard .tariff-container > .tariff-details .detail-value {
    color: #29342c;
    font-weight: 800;
}

.profile-dashboard .detail-description {
    margin: 16px 0;
    padding: 14px;
    border: 1px solid rgba(52, 162, 52, 0.1);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.8);
    color: #5e6a62;
    font-size: 0.75rem;
    font-style: normal;
    line-height: 1.55;
}

.profile-dashboard .btn-select-tariff {
    width: 100%;
    min-height: 48px;
    margin-top: 3px;
    border: 0;
    font-size: 0.8rem;
    font-weight: 820;
}

.profile-dashboard .tariff-modal .modal-footer {
    flex: 0 0 auto;
    padding: 13px 22px;
    border-top: 1px solid rgba(52, 162, 52, 0.1);
    background: #fff;
}

.profile-dashboard #cancelChangeTariff {
    min-height: 38px;
    padding: 0 16px;
    border: 1px solid var(--ui-line);
    border-radius: 10px;
    background: #fff;
    color: #5d6961;
    font-size: 0.75rem;
    font-weight: 750;
}

.profile-dashboard #cancelChangeTariff:hover {
    border-color: rgba(52, 162, 52, 0.3);
    background: var(--ui-green-50);
}

@media (max-width: 1120px) {
    .profile-dashboard .main-lk-two,
    .profile-dashboard .main-lk-two:has(> .pretrial-claim) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profile-dashboard .tariff-container {
        grid-template-columns: minmax(220px, 0.75fr) minmax(340px, 1.25fr);
    }

    .profile-dashboard .tariff-container > .current-tariff-section {
        grid-column: 1;
        grid-row: 1;
    }

    .profile-dashboard .tariff-container > .tariff-selection {
        grid-column: 2;
        grid-row: 1 / span 2;
    }

    .profile-dashboard .tariff-container > .tariff-details {
        grid-column: 1;
        grid-row: 2;
        border-top: 1px solid rgba(52, 162, 52, 0.1);
        border-left: 0;
    }
}

@media (max-width: 900px) {
    .dashboard-overview {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-overview__aside {
        width: 100%;
        flex-wrap: wrap;
    }

    .profile-dashboard .main-lk {
        grid-template-columns: 1fr;
    }

    .profile-dashboard .lk-balance {
        min-height: 0;
    }

    .profile-dashboard .balance-content.active {
        min-height: 195px;
    }

    .profile-dashboard .lk-ad {
        min-height: auto;
        aspect-ratio: 1024 / 346;
    }
}

@media (max-width: 720px) {
    .profile-dashboard__content {
        padding-top: 12px !important;
    }

    .dashboard-overview {
        min-height: 0;
        gap: 17px;
        padding: 20px;
        border-radius: 18px;
    }

    .dashboard-overview::before {
        right: -120px;
    }

    .dashboard-overview::after {
        display: none;
    }

    .dashboard-overview p {
        font-size: 0.84rem;
    }

    .dashboard-overview__status {
        width: 100%;
        justify-content: flex-start;
    }

    .dashboard-overview__aside > a {
        width: 100%;
    }

    .profile-dashboard .main-lk,
    .profile-dashboard .main-lk-two,
    .profile-dashboard .main-lk-two:has(> .pretrial-claim) {
        grid-template-columns: 1fr;
        gap: 14px;
        padding-top: 14px;
    }

    .profile-dashboard .lk-balance,
    .profile-dashboard .lk-service,
    .profile-dashboard .lk-service_finance,
    .profile-dashboard .pretrial-claim {
        border-radius: 18px;
    }

    .profile-dashboard .lk-balance {
        padding: 21px;
    }

    .profile-dashboard .balance-tabs {
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .profile-dashboard .balance-tab {
        min-width: 0;
    }

    .profile-dashboard .lk-service {
        min-height: 0;
        padding: 20px;
    }

    .profile-dashboard .pretrial-claim {
        min-height: 0;
    }

    .profile-dashboard .lk-service_finance {
        padding: 18px;
    }

    .profile-dashboard .lk-service_header_finance {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .profile-dashboard .lk-service_finance_month {
        width: 100%;
        margin-top: 4px;
    }

    .profile-dashboard .lk-service_finance_month button {
        flex: 1 1 0;
    }

    .profile-dashboard #changeTariffModal {
        align-items: stretch;
        padding: 0;
    }

    .profile-dashboard .tariff-modal {
        width: 100%;
        max-width: none;
        max-height: 100vh;
        max-height: 100svh;
        border: 0;
        border-radius: 0;
    }

    .profile-dashboard .tariff-modal > .modal-header {
        padding: 17px 18px;
    }

    .profile-dashboard .tariff-container {
        display: block;
        overflow-y: auto;
    }

    .profile-dashboard .tariff-container > .current-tariff-section,
    .profile-dashboard .tariff-container > .tariff-selection,
    .profile-dashboard .tariff-container > .tariff-details {
        overflow: visible;
        padding: 18px;
        border: 0;
        border-bottom: 1px solid rgba(52, 162, 52, 0.1);
    }

    .profile-dashboard .tariff-container > .tariff-selection {
        background: #fff;
    }

    .profile-dashboard .tariff-modal .modal-footer {
        padding:
            11px
            max(16px, env(safe-area-inset-right))
            max(11px, env(safe-area-inset-bottom))
            max(16px, env(safe-area-inset-left));
    }

    .profile-dashboard #cancelChangeTariff {
        width: 100%;
    }
}

@media (max-width: 420px) {
    .dashboard-overview h1 {
        font-size: 1.65rem;
    }

    .profile-dashboard .lk-ad {
        border-radius: 16px;
    }

    .profile-dashboard .balance-tabs {
        align-items: stretch;
    }

    .profile-dashboard .balance-tab {
        padding-inline: 6px;
        font-size: 0.7rem;
    }

    .profile-dashboard .tariff-filters {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .profile-dashboard .filter-btn {
        min-width: 0;
        padding-inline: 6px;
    }
}

/* --------------------------------------------------------------------------
   Profile dashboard polish
   -------------------------------------------------------------------------- */

.profile-dashboard .cabinet-banner {
    width: 100vw;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
}

.profile-dashboard__content {
    padding-top: 18px !important;
}

.profile-dashboard .main-lk {
    padding-top: 0;
}

.profile-dashboard .lk-balance {
    display: flex;
    flex-direction: column;
}

.profile-dashboard .lk-balance h2,
.profile-dashboard .balance-amount {
    text-align: center;
}

.profile-dashboard .lk-balance h2 {
    align-items: center;
}

.profile-dashboard .balance-details {
    padding: 11px 14px;
}

.profile-dashboard .balance-details .detail-item {
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    text-align: center;
}

.profile-dashboard .balance-details .detail-value {
    font-size: 0.88rem;
    letter-spacing: 0.045em;
}

.profile-dashboard .balance-content > .service_body_info {
    display: block;
    min-height: 0;
    margin: 0 0 10px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.profile-dashboard #toggleInternetStatus,
.profile-dashboard .balance-content > .payment-button {
    display: inline-flex;
    width: 100% !important;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 12px 16px !important;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 820;
    line-height: 1.2;
    text-align: center;
}

.profile-dashboard .balance-content > .payment-button {
    margin-top: auto;
}

.dashboard-connection-card {
    position: relative;
    display: flex;
    min-height: 360px;
    overflow: hidden;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 42px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 20px;
    background:
        radial-gradient(circle at 78% 8%, rgba(137, 222, 147, 0.23), transparent 30%),
        linear-gradient(135deg, #1d742a 0%, #2f9f38 58%, #25822f 100%);
    box-shadow: var(--dashboard-card-shadow);
    color: #fff;
    isolation: isolate;
}

.dashboard-connection-card::after {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(95deg, rgba(8, 48, 16, 0.22), transparent 58%);
    content: "";
}

.dashboard-connection-card__rings {
    position: absolute;
    top: 42%;
    right: 8%;
    z-index: -1;
    width: 130px;
    height: 130px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    transform: translate(50%, -50%);
}

.dashboard-connection-card__rings::before,
.dashboard-connection-card__rings::after {
    position: absolute;
    top: 50%;
    left: 50%;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
    content: "";
    transform: translate(-50%, -50%);
}

.dashboard-connection-card__rings::before {
    width: 280px;
    height: 280px;
}

.dashboard-connection-card__rings::after {
    width: 460px;
    height: 460px;
}

.dashboard-connection-card__content {
    max-width: 620px;
}

.dashboard-connection-card__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.dashboard-connection-card__eyebrow::before {
    width: 24px;
    height: 2px;
    border-radius: 99px;
    background: currentColor;
    content: "";
}

.dashboard-connection-card h1 {
    max-width: 540px;
    margin: 0;
    color: #fff;
    font-size: clamp(2.1rem, 5vw, 4.35rem);
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.dashboard-connection-card p {
    max-width: 570px;
    margin: 18px 0 22px;
    color: rgba(255, 255, 255, 0.84);
    font-size: clamp(0.88rem, 1.6vw, 1rem);
    line-height: 1.55;
}

.dashboard-connection-card__statuses {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.dashboard-connection-card__statuses > span {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border: 1px solid rgba(255, 255, 255, 0.17);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 0.73rem;
    font-weight: 720;
    backdrop-filter: blur(8px);
}

.dashboard-connection-card__statuses i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #aef5b7;
    box-shadow: 0 0 0 4px rgba(174, 245, 183, 0.12);
}

.dashboard-connection-card__statuses .is-warning i {
    background: #ffd26e;
    box-shadow: 0 0 0 4px rgba(255, 210, 110, 0.13);
}

.dashboard-connection-card__help {
    display: flex;
    min-width: 130px;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
    padding-bottom: 3px;
    text-align: right;
}

.dashboard-connection-card__help span {
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.7rem;
}

.dashboard-connection-card__help a {
    color: #fff;
    font-size: 1.15rem;
    font-weight: 850;
    text-decoration: none;
}

.profile-dashboard .lk-service {
    display: flex;
    min-height: 300px;
    align-items: center;
    flex-direction: column;
    padding: 24px 22px;
    text-align: center;
}

.profile-dashboard .lk-service::before {
    top: 0;
    left: 50%;
    width: 46px;
    transform: translateX(-50%);
}

.profile-dashboard .lk-service_header {
    width: 100%;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 9px;
    margin-bottom: 11px;
}

.profile-dashboard .lk-service_header .ml-8 {
    margin-left: 0;
}

.profile-dashboard .service_point {
    width: 50px;
    height: 50px;
    border-radius: 15px;
}

.profile-dashboard .service_small {
    min-height: 0;
    margin-bottom: 12px;
    text-align: center;
}

.profile-dashboard .service_body_info {
    width: 100%;
    justify-content: flex-start;
    text-align: left;
}

.profile-dashboard .no-account-center {
    display: flex;
    width: 100%;
    min-height: 180px;
    align-items: center;
    justify-content: center;
    padding: 8px;
}

.profile-dashboard .link-account-button {
    width: min(100%, 220px);
}

.profile-dashboard .pretrial-claim {
    display: flex;
    min-height: 300px;
    flex-direction: column;
}

.profile-dashboard .pretrial-claim__heading {
    align-items: flex-start;
}

.profile-dashboard .pretrial-claim h2 {
    font-size: 1rem;
    line-height: 1.28;
}

.profile-dashboard .pretrial-claim__suspension {
    display: flex;
    width: 100%;
    align-self: stretch;
    margin-top: 14px;
    padding: 14px;
    border: 1px solid rgba(213, 148, 20, 0.3);
    border-radius: 13px;
    background: #fff6d9;
    box-sizing: border-box;
    flex-direction: column;
    gap: 5px;
}

.profile-dashboard .pretrial-claim__suspension span {
    color: #846017;
    font-size: 0.71rem;
    font-weight: 700;
}

.profile-dashboard .pretrial-claim__suspension strong {
    color: #3a2a08;
    font-size: 1.25rem;
    letter-spacing: -0.02em;
}

.profile-dashboard .pretrial-claim__actions {
    gap: 8px;
}

.profile-dashboard .lk-service_header_finance {
    align-items: center;
}

.profile-dashboard .lk-service_body_finance {
    gap: 18px;
}

.profile-dashboard .finance-section-title,
.profile-dashboard .lk-service_body_finance > h2 {
    margin: 2px 0 -6px;
    color: #283229;
    font-size: 0.85rem;
    font-weight: 820;
}

.profile-dashboard .lk-service_body_charge {
    display: grid;
    min-height: 76px;
    align-items: center;
    grid-template-columns: 48px minmax(0, 1fr) max-content;
    gap: 13px;
    padding: 14px 16px;
    background: #f4f8f5;
}

.profile-dashboard .lk-service_body_charge:has(.amount-negative) {
    border-color: rgba(228, 67, 53, 0.12);
    background: #fff8f7;
}

.profile-dashboard .lk-service_body_charge:has(.amount-positive) {
    border-color: rgba(52, 162, 52, 0.14);
    background: #f2faf3;
}

.profile-dashboard .service_point-finance {
    position: relative;
    display: grid;
    width: 44px;
    height: 44px;
    padding: 0;
    place-items: center;
    border-radius: 13px;
    background: #fff;
}

.profile-dashboard .service_point-finance > svg {
    display: none;
}

.profile-dashboard .service_point-finance::before {
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    border-radius: 50%;
    background: #fff0ee;
    color: #c93c31;
    content: "−";
    font-size: 1.15rem;
    font-weight: 850;
    line-height: 1;
}

.profile-dashboard
    .lk-service_body_charge:has(.amount-positive)
    .service_point-finance::before {
    background: #e8f7eb;
    color: var(--ui-green-900);
    content: "+";
}

.profile-dashboard .lk-service_body_charge > div:last-child {
    min-width: 112px;
    text-align: right;
}

.profile-dashboard .lk-service_body_charge .finance-title {
    margin-bottom: 3px;
    color: #202920;
    font-size: 0.84rem;
    line-height: 1.3;
}

.profile-dashboard .lk-service_body_charge .finance-description {
    color: #758078;
    font-size: 0.7rem;
    line-height: 1.35;
}

.profile-dashboard .lk-service_body_charge .amount-negative,
.profile-dashboard .lk-service_body_charge .amount-positive {
    margin: 0 0 3px;
    font-size: 0.91rem;
    white-space: nowrap;
}

.profile-dashboard .lk-service_body_charge .small-finance {
    display: block;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .dashboard-connection-card {
        min-height: 300px;
        padding: 32px;
    }

    .dashboard-connection-card__help {
        display: none;
    }
}

@media (max-width: 720px) {
    .profile-dashboard .cabinet-banner {
        margin-right: calc(50% - 50vw);
        margin-left: calc(50% - 50vw);
    }

    .profile-dashboard .header-logo {
        height: 58px;
    }

    .profile-dashboard .lk-header {
        min-height: 82px;
    }

    .profile-dashboard__content {
        padding-top: 14px !important;
    }

    .profile-dashboard .lk-balance {
        padding: 22px 20px;
    }

    .profile-dashboard .balance-content > .service_body_info {
        margin-bottom: 10px;
    }

    .profile-dashboard #toggleInternetStatus,
    .profile-dashboard .balance-content > .payment-button {
        min-height: 50px;
    }

    .dashboard-connection-card {
        min-height: 280px;
        align-items: center;
        padding: 26px 22px;
        border-radius: 18px;
    }

    .dashboard-connection-card h1 {
        font-size: 2.35rem;
    }

    .dashboard-connection-card p {
        margin: 14px 0 18px;
        font-size: 0.83rem;
    }

    .dashboard-connection-card__statuses {
        gap: 7px;
    }

    .dashboard-connection-card__statuses > span {
        min-height: 31px;
        padding: 6px 10px;
        font-size: 0.67rem;
    }

    .profile-dashboard .lk-service {
        min-height: 280px;
        justify-content: flex-start;
    }

    .profile-dashboard .lk-service_header_finance {
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .profile-dashboard .lk-service_header_finance > .service_point {
        margin: 0 auto;
    }

    .profile-dashboard .lk-service_finance_month {
        margin-top: 8px;
    }

    .profile-dashboard .finance-section-title,
    .profile-dashboard .lk-service_body_finance > h2 {
        text-align: left;
    }

    .profile-dashboard .lk-service_body_charge {
        grid-template-columns: 42px minmax(0, 1fr) max-content;
        gap: 10px;
        padding: 13px;
    }

    .profile-dashboard .service_point-finance {
        width: 40px;
        height: 40px;
    }

    .profile-dashboard .lk-service_body_charge > div:last-child {
        min-width: 82px;
    }

    .profile-dashboard .lk-service_body_charge .finance-title {
        font-size: 0.78rem;
    }

    .profile-dashboard .lk-service_body_charge .finance-description {
        font-size: 0.65rem;
    }

    .profile-dashboard .lk-service_body_charge .amount-negative,
    .profile-dashboard .lk-service_body_charge .amount-positive {
        font-size: 0.8rem;
    }

    .profile-dashboard .tariff-container {
        padding-bottom: 82px;
    }

    .profile-dashboard .tariff-details-content .btn-select-tariff {
        position: fixed;
        right: max(16px, env(safe-area-inset-right));
        bottom: max(12px, env(safe-area-inset-bottom));
        left: max(16px, env(safe-area-inset-left));
        z-index: 1100;
        width: auto;
        min-height: 52px;
        margin: 0;
        border: 1px solid rgba(255, 255, 255, 0.55);
        box-shadow:
            0 -10px 24px rgba(255, 255, 255, 0.88),
            0 14px 30px rgba(39, 104, 54, 0.28);
    }
}

@media (max-width: 420px) {
    .profile-dashboard .header-logo {
        height: 62px;
    }

    .dashboard-connection-card h1 {
        font-size: 2.1rem;
    }

    .profile-dashboard .lk-service_body_charge {
        grid-template-columns: 38px minmax(0, 1fr) max-content;
        gap: 8px;
        padding: 12px 10px;
    }

    .profile-dashboard .service_point-finance {
        width: 36px;
        height: 36px;
    }

    .profile-dashboard .service_point-finance::before {
        width: 23px;
        height: 23px;
        font-size: 1rem;
    }

    .profile-dashboard .lk-service_body_charge > div:last-child {
        min-width: 72px;
    }

    .profile-dashboard .lk-service_body_charge .amount-negative,
    .profile-dashboard .lk-service_body_charge .amount-positive {
        font-size: 0.76rem;
    }
}

/* Keep the account card stable while switching between Internet and TV. */
.profile-dashboard .balance-content.active {
    min-height: 243px;
}

/* Give the compact suspension notice a calmer, more even desktop rhythm. */
.profile-dashboard .pretrial-claim {
    gap: 12px;
    padding: 18px;
}

.profile-dashboard .pretrial-claim__heading {
    display: grid;
    align-items: start;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 11px;
}

.profile-dashboard .pretrial-claim__heading .pretrial-claim__icon {
    width: 42px;
    height: 42px;
}

.profile-dashboard .pretrial-claim__heading > div {
    min-width: 0;
}

.profile-dashboard .pretrial-claim h2 {
    margin-top: 2px;
    font-size: 0.93rem;
    line-height: 1.25;
}

.profile-dashboard .pretrial-claim > p {
    width: 100%;
    margin: 0;
}

.profile-dashboard .pretrial-claim__suspension {
    display: grid;
    min-height: 66px;
    align-items: center;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    margin-top: 2px;
    padding: 12px 13px;
}

.profile-dashboard .pretrial-claim__suspension strong {
    font-size: 1.08rem;
    white-space: nowrap;
}

@media (max-width: 420px) {
    .profile-dashboard .pretrial-claim__suspension {
        grid-template-columns: 1fr;
        gap: 5px;
    }
}

/* One calm summary surface instead of several technical-looking rows. */
.profile-dashboard .service-metrics {
    display: grid;
    width: 100%;
    overflow: hidden;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: auto;
    border: 1px solid #e7ebe8;
    border-radius: 17px;
    background: #f7f8f7;
}

.profile-dashboard .lk-service--tv .service-metrics {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
}

.profile-dashboard .lk-service--tv .service-metrics .service_body_info {
    padding-right: 10px;
    padding-left: 10px;
}

.profile-dashboard .service-metrics .service_body_info {
    display: flex;
    min-width: 0;
    min-height: 104px;
    align-items: flex-start;
    justify-content: center;
    margin: 0;
    padding: 18px 13px 16px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: left;
}

.profile-dashboard .service-metrics .service_body_info + .service_body_info {
    border-left: 1px solid #e1e6e2;
}

.profile-dashboard .service-metrics .service_body_info > svg {
    display: none;
}

.profile-dashboard .service-metrics .service_body_info > div {
    width: 100%;
    min-width: 0;
}

.profile-dashboard .service-metrics .service_body_info p:first-child {
    margin: 0 0 8px;
    color: #788079;
    font-size: 0.68rem;
    font-weight: 720;
    letter-spacing: 0.025em;
    line-height: 1.2;
}

.profile-dashboard .service-metrics .service_body_info p:last-child,
.profile-dashboard .service-metrics .service_body_info a {
    margin: 0;
    color: #172019;
    font-size: 0.92rem;
    font-weight: 850;
    line-height: 1.32;
    text-decoration: none;
}

.profile-dashboard .service-metrics .service_body_info a:hover {
    color: var(--ui-green-900);
}

.profile-dashboard .lk-service--tv .service-metrics .service_body_info:last-child p:last-child,
.profile-dashboard .lk-service--tv .service-metrics .service_body_info:last-child a {
    font-size: 0.8rem;
}

.profile-dashboard .lk-service--tv .service-metrics .service_body_info:first-child p:last-child {
    white-space: nowrap;
}

@media (max-width: 600px) {
    .profile-dashboard .service-metrics .service_body_info {
        min-height: 92px;
        padding: 16px 15px;
    }
}

/* Service cards v2: subscriptions instead of a stack of technical rows. */
.profile-dashboard .service-card-v2 {
    display: flex;
    min-height: 318px;
    align-items: stretch;
    justify-content: flex-start;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(31, 104, 48, 0.12);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(24, 72, 35, 0.08);
    text-align: left;
}

.profile-dashboard .service-card-v2::before {
    display: none;
}

.profile-dashboard .service-card-v2:hover {
    border-color: rgba(47, 170, 53, 0.28);
    box-shadow: 0 18px 40px rgba(24, 72, 35, 0.12);
}

.profile-dashboard .service-card-v2 .lk-service_header {
    display: flex;
    width: 100%;
    min-height: 82px;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 12px;
    margin: 0;
    padding: 17px 18px;
    border-bottom: 1px solid #e2ebe4;
    background:
        radial-gradient(circle at 100% 0, rgba(47, 170, 53, 0.1), transparent 46%),
        linear-gradient(135deg, #edf8f0 0%, #fbfdfb 82%);
}

.profile-dashboard .service-card-v2 .service_point {
    width: 46px;
    height: 46px;
    padding: 9px;
    border-radius: 14px;
    background: #dcefe1;
}

.profile-dashboard .service-card-v2 .lk-service_header h2 {
    margin: 0;
    color: #16251a;
    font-size: 1.03rem;
    font-weight: 850;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.profile-dashboard .service-card-v2 .lk-service_header .ml-8 {
    margin-left: 0;
}

.profile-dashboard .service-card-v2 .unlink-button {
    top: 25px;
    right: 13px;
}

.profile-dashboard .service-card-content {
    display: flex;
    width: 100%;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 19px 18px 18px;
}

.profile-dashboard .service-card-content--details-only .service-card-facts {
    min-height: 0;
    flex: 1 1 auto;
    align-items: stretch;
    margin-top: 0;
}

.profile-dashboard .service-card-content--details-only .service-card-fact {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.profile-dashboard .service-card-plan {
    min-width: 0;
    margin-bottom: 17px;
}

.profile-dashboard .service-card-eyebrow {
    display: block;
    color: #2b8b35;
    font-size: 0.62rem;
    font-weight: 850;
    letter-spacing: 0.09em;
    line-height: 1.2;
    text-transform: uppercase;
}

.profile-dashboard .service-card-plan strong {
    display: block;
    overflow: hidden;
    margin-top: 5px;
    color: #162019;
    font-size: 1.02rem;
    font-weight: 850;
    letter-spacing: -0.015em;
    line-height: 1.28;
    text-overflow: ellipsis;
}

.profile-dashboard .service-card-facts {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 17px;
    padding: 14px 0;
    border-top: 1px solid #e5ebe6;
    border-bottom: 1px solid #e5ebe6;
}

.profile-dashboard .service-card-fact {
    min-width: 0;
    padding: 0 11px;
}

.profile-dashboard .service-card-fact:first-child {
    padding-left: 0;
}

.profile-dashboard .service-card-fact:last-child {
    padding-right: 0;
}

.profile-dashboard .service-card-fact + .service-card-fact {
    border-left: 1px solid #e5ebe6;
}

.profile-dashboard .service-card-fact span,
.profile-dashboard .service-card-fact small {
    display: block;
    color: #748078;
    font-size: 0.64rem;
    font-weight: 700;
    line-height: 1.25;
}

.profile-dashboard .service-card-fact strong {
    display: block;
    margin: 5px 0 3px;
    color: #172019;
    font-size: 0.94rem;
    font-weight: 900;
    letter-spacing: -0.015em;
    line-height: 1.15;
}

.profile-dashboard .service-card-action {
    display: flex;
    width: 100%;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-top: auto;
    padding: 10px 14px;
    border: 1px solid #2faa35;
    border-radius: 12px;
    background: #2faa35;
    box-shadow: 0 9px 20px rgba(47, 170, 53, 0.2);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 850;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    transition:
        background 0.18s ease,
        border-color 0.18s ease,
        box-shadow 0.18s ease,
        transform 0.18s ease;
}

.profile-dashboard .service-card-action:hover {
    border-color: #248c2c;
    background: #248c2c;
    box-shadow: 0 11px 24px rgba(47, 170, 53, 0.25);
    color: #fff;
    transform: translateY(-1px);
}

.profile-dashboard .service-card-action--secondary {
    border-color: #b8dabc;
    background: #fff;
    box-shadow: none;
    color: #237b2c;
}

.profile-dashboard .service-card-action--secondary:hover {
    border-color: #2faa35;
    background: #f0f8f2;
    box-shadow: none;
    color: #1f7027;
}

/* The former technical presentation stays out of the visual tree. */
.profile-dashboard .service-card-v2 > .service_small,
.profile-dashboard .service-card-v2 > .service-metrics {
    display: none;
}

.profile-dashboard .service-card-v2 > .service-status-badge {
    position: absolute;
    top: 24px;
    right: 48px;
    z-index: 5;
    margin: 0;
    padding: 6px 9px;
    font-size: 0.64rem;
}

.profile-dashboard .service-card-v2 .service-status-tooltip {
    top: calc(100% + 0.6rem);
    right: 0;
    bottom: auto;
    left: auto;
    text-align: left;
}

.profile-dashboard .service-card-v2 .service-status-tooltip::after {
    top: auto;
    right: 1.25rem;
    bottom: 100%;
    left: auto;
    border-top-color: transparent;
    border-bottom-color: #2f2b22;
}

.profile-dashboard .service-card-v2.lk-service--closed .service-card-content {
    opacity: 0.62;
}

.profile-dashboard .service-card-v2 .no-account-center {
    min-height: 0;
    flex: 1 1 auto;
    padding: 22px 18px;
}

@media (max-width: 600px) {
    .profile-dashboard .service-card-v2 {
        min-height: 310px;
    }

    .profile-dashboard .service-card-v2 .lk-service_header {
        min-height: 76px;
        padding: 15px 16px;
    }

    .profile-dashboard .service-card-v2 .service_point {
        width: 44px;
        height: 44px;
    }

    .profile-dashboard .service-card-v2 .unlink-button {
        top: 22px;
    }

    .profile-dashboard .service-card-content {
        padding: 18px 16px 16px;
    }

    .profile-dashboard .service-card-fact {
        padding: 0 10px;
    }

    .profile-dashboard .service-card-v2 > .service-status-badge {
        top: 22px;
    }
}
