:root {
    --lab-black: #101714;
    --lab-ink: #18241f;
    --lab-panel: #f5f7f1;
    --lab-paper: #ffffff;
    --lab-muted: #68736d;
    --lab-border: #d8dfd4;
    --lab-green: #126c43;
    --lab-acid: #9ecb3a;
    --lab-amber: #e2b741;
    --lab-orange: #f28c28;
    --lab-danger: #9b2f2d;
    --topbar-height: 66px;
    --sidebar-width: 264px;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: 0;
    color: var(--lab-ink);
    background: var(--lab-panel);
}

a {
    color: inherit;
}

.auth-shell {
    min-height: 100vh;
    min-height: 100svh;
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background:
        linear-gradient(90deg, rgba(4, 13, 10, .98) 0%, rgba(10, 25, 18, .92) 34%, rgba(38, 52, 35, .82) 62%, rgba(64, 55, 33, .72) 100%),
        repeating-linear-gradient(90deg, rgba(237, 255, 205, .055) 0 2px, transparent 2px 13px),
        repeating-linear-gradient(0deg, rgba(158, 203, 58, .025) 0 1px, transparent 1px 58px);
    color: var(--lab-paper);
}

.auth-shell::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: .78;
    background:
        linear-gradient(90deg, rgba(1, 6, 5, .82), transparent 22%, transparent 72%, rgba(2, 7, 5, .35)),
        linear-gradient(180deg, rgba(1, 7, 5, .22), transparent 28%, rgba(3, 9, 7, .82) 100%),
        linear-gradient(105deg, transparent 0 44%, rgba(8, 18, 13, .58) 44% 47%, transparent 47% 60%, rgba(8, 18, 13, .36) 60% 63%, transparent 63%),
        linear-gradient(80deg, transparent 0 60%, rgba(227, 255, 183, .08) 60% 61%, transparent 61%);
}

.auth-shell::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: .72;
    background:
        radial-gradient(ellipse at 15% 78%, rgba(158, 203, 58, .42), transparent 25%),
        radial-gradient(ellipse at 46% 55%, rgba(158, 203, 58, .16), transparent 28%),
        linear-gradient(90deg, transparent 0 33%, rgba(190, 255, 112, .09) 33% 34%, transparent 34% 100%),
        linear-gradient(90deg, transparent 0 68%, rgba(255, 247, 195, .10) 68% 69%, transparent 69% 100%);
    mix-blend-mode: screen;
}

.auth-stage {
    min-height: 100vh;
    min-height: 100svh;
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(520px, 1fr) 410px;
    align-items: center;
    gap: 72px;
    padding: 64px 96px 72px;
}

@supports (height: 100dvh) {
    .auth-shell,
    .auth-stage {
        min-height: 100dvh;
    }
}

.auth-brand {
    position: relative;
    min-height: 620px;
    min-width: 0;
}

.auth-brand h1 {
    margin: 0;
    color: rgba(255, 255, 250, .96);
    font-size: 5.7rem;
    line-height: 1;
    font-weight: 900;
    text-shadow: 0 8px 28px rgba(0, 0, 0, .52), 0 0 22px rgba(255, 255, 255, .16);
}

.auth-brand-lockup {
    position: absolute;
    left: 13%;
    top: 37%;
    display: flex;
    align-items: center;
    gap: 22px;
    transform: translateY(-50%);
}

.brand-kicker,
.eyebrow {
    color: var(--lab-acid);
    font-size: .78rem;
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: 0;
}

.brand-kicker {
    text-shadow: 0 0 14px rgba(158, 203, 58, .42);
}

.periodic-logo {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.tile,
.mini-tile {
    display: inline-grid;
    place-items: center;
    border: 2px solid var(--lab-acid);
    background: rgba(158, 203, 58, .12);
    color: var(--lab-acid);
    font-weight: 900;
    box-shadow: inset 0 0 18px rgba(158, 203, 58, .13), 0 0 18px rgba(158, 203, 58, .14);
}

.tile {
    width: 72px;
    height: 72px;
    font-size: 1.85rem;
}

.tile-secondary {
    border-color: var(--lab-orange);
    color: var(--lab-orange);
    box-shadow: inset 0 0 18px rgba(242, 140, 40, .12), 0 0 18px rgba(242, 140, 40, .12);
}

.mini-tile {
    width: 34px;
    height: 34px;
    margin-right: 10px;
    font-size: .94rem;
}

.auth-panel {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, .78);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(255, 255, 252, .98), rgba(236, 239, 228, .95)),
        var(--lab-panel);
    color: var(--lab-ink);
    box-shadow: 0 24px 72px rgba(0, 0, 0, .44), 0 0 0 1px rgba(255, 255, 255, .1);
    padding: 34px;
    backdrop-filter: blur(10px);
}

.auth-heading {
    margin-bottom: 24px;
}

.auth-heading h2,
.page-header h1,
.section-heading h2 {
    margin: 0;
    font-weight: 800;
}

.auth-heading h2 {
    max-width: 310px;
    font-size: 1.85rem;
    line-height: 1.18;
}

.auth-panel .form-label {
    color: #253129;
    font-size: .9rem;
    font-weight: 650;
}

.stacked-form {
    display: grid;
    gap: 18px;
}

.auth-secondary-actions {
    margin-top: 18px;
    text-align: center;
}

.auth-secondary-actions a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--lab-green);
    font-size: .9rem;
    font-weight: 800;
    text-decoration: none;
}

.auth-secondary-actions a:hover,
.auth-secondary-actions a:focus {
    color: #0d5534;
    text-decoration: underline;
}

.form-control,
.form-check-input {
    border-radius: 8px;
    border-color: var(--lab-border);
}

.auth-panel .form-control {
    min-height: 46px;
    background: rgba(255, 255, 255, .84);
    border-color: rgba(16, 23, 20, .18);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .04);
}

.form-control:focus,
.form-check-input:focus {
    border-color: var(--lab-green);
    box-shadow: 0 0 0 .2rem rgba(18, 108, 67, .18);
}

.btn {
    border-radius: 8px;
    font-weight: 750;
}

.btn-lab {
    border-color: var(--lab-green);
    background: linear-gradient(180deg, #15834f, #0f6d42);
    color: var(--lab-paper);
    box-shadow: 0 10px 20px rgba(18, 108, 67, .22);
}

.btn-lab:hover,
.btn-lab:focus {
    border-color: #0d5534;
    background: #0d5534;
    color: var(--lab-paper);
}

.btn-lab-outline {
    border-color: rgba(18, 108, 67, .35);
    color: var(--lab-green);
    background: var(--lab-paper);
}

.btn-lab-outline:hover,
.btn-lab-outline:focus {
    border-color: var(--lab-green);
    color: var(--lab-paper);
    background: var(--lab-green);
}

.compact-alert {
    border-radius: 8px;
    font-weight: 650;
}

.auth-science-layer {
    position: fixed;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
    color: rgba(158, 203, 58, .18);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.formula,
.auth-code {
    position: absolute;
    user-select: none;
}

.formula {
    font-size: 1rem;
    font-weight: 700;
    text-shadow: 0 0 12px rgba(158, 203, 58, .18);
}

.formula-a {
    left: 7%;
    top: 15%;
}

.formula-b {
    left: 12%;
    top: 28%;
}

.formula-c {
    right: 11%;
    top: 13%;
}

.formula-d {
    left: 48%;
    bottom: 15%;
}

.auth-code {
    color: rgba(174, 211, 69, .22);
    font-size: .95rem;
    font-weight: 800;
    line-height: 1.55;
}

.auth-code-a {
    left: 31%;
    top: 13%;
}

.auth-code-b {
    right: 28%;
    bottom: 17%;
}

.auth-code-c {
    right: 13%;
    bottom: 23%;
}

.auth-circuit {
    position: absolute;
    left: 43%;
    top: 55%;
    display: grid;
    gap: 7px;
    width: 430px;
    color: rgba(174, 211, 69, .38);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: .92rem;
    font-weight: 800;
    transform: translate(-12%, -50%);
}

.auth-circuit::before,
.auth-circuit::after {
    content: "";
    position: absolute;
    top: 0;
    left: 96px;
    right: 0;
    height: 100%;
    opacity: .5;
    background:
        linear-gradient(90deg, rgba(158, 203, 58, .48) 0 26px, transparent 26px 38px, rgba(158, 203, 58, .42) 38px 120px, transparent 120px),
        repeating-linear-gradient(180deg, transparent 0 17px, rgba(158, 203, 58, .42) 17px 19px, transparent 19px 36px);
    clip-path: polygon(0 18%, 30% 18%, 38% 30%, 72% 30%, 72% 35%, 42% 35%, 34% 24%, 0 24%, 0 45%, 22% 45%, 31% 58%, 90% 58%, 90% 64%, 28% 64%, 18% 51%, 0 51%, 0 77%, 40% 77%, 46% 86%, 100% 86%, 100% 92%, 42% 92%, 36% 83%, 0 83%);
}

.auth-circuit::after {
    left: 250px;
    width: 160px;
    opacity: .28;
    transform: scaleX(-1);
}

.auth-circuit span {
    position: relative;
    z-index: 1;
}

.crystal-cluster {
    position: absolute;
    left: -28px;
    bottom: -12px;
    width: 440px;
    height: 370px;
    filter: drop-shadow(0 0 22px rgba(172, 255, 71, .34)) drop-shadow(0 24px 50px rgba(0, 0, 0, .58));
}

.crystal {
    position: absolute;
    display: block;
    background:
        linear-gradient(125deg, rgba(255, 255, 255, .86), rgba(174, 255, 49, .28) 26%, rgba(30, 96, 28, .76) 60%, rgba(5, 31, 16, .94)),
        repeating-linear-gradient(45deg, rgba(255, 255, 255, .38) 0 2px, transparent 2px 18px);
    border: 1px solid rgba(217, 255, 147, .48);
    transform-origin: bottom center;
}

.crystal::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0 42%, rgba(255, 255, 255, .54) 43% 45%, transparent 46% 100%);
    clip-path: inherit;
}

.crystal-main {
    left: 58px;
    bottom: 10px;
    width: 122px;
    height: 310px;
    clip-path: polygon(47% 0, 84% 20%, 100% 100%, 0 100%, 17% 20%);
    transform: rotate(-12deg);
}

.crystal-mid {
    left: 172px;
    bottom: 0;
    width: 86px;
    height: 210px;
    clip-path: polygon(50% 0, 88% 24%, 100% 100%, 0 100%, 12% 24%);
    transform: rotate(13deg);
}

.crystal-small {
    left: 245px;
    bottom: 22px;
    width: 58px;
    height: 142px;
    clip-path: polygon(52% 0, 90% 28%, 100% 100%, 0 100%, 10% 28%);
    transform: rotate(29deg);
}

.crystal-chip {
    width: 22px;
    height: 22px;
    clip-path: polygon(50% 0, 100% 43%, 72% 100%, 18% 86%, 0 34%);
    opacity: .86;
}

.chip-a {
    left: 305px;
    bottom: 206px;
}

.chip-b {
    left: 364px;
    bottom: 230px;
    transform: scale(.7) rotate(28deg);
}

.header-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.captcha-box {
    min-height: 78px;
}

.captcha-warning {
    border: 1px solid #f2c2c2;
    border-radius: 8px;
    background: #fff0f0;
    color: #7b1d1d;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.35;
    padding: 12px 14px;
}

.floating-logout {
    position: fixed;
    right: 18px;
    top: 18px;
}

.mode-grid {
    display: grid;
    gap: 14px;
}

.mode-option {
    margin: 0;
}

.mode-button {
    width: 100%;
    min-height: 96px;
    display: flex;
    align-items: center;
    gap: 16px;
    text-align: left;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 18px;
    color: var(--lab-ink);
    background: var(--lab-paper);
}

.mode-button:hover,
.mode-button:focus {
    border-color: var(--lab-green);
    box-shadow: 0 12px 30px rgba(18, 108, 67, .12);
}

.mode-button.admin {
    border-color: rgba(226, 183, 65, .6);
}

.mode-button-disabled,
.mode-button-disabled:hover,
.mode-button-disabled:focus {
    opacity: 1;
    color: var(--lab-muted);
    border-color: rgba(155, 47, 45, .24);
    background: rgba(155, 47, 45, .07);
    box-shadow: none;
}

.mode-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    flex: 0 0 48px;
    border-radius: 8px;
    background: rgba(18, 108, 67, .1);
    color: var(--lab-green);
    font-size: 1.35rem;
}

.mode-button small {
    display: block;
    color: var(--lab-muted);
}

.auto-access-note {
    margin: 16px 0 0;
    color: var(--lab-muted);
    font-size: .92rem;
    font-weight: 700;
    text-align: center;
}

.maintenance-box {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 18px;
    border: 1px solid rgba(226, 183, 65, .55);
    border-radius: 8px;
    background: #fff8df;
}

.maintenance-box i {
    color: #9c6a00;
    font-size: 1.8rem;
}

.maintenance-box p {
    margin: 0;
    font-weight: 700;
}

.app-shell {
    min-height: 100vh;
    padding-top: var(--topbar-height);
    padding-bottom: 48px;
}

.app-shell-user {
    padding-top: var(--topbar-height);
}

.axo-topbar {
    min-height: var(--topbar-height);
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    background: var(--lab-black);
    color: var(--lab-paper);
}

.axo-topbar .navbar-brand,
.axo-topbar .nav-link,
.axo-topbar .navbar-toggler {
    color: var(--lab-paper);
}

.axo-topbar .navbar-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 900;
}

.app-shell-user .axo-topbar .container-fluid {
    flex-wrap: nowrap;
    gap: 12px;
}

.app-shell-user .axo-topbar .navbar-brand {
    min-width: 0;
}

.brand-user-name {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    max-width: 210px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: 2px solid var(--lab-orange);
    border-radius: 8px;
    padding: 4px 12px 4px 44px;
    color: var(--lab-orange);
    background:
        linear-gradient(135deg, rgba(242, 140, 40, .18), rgba(18, 108, 67, .14)),
        rgba(16, 23, 20, .92);
    box-shadow: inset 0 0 0 1px rgba(242, 140, 40, .14);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: .92rem;
    font-weight: 950;
    text-transform: uppercase;
}

.brand-user-name::before {
    content: "Dc";
    position: absolute;
    left: 7px;
    top: 6px;
    width: 28px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(158, 203, 58, .82);
    color: var(--lab-acid);
    background: rgba(158, 203, 58, .08);
    font-size: .78rem;
    line-height: 1;
}

.brand-user-name::after {
    content: "";
    position: absolute;
    left: 38px;
    top: 7px;
    bottom: 7px;
    width: 1px;
    background: rgba(242, 140, 40, .52);
}

.navbar-toggler {
    border-color: rgba(255, 255, 255, .22);
}

.navbar-toggler-icon {
    filter: invert(1);
}

.mega-menu {
    width: min(620px, calc(100vw - 32px));
    border: 0;
    border-radius: 8px;
    padding: 10px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .24);
}

.mega-menu-inner {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 8px;
}

.mega-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 48px;
    padding: 10px 12px;
    border-radius: 8px;
    color: var(--lab-ink);
    text-decoration: none;
    background: var(--lab-panel);
}

.mega-link:hover,
.mega-link:focus {
    color: var(--lab-green);
    background: #eef5e8;
}

.topbar-user {
    display: flex;
    align-items: center;
    gap: 10px;
}

.topbar-user-minimal {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: nowrap;
    flex-shrink: 0;
    margin-left: auto;
    white-space: nowrap;
}

.topbar-user-minimal form {
    display: inline-flex;
    align-items: center;
    margin: 0;
}

.app-shell-user .axo-topbar {
    padding-block: 0;
}

.app-shell-user .axo-topbar .container-fluid {
    display: flex;
    align-items: center;
    min-height: var(--topbar-height);
    flex-wrap: nowrap;
}

.app-shell-user .topbar-user-minimal {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex: 0 0 auto;
    min-width: max-content;
}

.app-shell-user .topbar-user-minimal > * {
    flex: 0 0 auto;
}

.app-shell-user .topbar-user-minimal form {
    display: flex;
    align-items: center;
    margin: 0;
}

.app-shell-user .topbar-user-minimal .btn {
    margin: 0;
    white-space: nowrap;
}

.topbar-credential-search {
    width: min(320px, 28vw);
    display: flex;
    align-items: center;
    gap: 6px;
}

.topbar-credential-search .form-control {
    min-height: 34px;
    border-color: rgba(255, 255, 255, .18);
    color: var(--lab-paper);
    background: rgba(255, 255, 255, .08);
}

.topbar-credential-search .form-control::placeholder {
    color: rgba(245, 247, 241, .62);
}

.topbar-credential-search .form-control:focus {
    border-color: rgba(158, 203, 58, .65);
    color: var(--lab-paper);
    background: rgba(255, 255, 255, .12);
    box-shadow: 0 0 0 .2rem rgba(158, 203, 58, .18);
}

.topbar-payment-counters {
    display: flex;
    align-items: center;
    gap: 6px;
    max-width: min(42vw, 560px);
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
}

.topbar-payment-counters::-webkit-scrollbar {
    display: none;
}

.payment-counter-chip {
    min-width: 42px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 1px solid rgba(158, 203, 58, .24);
    border-radius: 8px;
    padding: 0 9px;
    color: var(--lab-paper);
    text-decoration: none;
    background:
        linear-gradient(135deg, rgba(18, 108, 67, .5), rgba(242, 140, 40, .18)),
        rgba(255, 255, 255, .06);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06);
    white-space: nowrap;
}

.payment-counter-chip:hover,
.payment-counter-chip:focus {
    color: var(--lab-acid);
    border-color: rgba(158, 203, 58, .55);
    background:
        linear-gradient(135deg, rgba(18, 108, 67, .72), rgba(242, 140, 40, .24)),
        rgba(255, 255, 255, .08);
}

.payment-counter-chip i {
    font-size: 1rem;
    line-height: 1;
}

.payment-counter-chip span {
    font-size: .82rem;
    font-weight: 950;
    line-height: 1;
}

.user-chip {
    max-width: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    padding: 7px 10px;
}

.app-footer {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 800;
}

.app-footer span + span::before {
    content: "";
    display: inline-block;
    width: 5px;
    height: 5px;
    margin-right: 12px;
    border-radius: 50%;
    background: var(--lab-orange);
    vertical-align: middle;
}

.auth-footer {
    display: none;
}

.app-footer-main {
    position: fixed;
    left: var(--sidebar-width);
    right: 0;
    bottom: 0;
    z-index: 900;
    border-top: 1px solid var(--lab-border);
    background: rgba(245, 247, 241, .92);
    backdrop-filter: blur(10px);
}

.icon-btn {
    width: 40px;
    height: 40px;
    display: inline-grid;
    place-items: center;
    border-color: rgba(255, 255, 255, .22);
    color: var(--lab-paper);
}

.icon-btn:hover,
.icon-btn:focus {
    border-color: var(--lab-acid);
    color: var(--lab-acid);
}

.axo-sidebar {
    position: fixed;
    top: var(--topbar-height);
    left: 0;
    bottom: 0;
    width: var(--sidebar-width);
    border-right: 1px solid var(--lab-border);
    background: var(--lab-paper);
    padding: 18px 14px;
    z-index: 1020;
}

.app-shell-user .axo-sidebar {
    top: var(--topbar-height);
}

.user-sidebar-toggle {
    position: fixed;
    left: 14px;
    top: 14px;
    z-index: 1030;
    border-color: rgba(18, 108, 67, .22);
    color: var(--lab-green);
    background: rgba(245, 247, 241, .94);
    box-shadow: 0 12px 28px rgba(16, 23, 20, .14);
}

.user-sidebar-toggle:hover,
.user-sidebar-toggle:focus {
    color: var(--lab-green);
    border-color: rgba(18, 108, 67, .45);
    background: var(--lab-paper);
}

.sidebar-collapse-toggle {
    position: absolute;
    top: 14px;
    right: -16px;
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(18, 108, 67, .25);
    border-radius: 50%;
    background: var(--lab-paper);
    color: var(--lab-green);
    box-shadow: 0 8px 22px rgba(16, 23, 20, .12);
    z-index: 1;
}

.sidebar-collapse-toggle:hover,
.sidebar-collapse-toggle:focus {
    border-color: var(--lab-green);
    color: var(--lab-green);
}

.sidebar-section {
    display: grid;
    gap: 6px;
}

.sidebar-link {
    min-height: 46px;
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 8px;
    padding: 10px 12px;
    color: var(--lab-ink);
    text-decoration: none;
    font-weight: 750;
}

.sidebar-link i {
    color: var(--lab-green);
}

.sidebar-link:hover,
.sidebar-link:focus,
.sidebar-link.active {
    background: rgba(18, 108, 67, .1);
    color: var(--lab-green);
}

.sidebar-collapsed {
    --sidebar-width: 82px;
}

.sidebar-collapsed .axo-sidebar {
    padding-inline: 10px;
}

.sidebar-collapsed .sidebar-link {
    justify-content: center;
    padding-inline: 8px;
}

.sidebar-collapsed .sidebar-link i {
    font-size: 1.12rem;
}

.sidebar-collapsed .sidebar-link span {
    width: 0;
    opacity: 0;
    overflow: hidden;
    white-space: nowrap;
    visibility: hidden;
}

.app-main {
    margin-left: var(--sidebar-width);
    padding: clamp(20px, 4vw, 36px);
}

.page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
}

.page-header h1 {
    font-size: clamp(1.7rem, 3vw, 2.5rem);
}

.kiv-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}

.kiv {
    min-height: 124px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid var(--lab-border);
    border-top: 5px solid var(--lab-green);
    border-radius: 8px;
    background: var(--lab-paper);
    padding: 18px;
}

.kiv-link {
    color: var(--lab-ink);
    text-decoration: none;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.kiv-link:hover,
.kiv-link:focus {
    color: var(--lab-ink);
    border-color: rgba(18, 108, 67, .35);
    box-shadow: 0 16px 36px rgba(18, 108, 67, .1);
    transform: translateY(-2px);
}

.kiv span {
    color: var(--lab-muted);
    font-size: .88rem;
    font-weight: 800;
    text-transform: uppercase;
}

.kiv small {
    display: block;
    margin-top: 4px;
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 750;
    line-height: 1.25;
}

.kiv strong {
    font-size: clamp(1.7rem, 3vw, 2.4rem);
    line-height: 1.05;
}

.kiv-alert {
    border-top-color: var(--lab-amber);
}

.kiv.stripe-credit-highlight,
.kiv.stripe-credit-soft-highlight {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border-color: var(--lab-border);
    border-top-color: var(--lab-green);
    border-image: none;
    background:
        linear-gradient(135deg, rgba(124, 58, 237, .1), rgba(255, 255, 255, .94) 42%, rgba(18, 108, 67, .06)),
        var(--lab-paper);
    box-shadow: 0 18px 42px rgba(124, 58, 237, .12);
    animation: none;
}

.kiv.stripe-credit-highlight::before,
.kiv.stripe-credit-soft-highlight::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(124, 58, 237, .16), transparent 38%),
        radial-gradient(circle at 92% 18%, rgba(216, 180, 254, .24), transparent 30%);
    opacity: .85;
    animation: stripeCreditSheen 1.05s ease-in-out 3;
}

.kiv.stripe-credit-highlight > *,
.kiv.stripe-credit-soft-highlight > * {
    position: relative;
    z-index: 1;
}

.kiv.stripe-credit-highlight::after,
.kiv.stripe-credit-soft-highlight::after {
    content: none !important;
    display: none !important;
    animation: none !important;
}

.stripe-credit-amount-highlight {
    display: inline-block;
    color: #6d28d9;
    text-shadow: 0 8px 24px rgba(124, 58, 237, .24);
    animation: stripeCreditAmountPulse 1.05s ease-in-out 3;
}

@keyframes stripeCreditSheen {
    0%,
    100% {
        opacity: .55;
    }

    50% {
        opacity: 1;
    }
}

@keyframes stripeCreditAmountPulse {
    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.08);
    }
}

.purchase-search-status {
    margin-bottom: 12px;
    color: var(--lab-muted);
    font-weight: 800;
}

.purchase-search-results {
    display: grid;
    gap: 12px;
}

.purchase-search-card {
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 14px;
    background: var(--lab-panel);
}

.purchase-search-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.purchase-search-card-title {
    display: grid;
    gap: 2px;
}

.purchase-search-card-title strong {
    font-size: 1.05rem;
}

.purchase-search-card-title span,
.purchase-search-grid span,
.purchase-search-note span {
    color: var(--lab-muted);
    font-weight: 800;
}

.purchase-search-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.purchase-search-grid > div,
.purchase-search-note {
    border: 1px solid rgba(18, 108, 67, .12);
    border-radius: 8px;
    padding: 10px;
    background: var(--lab-paper);
}

.purchase-search-grid strong,
.purchase-search-note strong {
    display: block;
    margin-top: 2px;
    word-break: break-word;
}

.purchase-search-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.content-band {
    width: 100%;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: var(--lab-paper);
    padding: clamp(16px, 2vw, 22px);
    margin-bottom: 22px;
}

.group-share-editor {
    border: 1px solid rgba(18, 108, 67, .28);
    border-left: 5px solid var(--lab-green);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(18, 108, 67, .08), rgba(255, 255, 255, .88));
    padding: 16px;
    margin: 12px 0 18px;
}

.group-share-editor-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--lab-green);
    font-weight: 800;
    margin-bottom: 10px;
}

.group-share-editor-strong {
    background: linear-gradient(135deg, rgba(18, 108, 67, .12), rgba(250, 247, 234, .92));
    box-shadow: 0 18px 44px rgba(6, 35, 24, .08);
}

.group-share-editor-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.group-share-current {
    display: grid;
    justify-items: end;
    gap: 3px;
    color: var(--lab-muted);
    font-size: .9rem;
}

.group-share-current strong {
    color: var(--lab-ink);
    font-size: 1.05rem;
}

.group-share-grid {
    align-items: end;
}

.group-share-help {
    border: 1px solid rgba(18, 108, 67, .18);
    border-radius: 8px;
    background: rgba(255, 255, 255, .7);
    padding: 12px 14px;
    min-height: 86px;
}

.group-share-help span,
.group-share-help small {
    display: block;
    color: var(--lab-muted);
    font-weight: 700;
}

.group-share-help strong {
    display: block;
    color: var(--lab-green);
    font-size: 1.8rem;
    line-height: 1.1;
}


.user-profile-band {
    padding: 0;
    overflow: hidden;
}

.user-profile-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(260px, 330px);
    gap: 18px;
    align-items: stretch;
    padding: clamp(16px, 2vw, 22px);
}

.user-profile-icon {
    width: 64px;
    min-height: 64px;
    display: grid;
    place-items: center;
    align-self: start;
    border: 1px solid rgba(18, 108, 67, .18);
    border-radius: 8px;
    color: var(--lab-green);
    background: rgba(18, 108, 67, .1);
    font-size: 2rem;
}

.user-profile-main {
    min-width: 0;
}

.user-profile-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.user-profile-grid div {
    min-width: 0;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 11px 12px;
}

.user-profile-grid span,
.user-password-form h3 {
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 850;
    text-transform: uppercase;
}

.user-profile-grid strong {
    display: block;
    margin-top: 4px;
    color: var(--lab-ink);
    font-size: 1rem;
    word-break: break-word;
}

.profile-credit-button {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    border: 0;
    padding: 0;
    color: var(--lab-green);
    background: transparent;
    font: inherit;
    font-weight: 900;
    text-align: left;
    text-decoration: underline;
    text-underline-offset: 4px;
    cursor: pointer;
}

.user-password-form {
    display: grid;
    align-content: start;
    gap: 9px;
    border-left: 1px solid var(--lab-border);
    padding-left: 18px;
}

.user-password-form h3 {
    margin: 0 0 2px;
    color: var(--lab-ink);
    font-size: 1rem;
    text-transform: none;
}

.user-password-form .btn {
    justify-self: start;
    margin-top: 4px;
}

.user-credit-modal .axo-table {
    min-width: 720px;
}

.user-credit-movements-scroll {
    max-height: min(58vh, 520px);
    overflow: auto;
}

.user-credit-movements-scroll thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--lab-paper);
}

.expiry-login-modal {
    border: 1px solid rgba(18, 108, 67, .2);
    border-radius: 8px;
    overflow: hidden;
}

.expiry-login-modal .modal-header {
    border-bottom: 1px solid var(--lab-border);
    background: linear-gradient(135deg, rgba(214, 255, 85, .14), rgba(255, 255, 255, .94));
}

.expiry-login-modal .axo-table {
    min-width: 620px;
}

.service-name-text .expiry-service-note {
    display: inline-block;
    max-width: min(58ch, 100%);
    margin-top: 4px;
    border-left: 3px solid rgba(18, 108, 67, .22);
    padding: 2px 0 2px 9px;
    color: #5e6b64;
    font-size: .82rem;
    font-weight: 650;
    line-height: 1.35;
    white-space: normal;
}

.expiry-login-modal .expiry-login-footnote {
    margin-top: 18px;
    margin-bottom: 0 !important;
    border-top: 1px solid rgba(18, 108, 67, .12);
    padding-top: 15px;
    color: #6b766f;
    font-size: .84rem;
    font-weight: 650;
    line-height: 1.45;
}

.expiry-days-pill {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    border-radius: 8px;
    padding: 4px 10px;
    color: var(--lab-green);
    background: rgba(18, 108, 67, .1);
    font-weight: 950;
    white-space: nowrap;
}

.expiry-days-pill.urgent {
    color: #a82e2e;
    background: rgba(168, 46, 46, .12);
}

.section-heading {
    margin-bottom: 14px;
}

.section-heading h2 {
    font-size: 1.15rem;
}

.quick-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
}

.quick-action {
    min-height: 78px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 14px;
    color: var(--lab-ink);
    background: #fbfcf8;
    text-decoration: none;
    font-weight: 800;
}

.quick-action i {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    border-radius: 8px;
    color: var(--lab-green);
    background: rgba(18, 108, 67, .1);
}

.quick-action small {
    display: block;
    margin-top: 3px;
    color: var(--lab-muted);
    font-size: .72rem;
    font-weight: 750;
    line-height: 1.25;
}

.quick-action:hover,
.quick-action:focus {
    border-color: var(--lab-green);
    color: var(--lab-green);
}

.news-hero-band {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
    overflow: hidden;
    min-height: 130px;
    background:
        linear-gradient(135deg, rgba(18, 108, 67, 0.1), rgba(255, 255, 255, 0.9)),
        var(--lab-paper);
}

.news-hero-band::after {
    content: "";
    position: absolute;
    inset: auto 22px -42px auto;
    width: 170px;
    height: 170px;
    border: 1px solid rgba(18, 108, 67, 0.14);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(139, 195, 74, 0.16), transparent 62%);
}

.news-hero-mark {
    position: relative;
    z-index: 1;
    width: 72px;
    height: 72px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: var(--lab-green);
    background: rgba(18, 108, 67, 0.12);
    font-size: 2rem;
}

.news-hero-band h2 {
    position: relative;
    z-index: 1;
    margin: 0;
    font-size: clamp(1.8rem, 4vw, 3rem);
}

.news-feed {
    display: grid;
    gap: 14px;
}

.news-card {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 18px;
    border: 1px solid var(--lab-border);
    border-left: 5px solid var(--lab-green);
    border-radius: 8px;
    padding: 18px;
    background: linear-gradient(90deg, rgba(18, 108, 67, 0.05), #fff 34%);
}

.news-date-box {
    display: grid;
    align-content: center;
    gap: 4px;
    color: var(--lab-muted);
    font-weight: 850;
    text-transform: uppercase;
}

.news-date-box small {
    color: var(--lab-green);
    font-size: 0.78rem;
}

.news-card-body h2 {
    margin: 0 0 8px;
    font-size: 1.3rem;
}

.news-text {
    color: var(--lab-ink);
    font-size: 1rem;
    line-height: 1.55;
}

.news-text p,
.news-admin-preview p {
    margin: 0 0 0.75rem;
}

.news-text ul,
.news-text ol,
.news-admin-preview ul,
.news-admin-preview ol {
    margin: 0.25rem 0 0.9rem 1.2rem;
    padding: 0;
}

.news-text table,
.news-admin-preview table {
    width: 100%;
    border-collapse: collapse;
    margin: 0.9rem 0;
    overflow: hidden;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
}

.news-text th,
.news-text td,
.news-admin-preview th,
.news-admin-preview td {
    border-bottom: 1px solid var(--lab-border);
    padding: 0.65rem 0.75rem;
    text-align: left;
    vertical-align: top;
}

.news-text th,
.news-admin-preview th {
    color: var(--lab-muted);
    background: #f8faf5;
    font-size: 0.82rem;
    text-transform: uppercase;
}

.news-text tr:last-child td,
.news-admin-preview tr:last-child td {
    border-bottom: 0;
}

.news-admin-preview {
    color: var(--lab-muted);
    line-height: 1.45;
}

.news-admin-info {
    margin-bottom: 22px;
}

.news-editor-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 230px auto;
    gap: 16px;
    align-items: end;
}

.news-title-field,
.news-body-field {
    grid-column: 1 / -1;
}

.news-body-field textarea {
    min-height: 190px;
}

.news-visible-switch {
    align-self: center;
}

.news-editor-actions {
    display: flex;
    justify-content: flex-end;
    grid-column: 1 / -1;
}

.news-admin-list {
    display: grid;
    gap: 12px;
}

.news-admin-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 16px;
    background: #fff;
}

.news-admin-card.is-hidden {
    background: rgba(241, 244, 238, 0.7);
    opacity: 0.78;
}

.news-admin-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    color: var(--lab-muted);
    font-size: 0.85rem;
    font-weight: 800;
    margin-bottom: 6px;
}

.news-status-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 0.2rem 0.55rem;
    font-size: 0.78rem;
    font-weight: 900;
}

.news-status-badge.visible {
    color: var(--lab-green);
    background: rgba(18, 108, 67, 0.12);
}

.news-status-badge.hidden {
    color: #6f7a73;
    background: rgba(111, 122, 115, 0.12);
}

.news-admin-main h3 {
    margin: 0 0 8px;
    font-size: 1.08rem;
}

.news-admin-main p {
    margin: 0;
    color: var(--lab-muted);
    line-height: 1.45;
}

.news-admin-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 130px;
}

@media (max-width: 760px) {
    .news-card,
    .news-admin-card,
    .news-editor-grid {
        grid-template-columns: 1fr;
    }

    .news-admin-actions {
        flex-direction: row;
        flex-wrap: wrap;
    }
}

.info-panel {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border: 1px solid rgba(18, 108, 67, .18);
    border-left: 5px solid var(--lab-green);
    border-radius: 8px;
    background: rgba(18, 108, 67, .06);
    padding: 14px 16px;
    margin-bottom: 18px;
}

.info-panel i {
    color: var(--lab-green);
    font-size: 1.1rem;
    margin-top: 2px;
}

.info-panel div {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.info-panel span {
    color: var(--lab-muted);
    font-weight: 700;
}

.service-name-cell {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 800;
}

.service-name-cell i {
    width: 30px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    color: var(--lab-green);
    background: rgba(18, 108, 67, .1);
}

.service-name-text {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.service-name-text small {
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 750;
    line-height: 1.2;
}

.two-columns {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr);
    gap: 22px;
}

.table-wrap {
    width: 100%;
    overflow-x: auto;
}

.axo-table {
    min-width: 620px;
    margin: 0;
}

.axo-table th {
    color: var(--lab-muted);
    font-size: .82rem;
    text-transform: uppercase;
}

.empty-cell,
.empty-state {
    color: var(--lab-muted);
    font-weight: 700;
}

.status-badge.neutral {
    color: var(--lab-muted);
    background: #edf3ea;
}

.users-tabs-band {
    padding: 0;
    overflow: hidden;
}

.users-tabs-band .settings-tabs {
    margin: 0;
}

.users-admin-tabs .tab-counter,
.bot-requests-band .tab-counter {
    min-width: 22px;
    min-height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 2px 7px;
    color: var(--lab-green);
    background: rgba(18, 108, 67, .1);
    font-size: .72rem;
    font-weight: 900;
}

.bot-requests-table {
    min-width: 1180px;
}

.bot-request-payload {
    max-width: 300px;
}

.bot-request-payload small {
    overflow-wrap: anywhere;
}

.bot-request-create-form {
    min-width: 170px;
    display: grid;
    gap: 8px;
    justify-items: start;
}

.bot-request-actions {
    display: grid;
    gap: 8px;
    justify-items: start;
}

.bot-request-create-form .settings-switch {
    min-height: auto;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.btn.danger {
    color: var(--lab-danger);
    border-color: rgba(155, 47, 45, .32);
    background: rgba(155, 47, 45, .06);
}

.btn.danger:hover,
.btn.danger:focus {
    color: #7c2422;
    border-color: rgba(155, 47, 45, .48);
    background: rgba(155, 47, 45, .1);
}

.dependent-list {
    display: grid;
    gap: 8px;
}

.dependent-row {
    min-height: 48px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 10px 12px;
    background: #fbfcf8;
}

.services-filter-grid {
    grid-template-columns: minmax(190px, .7fr) minmax(280px, 1fr) auto;
}

.users-filter-grid {
    grid-template-columns: minmax(170px, .6fr) minmax(260px, 1fr) repeat(2, minmax(150px, .65fr)) auto;
}

.purchase-filter-grid {
    grid-template-columns: minmax(260px, 1.2fr) repeat(5, minmax(130px, .7fr)) auto;
}

.users-filter-grid .filter-search,
.purchase-filter-grid .filter-search {
    grid-column: auto;
}

.services-filter-grid-simple {
    grid-template-columns: minmax(280px, 1fr) auto;
}

.services-filter-grid-simple .filter-search {
    grid-column: auto;
}

.service-table {
    min-width: 1120px;
    table-layout: fixed;
    border-collapse: collapse;
}

.service-table-shell {
    position: relative;
}

.mobile-scroll-cue {
    display: none;
}

.service-table th,
.service-table td {
    vertical-align: middle;
}

.service-table tbody tr {
    border-bottom: 1px solid var(--lab-border);
}

.service-request-band-collapsed:not(:target) {
    display: none;
}

.service-request-band-open,
.service-request-band-collapsed:target {
    display: block;
    animation: serviceRequestReveal .18s ease-out;
}

.field-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;
}

.field-label-row .form-label {
    margin-bottom: 0;
}

.service-request-help-button {
    min-height: 32px;
    padding: 4px 10px;
}

.service-request-help-modal .modal-content {
    border: 1px solid rgba(18, 108, 67, .2);
    border-radius: 8px;
}

.service-request-help-intro {
    margin-bottom: 14px;
    color: var(--lab-muted);
    font-weight: 700;
}

.service-request-help-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.service-request-help-grid article {
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: rgba(18, 108, 67, .035);
    padding: 14px;
}

.service-request-help-option {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    border-radius: 999px;
    padding: 3px 9px;
    color: var(--lab-green);
    background: rgba(18, 108, 67, .1);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.service-request-help-grid h3 {
    margin: 10px 0 8px;
    font-size: 1rem;
}

.service-request-help-grid p {
    margin: 0 0 10px;
    color: var(--lab-muted);
    font-size: .92rem;
    line-height: 1.45;
}

.service-request-help-grid strong {
    display: block;
    margin-bottom: 4px;
    color: var(--lab-ink);
    font-size: .88rem;
}

.service-request-help-note {
    border-left: 3px solid var(--lab-amber);
    padding-left: 10px;
}

@media (max-width: 760px) {
    .field-label-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .service-request-help-grid {
        grid-template-columns: 1fr;
    }

    .service-table-wrap {
        -webkit-overflow-scrolling: touch;
        border: 1px solid rgba(18, 108, 67, .12);
        border-radius: 8px;
        background: var(--lab-paper);
    }

    .mobile-scroll-cue {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        width: fit-content;
        max-width: 100%;
        margin-bottom: 10px;
        border: 1px solid rgba(18, 108, 67, .18);
        border-radius: 999px;
        padding: 7px 11px;
        color: var(--lab-green);
        background: linear-gradient(90deg, rgba(18, 108, 67, .08), rgba(158, 203, 58, .08));
        font-size: .78rem;
        font-weight: 850;
        line-height: 1.2;
        box-shadow: 0 10px 22px rgba(18, 108, 67, .08);
    }

    .mobile-scroll-cue i {
        font-size: .95rem;
        animation: serviceScrollCueNudge 1.45s ease-in-out infinite;
    }

    .service-table-shell::after {
        content: "";
        position: absolute;
        top: 44px;
        right: 0;
        bottom: 0;
        width: 58px;
        pointer-events: none;
        border-radius: 0 8px 8px 0;
        background: linear-gradient(90deg, rgba(245, 247, 241, 0), rgba(245, 247, 241, .94) 68%, rgba(245, 247, 241, 1));
        z-index: 2;
    }

    .service-table-shell::before {
        content: "\203A";
        position: absolute;
        right: 13px;
        top: 92px;
        z-index: 3;
        pointer-events: none;
        width: 30px;
        height: 30px;
        display: grid;
        place-items: center;
        border: 1px solid rgba(18, 108, 67, .22);
        border-radius: 50%;
        color: var(--lab-green);
        background: rgba(245, 247, 241, .94);
        font-size: 1.45rem;
        font-weight: 900;
        line-height: 1;
        box-shadow: 0 12px 24px rgba(16, 23, 20, .12);
        animation: serviceScrollCueNudge 1.45s ease-in-out infinite;
    }
}

@keyframes serviceRequestReveal {
    from {
        opacity: .35;
        transform: translateY(-6px);
    }

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

@keyframes serviceScrollCueNudge {
    0%,
    100% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(4px);
    }
}

.service-table tbody td {
    border-bottom: 0;
    padding-top: 14px;
    padding-bottom: 14px;
}

.service-table tbody tr.service-dependent-row {
    background:
        linear-gradient(90deg, rgba(83, 132, 174, .16), rgba(83, 132, 174, .05) 42%, rgba(255, 255, 255, 0) 100%),
        #fbfcf8;
    box-shadow: inset 4px 0 0 rgba(83, 132, 174, .68);
}

.service-table td.stacked-cell {
    display: table-cell;
}

.service-table td.stacked-cell > strong,
.service-table td.stacked-cell > small {
    display: block;
}

.service-table td.stacked-cell > small {
    margin-top: 4px;
}

.service-owner-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    margin-top: 7px;
    border-radius: 999px;
    padding: 4px 9px;
    font-size: .78rem;
    font-weight: 850;
    line-height: 1.1;
}

.service-owner-pill.dependent {
    border: 1px solid rgba(83, 132, 174, .24);
    background: rgba(83, 132, 174, .12);
    color: #2c607e;
}

.service-table .credential-stack {
    max-width: 100%;
}

.service-table .copy-btn {
    width: min(100%, 340px);
    justify-content: center;
}

.service-url-box {
    display: grid;
    gap: 6px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(18, 108, 67, .14);
}

.service-url-box span {
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 850;
    text-transform: uppercase;
}

.service-url-box code {
    display: block;
    max-width: min(56vw, 520px);
    border: 1px solid rgba(18, 108, 67, .18);
    border-radius: 8px;
    background: rgba(18, 108, 67, .05);
    color: var(--lab-ink);
    padding: 8px 10px;
    white-space: normal;
    overflow-wrap: anywhere;
}

.service-action-stack {
    justify-content: flex-start;
}

.service-action-stack .btn {
    white-space: nowrap;
}

.service-resend-button {
    color: #26624a;
    background: rgba(18, 108, 67, .035);
}

.service-resend-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.service-resend-summary > div {
    min-width: 0;
    border: 1px solid rgba(18, 108, 67, .14);
    border-radius: 8px;
    padding: 10px 12px;
    background: #fbfcf8;
}

.service-resend-summary span {
    display: block;
    color: var(--lab-muted);
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.service-resend-summary strong {
    display: block;
    margin-top: 4px;
    color: var(--lab-ink);
    overflow-wrap: anywhere;
}

.service-resend-channels {
    margin-top: 0;
}

.admin-renewal-scroll {
    max-height: 360px;
    overflow: auto;
}

.admin-renewal-row.is-funded,
.admin-renewal-row.has-positive-credit {
    background: rgba(18, 122, 75, 0.035);
}

.admin-renewal-row.has-shortfall {
    background: rgba(164, 47, 47, 0.08);
}

.admin-renewal-row.needs-review {
    background: rgba(180, 130, 0, 0.08);
}

.admin-renewal-line-ref {
    display: block;
    margin-top: 0.35rem;
    color: var(--text-muted, #6f7a73);
    font-size: 0.82rem;
    font-weight: 800;
}

.renewal-member-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.35rem;
}

.renewal-member-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.22rem 0.55rem;
    border: 1px solid var(--lab-border);
    border-radius: 999px;
    background: #fff;
    font-size: 0.85rem;
    font-weight: 800;
    white-space: nowrap;
}

.renewal-member-chip small {
    margin: 0;
    color: inherit;
    font-size: 0.78rem;
    font-weight: 800;
    opacity: 0.78;
}

.renewal-member-chip.is-funded {
    border-color: rgba(18, 122, 75, 0.34);
    background: rgba(18, 122, 75, 0.12);
    color: var(--lab-green);
}

.renewal-member-chip.is-short {
    border-color: rgba(164, 47, 47, 0.34);
    background: rgba(164, 47, 47, 0.12);
    color: #a42f2f;
}

.renewal-member-chip.is-unknown {
    border-color: rgba(180, 130, 0, 0.34);
    background: rgba(255, 244, 204, 0.82);
    color: #7b5c00;
}

.renewal-member-chip.has-credit:not(.is-short) {
    border-color: rgba(18, 122, 75, 0.36);
    background: linear-gradient(90deg, rgba(18, 122, 75, 0.13), rgba(167, 238, 45, 0.07));
    color: #0f7046;
}

.renewal-member-chip.has-no-credit:not(.is-funded) {
    border-color: rgba(164, 47, 47, 0.28);
    background: linear-gradient(90deg, rgba(164, 47, 47, 0.13), rgba(255, 255, 255, 0.68));
    color: #8c2c2c;
}

.renewal-member-telegram {
    color: #2f6f98;
    opacity: 0.9;
}

.renewal-action-stack {
    display: inline-flex;
    flex-direction: column;
    align-items: stretch;
    gap: 7px;
    min-width: 128px;
}

.renewal-action-stack .btn,
.renewal-action-stack form,
.renewal-action-stack .inline-form {
    width: 100%;
}

.expiry-notice-button {
    color: #135c7a;
    border-color: rgba(19, 92, 122, 0.32);
    background: linear-gradient(90deg, rgba(19, 92, 122, 0.08), rgba(255, 255, 255, 0.92));
}

.expiry-notice-button:hover,
.expiry-notice-button:focus {
    color: #0f4e68;
    border-color: rgba(19, 92, 122, 0.58);
    background: rgba(19, 92, 122, 0.12);
}

.incident-table {
    min-width: 980px;
}

.group-table {
    min-width: 900px;
}

.line-table {
    min-width: 980px;
}

.purchase-tabs-band {
    padding: 0;
    overflow: hidden;
}

.purchase-tabs-band .settings-tabs {
    margin: 0;
}

.purchase-table {
    min-width: 1320px;
    table-layout: fixed;
}

.purchase-table.is-admin {
    min-width: 1780px;
}

.purchase-table .purchase-col-date {
    width: 8rem;
}

.purchase-table .purchase-col-user {
    width: 14.5rem;
}

.purchase-table .purchase-col-service {
    width: 11.5rem;
}

.purchase-table .purchase-col-group {
    width: 12.5rem;
}

.purchase-table .purchase-col-movement {
    width: 8.5rem;
}

.purchase-table .purchase-col-credentials {
    width: 18.5rem;
}

.purchase-table .purchase-col-amount {
    width: 8.5rem;
}

.purchase-table .purchase-col-detail {
    width: 16rem;
}

.purchase-table .purchase-col-actions {
    width: 13.5rem;
}

.purchase-table th,
.purchase-table td {
    vertical-align: middle;
}

.purchase-movements-band .purchase-table {
    border-collapse: separate;
    border-spacing: 0 8px;
}

.purchase-movements-band .purchase-table thead th {
    border: 0;
    background: #f6f8f3;
    color: var(--lab-muted);
    font-size: .78rem;
    letter-spacing: 0;
}

.purchase-movements-band .purchase-table tbody tr {
    background: #fff;
    box-shadow: 0 1px 0 rgba(18, 108, 67, .12);
}

.purchase-movements-band .purchase-table tbody td {
    border-top: 1px solid rgba(18, 108, 67, .11);
    border-bottom: 1px solid rgba(18, 108, 67, .11);
    padding-top: 14px;
    padding-bottom: 14px;
}

.purchase-movements-band .purchase-table tbody td:first-child {
    border-left: 1px solid rgba(18, 108, 67, .11);
    border-radius: 8px 0 0 8px;
}

.purchase-movements-band .purchase-table tbody td:last-child {
    border-right: 1px solid rgba(18, 108, 67, .11);
    border-radius: 0 8px 8px 0;
}

.purchase-table .amount-cell {
    text-align: right;
    white-space: nowrap;
}

.purchase-table .purchase-service-cell,
.purchase-table .purchase-group-cell {
    min-width: 0;
}

.purchase-table .purchase-movement-cell {
    white-space: nowrap;
}

.purchase-table .purchase-user-cell small,
.purchase-table .purchase-detail-cell,
.purchase-table .purchase-credentials-card span,
.purchase-table .purchase-credentials-card small {
    overflow-wrap: anywhere;
}

.purchase-service-name,
.purchase-group-code {
    display: block;
    max-width: 100%;
    color: var(--lab-ink);
    font-weight: 900;
    line-height: 1.15;
    white-space: normal;
    overflow-wrap: anywhere;
}

.purchase-group-code {
    font-weight: 800;
}

.purchase-credentials-cell {
    min-width: 0;
}

.purchase-credentials-card {
    display: grid;
    gap: 5px;
    width: 100%;
    max-width: 100%;
    padding: 10px 12px;
    border: 1px solid rgba(18, 108, 67, .14);
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(248, 251, 246, .95), rgba(255, 255, 255, .9));
    line-height: 1.2;
}

.purchase-credentials-card span {
    color: var(--lab-ink);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: .84rem;
    font-weight: 850;
}

.purchase-credentials-card small {
    color: var(--lab-muted);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: .78rem;
    font-weight: 800;
}

.purchase-table .purchase-detail-cell {
    min-width: 0;
    color: var(--lab-ink);
    line-height: 1.35;
}

.purchase-table .purchase-actions-cell {
    vertical-align: top;
}

.dependents-table,
.users-table {
    min-width: 1320px;
}

.consultation-history-table {
    min-width: 980px;
}

.consulta-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.consulta-panel {
    min-width: 0;
}

.compact-list {
    display: grid;
    gap: 8px;
}

.compact-row {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 10px 12px;
}

.compact-row-link {
    color: inherit;
    text-decoration: none;
}

.compact-row-link:hover,
.compact-row-link:focus {
    border-color: rgba(18, 108, 67, .34);
    color: var(--lab-ink);
    background: #f5faf0;
}

.compact-row strong,
.compact-row small {
    display: block;
}

.compact-row small {
    margin-top: 3px;
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 750;
}

.service-request-status-band .compact-row {
    align-items: flex-start;
}

.service-request-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 230px;
}

.compact-actions,
.row-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.user-row-actions {
    justify-content: flex-start;
    min-width: 356px;
}

.user-row-actions .btn {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.notification-confirm-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 18px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 14px 16px;
}

.notification-confirm-panel > strong,
.notification-confirm-panel > span {
    display: block;
}

.notification-confirm-panel > span {
    color: var(--lab-muted);
    font-size: .9rem;
    font-weight: 750;
}

.transfer-dependent-selected [data-transfer-notification-panel] {
    align-items: flex-start;
    flex-wrap: wrap;
    border-color: #edc85b;
    background: #fff8df;
    box-shadow: inset 0 0 0 1px rgba(237, 200, 91, 0.34);
}

.transfer-dependent-warning {
    width: 100%;
    margin-top: 10px;
    padding: 11px 13px;
    border: 1px solid #edc85b;
    border-left: 5px solid #d69b00;
    border-radius: 8px;
    background: #fff4c9;
    color: #604200;
    font-weight: 850;
}

.transfer-dependent-warning strong {
    display: block;
    color: inherit;
}

.transfer-dependent-warning span {
    display: block;
    margin-top: 3px;
    font-size: 0.86rem;
    font-weight: 750;
}

.user-action-target {
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    margin: 0 0 14px;
    padding: 11px 12px;
}

.payment-visibility-stack {
    display: grid;
    gap: 8px;
}

.user-detail-panel {
    border-top: 5px solid var(--lab-green);
}

.user-detail-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.user-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
    gap: 22px;
}

.user-detail-scroll {
    max-height: 440px;
    overflow: auto;
}

.user-detail-table {
    min-width: 760px;
}

.payment-tax-input {
    min-width: 120px;
}

.settings-compact-textarea {
    min-width: 230px;
    resize: vertical;
}

.payment-name-input {
    min-width: 190px;
    font-weight: 850;
}

.delete-payment-option {
    color: var(--lab-danger);
    font-weight: 850;
}

.settings-provider-table {
    min-width: 1120px;
}

.provider-name-input {
    min-width: 190px;
    font-weight: 850;
}

.provider-contact-input {
    min-width: 190px;
    margin-bottom: 8px;
}

.provider-contact-input:last-child {
    margin-bottom: 0;
}

.provider-usage-cell {
    white-space: nowrap;
}

.provider-usage-cell span {
    display: block;
    color: var(--lab-muted);
    font-size: .88rem;
    font-weight: 800;
}

.settings-subpanel {
    margin-top: 18px;
    border-top: 1px solid var(--lab-border);
    padding-top: 18px;
}

.shared-connector-row td {
    height: 24px;
    background: #fbfcf8;
    padding: 0;
    border-top: 0;
    border-bottom: 0;
}

.shared-connector {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 8px;
    margin-left: min(54%, 980px);
    width: 210px;
    color: var(--lab-green);
}

.shared-connector span {
    height: 2px;
    background: rgba(18, 108, 67, .26);
}

.shared-connector i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid rgba(18, 108, 67, .26);
    border-radius: 999px;
    background: #eef6ec;
    font-size: 1rem;
}

.income-filter-grid {
    grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.income-filter-grid .filter-search {
    grid-column: span 2;
}

.income-tabs-shell {
    padding: 0;
    overflow: hidden;
}

.income-tabs {
    margin: 0;
}

.income-tab-content {
    padding: clamp(16px, 2vw, 22px);
}

.income-history-block {
    display: grid;
    gap: 14px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid rgba(18, 108, 67, .14);
}

.money-amount {
    white-space: nowrap;
    word-break: keep-all;
    font-variant-numeric: tabular-nums;
}

.money-amount.ok {
    color: var(--lab-green);
}

.money-amount.danger {
    color: var(--lab-danger);
}

.income-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 14px;
}

.income-kpi-card {
    position: relative;
    isolation: isolate;
    display: grid;
    gap: 10px;
    min-width: 0;
    overflow: visible;
    padding: 14px 16px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
}

.income-kpi-card > * {
    position: relative;
    z-index: 2;
}

.income-kpi-heading {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: baseline;
    min-width: 0;
}

.income-kpi-heading span,
.income-kpi-card small,
.income-kpi-values span {
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 850;
    text-transform: uppercase;
}

.income-kpi-heading strong {
    flex: 0 0 auto;
    color: var(--lab-green);
    font-size: .9rem;
    white-space: nowrap;
}

.income-kpi-values {
    display: grid;
    gap: 8px;
}

.income-kpi-metric {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    align-items: baseline;
    gap: 14px;
    min-width: 0;
    white-space: nowrap;
}

.income-kpi-metric span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.income-kpi-metric strong {
    flex: 0 0 auto;
    color: var(--lab-ink);
    font-size: clamp(.98rem, 1.05vw, 1.18rem);
    line-height: 1.15;
    text-align: right;
    white-space: nowrap;
}

.income-kpi-metric.compact {
    padding: 6px 9px;
    border: 1px solid rgba(18, 108, 67, .1);
    border-radius: 7px;
    background: rgba(18, 108, 67, .035);
}

.income-kpi-metric.compact strong {
    font-size: .95rem;
}

.income-kpi-corner-badge {
    position: absolute;
    right: 26px;
    bottom: 24px;
    z-index: 1;
    color: rgba(18, 108, 67, .22);
    font-size: 1.42rem;
    font-weight: 950;
    letter-spacing: 0;
    pointer-events: none;
}

.income-kpi-card-all::after {
    content: "";
    position: absolute;
    right: 16px;
    bottom: 14px;
    width: 92px;
    height: 46px;
    opacity: .08;
    z-index: 0;
    pointer-events: none;
    background: var(--lab-black);
    clip-path: polygon(4% 74%, 16% 58%, 28% 56%, 34% 38%, 47% 34%, 55% 44%, 70% 45%, 85% 56%, 96% 54%, 86% 67%, 72% 69%, 69% 88%, 62% 88%, 59% 70%, 42% 71%, 38% 90%, 31% 90%, 29% 72%, 17% 74%);
}

.income-kpi-card-year::after {
    content: attr(data-kpi-range);
    position: absolute;
    right: 18px;
    bottom: 12px;
    min-width: 74px;
    border: 2px solid rgba(18, 108, 67, .13);
    border-top-width: 12px;
    border-radius: 8px;
    color: rgba(18, 108, 67, .16);
    font-size: 1.6rem;
    font-weight: 950;
    line-height: 1.2;
    text-align: center;
    z-index: 0;
    pointer-events: none;
}

.income-kpi-card-month::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    border: 2px solid rgba(210, 230, 75, .9);
    border-radius: inherit;
    box-shadow: inset 0 0 0 0 rgba(210, 230, 75, 0);
    opacity: 0;
    pointer-events: none;
    animation: incomeMonthBorderPulse 1.05s ease-in-out 3;
}

.income-kpi-card-month::after {
    content: "";
    position: absolute;
    right: 18px;
    bottom: 14px;
    width: 72px;
    height: 72px;
    border: 2px solid rgba(210, 230, 75, .22);
    border-top-width: 14px;
    border-radius: 10px;
    opacity: .34;
    z-index: 0;
    pointer-events: none;
    box-shadow: inset 0 18px 0 rgba(18, 108, 67, .08);
}

@keyframes incomeMonthBorderPulse {
    0%,
    100% {
        opacity: 0;
        border-color: rgba(210, 230, 75, .18);
        box-shadow: inset 0 0 0 0 rgba(210, 230, 75, 0);
    }

    22%,
    62% {
        opacity: .95;
        border-color: rgba(255, 246, 130, .95);
        box-shadow: inset 0 0 0 3px rgba(210, 230, 75, .18);
    }

    76% {
        border-color: rgba(18, 108, 67, .7);
    }
}

.income-chart {
    display: grid;
    gap: 10px;
}

.income-chart-row {
    display: grid;
    grid-template-columns: minmax(120px, 220px) 1fr minmax(110px, auto);
    align-items: center;
    gap: 12px;
}

.income-chart-row.compact {
    grid-template-columns: minmax(110px, 190px) 1fr minmax(100px, auto);
    font-size: .92rem;
}

.income-chart-label {
    color: var(--lab-ink);
    font-weight: 850;
    overflow-wrap: anywhere;
}

.income-chart-track {
    min-height: 14px;
    border-radius: 999px;
    background: #e8eee4;
    overflow: hidden;
}

.income-chart-bar {
    min-width: 4px;
    height: 14px;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--bar-color, var(--lab-green)), var(--bar-color-end, #d2e64b));
}

.income-chart-row > strong {
    white-space: nowrap;
}

.income-current-chart {
    margin-bottom: 26px;
}

.income-year-chart {
    display: grid;
    gap: 14px;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(18, 108, 67, .14);
}

.compact-heading {
    margin-bottom: 0;
}

.income-year-group {
    display: grid;
    gap: 10px;
}

.income-year-heading {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: baseline;
}

.income-year-heading strong {
    color: var(--lab-ink);
    font-size: 1.15rem;
}

.income-year-heading span {
    color: var(--lab-muted);
    font-size: .82rem;
    font-weight: 850;
}

.income-year-explorer {
    display: grid;
    gap: 14px;
    margin-top: 12px;
    border: 1px solid rgba(18, 108, 67, .16);
    border-radius: 8px;
    background: linear-gradient(180deg, #fbfcf8, #f5faf0);
    padding: 16px;
}

.income-year-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
}

.income-year-select-label {
    display: grid;
    gap: 5px;
    min-width: 150px;
    color: var(--lab-muted);
    font-size: .75rem;
    font-weight: 850;
    text-transform: uppercase;
}

.income-year-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 8px;
}

.income-year-pill {
    display: grid;
    gap: 3px;
    min-width: 0;
    border: 1px solid rgba(18, 108, 67, .12);
    border-radius: 8px;
    background: var(--lab-paper);
    padding: 10px 12px;
}

.income-year-pill span {
    color: var(--lab-muted);
    font-size: .72rem;
    font-weight: 850;
    text-transform: uppercase;
}

.income-year-pill strong {
    color: var(--lab-ink);
    font-size: .98rem;
}

.income-year-axis {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: var(--lab-muted);
    font-size: .75rem;
    font-weight: 850;
}

.income-year-bars {
    display: grid;
    gap: 10px;
}

.income-year-xy-chart {
    display: grid;
    gap: 10px;
    border: 1px solid rgba(18, 108, 67, .12);
    border-radius: 8px;
    background: #fff;
    padding: 10px;
}

.income-year-xy-chart svg {
    width: 100%;
    height: auto;
    display: block;
}

.income-year-axis-line {
    stroke: rgba(18, 108, 67, .32);
    stroke-width: 2;
}

.income-year-grid-line {
    stroke: rgba(18, 108, 67, .1);
    stroke-width: 1;
}

.income-year-x-label,
.income-year-y-label {
    fill: var(--lab-muted);
    font-size: 12px;
    font-weight: 850;
}

.income-year-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 850;
    text-transform: uppercase;
}

.income-year-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.income-year-legend i {
    width: 10px;
    height: 10px;
    border-radius: 999px;
}

.income-year-bar-row {
    display: grid;
    grid-template-columns: minmax(120px, 220px) 1fr minmax(120px, auto);
    align-items: center;
    gap: 12px;
}

.income-year-animated-bar {
    transition: width .72s cubic-bezier(.2, .75, .2, 1);
}

.income-table-scroll {
    max-height: 620px;
    overflow: auto;
}

.stripe-income-chip {
    width: max-content;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 1px solid rgba(92, 84, 209, .24);
    border-radius: 999px;
    background: rgba(92, 84, 209, .08);
    color: #3f3a9c;
    padding: 3px 8px;
    font-size: .72rem;
    font-weight: 900;
}

.stripe-income-details {
    display: grid;
    gap: 3px;
    margin-top: 8px;
    border: 1px solid rgba(92, 84, 209, .18);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(92, 84, 209, .08), rgba(255, 255, 255, .72));
    padding: 8px 10px;
    color: var(--lab-ink);
    font-size: .78rem;
    font-weight: 720;
}

.stripe-income-title {
    color: #3f3a9c;
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.stripe-income-details code {
    color: #25216f;
    font-size: .72rem;
    white-space: normal;
    overflow-wrap: anywhere;
}

.table-action-stack {
    display: inline-grid;
    gap: 6px;
    justify-items: start;
}

.expense-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.expense-kpi-card {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 14px 16px;
}

.expense-kpi-card span {
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.expense-kpi-card strong {
    color: var(--lab-ink);
    font-size: clamp(1.15rem, 1.7vw, 1.75rem);
    line-height: 1.05;
}

.expense-kpi-card small {
    color: var(--lab-muted);
    font-weight: 750;
}

.expense-kpi-card.soft-danger {
    border-color: rgba(155, 47, 45, .25);
    background: linear-gradient(180deg, #fffafa, #fbfcf8);
}

.expense-kpi-card.soft-ok {
    border-color: rgba(18, 108, 67, .2);
    background: linear-gradient(180deg, #f6fbf3, #fbfcf8);
}

.expense-create-grid {
    grid-template-columns: minmax(150px, .8fr) minmax(220px, 1.4fr) minmax(140px, .8fr) minmax(110px, .55fr) minmax(160px, 1fr) minmax(160px, 1fr);
}

.expense-table-scroll {
    max-height: 650px;
    overflow: auto;
}

.expense-table td {
    vertical-align: middle;
}

.expense-actions {
    display: grid;
    gap: 7px;
    min-width: 150px;
}

.expense-actions .btn {
    justify-content: center;
    width: 100%;
}

.expense-detail-grid,
.expense-edit-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.expense-detail-grid {
    display: grid;
    gap: 10px;
}

.expense-detail-grid > div,
.expense-notes-box {
    display: grid;
    gap: 4px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 11px 12px;
}

.expense-detail-grid span,
.expense-notes-box span {
    color: var(--lab-muted);
    font-size: .75rem;
    font-weight: 900;
    text-transform: uppercase;
}

.expense-detail-grid strong,
.expense-detail-grid small,
.expense-notes-box p {
    overflow-wrap: anywhere;
}

.expense-detail-grid small {
    color: var(--lab-muted);
    font-weight: 750;
}

.expense-notes-box {
    margin-top: 12px;
}

.expense-notes-box p {
    margin: 0;
    color: var(--lab-ink);
}

.purchase-incident-row > * {
    background: rgba(155, 47, 45, .055);
}

.group-purchase-band {
    border-top: 4px solid rgba(18, 108, 67, .65);
}

.group-purchase-picker {
    margin-bottom: 16px;
}

.group-purchase-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 16px 0;
}

.group-purchase-summary > div {
    border: 1px solid rgba(18, 108, 67, .14);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 12px;
}

.group-purchase-summary.blocked > div {
    border-color: rgba(155, 47, 45, .2);
    background: rgba(155, 47, 45, .07);
}

.group-purchase-summary span,
.group-purchase-summary small {
    display: block;
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 850;
}

.group-purchase-summary strong {
    display: block;
    margin: 3px 0;
    font-size: 1.05rem;
}

.group-purchase-members-scroll {
    margin-top: 16px;
    max-height: 430px;
    overflow: auto;
}

.income-filter-summary,
.income-export-band {
    margin-top: 18px;
}

.movement-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 28px;
    border-radius: 8px;
    padding: 4px 9px;
    font-size: .76rem;
    font-weight: 900;
}

.movement-badge.purchase {
    color: #6d35b5;
    background: linear-gradient(90deg, rgba(124, 58, 237, .15), rgba(18, 108, 67, .08));
}

.movement-badge.income {
    color: #0f766e;
    background: rgba(20, 184, 166, .14);
}

.movement-badge.renewal {
    color: #1f5f84;
    background: rgba(31, 95, 132, .12);
}

.movement-badge.incident {
    color: var(--lab-danger);
    background: rgba(155, 47, 45, .14);
}

.movement-badge.initial-purchase {
    width: fit-content;
    gap: 5px;
    color: #7a5200;
    background: rgba(226, 183, 65, .2);
}

.incident-extension-days {
    display: block;
    margin-top: 4px;
    color: var(--lab-danger);
    font-weight: 900;
}

.group-edit-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
    gap: 22px;
    align-items: start;
}

.group-detail-layout,
.line-detail-layout {
    grid-template-columns: minmax(0, .95fr) minmax(460px, .9fr);
}

.group-edit-panel {
    position: sticky;
    top: calc(var(--topbar-height) + 22px);
}

.group-detail-panel,
.line-detail-panel {
    max-height: calc(100vh - var(--topbar-height) - 38px);
    overflow: auto;
}

.group-edit-summary {
    display: grid;
    gap: 4px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 12px;
    margin-bottom: 14px;
}

.group-edit-summary span,
.group-edit-summary small {
    color: var(--lab-muted);
    overflow-wrap: anywhere;
}

.group-renewal-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin: 0 0 14px;
}

.group-profile-update-panel {
    display: grid;
    gap: 12px;
    border: 1px solid rgba(18, 108, 67, .22);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(18, 108, 67, .07), rgba(226, 183, 65, .08));
    padding: 14px;
    margin-bottom: 16px;
}

.group-profile-update-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.group-profile-update-heading span {
    display: block;
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 850;
    text-transform: uppercase;
}

.group-profile-update-heading strong {
    display: block;
    line-height: 1.2;
}

.group-profile-update-form {
    display: grid;
    grid-template-columns: minmax(92px, .55fr) minmax(110px, .65fr) minmax(132px, 1fr) auto;
    gap: 10px;
    align-items: end;
}

.group-edit-form {
    display: grid;
    gap: 14px;
}

.group-dashboard-strip {
    display: grid;
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
    gap: 22px;
}

.group-kpi {
    display: grid;
    align-content: center;
    gap: 6px;
}

.group-kpi span {
    color: var(--lab-muted);
    font-size: .82rem;
    font-weight: 850;
    text-transform: uppercase;
}

.group-kpi strong {
    color: var(--lab-green);
    font-size: clamp(2rem, 5vw, 3.4rem);
    line-height: 1;
}

.group-waiting-panel .compact-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.group-admin-actions {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, .75fr);
    gap: 22px;
    margin-bottom: 24px;
}

.group-action-panel,
.group-create-form,
.group-link-form {
    display: grid;
    gap: 16px;
}

.group-create-grid {
    grid-template-columns: minmax(180px, 1.2fr) minmax(150px, .8fr) minmax(135px, .7fr) minmax(135px, .7fr);
}

.group-detail-grid {
    margin-bottom: 16px;
}

.group-date-grid {
    gap: 12px;
}

.group-subheading {
    margin-top: 20px;
}

.group-list-scroll {
    max-height: min(680px, calc(100vh - 360px));
}

.group-list-filter {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(160px, 220px) minmax(150px, 190px) auto;
    gap: 14px;
    align-items: end;
    margin-bottom: 16px;
}

.group-mini-scroll {
    max-height: 280px;
    overflow: auto;
}

.capacity-manual-check {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    border: 1px solid rgba(226, 183, 65, .35);
    border-radius: 8px;
    background: rgba(226, 183, 65, .11);
    padding: 12px;
}

.capacity-manual-check input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: #a07200;
}

.capacity-manual-check strong,
.capacity-manual-check small {
    display: block;
}

.capacity-manual-check small {
    margin-top: 3px;
    color: var(--lab-muted);
    font-weight: 750;
}

.group-union-filter {
    grid-template-columns: minmax(200px, 1fr) minmax(200px, 1fr) auto;
}

.group-union-form {
    display: grid;
    gap: 18px;
}

.group-union-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 22px;
}

.group-union-panel {
    display: grid;
    gap: 16px;
    min-height: 0;
}

.group-union-scroll {
    display: grid;
    align-content: start;
    gap: 10px;
    max-height: min(680px, calc(100vh - 360px));
    overflow: auto;
    padding-right: 4px;
}

.union-choice-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 12px;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.union-choice-card:hover,
.union-choice-card:has(input:checked) {
    border-color: rgba(18, 108, 67, .55);
    background: rgba(234, 242, 233, .86);
    box-shadow: inset 4px 0 0 var(--lab-green);
}

.union-choice-card input {
    width: 18px;
    height: 18px;
    accent-color: var(--lab-green);
}

.union-choice-card strong,
.union-choice-card small {
    display: block;
}

.union-choice-card small {
    color: var(--lab-muted);
}

.union-choice-main {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.union-group-extra {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
    margin-top: 8px;
    padding-top: 9px;
    border-top: 1px solid rgba(18, 108, 67, .12);
}

.union-group-extra > span {
    display: grid;
    align-content: start;
    gap: 4px;
    min-width: 0;
}

.union-group-extra b {
    color: var(--lab-muted);
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.union-group-extra code {
    display: block;
    max-width: 100%;
    border-radius: 6px;
    background: rgba(18, 108, 67, .07);
    color: var(--lab-ink);
    padding: 3px 6px;
    overflow-wrap: anywhere;
    white-space: normal;
}

.union-group-extra em {
    color: var(--lab-muted);
    font-style: normal;
    font-weight: 750;
}

.union-member-list {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.union-member-list i {
    display: inline-flex;
    border-radius: 999px;
    background: rgba(83, 132, 174, .12);
    color: #2c607e;
    padding: 3px 7px;
    font-size: .78rem;
    font-style: normal;
    font-weight: 850;
    line-height: 1.15;
}

.group-union-actions {
    display: flex;
    justify-content: flex-end;
}

.line-assistant-band {
    border-color: rgba(18, 108, 67, .22);
}

.line-tabs-shell {
    padding: 0;
    overflow: hidden;
}

.line-tabs-shell > .split-heading {
    padding: 22px 24px 0;
}

.line-tab-content {
    padding: 18px 24px 24px;
}

.line-tab-form {
    display: grid;
    gap: 16px;
}

.line-assistant-grid {
    grid-template-columns: minmax(220px, 1.2fr) repeat(3, minmax(130px, .7fr));
}

.line-assistant-users {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.line-assistant-user {
    display: grid;
    gap: 10px;
    border: 1px solid rgba(18, 108, 67, .14);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 12px;
}

.line-assistant-user > strong {
    color: var(--lab-green);
}

.line-generated-service {
    display: grid;
    align-content: end;
    min-height: 70px;
    border: 1px solid rgba(18, 108, 67, .18);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(18, 108, 67, .12), rgba(242, 140, 40, .1)),
        #fbfcf8;
    padding: 10px 12px;
}

.line-generated-service span {
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 850;
    text-transform: uppercase;
}

.line-generated-service strong {
    color: var(--lab-green);
    font-size: 1.35rem;
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.line-generated-service small {
    color: var(--lab-muted);
    font-weight: 750;
    margin-top: 3px;
}

.line-credential-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    gap: 8px;
}

.line-credential-button {
    width: 42px;
    padding: 0;
    justify-content: center;
}

.line-user-picker {
    position: relative;
}

.line-user-suggestions {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 30;
    display: none;
    max-height: 230px;
    overflow: auto;
    border: 1px solid rgba(18, 108, 67, .22);
    border-radius: 8px;
    background: #fffffb;
    box-shadow: 0 16px 34px rgba(7, 18, 12, .14);
    padding: 6px;
}

.line-user-suggestions.open {
    display: grid;
    gap: 4px;
}

.line-user-suggestion {
    width: 100%;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--lab-ink);
    padding: 8px 10px;
    text-align: left;
}

.line-user-suggestion:hover,
.line-user-suggestion:focus {
    background: rgba(18, 108, 67, .08);
    outline: none;
}

.line-user-suggestion strong,
.line-user-suggestion small {
    display: block;
}

.line-user-suggestion small {
    margin-top: 2px;
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 750;
}

.line-create-url-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: start;
}

.line-generate-url-button {
    min-width: 190px;
    margin-top: 30px;
}

.line-create-grid {
    grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(180px, 1fr) minmax(150px, .7fr);
}

.line-duration-field,
.line-switch-field {
    display: grid;
    align-content: end;
    gap: 8px;
}

.line-duration-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.line-duration-button {
    min-width: 92px;
    justify-content: center;
}

.line-duration-button.active {
    background: rgba(18, 108, 67, .12);
    border-color: rgba(18, 108, 67, .38);
    color: var(--lab-green);
}

.catalog-admin-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
}

.catalog-service-form,
.catalog-group-form,
.catalog-service-card {
    display: grid;
    gap: 16px;
}

.stripe-catalog-price-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(160px, 240px);
    align-items: center;
    gap: 16px;
    border: 1px solid rgba(16, 127, 75, .24);
    border-radius: 8px;
    padding: 14px 16px;
    background:
        linear-gradient(90deg, rgba(16, 127, 75, .13), rgba(236, 250, 232, .42)),
        #f8fcf5;
}

.stripe-catalog-price-box span {
    display: block;
    color: var(--lab-green);
    font-weight: 900;
}

.stripe-catalog-price-box small {
    display: block;
    margin-top: 2px;
    color: var(--lab-muted);
    font-weight: 800;
}

.catalog-field-grid {
    grid-template-columns: repeat(5, minmax(120px, 1fr));
}

.catalog-service-fields {
    grid-template-columns: minmax(180px, 1.4fr) minmax(120px, .8fr) minmax(120px, .8fr) minmax(120px, .8fr);
}

.catalog-check-row {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    align-items: center;
}

.catalog-check-row .form-check {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-weight: 800;
}

.catalog-check-row .form-check-input {
    margin: 0;
}

.provider-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.provider-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid rgba(18, 108, 67, .2);
    border-radius: 999px;
    background: #fbfcf8;
    padding: 7px 10px;
    font-size: .88rem;
    font-weight: 800;
}

.provider-chip input {
    accent-color: var(--lab-green);
}

.service-catalog-list {
    display: grid;
    gap: 14px;
}

.catalog-service-card {
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 14px;
}

.catalog-service-details {
    display: block;
}

.catalog-service-details[open] {
    background: #ffffff;
}

.catalog-service-heading {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    cursor: pointer;
    list-style: none;
}

.catalog-service-heading::-webkit-details-marker {
    display: none;
}

.catalog-service-heading strong,
.catalog-service-heading small {
    display: block;
}

.catalog-service-heading small {
    color: var(--lab-muted);
    margin-top: 3px;
}

.catalog-service-summary-actions {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.catalog-service-summary-actions .bi-chevron-down {
    color: var(--lab-muted);
    transition: transform .18s ease;
}

.catalog-service-details[open] .catalog-service-summary-actions .bi-chevron-down {
    transform: rotate(180deg);
}

.catalog-service-edit-form {
    margin-top: 16px;
    border-top: 1px solid rgba(18, 108, 67, .12);
    padding-top: 16px;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(114, 126, 118, .12);
    color: var(--lab-muted);
    font-size: .82rem;
    font-weight: 850;
    white-space: nowrap;
}

.status-pill.ok {
    background: rgba(18, 108, 67, .12);
    color: var(--lab-green);
}

.status-pill.muted {
    background: rgba(151, 45, 45, .12);
    color: var(--lab-red);
}

.compact-admin-table {
    min-width: 620px;
}

.group-member-add-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 12px;
    margin-top: 14px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 12px;
}

.danger-action {
    border-color: rgba(155, 47, 45, .28);
    color: var(--lab-danger);
}

.inline-delete-form {
    margin: 0;
}

.danger-action:hover,
.danger-action:focus {
    border-color: rgba(155, 47, 45, .45);
    color: var(--lab-danger);
    background: rgba(155, 47, 45, .08);
}

.selected-row > * {
    background: rgba(18, 108, 67, .08) !important;
}

.group-renew-row > * {
    background: rgba(18, 108, 67, .105) !important;
    box-shadow: inset 4px 0 0 rgba(18, 108, 67, .68);
}

.group-renew-row .table-entity-link,
.group-renew-row .stacked-cell small {
    color: var(--lab-green);
}

.group-no-renew-row > * {
    background: rgba(155, 47, 45, .15) !important;
    box-shadow: inset 4px 0 0 rgba(155, 47, 45, .72);
}

.group-no-renew-row .table-entity-link,
.group-no-renew-row .stacked-cell small {
    color: var(--lab-danger);
}

.group-overcapacity-row > * {
    background: rgba(155, 47, 45, .16) !important;
}

.group-manual-full-row > * {
    background: rgba(226, 183, 65, .13) !important;
    box-shadow: inset 4px 0 0 rgba(226, 183, 65, .75);
}

.group-renew-row.selected-row > *,
.group-no-renew-row.selected-row > *,
.group-manual-full-row.selected-row > * {
    outline: 2px solid rgba(18, 108, 67, .22);
    outline-offset: -2px;
}

.attention-row > * {
    background: rgba(155, 47, 45, .08);
}

.inactive-member-row > * {
    background: #f4f6f3 !important;
    color: var(--lab-muted);
}

.code-textarea {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: .82rem;
}

.compact-form-actions {
    margin-bottom: 0;
}

.incident-filter-grid {
    grid-template-columns: minmax(280px, 1fr) auto;
}

.incident-workbench {
    border-top: 5px solid var(--lab-green);
}

.tab-counter {
    min-width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    padding: 0 7px;
    color: var(--lab-green);
    background: rgba(18, 108, 67, .1);
    font-size: .76rem;
    font-weight: 900;
}

.settings-tabs .nav-link.active .tab-counter {
    color: #fff;
    background: var(--lab-green);
}

.incident-card-list {
    display: grid;
    gap: 16px;
}

.incident-card {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 16px;
}

.incident-card-main {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 14px;
}

.incident-card-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
}

.incident-quick-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.incident-quick-meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    border: 1px solid rgba(18, 108, 67, .14);
    border-radius: 999px;
    background: rgba(18, 108, 67, .06);
    color: var(--lab-muted);
    padding: 5px 9px;
    font-size: .78rem;
    font-weight: 850;
    overflow-wrap: anywhere;
}

.incident-quick-meta i {
    color: var(--lab-green);
    font-size: .88rem;
}

.incident-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 8px;
}

.incident-detail-grid > div {
    min-width: 0;
    display: grid;
    gap: 3px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: var(--lab-paper);
    padding: 12px;
}

.incident-detail-grid span,
.incident-description span {
    color: var(--lab-muted);
    font-size: .75rem;
    font-weight: 850;
    text-transform: uppercase;
}

.incident-detail-grid strong,
.incident-detail-grid small {
    overflow-wrap: anywhere;
}

.incident-detail-grid small {
    color: var(--lab-muted);
    font-weight: 750;
}

.incident-users-panel {
    border: 1px solid rgba(18, 108, 67, .16);
    border-radius: 8px;
    background: linear-gradient(90deg, rgba(18, 108, 67, .08), rgba(255, 255, 255, .7));
    padding: 12px;
}

.incident-users-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.incident-users-heading span {
    color: var(--lab-muted);
    font-size: .75rem;
    font-weight: 850;
    text-transform: uppercase;
}

.incident-users-heading strong {
    color: var(--lab-green);
    font-size: .88rem;
}

.incident-user-list {
    display: grid;
    gap: 8px;
}

.incident-user-chip {
    display: grid;
    grid-template-columns: minmax(170px, .85fr) minmax(0, 1.4fr);
    gap: 10px;
    align-items: start;
    border: 1px solid rgba(18, 108, 67, .12);
    border-radius: 8px;
    background: rgba(255, 255, 255, .76);
    padding: 9px 10px;
}

.incident-user-chip a,
.incident-user-chip strong {
    color: var(--lab-ink);
    font-weight: 900;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.incident-user-chip a:hover {
    color: var(--lab-green);
    text-decoration: underline;
}

.incident-user-chip small {
    display: block;
    color: var(--lab-muted);
    font-weight: 750;
    overflow-wrap: anywhere;
}

.incident-user-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.incident-user-meta span {
    border-radius: 999px;
    background: rgba(18, 108, 67, .09);
    color: var(--lab-muted);
    padding: 3px 7px;
    font-size: .75rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.incident-description {
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: var(--lab-paper);
    padding: 12px;
}

.incident-description p {
    margin: 4px 0 0;
    color: var(--lab-ink);
    overflow-wrap: anywhere;
}

.incident-description-compact p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.incident-more-details {
    border: 1px solid rgba(18, 108, 67, .16);
    border-radius: 8px;
    background: rgba(18, 108, 67, .035);
    overflow: hidden;
}

.incident-more-details summary {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    list-style: none;
    color: var(--lab-green);
    font-weight: 900;
    padding: 12px 14px;
}

.incident-more-details summary::-webkit-details-marker {
    display: none;
}

.incident-more-details summary i {
    transition: transform .18s ease;
}

.incident-more-details[open] summary {
    border-bottom: 1px solid rgba(18, 108, 67, .12);
}

.incident-more-details[open] summary i {
    transform: rotate(180deg);
}

.incident-expanded-content {
    display: grid;
    gap: 14px;
    padding: 14px;
}

.incident-action-panel {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-content: start;
    border-top: 1px solid var(--lab-border);
    padding-top: 14px;
}

.incident-recovery-calculation {
    display: grid;
    gap: 3px;
    border: 1px solid rgba(155, 47, 45, .22);
    border-radius: 8px;
    background: rgba(155, 47, 45, .08);
    padding: 10px 12px;
}

.incident-recovery-calculation span {
    color: var(--lab-muted);
    font-size: .75rem;
    font-weight: 850;
    text-transform: uppercase;
}

.incident-recovery-calculation strong,
.incident-recovery-calculation b {
    color: var(--lab-danger);
}

.incident-recovery-calculation small {
    color: var(--lab-muted);
    font-weight: 750;
}

.incident-message-field,
.incident-action-submit {
    grid-column: 1 / -1;
}

.incident-action-submit {
    display: flex;
    justify-content: flex-end;
}

.service-incident-modal .modal-content {
    border: 1px solid var(--lab-border);
    border-radius: 8px;
}

.line-api-modal .modal-content {
    border: 1px solid var(--lab-border);
    border-radius: 8px;
}

.line-api-loading {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--lab-muted);
    font-weight: 850;
}

.line-api-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.line-api-info-item {
    display: grid;
    gap: 4px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 11px 12px;
}

.line-api-info-item span {
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 850;
    text-transform: uppercase;
}

.line-api-info-item strong {
    color: var(--lab-ink);
    overflow-wrap: anywhere;
}

.incident-modal-summary {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin-bottom: 12px;
}

.incident-modal-summary > div {
    display: grid;
    gap: 3px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 10px 12px;
}

.incident-modal-summary span {
    color: var(--lab-muted);
    font-size: .75rem;
    font-weight: 850;
    text-transform: uppercase;
}

.incident-modal-summary strong {
    overflow-wrap: anywhere;
}

.incident-reason-field {
    display: grid;
    gap: 6px;
    margin-top: 12px;
}

.credential-stack {
    min-width: 180px;
    display: grid;
    gap: 3px;
}

.credential-stack span,
.credential-stack small {
    overflow-wrap: anywhere;
}

.credential-stack small {
    color: var(--lab-muted);
}

.incident-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 28px;
    border-radius: 8px;
    padding: 4px 9px;
    font-size: .78rem;
    font-weight: 850;
    white-space: nowrap;
}

.incident-badge.allowed {
    color: var(--lab-green);
    background: rgba(18, 108, 67, .12);
}

.incident-badge.blocked {
    color: #8a5d00;
    background: rgba(226, 183, 65, .18);
}

.incident-badge.open {
    color: var(--lab-danger);
    background: rgba(155, 47, 45, .12);
}

.incident-status-dot {
    display: inline-block;
    width: .68rem;
    height: .68rem;
    flex: 0 0 .68rem;
    border-radius: 999px;
    background: #b3262e;
    box-shadow: 0 0 0 4px rgba(179, 38, 46, .13), 0 0 16px rgba(179, 38, 46, .38);
}

.service-incident-row > * {
    background: linear-gradient(90deg, rgba(179, 38, 46, .075), rgba(179, 38, 46, .025));
}

.service-incident-button {
    color: #8f1f27;
    border-color: rgba(179, 38, 46, .35);
    background: linear-gradient(135deg, rgba(255, 247, 247, .98), rgba(255, 255, 255, .96));
}

.service-incident-button:hover,
.service-open-incident-button:hover {
    color: #741820;
    border-color: rgba(179, 38, 46, .52);
    background: rgba(179, 38, 46, .08);
}

.service-open-incident-button {
    color: #8f1f27;
    border-color: rgba(179, 38, 46, .32);
    background: rgba(179, 38, 46, .055);
}

.service-open-incident-button .incident-status-dot {
    width: .58rem;
    height: .58rem;
    flex-basis: .58rem;
    box-shadow: 0 0 0 3px rgba(179, 38, 46, .12), 0 0 12px rgba(179, 38, 46, .35);
}

.incident-question-text {
    margin: -2px 0 8px;
    color: var(--lab-muted);
    font-size: .9rem;
    font-weight: 650;
}

.incident-badge.history {
    color: var(--lab-muted);
    background: rgba(104, 115, 109, .12);
}

.service-expired-row > * {
    color: var(--lab-muted);
    background: rgba(104, 115, 109, .08);
}

.service-expired-row .date-pill {
    color: var(--lab-muted);
    background: rgba(104, 115, 109, .1);
}

.service-expired-row .btn {
    opacity: .72;
}

.news-channel-expelled-row > * {
    background: linear-gradient(90deg, rgba(164, 47, 47, .14), rgba(255, 250, 247, .82) 60%, rgba(255, 255, 255, .92));
}

.news-channel-expelled-row > td:first-child {
    border-left: 4px solid #a42f2f;
}

.news-channel-expelled-pill,
.renewal-channel-reminder {
    width: fit-content;
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    padding: 3px 8px;
    color: #9a3b19;
    background: rgba(255, 189, 89, .2);
    font-size: .74rem;
    font-weight: 900;
    white-space: nowrap;
}

.renewal-channel-reminder {
    margin-top: 3px;
    color: #0b6f75;
    background: rgba(31, 154, 166, .13);
}

.needs-channel-invite > * {
    box-shadow: inset 4px 0 0 rgba(31, 154, 166, .38);
}

.inline-entity-actions {
    display: flex;
    align-items: center;
    gap: .45rem;
    flex-wrap: wrap;
}

.icon-copy-btn {
    width: 30px;
    min-width: 30px;
    justify-content: center;
    padding-inline: 0;
}

.btn-lab-warning-outline {
    border-color: rgba(154, 59, 25, .28);
    color: #9a3b19;
    background: rgba(255, 189, 89, .12);
}

.btn-lab-warning-outline:hover {
    border-color: rgba(154, 59, 25, .4);
    color: #7c2e13;
    background: rgba(255, 189, 89, .22);
}

.stacked-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .45rem;
}

.inline-action-form {
    display: inline-flex;
    margin: 0;
}

.line-delete-form {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .35rem;
    margin-top: .75rem;
    padding-top: .75rem;
    border-top: 1px solid var(--lab-border);
}

.group-line-attach-panel {
    margin-top: .85rem;
}

.settings-form {
    max-width: 980px;
}

.settings-form-wide {
    max-width: none;
}

.settings-shell {
    padding: 0;
    overflow: hidden;
}

.settings-tabs {
    gap: 4px;
    border-bottom: 1px solid var(--lab-border);
    padding: 12px 14px 0;
    background: #fbfcf8;
}

.settings-tabs .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border-radius: 8px 8px 0 0;
    color: var(--lab-muted);
    font-weight: 850;
}

.settings-tabs .nav-link.active {
    border-color: var(--lab-border) var(--lab-border) var(--lab-paper);
    color: var(--lab-green);
    background: var(--lab-paper);
}

.renewal-tabs {
    margin: 18px 0 0;
    border: 1px solid var(--lab-border);
    border-bottom: 0;
    border-radius: 8px 8px 0 0;
}

.settings-tab-content {
    padding: clamp(16px, 2vw, 22px);
}

.settings-wide-field {
    grid-column: 1 / -1;
}

.settings-table-wrap {
    max-height: min(620px, calc(100vh - 330px));
    overflow: auto;
}

.settings-table-wrap thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--lab-paper);
}

.settings-service-table {
    min-width: 1040px;
}

.settings-service-table td strong,
.settings-service-table td small {
    display: block;
}

.settings-service-table td small {
    color: var(--lab-muted);
}

.service-name-input {
    min-width: 180px;
}

.service-acronym-input {
    max-width: 120px;
    margin-top: 8px;
    text-transform: uppercase;
}

.service-number-input {
    max-width: 110px;
}

.service-notes-cell {
    min-width: 260px;
}

.service-notes-cell textarea + textarea {
    margin-top: 8px;
}

.danger-switch {
    color: var(--lab-red);
}

.settings-note {
    display: block;
    margin-top: 3px;
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 750;
}

.settings-switch {
    min-height: 34px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    font-weight: 750;
}

.settings-switch .form-check-input {
    margin: 0;
}

.settings-switch.is-disabled {
    cursor: not-allowed;
    opacity: .72;
}

.settings-switch.is-disabled .form-check-input,
.settings-switch.is-disabled span {
    cursor: not-allowed;
}

.settings-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 0;
    border: 1px solid rgba(18, 108, 67, .16);
    border-radius: 8px;
    padding: 12px 14px;
    background: rgba(231, 241, 234, .42);
    cursor: pointer;
}

.settings-toggle span,
.settings-toggle small {
    display: block;
}

.settings-toggle strong {
    color: var(--lab-ink);
}

.settings-toggle small {
    margin-top: 2px;
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 750;
}

.settings-toggle input {
    flex: 0 0 auto;
    width: 38px;
    height: 22px;
    accent-color: var(--lab-green);
}

.lab-switch {
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.lab-switch .form-check-input {
    width: 3.2rem;
    height: 1.7rem;
}

.lab-switch .form-check-input:checked {
    border-color: var(--lab-green);
    background-color: var(--lab-green);
}

.settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.settings-test-row {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) auto;
    gap: 12px;
    align-items: end;
    padding: 14px;
    border: 1px solid rgba(18, 108, 67, .14);
    border-radius: 8px;
    background: #fbfcf8;
}

.stripe-settings-panel {
    display: grid;
    gap: 16px;
    margin-bottom: 20px;
    border: 1px solid rgba(18, 108, 67, .18);
    border-left: 5px solid #6c7971;
    border-radius: 8px;
    padding: 16px;
    background: #fbfcf8;
}

.stripe-settings-panel.is-enabled {
    border-left-color: var(--lab-green);
    background: linear-gradient(90deg, rgba(18, 108, 67, .1), #fbfcf8 40%);
}

.stripe-settings-heading {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
}

.stripe-settings-heading h2,
.stripe-settings-heading span {
    display: block;
}

.stripe-settings-heading h2 {
    margin: 0 0 4px;
    font-size: 1.15rem;
}

.stripe-settings-heading > div > span {
    color: var(--lab-muted);
    font-size: .86rem;
    font-weight: 750;
}

.stripe-toggle {
    min-width: 140px;
    justify-content: center;
}

.stripe-webhook-box {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 10px 12px;
    color: var(--lab-muted);
    background: var(--lab-paper);
    font-size: .82rem;
    font-weight: 850;
}

.stripe-webhook-box code {
    color: var(--lab-green);
    white-space: normal;
    word-break: break-all;
}

.stripe-payment-blocked {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    border: 1px solid rgba(164, 47, 47, .22);
    border-radius: 8px;
    padding: 6px 10px;
    color: #8a332f;
    background: rgba(255, 242, 238, .9);
    font-size: .82rem;
    font-weight: 900;
}

.notification-event-panel {
    margin-bottom: 18px;
    padding: 14px;
    border: 1px solid rgba(18, 108, 67, .14);
    border-radius: 8px;
    background: #fbfcf8;
}

.notification-event-table {
    min-width: 980px;
}

.notification-event-table td:nth-child(4),
.notification-event-table td:nth-child(5) {
    width: 130px;
}

.notification-event-name {
    display: grid;
    gap: 3px;
}

.notification-event-name small {
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 750;
}

.renewal-notification-panel {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    margin-top: 18px;
    padding: 14px 16px;
    border: 1px solid rgba(18, 108, 67, .16);
    border-radius: 8px;
    background: #fbfcf8;
}

.renewal-notification-panel strong,
.renewal-notification-panel small {
    display: block;
}

.renewal-notification-panel small {
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 750;
}

.renewal-dependent-alert {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    border: 1px solid rgba(164, 47, 47, .22);
    border-radius: 8px;
    padding: 12px 14px;
    background: linear-gradient(90deg, rgba(164, 47, 47, .12), rgba(255, 247, 241, .84) 62%, rgba(255, 255, 255, .9));
    color: #7e2a2a;
}

.renewal-dependent-alert i {
    flex: 0 0 auto;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 8px;
    background: rgba(164, 47, 47, .12);
    font-size: 1.25rem;
}

.renewal-dependent-alert strong,
.renewal-dependent-alert span {
    display: block;
}

.renewal-dependent-alert strong {
    font-size: .9rem;
    font-weight: 900;
}

.renewal-dependent-alert span {
    color: #875050;
    font-size: .82rem;
    font-weight: 800;
}

.renewal-channel-alert {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    border: 1px solid rgba(31, 154, 166, .24);
    border-radius: 8px;
    padding: 12px 14px;
    background: linear-gradient(90deg, rgba(31, 154, 166, .13), rgba(232, 249, 247, .8) 58%, rgba(255, 255, 255, .9));
    color: #0b6f75;
}

.renewal-channel-alert i {
    flex: 0 0 auto;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 8px;
    background: rgba(31, 154, 166, .14);
    font-size: 1.25rem;
}

.renewal-channel-alert strong,
.renewal-channel-alert span {
    display: block;
}

.renewal-channel-alert strong {
    font-size: .9rem;
    font-weight: 900;
}

.renewal-channel-alert span {
    color: #2e777b;
    font-size: .82rem;
    font-weight: 800;
}

.api-field-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.api-field-option {
    min-height: 44px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 9px 10px;
}

.api-result-panel {
    margin-top: 18px;
    border: 1px solid rgba(18, 108, 67, .18);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 16px;
}

.api-diagnostics {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

.api-response-preview {
    display: grid;
    gap: 6px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: var(--lab-paper);
    padding: 11px 12px;
}

.api-response-preview span {
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 850;
    text-transform: uppercase;
}

.api-response-preview pre {
    max-height: 180px;
    margin: 0;
    overflow: auto;
    border-radius: 8px;
    padding: 10px;
    color: #f3f0df;
    background: #0d1711;
    font-size: .82rem;
    white-space: pre-wrap;
}

.telegram-config-grid {
    display: grid;
    gap: 16px;
}

.telegram-config-box {
    position: relative;
    border: 1px solid rgba(18, 108, 67, .16);
    border-radius: 8px;
    padding: 16px;
    background: #fbfcf8;
}

.telegram-config-test {
    overflow: hidden;
    border-color: rgba(176, 108, 20, .36);
    background:
        linear-gradient(90deg, rgba(255, 197, 89, .18), rgba(255, 250, 235, .92) 44%, #fbfcf8),
        #fbfcf8;
}

.telegram-test-ribbon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    border: 1px solid rgba(176, 108, 20, .28);
    border-radius: 999px;
    padding: 7px 11px;
    color: #7d4d0c;
    background: rgba(255, 232, 184, .9);
    font-size: .78rem;
    font-weight: 950;
    text-transform: uppercase;
}

.telegram-config-test::after {
    content: "TEST";
    position: absolute;
    top: 18px;
    right: 18px;
    color: rgba(176, 108, 20, .11);
    font-size: clamp(2.2rem, 7vw, 5rem);
    font-weight: 950;
    line-height: 1;
    pointer-events: none;
}

.telegram-console {
    margin-top: 22px;
    border: 1px solid rgba(18, 108, 67, .18);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 16px;
}

.telegram-webhook-note {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 12px 0;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 10px 12px;
    color: var(--lab-muted);
    background: var(--lab-paper);
    font-size: .82rem;
    font-weight: 850;
}

.telegram-webhook-note code {
    color: var(--lab-green);
    white-space: normal;
    word-break: break-all;
}

.telegram-webhook-note-test {
    border-color: rgba(176, 108, 20, .28);
    background: rgba(255, 246, 225, .86);
}

.telegram-webhook-note-test code {
    color: #87540d;
}

.telegram-console-list {
    display: grid;
    gap: 10px;
    max-height: 430px;
    overflow: auto;
    border-radius: 8px;
    background: #0d1711;
    padding: 12px;
}

.telegram-console-row {
    border: 1px solid rgba(222, 231, 212, .16);
    border-radius: 8px;
    background: rgba(255, 255, 255, .04);
    color: #f3f0df;
    padding: 12px;
}

.telegram-console-row.incoming {
    border-color: rgba(231, 255, 113, .32);
}

.telegram-console-row.outgoing {
    border-color: rgba(143, 214, 198, .28);
}

.telegram-console-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
    color: rgba(243, 240, 223, .62);
    font-size: .76rem;
    font-weight: 850;
}

.telegram-direction,
.telegram-status {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    border-radius: 7px;
    padding: 3px 8px;
    background: rgba(255, 255, 255, .08);
}

.telegram-status.sent,
.telegram-status.received {
    color: #e7ff71;
    background: rgba(231, 255, 113, .12);
}

.telegram-status.error {
    color: #ffb09c;
    background: rgba(155, 47, 45, .28);
}

.telegram-console-body {
    display: grid;
    gap: 8px;
}

.telegram-console-body strong,
.telegram-console-body small {
    display: block;
}

.telegram-console-body small {
    color: rgba(243, 240, 223, .62);
}

.telegram-console-body pre {
    max-height: 160px;
    margin: 0;
    overflow: auto;
    border-radius: 8px;
    padding: 10px;
    color: #f3f0df;
    background: rgba(0, 0, 0, .24);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: .82rem;
    line-height: 1.45;
    white-space: pre-wrap;
}

.telegram-detail {
    color: #e7ff71 !important;
}

.template-workbench {
    display: grid;
    grid-template-columns: minmax(210px, .35fr) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.template-selector {
    min-width: 0;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 10px;
}

.template-list {
    display: grid;
    gap: 8px;
}

.template-channel-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    margin-bottom: 10px;
}

.template-channel-tabs button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 8px;
    color: var(--lab-muted);
    background: var(--lab-paper);
    font-weight: 850;
}

.template-channel-tabs button.active {
    border-color: var(--lab-green);
    color: var(--lab-green);
    background: #eef8ef;
}

.template-list-item {
    width: 100%;
    min-height: 68px;
    display: grid;
    gap: 3px;
    border: 1px solid transparent;
    border-radius: 8px;
    padding: 10px;
    text-align: left;
    color: var(--lab-ink);
    background: var(--lab-paper);
}

.template-list-item strong,
.template-list-item small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.template-list-item small {
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 750;
}

.template-list-item:hover,
.template-list-item:focus,
.template-list-item.active {
    border-color: var(--lab-green);
    color: var(--lab-green);
}

.template-editor {
    min-width: 0;
    display: grid;
    gap: 16px;
}

.template-format-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

.template-format-button {
    width: 36px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(18, 108, 67, .22);
    border-radius: 8px;
    background: #fbfcf8;
    color: var(--lab-green);
}

.template-format-button:hover,
.template-format-button:focus {
    border-color: var(--lab-green);
    background: rgba(18, 108, 67, .08);
}

.template-html-editor {
    min-height: 260px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: .9rem;
}

.template-variable-panel {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 8px;
}

.template-variable {
    min-height: 52px;
    display: grid;
    gap: 2px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 8px 10px;
    text-align: left;
    background: #fbfcf8;
}

.template-variable:hover,
.template-variable:focus {
    border-color: var(--lab-green);
}

.template-variable code {
    color: var(--lab-green);
    font-weight: 900;
}

.template-variable span {
    color: var(--lab-muted);
    font-size: .75rem;
    font-weight: 750;
}

.template-preview-shell {
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    overflow: hidden;
    background: var(--lab-paper);
}

.template-preview-heading {
    display: grid;
    gap: 3px;
    border-bottom: 1px solid var(--lab-border);
    padding: 10px 12px;
    background: #fbfcf8;
}

.template-preview-heading span {
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 850;
    text-transform: uppercase;
}

.template-preview-heading strong {
    overflow-wrap: anywhere;
}

.template-preview-body {
    min-height: 180px;
    padding: 16px;
    overflow-wrap: anywhere;
}

.template-preview-frame {
    width: 100%;
    height: min(560px, 65vh);
    display: block;
    border: 0;
    padding: 0;
    background: var(--lab-paper);
}

.settings-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    border: 1px solid rgba(18, 108, 67, .18);
    border-radius: 8px;
    padding: 6px 10px;
    color: var(--lab-green);
    background: #eef8ef;
    font-size: .82rem;
    font-weight: 900;
}

.automation-grid,
.automation-preview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

.automation-card {
    min-width: 0;
    border: 1px solid rgba(18, 108, 67, .16);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 16px;
}

.automation-card + .automation-card,
.automation-preview-grid,
.automation-test-card {
    margin-top: 16px;
}

.automation-channel-row {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    min-height: 44px;
}

.cron-command {
    display: block;
    border: 1px solid rgba(18, 108, 67, .18);
    border-radius: 8px;
    padding: 11px 12px;
    color: #f3f0df;
    background: #0d1711;
    overflow-x: auto;
    white-space: nowrap;
}

.settings-json-preview {
    max-height: 180px;
    margin: 10px 0 0;
    border: 1px solid rgba(18, 108, 67, .14);
    border-radius: 8px;
    padding: 12px;
    color: #26362f;
    background: rgba(239, 246, 235, .72);
    font-size: .82rem;
    line-height: 1.45;
    overflow: auto;
    white-space: pre;
}

.automation-preview-frame {
    width: 100%;
    height: 340px;
    display: block;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: var(--lab-paper);
}

.automation-telegram-preview,
.automation-last-result pre {
    min-height: 180px;
    max-height: 340px;
    margin: 0;
    overflow: auto;
    border: 1px solid rgba(222, 231, 212, .16);
    border-radius: 8px;
    padding: 12px;
    color: #f3f0df;
    background: #0d1711;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: .86rem;
    line-height: 1.45;
    white-space: pre-wrap;
}

.automation-variable-cloud {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 8px;
}

.automation-variable-cloud span {
    min-height: 44px;
    display: grid;
    gap: 2px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 8px 10px;
    color: var(--lab-muted);
    background: var(--lab-paper);
    font-size: .76rem;
    font-weight: 750;
}

.automation-variable-cloud code {
    color: var(--lab-green);
    font-size: .82rem;
    font-weight: 900;
}

.automation-last-result {
    margin-top: 16px;
}

.filters-grid {
    display: grid;
    grid-template-columns: minmax(150px, .7fr) repeat(3, minmax(150px, 1fr));
    gap: 14px;
    align-items: end;
}

.filter-search {
    grid-column: span 2;
}

.filter-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.filter-help {
    margin: 14px 0 0;
    color: var(--lab-muted);
    font-size: .88rem;
    font-weight: 700;
}

.split-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.result-count {
    color: var(--lab-muted);
    font-size: .9rem;
    font-weight: 800;
}

.notes-tabs-band {
    padding-bottom: 0;
}

.notes-tabs-band .settings-tabs {
    margin-bottom: -1px;
}

.note-create-grid,
.note-edit-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    align-items: end;
}

.note-text-field,
.note-action-field {
    grid-column: span 2;
}

.note-form-actions {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
}

.note-filter-grid {
    grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.notes-table-scroll {
    max-height: 620px;
    overflow: auto;
}

.notes-table {
    min-width: 1120px;
}

.notes-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--lab-paper);
}

.note-level-badge {
    display: inline-flex;
    min-width: 118px;
    justify-content: center;
    border: 1px solid rgba(15, 32, 27, .14);
    border-radius: 6px;
    padding: 8px 10px;
    font-weight: 900;
}

.note-row-due {
    background: rgba(255, 216, 0, .08);
}

.notes-actions-cell {
    min-width: 170px;
    white-space: nowrap;
}

.note-edit-row td {
    background: #fbfcf8;
}

.note-level-list {
    display: grid;
    gap: 12px;
}

.note-level-card {
    display: grid;
    grid-template-columns: minmax(140px, .8fr) minmax(220px, 1.4fr) auto auto minmax(130px, .7fr) auto;
    gap: 12px;
    align-items: end;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    padding: 14px;
    background: #fbfcf8;
}

.note-level-preview {
    min-height: 48px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(15, 32, 27, .14);
    border-radius: 6px;
    padding: 8px 10px;
    font-weight: 950;
}

.note-level-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.note-reminder-modal .modal-content {
    border: 1px solid rgba(18, 108, 67, .18);
    border-radius: 8px;
}

.note-reminder-list {
    display: grid;
    gap: 12px;
}

.note-reminder-card {
    border: 1px solid rgba(15, 32, 27, .14);
    border-left: 8px solid var(--note-color);
    border-radius: 8px;
    padding: 14px;
    background: color-mix(in srgb, var(--note-bg) 35%, #fff);
}

.note-reminder-card p {
    margin: 10px 0;
    font-weight: 700;
}

.note-reminder-card small,
.note-reminder-card em {
    display: block;
    color: var(--lab-muted);
    font-style: normal;
    font-weight: 750;
}

.note-reminder-meta {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: var(--note-color);
    font-weight: 950;
    text-transform: uppercase;
}

.renovation-table {
    min-width: 1120px;
}

.renewal-service-cell {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-width: 210px;
}

.renewal-service-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 8px;
    color: var(--renewal-accent, #126c43);
    background: linear-gradient(90deg, var(--renewal-glow, rgba(18, 108, 67, .22)), rgba(255, 255, 255, 0));
    font-size: 1.35rem;
}

.renovation-table tbody tr[class*="renewal-service-"] > td:first-child {
    box-shadow: inset 7px 0 0 var(--renewal-accent, rgba(18, 108, 67, .45));
}

.renovation-table tbody tr.renewal-service-disney {
    --renewal-accent: #285caa;
    --renewal-glow: rgba(40, 92, 170, .22);
}

.renovation-table tbody tr.renewal-service-spotify {
    --renewal-accent: #1f8f55;
    --renewal-glow: rgba(31, 143, 85, .24);
}

.renovation-table tbody tr.renewal-service-youtube {
    --renewal-accent: #c92f2b;
    --renewal-glow: rgba(201, 47, 43, .22);
}

.renovation-table tbody tr.renewal-service-max {
    --renewal-accent: #3367d6;
    --renewal-glow: rgba(51, 103, 214, .22);
}

.renovation-table tbody tr.renewal-service-netflix {
    --renewal-accent: #a5282c;
    --renewal-glow: rgba(165, 40, 44, .22);
}

.renovation-table tbody tr.renewal-service-plex {
    --renewal-accent: #b97816;
    --renewal-glow: rgba(185, 120, 22, .23);
}

.renovation-table tbody tr.renewal-service-dazn {
    --renewal-accent: #4d5b55;
    --renewal-glow: rgba(77, 91, 85, .22);
}

.renovation-table tbody tr.renewal-service-tv {
    --renewal-accent: #5b6488;
    --renewal-glow: rgba(91, 100, 136, .22);
}

.table-scroll {
    max-height: min(620px, calc(100vh - 330px));
    overflow: auto;
}

.log-filter-grid {
    grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.log-table-scroll {
    max-height: min(680px, calc(100vh - 320px));
    overflow: auto;
}

.log-table {
    min-width: 1180px;
}

.logs-tabs-band {
    padding-bottom: 0;
}

.system-log-controls {
    grid-template-columns: minmax(140px, 180px) auto;
    align-items: end;
}

.system-log-meta {
    display: grid;
    gap: 4px;
    margin: 18px 0 12px;
    color: var(--lab-muted);
    font-weight: 850;
}

.system-log-meta strong {
    color: var(--lab-ink);
    overflow-wrap: anywhere;
}

.system-log-view {
    max-height: min(700px, calc(100vh - 330px));
    overflow: auto;
    margin: 0;
    border: 1px solid rgba(15, 32, 27, .16);
    border-radius: 8px;
    padding: 16px;
    background: #07140f;
    color: #dff7d0;
    font-size: .82rem;
    line-height: 1.55;
    white-space: pre-wrap;
}

.log-date-cell {
    white-space: nowrap;
}

.log-action-badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    border-radius: 999px;
    padding: 4px 9px;
    color: var(--lab-green);
    background: rgba(18, 108, 67, .1);
    font-size: .78rem;
    font-weight: 900;
    white-space: nowrap;
}

.table-scroll thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--lab-paper);
}

.renovation-table tbody tr.renovation-due-today > * {
    background: rgba(155, 47, 45, .13);
}

.renovation-table tbody tr.renovation-due-soon > * {
    background: rgba(155, 47, 45, .06);
}

.renovation-table tbody tr.renovation-due-later > * {
    background: rgba(155, 47, 45, .035);
}

.renovation-table tbody tr.renovation-expired > * {
    background: rgba(155, 47, 45, .18);
}

.renovation-table tbody tr.renovation-muted > * {
    background: rgba(104, 115, 109, .07);
}

.user-detail-table tbody tr.user-group-no-renew > * {
    color: #6e1717;
    background: rgba(155, 47, 45, .16);
}

.user-detail-table tbody tr.user-group-no-renew .date-pill {
    color: #6e1717;
    background: rgba(155, 47, 45, .14);
}

.user-detail-table tbody tr.user-group-incident-open > * {
    background: linear-gradient(90deg, rgba(155, 47, 45, .13), rgba(255, 255, 255, .82));
    box-shadow: inset 4px 0 0 rgba(155, 47, 45, .72);
}

.user-group-incident-link {
    margin-top: 8px;
    width: fit-content;
    text-decoration: none;
}

.renovation-table tbody tr.renovation-initial-purchase > * {
    background: linear-gradient(90deg, rgba(226, 183, 65, .16), rgba(18, 108, 67, .06));
}

.renewal-completed-table tbody tr.completed-renewal-row {
    background: linear-gradient(90deg, rgba(31, 95, 132, .07), rgba(255, 255, 255, .72));
}

.renewal-completed-table tbody tr.completed-new-purchase-row {
    background: linear-gradient(90deg, rgba(124, 58, 237, .1), rgba(18, 108, 67, .06));
}

.renewal-completed-table tbody tr.completed-renewal-row > *,
.renewal-completed-table tbody tr.completed-new-purchase-row > * {
    background: transparent;
}

.renewal-completed-table tbody tr.completed-new-purchase-row td:first-child {
    box-shadow: inset 4px 0 0 rgba(124, 58, 237, .56);
}

.renewal-start-highlight {
    position: relative;
    display: inline-block;
    isolation: isolate;
    color: var(--lab-ink);
    font-weight: 950;
}

.renewal-start-highlight::after {
    content: "";
    position: absolute;
    left: -2px;
    right: -2px;
    bottom: .08em;
    z-index: -1;
    height: .42em;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(196, 255, 54, .88), rgba(71, 214, 130, .48), rgba(255, 255, 255, 0));
    transform: rotate(-1.2deg);
}

.status-badge,
.date-pill {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    border-radius: 8px;
    padding: 4px 9px;
    font-size: .8rem;
    font-weight: 850;
    white-space: nowrap;
}

.status-badge.open {
    color: var(--lab-green);
    background: rgba(18, 108, 67, .12);
}

.status-badge.expired {
    color: var(--lab-danger);
    background: rgba(155, 47, 45, .12);
}

.status-badge.blocked {
    color: #8a5d00;
    background: rgba(226, 183, 65, .18);
}

.date-pill {
    color: var(--lab-ink);
    background: var(--lab-panel);
}

.stacked-cell {
    display: grid;
    gap: 2px;
}

td.stacked-cell {
    display: table-cell;
}

td.stacked-cell > strong,
td.stacked-cell > small {
    display: block;
}

td.stacked-cell > small {
    margin-top: 4px;
}

.stacked-cell small {
    color: var(--lab-muted);
    font-size: .78rem;
}

.service-copy-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.copy-btn {
    min-height: 28px;
    padding: 3px 8px;
    font-size: .76rem;
}

.shared-pill {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid rgba(18, 108, 67, .2);
    border-radius: 999px;
    padding: 3px 8px;
    color: var(--lab-green);
    background: rgba(18, 108, 67, .08);
    font-size: .74rem;
    font-weight: 850;
    white-space: nowrap;
}

.shared-pill-compact {
    max-width: min(100%, 360px);
}

.shared-pill-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.telegram-id-pill {
    width: fit-content;
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    margin-top: 3px;
    border-radius: 999px;
    padding: 2px 7px;
    color: #23709a;
    background: rgba(35, 112, 154, .1);
    font-size: .72rem;
    font-weight: 850;
}

.telegram-id-pill.is-disabled {
    color: #7a8580;
    background: rgba(122, 133, 128, .12);
    text-decoration: line-through;
    opacity: .75;
}

.dependent-user-pill {
    width: fit-content;
    max-width: 100%;
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    margin-top: 3px;
    border: 1px solid rgba(164, 47, 47, .24);
    border-radius: 999px;
    padding: 3px 8px;
    color: #8f2f2f;
    background: linear-gradient(90deg, rgba(164, 47, 47, .13), rgba(255, 255, 255, .65));
    font-size: .72rem;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.service-brand-badge {
    width: fit-content;
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    padding: 6px 11px;
    color: var(--lab-ink);
    background: var(--lab-panel);
}

.service-brand-badge i {
    font-size: 1rem;
}

.service-brand-disney { color: #113e88; background: rgba(42, 110, 204, .12); }
.service-brand-spotify { color: #116c34; background: rgba(30, 185, 84, .14); }
.service-brand-youtube { color: #a71f1f; background: rgba(210, 36, 36, .12); }
.service-brand-max { color: #21426e; background: rgba(65, 118, 196, .13); }
.service-brand-netflix { color: #9c1f1f; background: rgba(192, 40, 40, .12); }
.service-brand-dazn { color: #334118; background: rgba(160, 188, 64, .18); }
.service-brand-prime { color: #0a6388; background: rgba(35, 148, 195, .13); }
.service-brand-tv { color: #285042; background: rgba(18, 108, 67, .12); }

.credit-value {
    font-weight: 850;
    white-space: nowrap;
}

.credit-value.ok {
    color: var(--lab-green);
}

.credit-value.warning {
    color: #a36d00;
}

.credit-value.danger {
    color: var(--lab-danger);
}

.notes-cell {
    max-width: 260px;
    color: var(--lab-muted);
}

.truncate-note {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.table-entity-link {
    color: var(--lab-ink);
    font-weight: 900;
    text-decoration: none;
}

.table-entity-link:hover,
.table-entity-link:focus {
    color: var(--lab-green);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.payment-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 22px;
    align-items: start;
}

.detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.detail-grid > div,
.charge-panel {
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 14px;
}

.detail-grid span {
    display: block;
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.detail-grid strong {
    display: block;
    margin-top: 4px;
}

.renewal-layout {
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 420px);
}

.renewal-panel {
    position: sticky;
    top: calc(var(--topbar-height) + 18px);
}

.renewal-screen {
    padding: 0;
    overflow: hidden;
}

.renewal-summary-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-bottom: 1px solid var(--lab-border);
    background: #fbfcf8;
}

.renewal-summary-strip > div {
    min-width: 0;
    padding: 16px 18px;
    border-right: 1px solid var(--lab-border);
}

.renewal-summary-strip > div:last-child {
    border-right: 0;
}

.renewal-summary-strip span,
.renewal-result-grid span,
.renewal-line-context span,
.provider-note span {
    display: block;
    color: var(--lab-muted);
    font-size: .76rem;
    font-weight: 850;
    text-transform: uppercase;
}

.renewal-summary-strip strong,
.renewal-result-grid strong,
.renewal-line-context strong,
.provider-note strong {
    display: block;
    margin-top: 3px;
    overflow-wrap: anywhere;
}

.renewal-summary-strip small,
.renewal-result-grid small,
.renewal-line-context small,
.shared-purchase-panel small {
    display: block;
    margin-top: 2px;
    color: var(--lab-muted);
    font-size: .82rem;
    overflow-wrap: anywhere;
}

.shared-purchase-panel {
    display: grid;
    grid-template-columns: minmax(180px, .8fr) minmax(0, 1.2fr) minmax(0, 1.2fr);
    gap: 0;
    border-bottom: 1px solid var(--lab-border);
    background: rgba(226, 183, 65, .08);
}

.shared-purchase-panel > div {
    min-width: 0;
    padding: 14px 18px;
    border-right: 1px solid rgba(226, 183, 65, .28);
}

.shared-purchase-panel > div:last-child {
    border-right: 0;
}

.shared-purchase-panel span {
    display: block;
    color: #8a5d00;
    font-size: .76rem;
    font-weight: 850;
    text-transform: uppercase;
}

.shared-purchase-panel strong {
    display: block;
    margin-top: 3px;
    overflow-wrap: anywhere;
}

.renewal-line-context {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-bottom: 1px solid var(--lab-border);
    background: linear-gradient(135deg, rgba(16, 121, 76, .08), rgba(226, 183, 65, .08));
}

.renewal-line-context > div {
    min-width: 0;
    padding: 14px 18px;
    border-right: 1px solid rgba(18, 92, 62, .14);
}

.renewal-line-context > div:last-child {
    border-right: 0;
}

.renewal-form {
    padding: clamp(16px, 2vw, 22px);
}

.renewal-form-grid {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    gap: 24px;
}

.renewal-form-section h2 {
    margin: 0 0 14px;
    font-size: 1rem;
    font-weight: 850;
}

.renewal-fields,
.credentials-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.renewal-admin-notes {
    grid-column: 1 / -1;
    margin-top: 12px;
}

.renewal-admin-notes textarea {
    min-height: 108px;
    resize: vertical;
}

.provider-note {
    min-height: 38px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.credentials-fields {
    display: grid;
    gap: 12px;
}

.credentials-compare {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 12px;
}

.current-credentials,
.generated-credentials {
    display: grid;
    gap: 3px;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    background: #fbfcf8;
    padding: 14px;
}

.generated-credentials {
    border-color: rgba(18, 108, 67, .28);
    background: rgba(18, 108, 67, .06);
}

.current-credentials span,
.generated-credentials span {
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.current-credentials small,
.generated-credentials small {
    color: var(--lab-muted);
    overflow-wrap: anywhere;
}

.credential-actions,
.renewal-submit-row,
.result-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 16px;
    flex-wrap: wrap;
}

.renewal-result-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    border: 1px solid var(--lab-border);
    border-radius: 8px;
    overflow: hidden;
}

.renewal-result-grid > div {
    min-width: 0;
    padding: 16px;
    border-right: 1px solid var(--lab-border);
    background: #fbfcf8;
}

.renewal-result-grid > div:last-child {
    border-right: 0;
}

.renewal-members-section {
    margin-top: 24px;
}

.group-renewal-table th,
.group-renewal-table td {
    vertical-align: middle;
}

.group-renewal-table .stacked-cell {
    min-width: 190px;
}

.group-renewal-table tr.dependent-renewal-row > td:first-child {
    box-shadow: inset 4px 0 0 rgba(164, 47, 47, .42);
}

.renewal-member-charge {
    min-width: 150px;
}

.renewal-member-charge .form-control {
    font-weight: 850;
}

.renewal-tax-check {
    align-items: center;
    display: flex;
    gap: 8px;
    margin: 0;
    min-width: 150px;
}

.renewal-tax-check span {
    font-weight: 850;
}

.renewal-result-members {
    margin-top: 16px;
}

.renewal-result-members small {
    display: block;
    color: var(--lab-muted);
    max-width: 320px;
    overflow-wrap: anywhere;
}

.renewal-members-cell small {
    max-width: 360px;
}

.renewal-member-balance-list {
    display: grid;
    gap: 4px;
    margin-top: 4px;
}

.renewal-member-balance-list span {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.renewal-member-balance-list b {
    color: var(--lab-muted);
    font-weight: 800;
}

.renewal-member-balance-list em {
    font-style: normal;
    font-weight: 900;
}

.renewal-member-balance-list em.ok {
    color: var(--lab-green);
}

.renewal-member-balance-list em.danger {
    color: var(--lab-danger);
}

.renewal-blocked-reasons {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 4px;
}

.renewal-blocked-reasons span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
    border-radius: 999px;
    padding: 4px 8px;
    color: #7b2626;
    background: rgba(155, 47, 45, .1);
    font-size: .72rem;
    font-weight: 850;
}

.renewal-credit-hint {
    display: block;
    margin-top: 4px;
    color: var(--lab-muted);
    font-size: .78rem;
    font-weight: 750;
    white-space: nowrap;
}

.field-label-action {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: space-between;
    margin-bottom: 6px;
}

.field-label-action .form-label {
    margin-bottom: 0;
}

.icon-only-btn {
    align-items: center;
    aspect-ratio: 1;
    display: inline-flex;
    justify-content: center;
    min-height: 34px;
    padding: 0;
    width: 36px;
}

.form-actions {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 32px;
}

.sidebar-backdrop {
    display: none;
}

@media (max-width: 991.98px) {
    .sidebar-collapsed {
        --sidebar-width: 264px;
    }

    .sidebar-collapse-toggle {
        display: none;
    }

    .auth-stage {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 22px;
        padding: 34px 24px 72px;
    }

    .auth-brand {
        min-height: 300px;
    }

    .auth-brand-lockup {
        left: 0;
        top: 42%;
    }

    .auth-brand h1 {
        font-size: 4rem;
    }

    .auth-panel {
        max-width: 440px;
    }

    .auth-circuit {
        left: 48%;
        top: 68%;
        opacity: .72;
        transform: translate(-10%, -50%) scale(.82);
        transform-origin: left center;
    }

    .crystal-cluster {
        left: -52px;
        bottom: -72px;
        transform: scale(.62);
        transform-origin: left bottom;
    }

    .auth-code-b,
    .auth-code-c,
    .formula-c,
    .formula-d {
        display: none;
    }

    .axo-sidebar {
        transform: translateX(-100%);
        transition: transform .2s ease;
    }

    .sidebar-open .axo-sidebar {
        transform: translateX(0);
    }

    .sidebar-open .sidebar-backdrop {
        display: block;
        position: fixed;
        inset: var(--topbar-height) 0 0 0;
        background: rgba(16, 23, 20, .38);
        z-index: 1010;
    }

    .app-shell-user.sidebar-open .sidebar-backdrop {
        inset: var(--topbar-height) 0 0 0;
    }

    .app-main {
        margin-left: 0;
    }

    .app-footer-main {
        left: 0;
    }

    .topbar-user {
        align-items: stretch;
        margin-top: 10px;
    }

    .topbar-credential-search {
        width: 100%;
        max-width: 520px;
    }

    .topbar-payment-counters {
        max-width: 100%;
        padding-bottom: 2px;
    }

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

    .two-columns,
    .user-profile-card,
    .consulta-grid,
    .catalog-admin-grid,
    .group-edit-layout,
    .group-admin-actions,
    .group-dashboard-strip,
    .group-list-filter,
    .group-union-filter,
    .group-union-layout,
    .user-detail-grid,
    .payment-layout,
    .renewal-form-grid,
    .renewal-result-grid,
    .settings-grid,
    .group-create-grid,
    .line-create-url-row,
    .line-create-grid,
    .line-assistant-grid,
    .line-assistant-users,
    .filters-grid,
    .expense-detail-grid,
    .services-filter-grid,
    .users-filter-grid,
    .purchase-filter-grid,
    .incident-filter-grid,
    .incident-card,
    .incident-detail-grid,
    .settings-test-row,
    .template-workbench,
    .automation-grid,
    .automation-preview-grid {
        grid-template-columns: 1fr;
    }

    .union-group-extra {
        grid-template-columns: 1fr;
    }

    .catalog-field-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .renewal-summary-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .shared-purchase-panel,
    .renewal-line-context {
        grid-template-columns: 1fr;
    }

    .renewal-summary-strip > div,
    .renewal-result-grid > div,
    .renewal-line-context > div,
    .shared-purchase-panel > div {
        border-right: 0;
        border-bottom: 1px solid var(--lab-border);
    }

    .renewal-summary-strip > div:nth-last-child(-n + 2),
    .renewal-result-grid > div:last-child,
    .renewal-line-context > div:last-child,
    .shared-purchase-panel > div:last-child {
        border-bottom: 0;
    }

    .detail-grid {
        grid-template-columns: 1fr;
    }

    .user-detail-summary {
        grid-template-columns: 1fr;
    }

    .income-kpi-grid {
        grid-template-columns: 1fr;
    }

    .api-field-grid,
    .line-api-info-grid {
        grid-template-columns: 1fr;
    }

    .renewal-panel {
        position: static;
    }

    .filter-search {
        grid-column: auto;
    }

    .income-filter-grid .filter-search {
        grid-column: auto;
    }

    .filter-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .incident-action-panel {
        border-left: 0;
        border-top: 1px solid var(--lab-border);
        padding-left: 0;
        padding-top: 16px;
    }

    .group-edit-panel {
        position: static;
    }

    .group-detail-panel,
    .line-detail-panel {
        max-height: none;
    }

    .group-waiting-panel .compact-list {
        grid-template-columns: 1fr;
    }

    .group-member-add-form {
        grid-template-columns: 1fr;
    }

    .user-password-form {
        border-left: 0;
        border-top: 1px solid var(--lab-border);
        padding-left: 0;
        padding-top: 16px;
    }

}

@media (max-width: 575.98px) {
    .stripe-catalog-price-box {
        grid-template-columns: 1fr;
    }

    .auth-stage {
        padding: 18px;
    }

    .auth-brand {
        min-height: 230px;
    }

    .auth-brand-lockup {
        gap: 12px;
    }

    .auth-brand h1 {
        font-size: 3rem;
    }

    .periodic-logo {
        display: none;
    }

    .auth-panel {
        padding: 20px;
    }

    .auth-heading h2 {
        font-size: 1.55rem;
    }

    .auth-circuit {
        left: 5%;
        top: 74%;
        opacity: .58;
        transform: scale(.66);
        transform-origin: left center;
    }

    .crystal-cluster {
        left: -86px;
        bottom: -88px;
        transform: scale(.5);
    }

    .auth-code-a,
    .formula-a,
    .formula-b {
        display: none;
    }

    .page-header {
        align-items: stretch;
        flex-direction: column;
    }

    .kiv-grid {
        grid-template-columns: 1fr;
    }

    .user-profile-grid {
        grid-template-columns: 1fr;
    }

    .income-chart-row,
    .income-chart-row.compact,
    .income-year-bar-row {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .income-year-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .income-year-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .renewal-summary-strip,
    .renewal-line-context,
    .renewal-fields,
    .credentials-fields,
    .credentials-compare,
    .incident-action-panel {
        grid-template-columns: 1fr;
    }

    .incident-card-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .renewal-summary-strip > div,
    .renewal-line-context > div {
        border-bottom: 1px solid var(--lab-border);
    }

    .renewal-summary-strip > div:last-child,
    .renewal-line-context > div:last-child {
        border-bottom: 0;
    }

    .topbar-user {
        flex-wrap: wrap;
    }

    .topbar-credential-search {
        max-width: 100%;
    }

    .purchase-search-grid {
        grid-template-columns: 1fr;
    }

    .user-chip {
        max-width: 100%;
    }

    .catalog-field-grid {
        grid-template-columns: 1fr;
    }

    .catalog-service-heading {
        align-items: stretch;
        flex-direction: column;
    }
}



.users-table-scroll {
    max-height: 620px;
    overflow: auto;
}

.purchase-table-scroll {
    max-height: 640px;
    overflow: auto;
}

.users-table-scroll thead th,
.purchase-table-scroll thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #fbfcf8;
}

.renovation-list tr.is-funded,
.renovation-list tr.has-positive-credit,
.axo-table tr.is-funded,
.axo-table tr.has-positive-credit {
    background: rgba(18, 122, 75, 0.035);
}

.renovation-list tr.has-shortfall,
.axo-table tr.has-shortfall {
    background: rgba(164, 47, 47, 0.08);
}

.renovation-list tr.needs-review,
.axo-table tr.needs-review {
    background: rgba(180, 130, 0, 0.08);
}

.renewal-member-balance-chip {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
    width: max-content;
    max-width: 100%;
    padding: 0.22rem 0.48rem;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.62);
}

.renewal-member-balance-chip em {
    font-style: normal;
    font-weight: 800;
}

.renewal-member-balance-chip small {
    color: var(--muted);
    font-weight: 700;
}

.renewal-member-balance-chip.is-funded {
    border-color: rgba(18, 122, 75, 0.35);
    background: rgba(18, 122, 75, 0.11);
    color: #117a4b;
}

.renewal-member-balance-chip.is-short {
    border-color: rgba(164, 47, 47, 0.35);
    background: rgba(164, 47, 47, 0.1);
    color: #a42f2f;
}

.renewal-member-balance-chip.is-unknown {
    border-color: rgba(180, 130, 0, 0.35);
    background: rgba(180, 130, 0, 0.1);
    color: #8a6500;
}

.renewal-member-balance-chip.has-credit:not(.is-short) {
    border-color: rgba(18, 122, 75, 0.36);
    background: linear-gradient(90deg, rgba(18, 122, 75, 0.13), rgba(167, 238, 45, 0.07));
    color: #0f7046;
}

.renewal-member-balance-chip.has-no-credit:not(.is-funded) {
    border-color: rgba(164, 47, 47, 0.28);
    background: linear-gradient(90deg, rgba(164, 47, 47, 0.13), rgba(255, 255, 255, 0.68));
    color: #8c2c2c;
}

.renewal-member-balance-chip.is-dependent {
    border-color: rgba(82, 98, 132, .38);
    background:
        linear-gradient(90deg, rgba(82, 98, 132, .18), rgba(255, 255, 255, .7)),
        rgba(255, 255, 255, .7);
    color: #34415c;
    box-shadow: inset 4px 0 0 rgba(82, 98, 132, .42);
}

.renewal-dependent-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid rgba(82, 98, 132, .22);
    border-radius: 999px;
    padding: 1px 6px;
    color: #34415c !important;
    background: rgba(255, 255, 255, .66);
    font-size: .67rem;
    font-weight: 900;
    text-transform: uppercase;
}

.busy-overlay {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: none;
    place-items: center;
    background: rgba(6, 20, 14, 0.55);
    backdrop-filter: blur(4px);
}

.busy-overlay.is-visible {
    display: grid;
}

.busy-overlay-card {
    min-width: 260px;
    border: 1px solid rgba(167, 238, 45, 0.35);
    border-radius: 14px;
    padding: 1.4rem;
    background: rgba(250, 253, 247, 0.96);
    color: var(--ink);
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.28);
    display: grid;
    justify-items: center;
    gap: 0.7rem;
    text-align: center;
}

.busy-overlay-card small {
    color: var(--muted);
    font-weight: 700;
}

.busy-spinner {
    width: 46px;
    height: 46px;
    border: 4px solid rgba(18, 122, 75, 0.18);
    border-top-color: #a7ee2d;
    border-right-color: #f28c18;
    border-radius: 50%;
    animation: busy-spin 0.75s linear infinite;
}

@keyframes busy-spin {
    to {
        transform: rotate(360deg);
    }
}

.admin-renewal-row.is-funded > *,
.admin-renewal-row.has-positive-credit > *,
.renovation-table tbody tr.is-funded > *,
.renovation-table tbody tr.has-positive-credit > * {
    background: rgba(18, 122, 75, 0.035) !important;
}

.admin-renewal-row.is-funded > td:first-child,
.admin-renewal-row.has-positive-credit > td:first-child,
.renovation-table tbody tr.is-funded > td:first-child,
.renovation-table tbody tr.has-positive-credit > td:first-child {
    box-shadow: inset 5px 0 0 rgba(18, 122, 75, 0.52);
}

.renewal-credit-cell {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.renewal-credit-cell.has-credit-watermark {
    background:
        linear-gradient(105deg, rgba(18, 122, 75, 0.12), rgba(222, 246, 224, 0.58) 48%, rgba(255, 255, 255, 0.42)) !important;
    box-shadow:
        inset 5px 0 0 rgba(18, 122, 75, 0.34),
        inset 0 0 0 1px rgba(18, 122, 75, 0.08);
}

.renewal-credit-cell.has-no-credit-watermark {
    background:
        linear-gradient(90deg, rgba(164, 47, 47, 0.13), rgba(255, 239, 232, 0.64) 46%, rgba(255, 255, 255, 0.42)) !important;
    box-shadow:
        inset 5px 0 0 rgba(164, 47, 47, 0.36),
        inset 0 0 0 1px rgba(164, 47, 47, 0.08);
}

.renewal-credit-cell.has-credit-watermark::after,
.renewal-credit-cell.has-no-credit-watermark::after {
    position: absolute;
    right: 18px;
    top: 50%;
    z-index: 0;
    color: rgba(18, 122, 75, 0.11);
    font-size: 5.8rem;
    font-weight: 950;
    line-height: 1;
    pointer-events: none;
    transform: translateY(-50%) rotate(-13deg);
}

.renewal-credit-cell.has-credit-watermark::after {
    content: "€";
}

.renewal-credit-cell.has-no-credit-watermark::after {
    content: ":(";
    right: 14px;
    color: rgba(164, 47, 47, 0.13);
    font-size: 5.2rem;
}

.renewal-credit-cell.has-credit-watermark > *,
.renewal-credit-cell.has-no-credit-watermark > * {
    position: relative;
    z-index: 1;
}

.admin-renewal-row.has-shortfall > *,
.renovation-table tbody tr.has-shortfall > * {
    background: rgba(164, 47, 47, 0.105) !important;
}

.admin-renewal-row.needs-review > *,
.renovation-table tbody tr.needs-review > * {
    background: rgba(180, 130, 0, 0.075) !important;
}

.admin-renewal-row.has-shortfall > .renewal-credit-cell.has-no-credit-watermark,
.admin-renewal-row.needs-review > .renewal-credit-cell.has-no-credit-watermark,
.renovation-table tbody tr.has-shortfall > .renewal-credit-cell.has-no-credit-watermark,
.renovation-table tbody tr.needs-review > .renewal-credit-cell.has-no-credit-watermark {
    background:
        linear-gradient(90deg, rgba(164, 47, 47, 0.16), rgba(255, 239, 232, 0.72) 48%, rgba(255, 255, 255, 0.44)) !important;
}

.shared-tools-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
    gap: 1rem;
    align-items: start;
}

.shared-audit-summary .active-filter {
    outline: 2px solid rgba(18, 108, 67, .24);
    outline-offset: 2px;
}

.shared-pair-form {
    display: grid;
    gap: 1rem;
}

.shared-line-results {
    display: grid;
    gap: .75rem;
    margin-top: 1rem;
    max-height: 360px;
    overflow: auto;
    padding-right: .25rem;
}

.shared-line-result,
.shared-audit-row {
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1rem;
    background: #fff;
}

.shared-line-result {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
}

.shared-audit-list {
    display: grid;
    gap: .75rem;
    max-height: 65vh;
    overflow: auto;
    padding-right: .35rem;
}

.shared-audit-row {
    display: grid;
    grid-template-columns: 1.2fr 1.2fr 1fr 1.2fr auto;
    gap: 1rem;
    align-items: center;
}

.shared-audit-row.is-problem {
    background: #fff0f0;
    border-color: #e6a3a3;
    box-shadow: inset 5px 0 0 #b33a3a;
}

.shared-audit-row.is-ok {
    background: #f4fbf6;
    border-color: #b8dcca;
    box-shadow: inset 5px 0 0 #0b7b49;
}

.shared-audit-meta {
    color: var(--muted);
    font-weight: 700;
    font-size: .92rem;
}

.shared-audit-name {
    font-weight: 900;
    font-size: 1.06rem;
}

.shared-audit-line {
    color: var(--muted);
    font-weight: 700;
    font-size: .9rem;
    overflow-wrap: anywhere;
}

.shared-problems {
    display: flex;
    gap: .35rem;
    flex-wrap: wrap;
}

.shared-problem-pill,
.shared-ok-pill,
.shared-warning-pill {
    border-radius: 999px;
    padding: .28rem .55rem;
    font-weight: 800;
    font-size: .8rem;
}

.shared-problem-pill {
    background: #f1d7d7;
    color: #9c2d2d;
}

.shared-ok-pill {
    background: #dcefe5;
    color: #0b7b49;
}

.shared-warning-pill {
    background: #fff4d2;
    color: #8a5a00;
}

.stripe-standalone-shell {
    min-height: 100vh;
    margin: 0;
    background: #06140e;
}

.stripe-standalone-main {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: clamp(16px, 4vw, 48px);
}

.stripe-result-shell {
    position: relative;
    min-height: clamp(430px, 68vh, 720px);
    width: min(1180px, 100%);
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(18, 108, 67, .2);
    border-radius: 8px;
    background:
        radial-gradient(circle at 18% 22%, rgba(132, 204, 22, .2), transparent 26%),
        linear-gradient(135deg, #07150f 0%, #10251a 48%, #e9efcf 100%);
    padding: clamp(24px, 5vw, 54px);
    box-shadow: 0 28px 70px rgba(6, 35, 24, .2);
}

.stripe-result-shell.is-error {
    border-color: rgba(155, 44, 44, .28);
    background:
        radial-gradient(circle at 18% 22%, rgba(248, 113, 113, .18), transparent 28%),
        linear-gradient(135deg, #180b0b 0%, #311515 52%, #f6e7df 100%);
}

.stripe-result-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .24;
}

.stripe-result-bg span {
    position: absolute;
    display: grid;
    place-items: center;
    min-width: 92px;
    min-height: 92px;
    border: 2px solid currentColor;
    color: rgba(255, 255, 255, .72);
    font-size: 1.9rem;
    font-weight: 950;
}

.stripe-result-bg span:nth-child(1) {
    top: 12%;
    left: 7%;
}

.stripe-result-bg span:nth-child(2) {
    right: 9%;
    bottom: 13%;
}

.stripe-result-bg span:nth-child(3) {
    right: 18%;
    top: 10%;
    font-size: 1.2rem;
}

.stripe-result-bg span:nth-child(4) {
    left: 13%;
    bottom: 9%;
    min-width: 152px;
    font-size: 1rem;
}

.stripe-result-panel {
    position: relative;
    z-index: 1;
    width: min(980px, 100%);
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, .75fr);
    gap: clamp(20px, 4vw, 42px);
    align-items: stretch;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 8px;
    background: rgba(252, 255, 244, .92);
    padding: clamp(22px, 4vw, 44px);
    color: var(--lab-ink);
    box-shadow: 0 30px 80px rgba(0, 0, 0, .28);
}

.stripe-result-content {
    min-width: 0;
}

.stripe-result-shell.is-error .stripe-result-panel {
    background: rgba(255, 247, 243, .94);
}

.stripe-result-mark {
    width: 72px;
    height: 72px;
    display: grid;
    place-items: center;
    margin-bottom: 18px;
    border: 3px solid #0f7c49;
    background: #d9f99d;
    box-shadow: inset 0 0 0 4px rgba(255, 255, 255, .55), 0 18px 42px rgba(15, 124, 73, .24);
}

.stripe-result-shell.is-error .stripe-result-mark {
    border-color: #9f2626;
    background: #fecaca;
    box-shadow: inset 0 0 0 4px rgba(255, 255, 255, .45), 0 18px 42px rgba(159, 38, 38, .2);
}

.stripe-result-mark span {
    font-size: 1.55rem;
    font-weight: 950;
}

.stripe-result-panel h1 {
    margin: 0;
    font-size: clamp(2rem, 5vw, 4.4rem);
    line-height: .98;
}

.stripe-result-copy {
    max-width: 56ch;
    margin: 18px 0 0;
    color: var(--lab-muted);
    font-size: 1.05rem;
    font-weight: 750;
}

.stripe-result-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 26px 0;
}

.stripe-result-metrics div {
    min-width: 0;
    border: 1px solid rgba(18, 108, 67, .18);
    border-radius: 8px;
    background: rgba(255, 255, 255, .64);
    padding: 14px;
}

.stripe-result-shell.is-error .stripe-result-metrics div {
    border-color: rgba(159, 38, 38, .18);
}

.stripe-result-metrics div > span {
    display: block;
    color: var(--lab-muted);
    font-size: .8rem;
    font-weight: 900;
    text-transform: uppercase;
}

.stripe-result-metrics div > strong {
    display: block;
    margin-top: 5px;
    color: var(--lab-ink);
    font-size: clamp(1.25rem, 3vw, 2rem);
    line-height: 1.08;
}

.stripe-result-visual {
    position: relative;
    min-height: 360px;
    overflow: hidden;
    border: 1px solid rgba(18, 108, 67, .22);
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, .08) 0 1px, transparent 1px 54px),
        linear-gradient(0deg, rgba(255, 255, 255, .08) 0 1px, transparent 1px 54px),
        radial-gradient(circle at 42% 30%, rgba(167, 243, 75, .28), transparent 32%),
        linear-gradient(145deg, #06140e, #10251a 55%, #24391f);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), 0 22px 48px rgba(6, 35, 24, .16);
}

.stripe-result-shell.is-error .stripe-result-visual {
    border-color: rgba(159, 38, 38, .26);
    background:
        linear-gradient(90deg, rgba(255, 255, 255, .07) 0 1px, transparent 1px 54px),
        linear-gradient(0deg, rgba(255, 255, 255, .07) 0 1px, transparent 1px 54px),
        radial-gradient(circle at 42% 30%, rgba(248, 113, 113, .22), transparent 34%),
        linear-gradient(145deg, #180b0b, #361717 58%, #573026);
}

.stripe-periodic-board {
    position: absolute;
    top: 24px;
    left: 24px;
    right: 24px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.stripe-periodic-board span {
    position: relative;
    min-height: 58px;
    display: grid;
    place-items: center;
    border: 2px solid rgba(167, 243, 75, .76);
    color: #d8ff88;
    background: rgba(11, 39, 24, .7);
    font-weight: 950;
    box-shadow: inset 0 0 18px rgba(167, 243, 75, .1), 0 0 22px rgba(167, 243, 75, .12);
}

.stripe-result-shell.is-error .stripe-periodic-board span {
    border-color: rgba(248, 113, 113, .74);
    color: #fecaca;
    background: rgba(62, 20, 20, .72);
    box-shadow: inset 0 0 18px rgba(248, 113, 113, .08), 0 0 22px rgba(248, 113, 113, .1);
}

.stripe-periodic-board .tile-lg {
    min-height: 86px;
    font-size: 2.1rem;
}

.stripe-periodic-board .tile-accent {
    border-color: rgba(242, 140, 40, .82);
    color: #ffc66d;
}

.stripe-periodic-board .tile-sm {
    font-size: 1.1rem;
}

.stripe-periodic-board .tile-wide {
    grid-column: span 2;
    min-height: 42px;
    color: #f8ffe8;
    font-size: 1.05rem;
    text-transform: uppercase;
}

.stripe-periodic-board small {
    position: absolute;
    right: 7px;
    top: 5px;
    color: currentColor;
    font-size: .64rem;
    opacity: .72;
}

.stripe-flask {
    position: absolute;
    right: 32px;
    bottom: 42px;
    width: 116px;
    height: 160px;
    border: 3px solid rgba(232, 255, 209, .72);
    border-top: 0;
    border-radius: 0 0 54px 54px;
    background:
        linear-gradient(to top, rgba(167, 243, 75, .44) 0 42%, rgba(167, 243, 75, .08) 42% 100%);
    box-shadow: inset 0 -22px 34px rgba(167, 243, 75, .22), 0 0 44px rgba(167, 243, 75, .16);
}

.stripe-flask::before {
    content: "";
    position: absolute;
    left: 37px;
    top: -72px;
    width: 38px;
    height: 76px;
    border: 3px solid rgba(232, 255, 209, .72);
    border-bottom: 0;
}

.stripe-flask span {
    position: absolute;
    left: 19px;
    right: 19px;
    bottom: 54px;
    height: 9px;
    border-radius: 999px;
    background: rgba(232, 255, 209, .78);
    box-shadow: 0 24px 0 rgba(232, 255, 209, .35), 21px -31px 0 -2px rgba(232, 255, 209, .48);
}

.stripe-result-shell.is-error .stripe-flask {
    background:
        linear-gradient(to top, rgba(248, 113, 113, .42) 0 42%, rgba(248, 113, 113, .08) 42% 100%);
    box-shadow: inset 0 -22px 34px rgba(248, 113, 113, .18), 0 0 44px rgba(248, 113, 113, .12);
}

.stripe-crystal-stack {
    position: absolute;
    left: 28px;
    bottom: 28px;
    width: 190px;
    height: 180px;
    filter: drop-shadow(0 12px 26px rgba(0, 0, 0, .35));
}

.stripe-crystal-stack span {
    position: absolute;
    bottom: 0;
    display: block;
    border: 1px solid rgba(232, 255, 209, .45);
    background:
        linear-gradient(130deg, rgba(255, 255, 255, .76), rgba(167, 243, 75, .26) 34%, rgba(10, 92, 51, .88));
    clip-path: polygon(50% 0, 90% 24%, 100% 100%, 0 100%, 10% 24%);
}

.stripe-crystal-stack span:nth-child(1) {
    left: 10px;
    width: 64px;
    height: 150px;
    transform: rotate(-13deg);
}

.stripe-crystal-stack span:nth-child(2) {
    left: 78px;
    width: 52px;
    height: 118px;
    transform: rotate(9deg);
}

.stripe-crystal-stack span:nth-child(3) {
    left: 126px;
    width: 34px;
    height: 82px;
    transform: rotate(24deg);
}

.stripe-result-shell.is-error .stripe-crystal-stack span {
    background:
        linear-gradient(130deg, rgba(255, 255, 255, .68), rgba(248, 113, 113, .28) 34%, rgba(124, 24, 24, .88));
}

.stripe-result-status-chip {
    position: absolute;
    right: 24px;
    top: 152px;
    max-width: 170px;
    border: 1px solid rgba(167, 243, 75, .5);
    border-radius: 8px;
    padding: 10px 12px;
    color: #d8ff88;
    background: rgba(6, 20, 14, .72);
    font-size: .8rem;
    font-weight: 950;
    text-transform: uppercase;
    box-shadow: 0 14px 30px rgba(0, 0, 0, .22);
}

.stripe-result-shell.is-error .stripe-result-status-chip {
    border-color: rgba(248, 113, 113, .5);
    color: #fecaca;
    background: rgba(46, 14, 14, .74);
}

@media (max-width: 1100px) {
    .shared-tools-grid,
    .shared-audit-row {
        grid-template-columns: 1fr;
    }

    .shared-line-result {
        align-items: flex-start;
        flex-direction: column;
    }

    .stripe-result-panel {
        grid-template-columns: 1fr;
    }

    .stripe-result-visual {
        min-height: 300px;
    }
}

@media (max-width: 720px) {
    .group-profile-update-form {
        grid-template-columns: 1fr;
    }

    .stripe-result-metrics {
        grid-template-columns: 1fr;
    }

    .stripe-result-bg span {
        transform: scale(.78);
    }

    .stripe-periodic-board {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .stripe-periodic-board .tile-wide {
        grid-column: span 3;
    }

    .stripe-flask {
        right: 18px;
        transform: scale(.82);
        transform-origin: bottom right;
    }

    .stripe-crystal-stack {
        left: 18px;
        transform: scale(.82);
        transform-origin: bottom left;
    }
}

.shared-user-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.35rem;
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.shared-user-links a {
    color: var(--lab-green);
    text-decoration: none;
}

.shared-user-links a:hover {
    text-decoration: underline;
}

.purchase-resend-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .38rem;
    margin: 0;
}

.purchase-actions {
    display: grid;
    gap: .42rem;
}

.purchase-actions form {
    margin: 0;
}

.purchase-provider-form {
    display: grid;
    gap: .35rem;
    padding: .45rem;
    border: 1px solid rgba(18, 108, 67, .14);
    border-radius: 8px;
    background: rgba(246, 248, 243, .82);
}

.purchase-provider-form .form-select {
    min-height: 34px;
    font-size: .78rem;
    font-weight: 800;
}

.purchase-provider-note {
    display: block;
    margin-top: .35rem;
    color: var(--lab-muted);
    font-size: .75rem;
    font-weight: 800;
}

.purchase-actions .settings-switch {
    min-height: 30px;
    margin: 0;
    font-size: .78rem;
    line-height: 1;
}

.purchase-actions .settings-switch span {
    font-size: .78rem;
}

.purchase-actions .btn {
    width: 100%;
    min-height: 34px;
    justify-content: center;
    padding: .38rem .5rem;
    line-height: 1.1;
    white-space: normal;
    word-break: normal;
}

.purchase-resend-form .btn {
    grid-column: 1 / -1;
}

.purchase-secondary-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .38rem;
}

.incident-create-band .incident-create-form {
    align-items: end;
}

.incident-copy-credentials {
    margin-top: 0.4rem;
}

.service-reactivation-button {
    border-color: rgba(16, 126, 85, .35);
    background: linear-gradient(90deg, rgba(224, 246, 236, .95), rgba(255, 255, 255, .96));
}

.service-action-note {
    display: block;
    max-width: 220px;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 750;
    line-height: 1.25;
}

.service-request-type-badge {
    width: fit-content;
    margin-top: .2rem;
}
