:root {
    --bg: #f3f6fb;
    --panel: #ffffff;
    --text: #172033;
    --muted: #667089;
    --line: #e6eaf3;
    --primary: #4f7cff;
    --secondary: #f2ccd5;
    --danger: #c95059;
    --success: #2f8f64;
    --radius: 10px;
    --shadow: 0 10px 30px rgba(23, 32, 51, 0.08);
    --shell-width: min(1320px, calc(100vw - 48px));
    --topbar-height: 88px;
    --font-family: Inter, Arial, sans-serif;
    --font-size-h1: 3.60rem;
    --font-size-h2: 2.20rem;
    --font-size-h3: 1.30rem;
    --font-size-h4: calc(var(--font-size-h3) * 0.9);
    --font-size-body: 1.02rem;
    --font-size-ui: 0.92rem;
    --control-height: 42px;
    --control-padding-x: 12px;
}

/* SaaS Betreiber-Handbuch */
.saas-doc-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, 0.75fr);
    gap: 32px;
    overflow: hidden;
    margin-bottom: 20px;
    padding: clamp(28px, 4vw, 48px);
    border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line));
    border-radius: 22px;
    background:
        radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--primary) 17%, transparent) 0, transparent 34%),
        linear-gradient(135deg, #ffffff 0%, color-mix(in srgb, var(--primary) 5%, #ffffff) 100%);
}

.saas-doc-hero::after {
    position: absolute;
    right: -70px;
    bottom: -120px;
    width: 300px;
    height: 300px;
    border: 42px solid color-mix(in srgb, var(--primary) 7%, transparent);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.saas-doc-hero > * {
    position: relative;
    z-index: 1;
}

.saas-doc-hero h2 {
    max-width: 760px;
    margin: 8px 0 12px;
    font-size: clamp(1.8rem, 3vw, 2.85rem);
    line-height: 1.05;
    letter-spacing: -0.045em;
}

.saas-doc-hero p {
    max-width: 760px;
    margin: 0;
    color: var(--muted);
    font-size: 1rem;
    line-height: 1.7;
}

.saas-doc-search {
    align-self: center;
    padding: 20px;
    border: 1px solid color-mix(in srgb, var(--primary) 16%, var(--line));
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.08);
}

.saas-doc-search label {
    display: block;
    margin-bottom: 9px;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.saas-doc-search > div {
    display: flex;
    gap: 8px;
}

.saas-doc-search input {
    min-width: 0;
    height: 44px;
}

.saas-doc-search .btn {
    min-height: 44px;
}

.saas-doc-search > a {
    display: inline-block;
    margin-top: 10px;
    color: var(--primary);
    font-size: 0.78rem;
    font-weight: 750;
}

.saas-doc-stats {
    margin-bottom: 30px;
}

.admin-shell .saas-doc-stats .stat-card {
    min-height: 112px;
}

.admin-shell .saas-doc-stats .stat-card small {
    color: var(--muted);
}

.saas-doc-section {
    margin-top: 30px;
}

.saas-doc-section .section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 13px;
}

.saas-doc-section .section-heading h2 {
    margin: 3px 0 0;
    font-size: 1.28rem;
}

.saas-doc-section .section-heading > span {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 750;
}

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

.saas-doc-card {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    min-height: 126px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    color: var(--text);
    text-decoration: none;
    transition: border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.saas-doc-card:hover {
    border-color: color-mix(in srgb, var(--primary) 42%, var(--line));
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.08);
    transform: translateY(-2px);
}

.saas-doc-card-icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 12px;
    background: color-mix(in srgb, var(--primary) 9%, #fff);
    color: var(--primary);
}

.saas-doc-card-icon .sidebar-nav-icon {
    width: 20px;
    height: 20px;
}

.saas-doc-card > span:nth-child(2) {
    display: grid;
    gap: 6px;
}

.saas-doc-card strong {
    font-size: 0.92rem;
}

.saas-doc-card small {
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.5;
}

.saas-doc-card b {
    color: var(--primary);
    font-size: 1.05rem;
}

.saas-doc-empty {
    display: grid;
    justify-items: start;
    gap: 8px;
    padding: 34px;
}

.saas-doc-empty p {
    margin: 0 0 8px;
    color: var(--muted);
}

.saas-doc-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 700;
}

.saas-doc-breadcrumb a {
    color: var(--primary);
}

.saas-doc-reader {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    align-items: start;
    gap: 18px;
}

.saas-doc-toc {
    position: sticky;
    top: 92px;
    display: grid;
    gap: 14px;
    max-height: calc(100vh - 116px);
    overflow: auto;
    padding: 17px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
}

.saas-doc-back {
    color: var(--primary);
    font-size: 0.8rem;
    font-weight: 800;
}

.saas-doc-toc nav {
    display: grid;
    gap: 3px;
}

.saas-doc-toc nav a {
    padding: 7px 8px;
    border-radius: 8px;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.35;
    text-decoration: none;
}

.saas-doc-toc nav a:hover {
    background: color-mix(in srgb, var(--primary) 7%, #fff);
    color: var(--primary);
}

.saas-doc-toc nav a.is-level-3,
.saas-doc-toc nav a.is-level-4 {
    padding-left: 18px;
    font-size: 0.72rem;
}

.admin-shell .saas-doc-article {
    min-width: 0;
    padding: clamp(24px, 4vw, 52px);
    border-radius: 16px;
}

.saas-doc-article-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin: calc(clamp(24px, 4vw, 52px) * -1) calc(clamp(24px, 4vw, 52px) * -1) 34px;
    padding: clamp(24px, 4vw, 44px) clamp(24px, 4vw, 52px);
    border-bottom: 1px solid var(--line);
    border-radius: 16px 16px 0 0;
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 7%, #fff), #fff);
}

.saas-doc-category {
    display: inline-flex;
    padding: 5px 9px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 10%, #fff);
    color: var(--primary);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.saas-doc-article-head h2 {
    margin: 10px 0 8px;
    font-size: clamp(1.7rem, 3vw, 2.55rem);
    line-height: 1.08;
    letter-spacing: -0.04em;
}

.saas-doc-article-head p {
    max-width: 720px;
    margin: 0;
    color: var(--muted);
    line-height: 1.65;
}

.saas-doc-meta {
    display: grid;
    flex: 0 0 auto;
    gap: 3px;
    padding-top: 5px;
    color: var(--muted);
    font-size: 0.7rem;
    text-align: right;
}

.saas-doc-meta strong {
    color: var(--text);
    font-size: 0.74rem;
}

.saas-doc-content {
    max-width: 980px;
}

.saas-doc-content > * + * {
    margin-top: 22px;
}

.saas-doc-content .prose-block h2,
.saas-doc-content > h2 {
    scroll-margin-top: 100px;
}

.saas-doc-content .content-code-block {
    max-width: 100%;
}

.saas-doc-content table {
    font-size: 0.82rem;
}

@media (max-width: 1100px) {
    .saas-doc-hero {
        grid-template-columns: 1fr;
    }

    .saas-doc-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .saas-doc-reader {
        grid-template-columns: 1fr;
    }

    .saas-doc-toc {
        position: static;
        max-height: none;
    }

    .saas-doc-toc nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .saas-doc-hero {
        padding: 24px 18px;
        border-radius: 16px;
    }

    .saas-doc-search > div,
    .saas-doc-article-head {
        align-items: stretch;
        flex-direction: column;
    }

    .saas-doc-grid {
        grid-template-columns: 1fr;
    }

    .saas-doc-card {
        min-height: 108px;
    }

    .saas-doc-toc nav {
        grid-template-columns: 1fr;
    }

    .saas-doc-meta {
        text-align: left;
    }
}

.ai-provider-test {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
}

.ai-provider-test small {
    color: var(--muted);
}

.ai-privacy-card {
    background:
        radial-gradient(circle at 100% 0, color-mix(in srgb, var(--primary) 12%, transparent), transparent 40%),
        var(--panel);
}

.ai-safety-list {
    display: grid;
    gap: 14px;
    margin: 22px 0 0;
    padding: 0;
    list-style: none;
}

.ai-safety-list li {
    position: relative;
    padding-left: 28px;
    color: var(--muted);
    line-height: 1.55;
}

.ai-safety-list li::before {
    content: "✓";
    position: absolute;
    top: 0;
    left: 0;
    color: #15805f;
    font-weight: 800;
}

.ai-safety-list strong {
    color: var(--text);
}

.ai-workspace-list {
    display: grid;
    gap: 12px;
    margin-bottom: 18px;
}

.ai-workspace-row {
    display: grid;
    grid-template-columns: minmax(210px, .7fr) minmax(180px, .65fr) minmax(280px, 1.2fr) minmax(240px, .9fr);
    gap: 16px;
    align-items: end;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--panel) 94%, var(--primary));
}

.tenant-ai-mode-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 20px 0;
}

.tenant-ai-mode-grid .manual-option {
    min-height: 104px;
    align-items: flex-start;
}

.tenant-ai-mode-grid .manual-option.is-disabled {
    opacity: 0.52;
}

.tenant-ai-provider-fields {
    margin-top: 20px;
}

.tenant-ai-test-status {
    display: grid;
    gap: 8px;
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
}

.tenant-ai-test-status .pill {
    width: fit-content;
}

.tenant-ai-test-status small {
    color: var(--muted);
    line-height: 1.5;
}

.portal-ai {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 120;
    font-family: var(--font-family);
}

.portal-ai-launcher {
    display: flex;
    gap: 10px;
    align-items: center;
    min-height: 52px;
    padding: 0 18px;
    border: 0;
    border-radius: 999px;
    background: var(--primary);
    color: #fff;
    box-shadow: 0 16px 38px rgba(15, 23, 42, .22);
    font: inherit;
    font-weight: 750;
    cursor: pointer;
}

.portal-ai-launcher svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.portal-ai.is-open .portal-ai-launcher {
    visibility: hidden;
}

.portal-ai-panel {
    position: absolute;
    right: 0;
    bottom: 0;
    display: grid;
    grid-template-rows: auto auto minmax(220px, 1fr) auto auto auto;
    width: min(430px, calc(100vw - 32px));
    height: min(650px, calc(100vh - 48px));
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--primary) 18%, #dbe3ef);
    border-radius: 22px;
    background: #fff;
    color: #172033;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .25);
}

.portal-ai-panel[hidden] {
    display: none;
}

.portal-ai-head {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 36px;
    gap: 12px;
    align-items: center;
    padding: 16px 16px 14px;
    border-bottom: 1px solid #e7ebf2;
}

.portal-ai-title {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.portal-ai-title strong {
    overflow: hidden;
    font-size: .98rem;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portal-ai-title small {
    overflow: hidden;
    color: #667089;
    font-size: .74rem;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portal-ai-head button {
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid #e1e7f0;
    border-radius: 10px;
    background: #f8fafc;
    color: #172033;
    font-size: 1.35rem;
    cursor: pointer;
}

.portal-ai-avatar {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
    background: var(--primary);
    color: #fff;
    font-size: 1.2rem;
    font-weight: 850;
}

.portal-ai-avatar.has-image {
    overflow: hidden;
    padding: 5px;
    background: var(--portal-ai-surface, #fff);
    border: 1px solid color-mix(in srgb, var(--primary) 24%, #dbe3ef);
}

.portal-ai-avatar.has-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.portal-ai-scope {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 9px 16px;
    border-bottom: 1px solid #e7ebf2;
    background: #fff;
}

.portal-ai-scope label {
    color: #667089;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.portal-ai-scope select {
    width: 100%;
    min-width: 0;
    height: 34px;
    padding: 0 30px 0 10px;
    border: 1px solid #dfe6f0;
    border-radius: 9px;
    background-color: #f8fafc;
    color: #263147;
    font: inherit;
    font-size: .78rem;
    font-weight: 700;
}

.portal-ai-messages {
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow-y: auto;
    padding: 18px 16px;
    background: #f7f9fc;
}

.portal-ai-message {
    max-width: 88%;
    animation: portal-ai-in .2s ease-out;
}

.portal-ai-message.is-user {
    align-self: flex-end;
}

.portal-ai-starters {
    display: grid;
    gap: 10px;
    width: 100%;
}

.portal-ai-starters[hidden] {
    display: none;
}

.portal-ai-starters button {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 20px;
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 13px 14px;
    border: 1px solid #dfe6f0;
    border-radius: 14px;
    background: #fff;
    color: #263147;
    font: inherit;
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.35;
    text-align: left;
    cursor: pointer;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.portal-ai-starters button:hover {
    border-color: color-mix(in srgb, var(--primary) 46%, #dfe6f0);
    box-shadow: 0 10px 25px rgba(15, 23, 42, .08);
    transform: translateY(-1px);
}

.portal-ai-starters button span {
    overflow: hidden;
    text-overflow: ellipsis;
}

.portal-ai-starters button svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: var(--primary);
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.portal-ai-starters.is-standalone {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 920px;
    margin-top: 6px;
}

.portal-ai-starters.is-standalone button {
    min-height: 66px;
    padding: 16px 18px;
    font-size: .9rem;
}

.portal-ai-message-body,
.portal-ai-message > div:first-child {
    padding: 12px 14px;
    border: 1px solid #e1e7f0;
    border-radius: 15px 15px 15px 4px;
    background: #fff;
    line-height: 1.55;
    white-space: pre-wrap;
}

.portal-ai-message.is-user .portal-ai-message-body {
    border-color: var(--primary);
    border-radius: 15px 15px 4px 15px;
    background: var(--primary);
    color: #fff;
}

.portal-ai-sources {
    display: grid;
    gap: 7px;
    margin-top: 9px;
}

.portal-ai-sources > strong {
    color: #667089;
    font-size: .72rem;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.portal-ai-sources a {
    display: grid;
    grid-template-columns: 27px minmax(0, 1fr);
    gap: 9px;
    align-items: center;
    padding: 9px;
    border: 1px solid #dfe6f0;
    border-radius: 11px;
    background: #fff;
    color: #172033;
    text-decoration: none;
}

.portal-ai-sources a > span:first-child {
    display: grid;
    width: 27px;
    height: 27px;
    place-items: center;
    border-radius: 8px;
    background: color-mix(in srgb, var(--primary) 12%, #fff);
    color: var(--primary);
    font-size: .76rem;
    font-weight: 800;
}

.portal-ai-sources a > span:last-child {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.portal-ai-sources a strong,
.portal-ai-sources a small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portal-ai-sources a small {
    color: #667089;
    font-size: .72rem;
}

.portal-ai-gap {
    margin-top: 8px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #667089;
    font: inherit;
    font-size: .75rem;
    text-decoration: underline;
    cursor: pointer;
}

.portal-ai-gap.is-done {
    color: #15805f;
    text-decoration: none;
}

.portal-ai-status {
    padding: 9px 16px 0;
    color: #667089;
    font-size: .76rem;
}

.portal-ai-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    gap: 8px;
    align-items: end;
    padding: 12px 12px 9px;
}

.portal-ai-form textarea {
    min-height: 44px;
    max-height: 120px;
    resize: none;
    padding: 11px 12px;
    border: 1px solid #d8e0eb;
    border-radius: 12px;
    color: #172033;
    font: inherit;
    line-height: 1.4;
}

.portal-ai-form button {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 12px;
    background: var(--primary);
    color: #fff;
    cursor: pointer;
}

.portal-ai-form button:disabled {
    cursor: wait;
    opacity: .55;
}

.portal-ai-form svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.portal-ai-panel > footer {
    padding: 0 14px 12px;
    color: #7b8498;
    font-size: .69rem;
    text-align: center;
}

.portal-ai-page-shell {
    width: 100vw;
    height: 100vh;
    height: var(--portal-ai-viewport-height, 100dvh);
    margin: 0;
    overflow: hidden;
    background: #f4f6fa;
    color: #172033;
}

.portal-ai-page {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    width: 100vw;
    height: 100vh;
    height: var(--portal-ai-viewport-height, 100dvh);
    min-height: 0;
    margin: 0;
    padding: 0;
}

.portal-ai-standalone {
    position: static;
    width: 100%;
    height: 100%;
    min-height: 0;
}

.portal-ai-standalone .portal-ai-panel {
    position: static;
    grid-template-rows: auto auto minmax(0, 1fr) auto auto auto;
    width: 100%;
    height: 100%;
    min-height: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.portal-ai-standalone .portal-ai-head {
    grid-template-columns: 42px minmax(0, 1fr) auto 42px;
    gap: 14px;
    padding: 18px 20px;
}

.portal-ai-standalone .portal-ai-head.is-logo-hidden {
    grid-template-columns: minmax(0, 1fr) auto 42px;
    padding-left: 24px;
}

.portal-ai-standalone .portal-ai-scope {
    grid-template-columns: auto minmax(240px, 420px);
    justify-content: end;
    padding: 10px clamp(18px, 3vw, 38px);
}

.portal-ai-standalone .portal-ai-messages {
    padding: 24px clamp(18px, 4vw, 54px);
}

.portal-ai-standalone .portal-ai-message {
    max-width: min(76%, 720px);
}

.portal-ai-standalone .portal-ai-form {
    padding: 14px clamp(16px, 3vw, 38px) 11px;
    border-top: 1px solid #e7ebf2;
    background: #fff;
}

.portal-ai-connection {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #667089;
    font-size: .75rem;
    white-space: nowrap;
}

.portal-ai-standalone .portal-ai-connection {
    padding: 0 4px;
}

.portal-ai-connection b {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #25a66f;
    box-shadow: 0 0 0 4px rgba(37, 166, 111, .11);
}

.portal-ai-page-logout {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid #e1e7f0;
    border-radius: 11px;
    background: #f8fafc;
    color: #172033;
    text-decoration: none;
}

.portal-ai-page-logout svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.portal-ai-page-login {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(340px, .75fr);
    gap: clamp(38px, 7vw, 100px);
    align-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: clamp(32px, 6vw, 82px);
    overflow-x: hidden;
    overflow-y: auto;
    border: 0;
    border-radius: 0;
    background:
        radial-gradient(circle at 90% 18%, color-mix(in srgb, var(--primary) 18%, transparent) 0 11%, transparent 12%),
        radial-gradient(circle at 78% 68%, color-mix(in srgb, var(--accent) 16%, transparent) 0 16%, transparent 17%),
        #fff;
    box-shadow: none;
}

.portal-ai-page-login-copy {
    min-width: 0;
}

.portal-ai-page-login.is-unavailable {
    grid-template-columns: minmax(0, 760px);
}

.portal-ai-page-login-mark {
    display: grid;
    width: 48px;
    height: 48px;
    margin-bottom: 28px;
    place-items: center;
    border-radius: 15px;
    background: var(--primary);
    color: #fff;
    font-size: 1.25rem;
}

.portal-ai-page-login-copy h1 {
    max-width: 680px;
    margin: 10px 0 16px;
    font-size: clamp(2.25rem, 4.3vw, 4.65rem);
    line-height: 1;
    letter-spacing: -.055em;
}

.portal-ai-page-login-copy p {
    max-width: 620px;
    margin: 0;
    color: #667089;
    font-size: 1.04rem;
    line-height: 1.65;
}

.portal-ai-page-login-form {
    display: grid;
    gap: 0;
    width: 100%;
    padding: clamp(24px, 3vw, 34px);
    border: 1px solid #e1e7f0;
    border-radius: 20px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 22px 60px rgba(15, 23, 42, .12);
}

.portal-ai-page-login-form > div:first-child {
    display: grid;
    gap: 3px;
}

.portal-ai-page-login-form > div:first-child strong {
    font-size: 1.05rem;
}

.portal-ai-page-login-form > div:first-child small,
.portal-ai-page-login-form > small {
    color: #7b8498;
    line-height: 1.45;
}

.portal-ai-page-login-form > small {
    margin-top: 18px;
    text-align: center;
}

.portal-ai-page-login-form .auth-microsoft-button,
.portal-ai-page-login-form .auth-login-form {
    margin-top: 24px;
}

.portal-ai-page-shell.is-white-label {
    background: var(--portal-ai-page-bg);
    color: var(--portal-ai-text);
}

.portal-ai-page-shell.is-white-label .portal-ai-panel,
.portal-ai-page-shell.is-white-label .portal-ai-head,
.portal-ai-page-shell.is-white-label .portal-ai-scope,
.portal-ai-page-shell.is-white-label .portal-ai-form {
    background: var(--portal-ai-surface);
    color: var(--portal-ai-text);
}

.portal-ai-page-shell.is-white-label .portal-ai-head,
.portal-ai-page-shell.is-white-label .portal-ai-scope,
.portal-ai-page-shell.is-white-label .portal-ai-standalone .portal-ai-form {
    border-color: color-mix(in srgb, var(--portal-ai-text) 14%, transparent);
}

.portal-ai-page-shell.is-white-label .portal-ai-head small,
.portal-ai-page-shell.is-white-label .portal-ai-connection,
.portal-ai-page-shell.is-white-label .portal-ai-status,
.portal-ai-page-shell.is-white-label .portal-ai-page-login-copy p,
.portal-ai-page-shell.is-white-label .portal-ai-page-login-form small,
.portal-ai-page-shell.is-white-label .portal-ai-panel > footer,
.portal-ai-page-shell.is-white-label .portal-ai-sources > strong,
.portal-ai-page-shell.is-white-label .portal-ai-sources a small,
.portal-ai-page-shell.is-white-label .portal-ai-gap {
    color: color-mix(in srgb, var(--portal-ai-text) 66%, transparent);
}

.portal-ai-page-shell.is-white-label .portal-ai-messages {
    background: var(--portal-ai-page-bg);
}

.portal-ai-page-shell.is-white-label .portal-ai-message-body,
.portal-ai-page-shell.is-white-label .portal-ai-message > div:first-child,
.portal-ai-page-shell.is-white-label .portal-ai-sources a,
.portal-ai-page-shell.is-white-label .portal-ai-starters button {
    border-color: color-mix(in srgb, var(--portal-ai-text) 14%, transparent);
    background: var(--portal-ai-surface);
    color: var(--portal-ai-text);
}

.portal-ai-page-shell.is-white-label .portal-ai-message.is-user .portal-ai-message-body {
    border-color: var(--primary);
    background: var(--primary);
    color: var(--portal-ai-button-text);
}

.portal-ai-page-shell.is-white-label .portal-ai-form textarea {
    border-color: color-mix(in srgb, var(--portal-ai-text) 18%, transparent);
    background: var(--portal-ai-surface);
    color: var(--portal-ai-text);
}

.portal-ai-page-shell.is-white-label .portal-ai-form textarea::placeholder {
    color: color-mix(in srgb, var(--portal-ai-text) 52%, transparent);
}

.portal-ai-page-shell.is-white-label .portal-ai-scope label {
    color: color-mix(in srgb, var(--portal-ai-text) 62%, transparent);
}

.portal-ai-page-shell.is-white-label .portal-ai-scope select {
    border-color: color-mix(in srgb, var(--portal-ai-text) 18%, transparent);
    background-color: var(--portal-ai-surface);
    color: var(--portal-ai-text);
}

.portal-ai-page-shell.is-white-label .portal-ai-form button,
.portal-ai-page-shell.is-white-label .auth-login-submit {
    background: var(--primary);
    color: var(--portal-ai-button-text);
}

.portal-ai-page-shell.is-white-label .portal-ai-page-logout {
    border-color: color-mix(in srgb, var(--portal-ai-text) 16%, transparent);
    background: var(--portal-ai-surface);
    color: var(--portal-ai-text);
}

.portal-ai-page-shell.is-white-label .portal-ai-page-login {
    background:
        radial-gradient(circle at 90% 18%, color-mix(in srgb, var(--primary) 18%, transparent) 0 11%, transparent 12%),
        radial-gradient(circle at 78% 68%, color-mix(in srgb, var(--accent) 16%, transparent) 0 16%, transparent 17%),
        var(--portal-ai-page-bg);
    color: var(--portal-ai-text);
}

.portal-ai-page-shell.is-white-label .portal-ai-page-login-form {
    border-color: color-mix(in srgb, var(--portal-ai-text) 14%, transparent);
    background: color-mix(in srgb, var(--portal-ai-surface) 96%, transparent);
    color: var(--portal-ai-text);
}

.portal-ai-page-shell.is-white-label .auth-login-form .field > label {
    color: var(--portal-ai-text);
}

.portal-ai-page-shell.is-white-label .auth-login-form input {
    border-color: color-mix(in srgb, var(--portal-ai-text) 18%, transparent);
    background: var(--portal-ai-surface);
    color: var(--portal-ai-text);
}

.portal-ai-page-shell.is-white-label .auth-password-field button {
    color: color-mix(in srgb, var(--portal-ai-text) 64%, transparent);
}

.portal-ai-brand-mark {
    display: flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    margin-bottom: 24px;
}

.portal-ai-brand-mark img,
.portal-ai-brand-mark > span {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    object-fit: contain;
    border-radius: 14px;
}

.portal-ai-brand-mark img {
    padding: 4px;
    background: var(--portal-ai-surface);
}

.portal-ai-brand-mark > span {
    background: var(--primary);
    color: var(--portal-ai-button-text);
    font-size: 1.2rem;
    font-weight: 850;
}

.portal-ai-brand-mark strong {
    color: var(--portal-ai-text);
    font-size: 1.05rem;
}

.portal-ai-white-label-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px 16px;
    padding: 0 18px 14px;
    color: color-mix(in srgb, var(--portal-ai-text) 64%, transparent);
    font-size: .72rem;
    text-align: center;
}

.portal-ai-white-label-footer a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.portal-ai-white-label-footer small {
    flex-basis: 100%;
    line-height: 1.45;
}

.portal-ai-page-login > .portal-ai-white-label-footer {
    grid-column: 1 / -1;
    padding: 8px 0 0;
}

.ai-white-label-fields {
    margin-top: 24px;
}

.ai-white-label-fields input[type="color"] {
    width: 100%;
    min-height: 46px;
    padding: 5px;
}

.ai-white-label-workspace-overview {
    display: grid;
    gap: 10px;
}

.ai-white-label-workspace-overview article {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 13px;
}

.ai-white-label-workspace-overview article > div {
    display: grid;
    gap: 3px;
}

.ai-white-label-workspace-overview small {
    color: var(--muted);
}

.ai-starter-editor {
    display: grid;
    gap: 10px;
    margin-top: 22px;
}

.ai-starter-editor-row {
    display: grid;
    grid-template-columns: 36px minmax(180px, .65fr) minmax(280px, 1.35fr) auto;
    gap: 12px;
    align-items: end;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
}

.ai-starter-position {
    display: grid;
    width: 32px;
    height: 42px;
    place-items: center;
    color: var(--muted);
    font-size: .75rem;
    font-weight: 800;
}

.ai-starter-active {
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: 7px;
    padding: 0 8px;
    font-size: .76rem;
    font-weight: 750;
}

.ai-starter-candidates {
    display: grid;
    gap: 12px;
    margin-top: 18px;
    padding: 16px;
    border: 1px dashed color-mix(in srgb, var(--primary) 30%, var(--line));
    border-radius: 14px;
    background: color-mix(in srgb, var(--primary) 4%, #fff);
}

.ai-starter-candidates > div:first-child {
    display: grid;
    gap: 4px;
}

.ai-starter-candidates small {
    color: var(--muted);
    line-height: 1.45;
}

.ai-starter-candidates > div:last-child {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ai-starter-candidates button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--text);
    font: inherit;
    font-size: .75rem;
    cursor: pointer;
}

.ai-starter-candidates button:hover {
    border-color: var(--primary);
}

.ai-starter-candidates button span {
    color: var(--primary);
    font-size: .68rem;
    font-weight: 850;
}

.workspace-chat-channel-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.workspace-chat-channel-grid .manual-option {
    grid-template-columns: auto minmax(0, 1fr);
}

.workspace-chat-channel-grid .manual-option small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    line-height: 1.45;
}

.workspace-chat-url > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
}

@keyframes portal-ai-in {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1280px) {
    .ai-workspace-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .ai-workspace-row {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .tenant-ai-mode-grid {
        grid-template-columns: 1fr;
    }

    .portal-ai-page-login {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .portal-ai-page-login-copy h1 {
        max-width: 620px;
        font-size: clamp(2.2rem, 8vw, 4.2rem);
    }

    .ai-starter-editor-row {
        grid-template-columns: 32px minmax(0, 1fr) auto;
    }

    .ai-starter-editor-row .field:nth-of-type(2) {
        grid-column: 2 / -1;
    }
}

@media (max-width: 600px) {
    .portal-ai {
        right: 12px;
        bottom: 12px;
    }

    .portal-ai-launcher span {
        display: none;
    }

    .portal-ai-launcher {
        width: 52px;
        padding: 0;
        justify-content: center;
    }

    .portal-ai-panel {
        position: fixed;
        inset: 8px;
        width: auto;
        height: auto;
        border-radius: 18px;
    }

    .portal-ai-page {
        width: 100%;
        height: 100%;
        padding: 0;
        gap: 0;
    }

    .portal-ai-standalone .portal-ai-panel {
        position: static;
        inset: auto;
        height: 100%;
        min-height: 0;
        border-width: 0;
        border-radius: 0;
    }

    .portal-ai-standalone .portal-ai-head {
        grid-template-columns: 42px minmax(0, 1fr) auto 42px;
        gap: 10px;
        padding: 12px;
    }

    .portal-ai-standalone .portal-ai-head.is-logo-hidden {
        grid-template-columns: minmax(0, 1fr) auto 42px;
    }

    .portal-ai-connection > span {
        display: none;
    }

    .portal-ai-standalone .portal-ai-message {
        max-width: 90%;
    }

    .portal-ai-starters.is-standalone {
        grid-template-columns: 1fr;
    }

    .portal-ai-page-login {
        height: 100%;
        min-height: 0;
        padding: 24px 18px;
        border-width: 0;
        border-radius: 0;
    }

    .portal-ai-page-login-copy h1 {
        font-size: clamp(2rem, 11vw, 3.2rem);
    }

    .portal-ai-page-login-copy p {
        font-size: .94rem;
    }

    .portal-ai-page-login-form {
        padding: 22px 18px;
        border-radius: 17px;
    }

    .workspace-chat-channel-grid,
    .workspace-chat-url > div {
        grid-template-columns: 1fr;
    }
}

/* Organisationsweites Redaktionsboard */
.documentation-board-shell {
    --board-gap: 12px;
    --documentation-card-padding: 9px 10px;
    --documentation-card-title-size: .82rem;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    height: var(--documentation-board-height, calc(100dvh - 150px));
    min-width: 0;
    overflow: hidden;
}

.documentation-board-shell[data-density="comfortable"] {
    --documentation-card-padding: 13px;
    --documentation-card-title-size: .94rem;
}

.documentation-board-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
}

.documentation-board-search {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(180px, 1fr) auto;
    align-items: center;
    flex: 1 1 320px;
    min-width: 230px;
    max-width: 440px;
}

.documentation-board-search > span {
    position: absolute;
    z-index: 1;
    left: 11px;
    color: var(--muted);
    font-size: 18px;
    pointer-events: none;
}

.documentation-board-search input {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 38px;
    margin: 0;
    padding: 7px 38px 7px 34px;
    border-radius: 9px;
    font-size: 12px;
}

.documentation-board-search > button {
    position: absolute;
    right: 6px;
    display: grid;
    width: 27px;
    height: 27px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 6px;
    color: var(--muted);
    background: var(--soft);
    font-size: 17px;
    cursor: pointer;
}

.documentation-board-search > button[hidden] { display: none; }
.documentation-board-search small {
    position: absolute;
    top: calc(100% + 3px);
    left: 4px;
    color: #2563eb;
    font-size: 9px;
    font-weight: 750;
    white-space: nowrap;
}
.documentation-board-search small.is-empty { color: #b42318; }

.documentation-board-summary,
.documentation-board-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.documentation-board-summary > span {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    min-height: 32px;
    padding: 6px 9px;
    border-radius: 7px;
    color: var(--muted);
    background: var(--soft);
    font-size: 12px;
}

.documentation-board-summary strong {
    color: var(--ink);
    font-size: 15px;
}

.documentation-board-summary .is-attention { background: #f3edff; color: #6d28d9; }
.documentation-board-summary .is-danger { background: #fff0f0; color: #b42318; }

.documentation-board-filters label {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.documentation-board-filters select {
    min-width: 150px;
    min-height: 34px;
    margin: 0;
    padding: 5px 30px 5px 9px;
    font-size: 12px;
}

.documentation-board-filters {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-width: 0;
}

.documentation-kanban {
    display: flex;
    align-items: stretch;
    gap: var(--board-gap);
    min-height: 0;
    height: 100%;
    padding: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #e9edf3;
}

.documentation-column {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    flex: 0 0 272px;
    min-width: 272px;
    height: 100%;
    padding: 8px;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, .26);
    border-radius: 12px;
    background: #f4f6f9;
}

.documentation-column > header {
    display: grid;
    grid-template-columns: 9px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    min-height: 34px;
    padding: 1px 4px 8px;
    font-size: 13px;
}

.documentation-column > header > span:last-child {
    display: grid;
    min-width: 24px;
    height: 24px;
    place-items: center;
    border-radius: 999px;
    color: var(--muted);
    background: #e8edf4;
    font-size: 11px;
    font-weight: 800;
}

.documentation-column-dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: var(--column-color);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--column-color) 16%, transparent);
}

.documentation-column-cards {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 7px;
    min-height: 0;
    padding-right: 3px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: #bdc6d3 transparent;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
    border-radius: 10px;
    transition: background .18s ease, box-shadow .18s ease;
}

.documentation-column-cards.is-drop-target {
    background: rgba(79, 124, 255, .08);
    box-shadow: inset 0 0 0 2px rgba(79, 124, 255, .25);
}

.documentation-card {
    flex: 0 0 auto;
    min-width: 0;
    min-height: min-content;
    overflow: hidden;
    border: 1px solid #dfe5ee;
    border-left: 2px solid #94a3b8;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .06);
    transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease;
}

.documentation-card:hover { box-shadow: 0 3px 8px rgba(15, 23, 42, .1); }
.documentation-card.is-dragging { opacity: .42; transform: rotate(1.5deg); }
.documentation-card.is-search-match { border-color: #93c5fd; box-shadow: 0 0 0 2px rgba(59, 130, 246, .1); }
.documentation-card.is-strong-search-match { border-color: #60a5fa; box-shadow: 0 0 0 2px rgba(59, 130, 246, .18), 0 4px 12px rgba(37, 99, 235, .12); }
.documentation-card.is-pending { border-left-color: #8b5cf6; background: linear-gradient(135deg, #fff 50%, #faf7ff); }
.documentation-card.priority-high { border-left-color: #f59e0b; }
.documentation-card.priority-urgent { border-left-color: #e11d48; }
.documentation-card.priority-low { border-left-color: #94a3b8; }

.documentation-card > button {
    display: block;
    width: 100%;
    min-width: 0;
    padding: var(--documentation-card-padding);
    border: 0;
    color: inherit;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.documentation-card [data-documentation-search-match] {
    display: inline-flex;
    margin-bottom: 6px;
    padding: 3px 7px;
    border-radius: 999px;
    color: #1d4ed8;
    background: #dbeafe;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .02em;
}

.documentation-card.is-strong-search-match [data-documentation-search-match] {
    color: #fff;
    background: #2563eb;
}

.documentation-card-badges {
    display: flex;
    gap: 6px;
    margin-bottom: 6px;
}

.documentation-card-badges span,
.documentation-source-badge {
    padding: 3px 6px;
    border-radius: 4px;
    color: #475569;
    background: #eef2f7;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.documentation-card strong { display: block; min-width: 0; overflow-wrap: anywhere; font-size: var(--documentation-card-title-size); line-height: 1.32; }
.documentation-card small { display: block; margin-top: 5px; color: var(--muted); font-size: .74rem; }
.documentation-card footer { display: flex; justify-content: space-between; gap: 8px; margin-top: 9px; color: var(--muted); font-size: 10px; }
.documentation-card footer > span { display: flex; align-items: center; gap: 7px; }
.documentation-card [data-documentation-comment-count][hidden] { display: none; }
.documentation-card footer .is-overdue { color: #c0262d; font-weight: 800; }

.documentation-card-labels {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 6px;
}

.documentation-card-labels span,
.documentation-label-overview span {
    max-width: 100%;
    padding: 2px 7px;
    overflow: hidden;
    border-radius: 999px;
    color: color-mix(in srgb, var(--label-color) 38%, #111827);
    background: color-mix(in srgb, var(--label-color) 18%, #fff);
    font-size: 9px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.documentation-column-empty {
    display: grid;
    min-height: 78px;
    place-items: center;
    border: 1px dashed #cbd5e1;
    border-radius: 10px;
    color: #94a3b8;
    font-size: 12px;
}

.documentation-board-shell.is-searching .documentation-column-empty { display: none; }

.documentation-column-search-empty {
    display: grid;
    min-height: 78px;
    padding: 12px;
    place-items: center;
    border: 1px dashed #cbd5e1;
    border-radius: 10px;
    color: #94a3b8;
    background: rgba(255, 255, 255, .42);
    font-size: 11px;
    text-align: center;
}

.documentation-add-column {
    flex: 0 0 220px;
    align-self: flex-start;
    min-height: 44px;
    padding: 12px;
    border: 1px dashed #aeb8c7;
    border-radius: 12px;
    color: #475569;
    background: rgba(255, 255, 255, .55);
    font-weight: 800;
    cursor: pointer;
}

.documentation-dialog {
    width: min(680px, calc(100vw - 32px));
    padding: 0;
    border: 0;
    border-radius: 18px;
    color: var(--ink);
    background: #fff;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .28);
}

.documentation-task-dialog {
    width: min(1100px, calc(100vw - 32px));
    height: min(760px, calc(100dvh - 32px));
    max-height: none;
    overflow: hidden;
}

.documentation-task-dialog-shell {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    height: 100%;
    min-height: 0;
}

.documentation-task-dialog-head {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px;
    min-height: 86px;
    padding: 17px 20px;
    border-bottom: 1px solid var(--line);
    background: #fff;
}

.documentation-task-dialog-head small {
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.documentation-task-dialog-head h2 {
    margin: 2px 0 0;
    overflow: hidden;
    font-size: clamp(1.15rem, 2vw, 1.55rem);
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.documentation-task-dialog-head p {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 11px;
}

.documentation-task-dialog-head > button {
    width: 36px;
    height: 36px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--soft);
    font-size: 22px;
    cursor: pointer;
}

.documentation-task-status-mark {
    width: 17px;
    height: 17px;
    margin-top: 18px;
    border: 2px solid #64748b;
    border-radius: 50%;
}

.documentation-task-dialog-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(330px, .8fr);
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.documentation-task-dialog-layout > form {
    min-height: 0;
    overflow-y: auto;
}

.documentation-task-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
}

.documentation-task-quick-actions details {
    position: relative;
}

.documentation-task-quick-actions summary {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 44px;
    padding: 6px 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: #374151;
    background: #fff;
    font-size: 12px;
    font-weight: 750;
    list-style: none;
    cursor: pointer;
}

.documentation-quick-action-copy {
    display: grid;
    min-width: 0;
    line-height: 1.15;
}

.documentation-quick-action-copy small {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.documentation-quick-action-copy strong {
    max-width: 150px;
    margin-top: 2px;
    overflow: hidden;
    color: #1f2937;
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.documentation-task-quick-actions summary::-webkit-details-marker { display: none; }
.documentation-task-quick-actions details[open] summary { border-color: var(--primary); background: color-mix(in srgb, var(--primary) 7%, #fff); }
.documentation-task-quick-actions details > div {
    position: absolute;
    z-index: 8;
    top: calc(100% + 7px);
    left: 0;
    width: 240px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(15, 23, 42, .16);
}
.documentation-task-quick-actions details > div label { display: grid; gap: 7px; margin: 0; font-size: 11px; font-weight: 800; }
.documentation-task-quick-actions select,
.documentation-task-quick-actions input { width: 100%; margin: 0; }

.documentation-task-label-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    margin-bottom: 22px;
}

.documentation-task-label-section h3 {
    grid-column: 1 / -1;
    margin: 0;
    font-size: 12px;
}

.documentation-task-selected-labels {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
}

.documentation-task-selected-labels button {
    max-width: 210px;
    padding: 5px 9px;
    overflow: hidden;
    border: 0;
    border-radius: 6px;
    color: color-mix(in srgb, var(--label-color) 38%, #111827);
    background: color-mix(in srgb, var(--label-color) 22%, #fff);
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.documentation-task-selected-labels small { color: var(--muted); }
.documentation-task-label-menu { position: relative; }
.documentation-label-add {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: #374151;
    background: #fff;
    font-size: 22px;
    cursor: pointer;
}

.documentation-label-menu-panel {
    position: absolute;
    z-index: 12;
    top: calc(100% + 7px);
    right: 0;
    width: min(330px, calc(100vw - 64px));
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .2);
}
.documentation-label-menu-panel[hidden] { display: none; }
.documentation-label-menu-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.documentation-label-menu-head button { width: 28px; height: 28px; border: 0; border-radius: 6px; background: var(--soft); font-size: 18px; cursor: pointer; }
.documentation-label-menu-panel > input[type="search"] { width: 100%; margin: 0 0 10px; }
.documentation-label-options {
    display: grid;
    gap: 5px;
    max-height: 210px;
    overflow-y: auto;
}
.documentation-label-options > label {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 7px;
    margin: 0;
    cursor: pointer;
}
.documentation-label-options input { width: 15px; min-height: 15px; margin: 0; }
.documentation-label-options span {
    padding: 7px 9px;
    border-radius: 6px;
    color: color-mix(in srgb, var(--label-color) 42%, #111827);
    background: color-mix(in srgb, var(--label-color) 22%, #fff);
    font-size: 11px;
    font-weight: 800;
}
.documentation-label-options-empty { margin: 6px 0; color: var(--muted); font-size: 11px; text-align: center; }
.documentation-label-inline-create { display: grid; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.documentation-label-inline-create > strong { font-size: 11px; }
.documentation-label-inline-create > div { display: grid; grid-template-columns: minmax(0, 1fr) 42px auto; gap: 6px; }
.documentation-label-inline-create input { width: 100%; min-width: 0; margin: 0; }
.documentation-label-inline-create input[type="color"] { min-height: 36px; padding: 3px; }
.documentation-label-inline-create small { min-height: 14px; color: var(--muted); font-size: 10px; }

.documentation-task-description {
    display: grid;
    gap: 9px;
    margin-bottom: 20px;
}
.documentation-task-description > div { display: flex; align-items: center; gap: 9px; }
.documentation-task-description h3 { margin: 0; font-size: 14px; }
.documentation-task-description label { display: grid; gap: 6px; margin: 0; color: var(--muted); font-size: 10px; font-weight: 800; }
.documentation-task-description textarea { width: 100%; min-height: 150px; margin: 0; resize: vertical; }

.documentation-dialog::backdrop { background: rgba(15, 23, 42, .48); backdrop-filter: blur(3px); }
.documentation-dialog.is-compact { width: min(460px, calc(100vw - 32px)); }
.documentation-dialog form { padding: 22px; }
.documentation-dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.documentation-dialog-head small { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.documentation-dialog-head h2 { margin: 4px 0 0; }
.documentation-dialog-head > button { width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 9px; background: var(--soft); font-size: 22px; cursor: pointer; }
.documentation-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.documentation-form-grid label, .documentation-dialog > form > label { display: grid; gap: 7px; margin: 0; font-size: 12px; font-weight: 800; }
.documentation-form-grid .span-2 { grid-column: 1 / -1; }
.documentation-form-grid input, .documentation-form-grid select, .documentation-form-grid textarea, .documentation-dialog > form > label input { width: 100%; margin: 0; }
.documentation-label-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    min-width: 0;
    margin: 0;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
}
.documentation-form-label-dropdown { position: relative; }
.documentation-form-label-dropdown > summary {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 7px 11px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    font-size: 12px;
    font-weight: 800;
    list-style: none;
    cursor: pointer;
}
.documentation-form-label-dropdown > summary::-webkit-details-marker { display: none; }
.documentation-form-label-dropdown > div { display: grid; gap: 8px; margin-top: 8px; }
.documentation-form-label-dropdown input[type="search"] { width: 100%; margin: 0; }
.documentation-form-label-dropdown .documentation-label-picker { max-height: 180px; overflow-y: auto; }
.documentation-label-picker legend { padding: 0 5px; color: var(--muted); font-size: 11px; font-weight: 800; }
.documentation-label-picker label { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.documentation-label-picker input { width: 15px; min-height: 15px; }
.documentation-label-picker span {
    padding: 4px 8px;
    border-radius: 999px;
    color: color-mix(in srgb, var(--label-color) 38%, #111827);
    background: color-mix(in srgb, var(--label-color) 18%, #fff);
    font-size: 10px;
    font-weight: 800;
}
.documentation-label-overview { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 18px; }
.documentation-label-create { display: grid; grid-template-columns: minmax(0, 1fr) 90px; gap: 12px; }
.documentation-label-create label { display: grid; gap: 7px; margin: 0; font-size: 12px; font-weight: 800; }
.documentation-label-create input { width: 100%; margin: 0; }
.documentation-label-create input[type="color"] { min-height: 42px; padding: 4px; }

.documentation-activity-pane {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    min-height: 0;
    padding: 22px;
    border-left: 1px solid var(--line);
    background: #f7f8fa;
}
.documentation-activity-pane > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.documentation-activity-pane > header small { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.documentation-activity-pane > header h3 { margin: 3px 0 0; }
.documentation-activity-pane > header .btn { min-height: 34px; padding: 6px 9px; white-space: nowrap; }
.documentation-activity-pane > header .btn[aria-pressed="true"] { border-color: var(--primary); color: var(--primary); background: #fff; }
.documentation-comment-form { display: grid; gap: 8px; margin: 18px 0; padding: 0; }
.documentation-comment-form textarea { width: 100%; max-height: 110px; margin: 0; resize: none; }
.documentation-comment-form .btn { justify-self: end; }
.documentation-activity-list { display: grid; align-content: start; gap: 14px; min-height: 0; padding-right: 4px; overflow-y: auto; }
.documentation-activity-item { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 9px; }
.documentation-activity-avatar { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; color: #fff; background: #111827; font-size: 11px; font-weight: 900; }
.documentation-activity-item header { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.documentation-activity-item header strong { font-size: 12px; }
.documentation-activity-item time { color: var(--muted); font-size: 9px; white-space: nowrap; }
.documentation-activity-item p { margin: 5px 0 0; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; font-size: 12px; line-height: 1.45; }
.documentation-activity-item small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; line-height: 1.4; }
.documentation-activity-empty { padding: 18px; border: 1px dashed var(--line); border-radius: 10px; color: var(--muted); text-align: center; font-size: 12px; }
.documentation-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.documentation-dialog-actions .documentation-article-action { margin-right: auto; }
.documentation-dialog-actions .documentation-article-action[hidden] { display: none; }
.documentation-triage-actions { display: grid; grid-template-columns: auto minmax(200px, 1fr) auto; align-items: end; gap: 10px; margin-top: 18px; padding: 14px; border: 1px solid #e9d5ff; border-radius: 12px; background: #faf7ff; }
.documentation-triage-actions[hidden] { display: none; }
.documentation-reject-field { display: grid; gap: 6px; margin: 0; color: #6b21a8; font-size: 11px; font-weight: 800; }
.documentation-reject-field input { margin: 0; }
.admin-shell .documentation-dialog .documentation-form-grid input,
.admin-shell .documentation-dialog .documentation-reject-field input {
    min-height: 42px;
    padding: 10px 12px;
    border: 1px solid #d8e0ea;
    border-radius: 9px;
    color: var(--text);
    background: #fff;
    font-weight: 500;
    box-shadow: none;
}
.admin-shell .documentation-dialog .documentation-form-grid input:focus,
.admin-shell .documentation-dialog .documentation-reject-field input:focus {
    border-color: var(--primary);
    outline: 3px solid color-mix(in srgb, var(--primary) 12%, transparent);
}

.documentation-rejected-list { display: grid; align-content: start; gap: 12px; min-height: 0; overflow-y: auto; }
.documentation-rejected-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.documentation-rejected-card h3 { margin: 10px 0 5px; }
.documentation-rejected-card p { margin: 0 0 8px; color: #7f1d1d; }
.documentation-rejected-card small { color: var(--muted); }

/* SaaS Deployment- und Release-Historie */
.release-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.release-stats > div {
    display: grid;
    gap: 5px;
    padding: 16px 18px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
}

.release-stats span { color: var(--muted); font-size: 11px; font-weight: 750; }
.release-stats strong { color: var(--ink); font-size: 1.55rem; }

.release-filter-panel {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
}

.release-filter-panel h2 { margin: 4px 0; }
.release-filter-panel p { margin: 0; color: var(--muted); }
.release-filter-panel form { display: flex; align-items: end; gap: 10px; padding: 0; }
.release-filter-panel label { display: grid; gap: 5px; margin: 0; color: var(--muted); font-size: 10px; font-weight: 800; }
.release-filter-panel select { min-width: 170px; margin: 0; }

.release-timeline { display: grid; gap: 0; }
.release-card {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    min-width: 0;
}

.release-card-rail { position: relative; display: flex; justify-content: center; }
.release-card-rail::before { position: absolute; inset: 0 auto; width: 2px; content: ''; background: #dce3ec; }
.release-card:first-child .release-card-rail::before { top: 23px; }
.release-card:last-child .release-card-rail::before { bottom: calc(100% - 24px); }
.release-card-rail span {
    position: relative;
    z-index: 1;
    width: 12px;
    height: 12px;
    margin-top: 18px;
    border: 3px solid #fff;
    border-radius: 999px;
    background: #64748b;
    box-shadow: 0 0 0 2px #cbd5e1;
}
.release-card.is-deployment .release-card-rail span { background: #059669; box-shadow: 0 0 0 2px #a7f3d0; }
.release-card.is-baseline .release-card-rail span { background: #4f46e5; box-shadow: 0 0 0 2px #c7d2fe; }

.release-card-body {
    min-width: 0;
    margin-bottom: 14px;
    padding: 18px 20px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(15, 23, 42, .035);
}

.release-card-body > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.release-card-body h3 { margin: 7px 0 5px; font-size: 1.08rem; }
.release-card-body header p { max-width: 850px; margin: 0; color: var(--muted); line-height: 1.55; }
.release-card-body time { flex: 0 0 auto; color: var(--ink); font-size: 12px; font-weight: 850; text-align: right; }
.release-card-body time small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; }

.release-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.release-badges span {
    padding: 4px 7px;
    border-radius: 999px;
    color: #475569;
    background: #eef2f7;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .035em;
    text-transform: uppercase;
}
.release-card.is-deployment .release-badges span:first-child { color: #047857; background: #d1fae5; }
.release-card.is-baseline .release-badges span:first-child { color: #4338ca; background: #e0e7ff; }

.release-change-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 17px; }
.release-change-grid section { padding: 13px 15px; border: 1px solid #e6eaf0; border-radius: 10px; background: #fafbfc; }
.release-change-grid h4 { margin: 0 0 8px; font-size: 11px; }
.release-change-grid ul { display: grid; gap: 5px; margin: 0; padding-left: 17px; color: #475569; font-size: 12px; line-height: 1.45; }

.release-card-body > footer { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.release-card-body > footer code { padding: 3px 6px; border-radius: 5px; background: var(--soft); }
.release-card-body > footer a { margin-left: auto; font-weight: 800; }

.release-technical-details { margin-top: 12px; border: 1px solid var(--line); border-radius: 9px; background: #fbfcfd; }
.release-technical-details summary { padding: 10px 12px; color: #475569; font-size: 11px; font-weight: 800; cursor: pointer; }
.release-technical-details > div { display: grid; gap: 14px; padding: 0 13px 13px; }
.release-technical-details h4 { margin: 0 0 7px; font-size: 11px; }
.release-technical-details ul { display: grid; gap: 5px; margin: 0; padding-left: 18px; color: #475569; font-size: 11px; }
.release-file-list { display: grid; gap: 3px; max-height: 260px; padding: 9px; overflow-y: auto; border-radius: 7px; background: #111827; }
.release-file-list code { color: #dbeafe; font-size: 10px; white-space: normal; overflow-wrap: anywhere; }
.release-file-list b { color: #86efac; }

@media (max-width: 900px) {
    .release-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .release-filter-panel, .release-filter-panel form { align-items: stretch; flex-direction: column; }
    .release-filter-panel select { width: 100%; }
    .release-change-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    .release-stats { grid-template-columns: 1fr 1fr; }
    .release-card { grid-template-columns: 18px minmax(0, 1fr); }
    .release-card-body { padding: 15px; }
    .release-card-body > header { flex-direction: column; gap: 10px; }
    .release-card-body time { text-align: left; }
}

body.is-documentation-focus { overflow: hidden; }
.documentation-board-shell.is-focus-mode {
    position: fixed;
    z-index: 1200;
    inset: 0;
    height: 100dvh;
    padding: 12px;
    overflow: hidden;
    background: #eef1f6;
}

@media (max-width: 760px) {
    .documentation-board-shell { height: auto; min-height: calc(100dvh - 110px); overflow: visible; }
    .documentation-board-toolbar, .documentation-board-filters { align-items: stretch; flex-direction: column; }
    .documentation-board-summary, .documentation-board-actions { flex-wrap: wrap; }
    .documentation-board-search { width: 100%; max-width: none; }
    .documentation-board-filters label { align-items: stretch; flex-direction: column; }
    .documentation-board-filters select { width: 100%; min-width: 0; }
    .documentation-kanban { min-height: 620px; }
    .documentation-form-grid { grid-template-columns: 1fr; }
    .documentation-form-grid .span-2 { grid-column: auto; }
    .documentation-triage-actions { grid-template-columns: 1fr; }
    .documentation-rejected-card { align-items: stretch; flex-direction: column; }
    .documentation-task-dialog-layout { grid-template-columns: 1fr; max-height: calc(100dvh - 24px); overflow-y: auto; }
    .documentation-task-dialog-layout > form { overflow: visible; }
    .documentation-activity-pane { min-height: 380px; border-top: 1px solid var(--line); border-left: 0; }
}

/* Portable Release-Editor: derselbe semantische Inhalt für Portal und Teams. */
.release-rich-field{grid-column:1/-1}.release-rich-editor-shell{overflow:hidden;border:1px solid #d9e0ea;border-radius:12px;background:#fff}.release-rich-toolbar{display:flex;flex-wrap:wrap;gap:5px;padding:8px;border-bottom:1px solid #e4e8ef;background:#f7f9fc}.release-rich-toolbar button{min-height:30px;padding:5px 9px;border:1px solid transparent;border-radius:7px;background:transparent;color:#445067;font:inherit;font-size:.76rem;font-weight:750;cursor:pointer}.release-rich-toolbar button:hover,.release-rich-toolbar button:focus-visible{border-color:#d4dbe6;background:#fff;color:#111827}.release-rich-toolbar .is-tone-accent{color:#3f63d8}.release-rich-toolbar .is-tone-success{color:#15805b}.release-rich-toolbar .is-tone-warning{color:#a16b00}.release-rich-toolbar .is-tone-attention{color:#b33c4a}.release-rich-editor{min-height:170px;padding:16px 18px;outline:0;color:#172033;line-height:1.62}.release-rich-field.is-compact .release-rich-editor{min-height:112px}.release-rich-editor:focus{box-shadow:inset 0 0 0 2px rgba(79,111,241,.2)}.release-rich-field>small{display:block;margin-top:6px;color:#78859a;font-size:.74rem}
.release-rich-content{color:inherit;line-height:1.62}.release-rich-content>:first-child{margin-top:0}.release-rich-content>:last-child{margin-bottom:0}.release-rich-content p{margin:.5em 0}.release-rich-content h2,.release-rich-content h3,.release-rich-content h4{margin:1.15em 0 .45em;color:#172033;line-height:1.2}.release-rich-content h2{font-size:1.45em}.release-rich-content h3{font-size:1.18em}.release-rich-content h4{font-size:1em}.release-rich-content ul,.release-rich-content ol{margin:.65em 0;padding-left:1.35em}.release-rich-content li+li{margin-top:.28em}.release-rich-content blockquote{margin:1em 0;padding:10px 14px;border-left:3px solid #8da3ff;background:#f4f6ff;color:#46536b}.release-rich-content a{color:#365fd3;text-decoration:underline;text-underline-offset:2px}.release-rich-content hr{margin:20px 0;border:0;border-top:1px solid #dce2eb}.release-rich-content hr[data-space]{border:0}.release-rich-content hr[data-space="small"]{margin:10px 0}.release-rich-content hr[data-space="medium"]{margin:24px 0}.release-rich-content hr[data-space="large"]{margin:42px 0}.release-rich-content [data-tone="accent"],.release-rich-editor [data-tone="accent"]{color:#4967d9}.release-rich-content [data-tone="success"],.release-rich-editor [data-tone="success"]{color:#18835e}.release-rich-content [data-tone="warning"],.release-rich-editor [data-tone="warning"]{color:#9b6800}.release-rich-content [data-tone="attention"],.release-rich-editor [data-tone="attention"]{color:#b43b49}
.release-admin-item-copy{min-width:0;flex:1}.release-admin-items article{align-items:flex-start}.release-admin-item-actions{flex-wrap:wrap}.release-item-edit>summary{list-style:none;cursor:pointer}.release-item-edit>summary::-webkit-details-marker{display:none}.release-item-edit[open]{position:fixed;z-index:120;inset:0;display:grid;place-items:center;padding:24px;background:rgba(17,24,39,.48)}.release-item-edit[open]>summary{position:fixed;z-index:2;top:30px;right:38px;background:#fff}.release-item-edit[open]>form{width:min(860px,calc(100vw - 48px));max-height:calc(100vh - 48px);overflow:auto;padding:24px;border-radius:16px;background:#fff;box-shadow:0 24px 70px rgba(15,23,42,.22)}
.portal-release-introduction{grid-column:1/-1}.portal-release-timeline-entry footer>.release-rich-content,.portal-release-detail>footer>.release-rich-content{max-width:900px}.portal-release-group article>.release-rich-content{margin-top:10px}
.release-preview-tabs{display:flex;gap:6px;margin:0 0 14px;padding:4px;border-radius:10px;background:#f0f3f8}.release-preview-tabs button{flex:1;padding:9px 12px;border:0;border-radius:7px;background:transparent;color:#66738a;font-weight:800;cursor:pointer}.release-preview-tabs button.is-active{background:#fff;color:#172033;box-shadow:0 1px 4px rgba(15,23,42,.08)}.release-preview-pane{display:none;max-height:600px;overflow:auto;padding:18px;border:1px solid #dfe4ec;border-radius:12px;background:#f5f7fa}.release-preview-pane.is-active{display:block}.release-preview-document{width:min(820px,100%);margin:auto;padding:30px;background:#fff;color:#172033}.release-preview-document>h2{margin:8px 0 18px;font-size:1.8rem}.release-preview-document>section{margin-top:26px}.release-preview-document>section>h3{padding-bottom:8px;border-bottom:1px solid #e3e7ed}.release-preview-document article{padding:14px 0;border-bottom:1px solid #e8ebf0}.release-preview-document article h4{margin:8px 0}.release-preview-document article small{margin-left:8px;color:#748096}.release-preview-document footer{margin-top:24px;padding-top:18px;border-top:1px solid #dfe4eb}.release-preview-pane.is-message{background:#fff}.release-preview-pane.is-message .release-preview-document{box-shadow:none}.release-preview-pane.is-adaptive{background:#eef1f5}.release-preview-pane.is-adaptive .release-preview-document{max-width:620px;border-radius:8px;box-shadow:0 4px 18px rgba(15,23,42,.12)}.release-preview-pane.is-adaptive .release-rich-content [data-tone]{font-weight:700}
@media (max-width:760px){.release-rich-toolbar{gap:3px}.release-rich-toolbar button{padding:5px 7px}.release-item-edit[open]{padding:10px}.release-item-edit[open]>form{width:calc(100vw - 20px);max-height:calc(100vh - 20px);padding:16px}.release-item-edit[open]>summary{top:17px;right:18px}.release-admin-items article{display:grid}.release-admin-item-actions{justify-content:flex-start}}

/* Organisationsweites Glossar */
.admin-shell .glossary-admin-layout {
    display: grid;
    grid-template-columns: minmax(360px, .82fr) minmax(480px, 1.18fr);
    gap: 18px;
    align-items: start;
}

.admin-shell .glossary-editor-card,
.admin-shell .glossary-library-card {
    min-width: 0;
}

.admin-shell .glossary-search {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin: 0 0 16px;
}

.admin-shell .glossary-admin-list {
    display: grid;
    gap: 9px;
    max-height: calc(100vh - 300px);
    overflow-y: auto;
    padding-right: 3px;
}

.admin-shell .glossary-admin-item {
    padding: 14px;
    border: 1px solid #e3e8f0;
    border-radius: 12px;
    background: #fff;
}

.admin-shell .glossary-admin-item.is-inactive {
    opacity: .62;
    background: #f8fafc;
}

.admin-shell .glossary-admin-item-head,
.admin-shell .glossary-admin-meta,
.admin-shell .glossary-admin-item .inline-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
}

.admin-shell .glossary-admin-item-head > div,
.admin-shell .glossary-admin-item-head strong,
.admin-shell .glossary-admin-item-head span {
    display: block;
}

.admin-shell .glossary-admin-item-head strong {
    color: #121827;
    font-size: 14px;
}

.admin-shell .glossary-admin-item-head > div > span {
    margin-top: 2px;
    color: #758095;
    font-size: 10px;
}

.admin-shell .glossary-admin-item > p {
    margin: 10px 0;
    color: #4f5e75;
    font-size: 11px;
    line-height: 1.55;
}

.admin-shell .glossary-admin-meta {
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-bottom: 11px;
    color: #8490a3;
    font-size: 9px;
}

.admin-shell .glossary-admin-meta span + span::before {
    content: '·';
    margin-right: 8px;
}

.admin-shell .glossary-admin-item .inline-actions {
    justify-content: flex-start;
}

.portal-glossary-page {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    padding: 34px 0 80px;
}

.portal-glossary-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .7fr);
    gap: 48px;
    align-items: end;
    padding: 34px;
    border: 1px solid #e2e7f0;
    border-radius: 20px;
    background: linear-gradient(135deg, #fff 35%, color-mix(in srgb, var(--primary) 8%, #fff));
}

.portal-glossary-hero h1 {
    max-width: 650px;
    margin: 8px 0 10px;
    font-size: clamp(2rem, 4vw, 3.5rem);
    line-height: 1.02;
    letter-spacing: -.045em;
}

.portal-glossary-hero p {
    max-width: 680px;
    margin: 0;
    color: #647087;
    line-height: 1.65;
}

.portal-glossary-search {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    padding: 7px;
    border: 1px solid #dbe1eb;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(27, 38, 61, .08);
}

.portal-glossary-search input {
    min-width: 0;
    border: 0;
    outline: 0;
    padding: 0 10px;
    background: transparent;
}

.portal-glossary-search button {
    border: 0;
    border-radius: 9px;
    padding: 11px 17px;
    background: var(--primary);
    color: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.portal-glossary-alphabet {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin: 22px 0 8px;
}

.portal-glossary-alphabet a {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border: 1px solid #e1e6ef;
    border-radius: 9px;
    background: #fff;
    color: #5d687d;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.portal-glossary-alphabet a:hover,
.portal-glossary-alphabet a:focus-visible {
    border-color: var(--primary);
    color: var(--primary);
}

.portal-glossary-groups {
    display: grid;
    gap: 28px;
    margin-top: 28px;
}

.portal-glossary-group {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 18px;
    scroll-margin-top: 24px;
}

.portal-glossary-letter {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    position: sticky;
    top: 20px;
    border-radius: 14px;
    background: #111827;
    color: #fff;
    font-size: 18px;
    font-weight: 800;
}

.portal-glossary-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.portal-glossary-card {
    padding: 22px;
    border: 1px solid #e2e7ef;
    border-radius: 15px;
    background: #fff;
}

.portal-glossary-card-head {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    justify-content: space-between;
}

.portal-glossary-card-head h2,
.portal-glossary-card-head p {
    margin: 0;
}

.portal-glossary-card-head h2 {
    font-size: 18px;
    letter-spacing: -.02em;
}

.portal-glossary-card-head p {
    margin-top: 3px;
    color: #7b8799;
    font-size: 11px;
}

.portal-glossary-card-head > span {
    padding: 5px 8px;
    border-radius: 999px;
    background: #f0f3f8;
    color: #657087;
    font-size: 9px;
    font-weight: 700;
}

.portal-glossary-definition {
    margin: 15px 0 0;
    color: #3f4c62;
    line-height: 1.6;
}

.portal-glossary-description {
    margin: 10px 0 0;
    color: #707c90;
    font-size: .92em;
    line-height: 1.6;
}

.portal-glossary-aliases {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 15px;
}

.portal-glossary-aliases strong {
    margin-right: 3px;
    color: #808ba0;
    font-size: 10px;
}

.portal-glossary-aliases span {
    padding: 4px 7px;
    border-radius: 7px;
    background: #f3f5f8;
    color: #667288;
    font-size: 10px;
}

.portal-glossary-article-link {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    margin-top: 18px;
    color: var(--primary);
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.portal-glossary-empty {
    padding: 64px 24px;
    border: 1px dashed #d7deea;
    border-radius: 16px;
    text-align: center;
}

.portal-glossary-empty strong,
.portal-glossary-empty p {
    display: block;
    margin: 0;
}

.portal-glossary-empty p {
    margin-top: 6px;
    color: #738096;
}

.portal-glossary-empty a {
    display: inline-block;
    margin-top: 14px;
    color: var(--primary);
    font-weight: 700;
}

.portal-glossary-term {
    position: relative;
    border-bottom: 1px dotted color-mix(in srgb, var(--primary) 70%, transparent);
    color: inherit;
    cursor: help;
    outline: none;
    text-decoration: none;
}

.portal-glossary-term::after {
    content: '?';
    display: inline-grid;
    width: 14px;
    height: 14px;
    place-items: center;
    margin-left: 3px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--primary) 13%, #fff);
    color: var(--primary);
    font-size: 9px;
    font-weight: 800;
    vertical-align: .12em;
}

.portal-glossary-tooltip {
    display: none;
    width: min(330px, calc(100vw - 40px));
    position: absolute;
    z-index: 50;
    left: 0;
    bottom: calc(100% + 12px);
    padding: 14px;
    border: 1px solid #e0e6ef;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 50px rgba(18, 27, 44, .18);
    color: #4c586d;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    cursor: default;
}

.portal-glossary-tooltip strong,
.portal-glossary-tooltip > span,
.portal-glossary-tooltip a {
    display: block;
}

.portal-glossary-tooltip strong {
    margin-bottom: 5px;
    color: #151d2c;
    font-size: 12px;
}

.portal-glossary-tooltip a {
    margin-top: 9px;
    color: var(--primary);
    font-weight: 800;
    text-decoration: none;
}

.portal-glossary-term:hover .portal-glossary-tooltip,
.portal-glossary-term:focus .portal-glossary-tooltip,
.portal-glossary-term.is-open .portal-glossary-tooltip {
    display: block;
}

.portal-glossary-term {
    scroll-margin-top: 110px;
}

.article-glossary-card details,
.article-glossary-card summary {
    margin: 0;
}

.article-glossary-card summary {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    list-style: none;
    cursor: pointer;
}

.article-glossary-card summary::-webkit-details-marker {
    display: none;
}

.article-glossary-card summary > span:first-child,
.article-glossary-card summary small,
.article-glossary-card summary strong {
    display: block;
}

.article-glossary-card summary small {
    margin-bottom: 5px;
    color: #7f8a9d;
    font-size: calc(var(--font-size-ui) * .82);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.article-glossary-card summary strong {
    color: var(--text);
    font-size: calc(var(--font-size-body) * .92);
}

.article-glossary-count {
    display: grid;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    place-items: center;
    border-radius: 9px;
    background: color-mix(in srgb, var(--primary) 11%, #fff);
    color: var(--primary);
    font-size: 11px;
    font-weight: 800;
}

.article-glossary-card summary::after {
    content: '';
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-right: 1.5px solid #8792a4;
    border-bottom: 1.5px solid #8792a4;
    transform: rotate(45deg) translateY(-2px);
    transition: transform .18s ease;
}

.article-glossary-card details[open] summary::after {
    transform: rotate(225deg) translate(-1px, -1px);
}

.article-glossary-list {
    display: grid;
    gap: 2px;
    margin-top: 14px;
    padding-top: 10px;
    border-top: 1px solid #edf1f5;
}

.article-glossary-list a {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    padding: 9px 7px;
    border-radius: 8px;
    color: #566277;
    text-decoration: none;
}

.article-glossary-list a:hover,
.article-glossary-list a:focus-visible {
    background: color-mix(in srgb, var(--primary) 7%, #fff);
    color: var(--primary);
}

.article-glossary-list a > span:first-child,
.article-glossary-list strong,
.article-glossary-list small {
    display: block;
}

.article-glossary-list strong {
    color: inherit;
    font-size: 11px;
}

.article-glossary-list small {
    margin-top: 2px;
    color: #8994a6;
    font-size: 9px;
    line-height: 1.35;
}

@media (max-width: 1050px) {
    .admin-shell .glossary-admin-layout,
    .portal-glossary-hero {
        grid-template-columns: 1fr;
    }

    .admin-shell .glossary-admin-list {
        max-height: none;
    }
}

@media (max-width: 720px) {
    .portal-glossary-page {
        width: min(100% - 24px, 1180px);
        padding-top: 18px;
    }

    .portal-glossary-hero {
        gap: 24px;
        padding: 24px 20px;
    }

    .portal-glossary-search,
    .portal-glossary-cards {
        grid-template-columns: 1fr;
    }

    .portal-glossary-search input {
        min-height: 42px;
    }

    .portal-glossary-group {
        grid-template-columns: 1fr;
    }

    .portal-glossary-letter {
        position: static;
    }

    .portal-glossary-tooltip {
        position: fixed;
        right: 12px;
        bottom: 18px;
        left: 12px;
        width: auto;
    }
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    font-family: var(--font-family);
    color: var(--text);
    background:
        radial-gradient(circle at top left, rgba(79, 124, 255, 0.09), transparent 24%),
        radial-gradient(circle at top right, rgba(242, 204, 213, 0.22), transparent 26%),
        var(--bg);
    line-height: 1.55;
}

body.is-dialog-locked {
    overflow: hidden;
}

body.is-editor-settings-open {
    overflow: hidden;
}

body.is-editor-focus-open {
    overflow: hidden;
}

.error-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 32px;
}

.error-card {
    width: min(760px, 100%);
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 42px;
    display: grid;
    gap: 24px;
    box-shadow: var(--shadow);
}

.error-mark {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, rgba(79, 124, 255, 0.12), rgba(242, 204, 213, 0.28));
    border: 1px solid rgba(79, 124, 255, 0.16);
    color: var(--text);
    font-weight: 800;
    letter-spacing: 0.04em;
}

.error-copy {
    display: grid;
    gap: 8px;
}

.error-copy p {
    margin-bottom: 0;
    max-width: 52ch;
}

.error-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; }
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

h1, h2, h3, h4, p { margin-top: 0; }
h1 { font-size: var(--font-size-h1); line-height: 1.08; letter-spacing: -0.03em; }
h2 { font-size: var(--font-size-h2); line-height: 1.2; letter-spacing: -0.02em; }
h3 { font-size: var(--font-size-h3); }
h4 { font-size: var(--font-size-h4); }
p, li, small, label { color: var(--muted); font-size: var(--font-size-body); }

.admin-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
}

.shell-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(12, 19, 34, 0.46);
    backdrop-filter: blur(4px);
    z-index: 30;
}

.context-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    padding: 24px 18px;
    background: linear-gradient(180deg, #ffffff 0%, #f7f9fd 100%);
    border-right: 1px solid rgba(230, 234, 243, 0.92);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.sidebar-nav {
    display: grid;
    gap: 8px;
    margin-top: 26px;
}

.sidebar-section-label,
.drawer-nav-label {
    padding: 8px 14px 2px;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.sidebar-nav a {
    padding: 12px 14px;
    border-radius: 16px;
    color: var(--muted);
    transition: 0.18s ease;
}

.sidebar-nav a:hover,
.sidebar-nav a.active {
    background: rgba(79, 124, 255, 0.1);
    color: var(--text);
}

.content-shell {
    min-width: 0;
}

.smart-topbar {
    position: sticky;
    top: 0;
    z-index: 40;
    width: auto;
    margin: 0 0 0 0;
    min-height: var(--topbar-height);
    padding: 16px 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    background: rgba(255, 255, 255, 0.82);
    border-bottom: 1px solid rgba(230, 234, 243, 0.9);
    border-left: 1px solid rgba(230, 234, 243, 0.55);
    box-shadow: none;
    backdrop-filter: blur(18px);
    transition: transform 0.28s ease, opacity 0.28s ease;
}

.smart-topbar.is-hidden {
    transform: translateY(calc(-100% - 26px));
    opacity: 0.94;
}

.topbar-brand,
.brand-mark,
.portal-brand,
.topbar-actions,
.profile-chip,
.drawer-title,
.page-intro,
.panel-head,
.section-head,
.list-row,
.inline-actions,
.portal-header,
.portal-header nav,
.block-head,
.block-meta,
.block-actions,
.sidebar-user,
.actions {
    display: flex;
    align-items: center;
}

.brand-mark,
.portal-brand,
.drawer-title,
.profile-chip {
    gap: 14px;
}

.page-meta {
    display: grid;
    gap: 2px;
}

.page-meta .eyebrow {
    margin-bottom: 0;
}

.topbar-spacer {
    display: flex;
    justify-content: flex-end;
    position: relative;
}

.topbar-spacer small {
    display: inline-block;
    max-width: 520px;
}

.workspace-search {
    position: relative;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    width: 250px;
    max-width: 100%;
    margin-left: auto;
    transition: width 0.22s ease;
}

.workspace-search.is-expanded,
.workspace-search:focus-within {
    width: min(560px, 100%);
}

.workspace-search-field {
    min-width: 0;
}

.workspace-search-lens {
    position: relative;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: rgba(79, 124, 255, 0.1);
    color: var(--primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.workspace-search-lens svg {
    width: 18px;
    height: 18px;
    display: block;
}

.workspace-search input {
    padding-left: 14px;
    padding-right: 18px;
    background: rgba(255, 255, 255, 0.96);
}

.workspace-search-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid rgba(230, 234, 243, 0.96);
    box-shadow: 0 18px 36px rgba(23, 32, 51, 0.12);
    z-index: 20;
    max-height: 420px;
    overflow: auto;
}

.workspace-search-status {
    padding: 14px 16px;
    color: var(--muted);
    font-size: 0.92rem;
    border-bottom: 1px solid var(--line);
    background: #fbfcff;
}

.workspace-search-results {
    display: grid;
}

.workspace-search-group {
    display: grid;
}

.workspace-search-group + .workspace-search-group {
    border-top: 1px solid var(--line);
}

.workspace-search-group-label {
    padding: 10px 16px;
    background: #f8faff;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.workspace-search-item {
    display: grid;
    gap: 4px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
    transition: background 0.18s ease;
}

.workspace-search-head {
    display: flex;
    align-items: center;
    gap: 8px;
}

.workspace-search-icon {
    width: 24px;
    height: 24px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(79, 124, 255, 0.1);
    color: var(--primary);
    font-size: 0.72rem;
    font-weight: 700;
}

.workspace-search-item:hover,
.workspace-search-item:focus-visible,
.workspace-search-item.is-active {
    background: rgba(79, 124, 255, 0.06);
}

.workspace-search-item strong {
    color: var(--text);
}

.workspace-search-item small {
    color: var(--muted);
}

.workspace-search-type {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(79, 124, 255, 0.1);
    color: var(--primary);
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.workspace-search-item mark {
    background: rgba(79, 124, 255, 0.16);
    color: var(--text);
    padding: 0 2px;
}

.topbar-actions {
    justify-content: flex-end;
    gap: 12px;
}

.notification-bell {
    position: relative;
    width: 42px;
    height: 42px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.notification-bell:hover,
.notification-bell.has-unread {
    color: var(--primary);
    border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
    background: color-mix(in srgb, var(--primary) 5%, #fff);
}

.notification-bell svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.notification-bell > span {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #cf4356;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 800;
}

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

.notification-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    background: #fff;
    color: inherit;
}

.notification-item.is-unread {
    border-color: color-mix(in srgb, var(--primary) 28%, var(--line));
    background: color-mix(in srgb, var(--primary) 4%, #fff);
}

.notification-type-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #9ba7b8;
}

.notification-type-dot.is-suggestion,
.notification-type-dot.is-search_gap { background: #d99214; }
.notification-type-dot.is-feedback,
.notification-type-dot.is-changes { background: #cf4356; }
.notification-type-dot.is-review { background: var(--primary); }
.notification-type-dot.is-approved { background: #2f9d69; }
.notification-type-dot.is-domain { background: #5b74c9; }
.notification-type-dot.is-workspace_access { background: #2f9d69; }
.notification-type-dot.is-workspace_role { background: #5b74c9; }

.notification-copy {
    display: grid;
    gap: 4px;
}

.notification-copy small,
.notification-item time {
    color: var(--muted);
}

.notification-item time {
    font-size: 0.76rem;
    white-space: nowrap;
}

.notification-action-section {
    display: grid;
    gap: 10px;
    margin-bottom: 20px;
}

.notification-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
}

.notification-section-head strong {
    color: var(--text);
    font-size: 0.82rem;
}

.notification-section-head small {
    font-size: 0.72rem;
}

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

.notification-action-item {
    border-color: color-mix(in srgb, var(--primary) 24%, var(--line));
    background: color-mix(in srgb, var(--primary) 4%, #fff);
}

.notification-action-count {
    display: grid;
    place-items: center;
    min-width: 30px;
    height: 30px;
    padding: 0 8px;
    border-radius: 999px;
    color: #fff;
    background: var(--primary);
    font-size: 0.72rem;
    font-weight: 800;
}

.notification-history-head {
    margin: 4px 0 10px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.brand-dot,
.portal-logo-fallback,
.avatar-badge {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    box-shadow: var(--shadow);
}

.avatar-badge.large {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    font-size: 1.05rem;
}

.burger-trigger,
.profile-chip,
.drawer-close {
    border: 1px solid rgba(230, 234, 243, 0.92);
    background: rgba(255, 255, 255, 0.88);
    cursor: pointer;
}

.burger-trigger {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    place-items: center;
    gap: 3px;
}

.burger-trigger span {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--text);
    border-radius: 999px;
}

.profile-chip {
    border-radius: 999px;
    padding: 6px 8px 6px 6px;
    gap: 10px;
}

.profile-copy {
    display: grid;
    text-align: left;
}

.profile-copy strong {
    font-size: 0.96rem;
}

.profile-copy small {
    font-size: 0.8rem;
}

.context-drawer {
    position: fixed;
    top: 0;
    right: 0;
    width: min(420px, calc(100vw - 24px));
    height: 100vh;
    padding: 22px;
    background:
        radial-gradient(circle at top right, rgba(79, 124, 255, 0.14), transparent 24%),
        linear-gradient(180deg, #ffffff 0%, #f7f9fd 100%);
    border-left: 1px solid rgba(230, 234, 243, 0.92);
    box-shadow: -18px 0 40px rgba(12, 19, 34, 0.16);
    overflow-y: auto;
    z-index: 45;
    transform: translateX(100%);
    transition: transform 0.26s ease;
}

.context-drawer.is-open {
    transform: translateX(0);
}

.drawer-head,
.drawer-section {
    margin-bottom: 24px;
}

.drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.drawer-close {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    font-size: 1.4rem;
    line-height: 1;
}

.drawer-section h3 {
    margin-bottom: 12px;
}

.drawer-nav {
    display: grid;
    gap: 10px;
}

.drawer-nav a,
.drawer-link-card {
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 14px 16px;
    background: rgba(255, 255, 255, 0.86);
    transition: 0.18s ease;
}

.drawer-nav a:hover,
.drawer-nav a.active,
.drawer-link-card:hover {
    transform: translateY(-1px);
    border-color: rgba(79, 124, 255, 0.2);
}

.drawer-links {
    display: grid;
    gap: 12px;
}

.drawer-link-card {
    display: grid;
    gap: 4px;
}

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

.main-panel {
    width: auto;
    margin: 0;
    padding: 26px 24px 48px;
}

.page-intro {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin: 18px 0 28px;
}

.page-intro-actions {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
}

.stats-grid, .content-grid, .card-grid {
    display: grid;
    gap: 18px;
}

.stats-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 26px;
}

.compact-status-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 20px;
    margin-bottom: 0;
}

.two-up {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.stat-card, .panel-card, .portal-card, .reading-surface, .auth-card {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.stat-card {
    padding: 14px 16px;
}

.stat-card span {
    display: block;
    margin-bottom: 6px;
    color: var(--muted);
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.stat-card strong {
    font-size: 1.4rem;
    letter-spacing: -0.02em;
}

.panel-card {
    padding: 24px;
}

.nested-panel {
    margin-top: 20px;
    background: #fbfcff;
}

.panel-head, .section-head {
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.hint-list {
    margin: 0;
    padding-left: 20px;
    color: var(--muted);
    line-height: 1.65;
}

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

.list-row {
    justify-content: space-between;
    gap: 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 14px 16px;
    background: #fff;
}

.inline-actions {
    gap: 10px;
    flex-wrap: wrap;
}

.table-wrap {
    overflow-x: auto;
}

.article-overview-shell {
    gap: 18px;
}

.article-template-choice-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.article-template-choice-card {
    display: grid;
    gap: 14px;
    align-content: space-between;
    min-height: 180px;
    padding: 18px;
    border: 1px solid #e2e8f4;
    background: #fff;
}

.article-template-choice-card.is-muted {
    background: #f8fafc;
}

.article-template-choice-card strong {
    display: block;
    margin: 0 0 6px;
    font-size: 1rem;
}

.article-template-choice-card p,
.article-template-choice-card small {
    margin: 0;
    color: #6d7890;
}

.article-filter-bar {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) repeat(3, minmax(150px, 1fr));
    gap: 10px;
    align-items: end;
    padding: 12px 0 0;
    border-top: 1px solid #edf1f5;
}

.article-filter-search {
    grid-column: 1;
}

.article-filter-bar .field {
    display: block;
    margin: 0;
}

.article-filter-bar .field label {
    display: none;
}

.article-filter-bar input,
.article-filter-bar select {
    min-height: var(--control-height);
    padding: 8px var(--control-padding-x);
    border-radius: 6px;
    border-color: #d9dfeb;
    background: #fff;
    box-shadow: none;
}

.article-filter-bar .actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 0;
}

.article-filter-bar .actions .btn {
    min-height: var(--control-height);
    padding: 8px var(--control-padding-x);
    border-radius: 6px;
}

.module-tabs {
    display: inline-flex;
    gap: 8px;
    margin: 4px 0 18px;
    padding: 4px;
    background: #f4f7fc;
    border: 1px solid #e2e8f4;
    border-radius: 8px;
}

.module-tab {
    min-height: 36px;
    padding: 6px 14px;
    border: 0;
    background: transparent;
    color: #667089;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
}

.module-tab.is-active {
    background: #ffffff;
    color: var(--text);
    box-shadow: 0 1px 2px rgba(23, 32, 51, 0.06);
}

.tenant-settings-tabs {
    display: flex;
    width: fit-content;
    max-width: 100%;
    flex-wrap: wrap;
}

.tenant-settings-tabs .module-tab {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.invitation-preview-card {
    margin-bottom: 18px;
    border-color: rgba(190, 50, 55, 0.24);
}

.invitation-preview-copy {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

.invitation-preview-copy input {
    min-width: 0;
}

.mail-config-error {
    padding: 12px 14px;
    border: 1px solid rgba(190, 50, 55, 0.25);
    border-radius: 7px;
    background: rgba(190, 50, 55, 0.07);
    color: #8c2026;
}

.mail-config-status {
    margin-bottom: 18px;
}

.mail-config-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
    margin: 0;
}

.mail-config-grid div {
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: rgba(79, 124, 255, 0.025);
}

.mail-config-grid dt {
    margin-bottom: 4px;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.mail-config-grid dd {
    margin: 0;
    overflow-wrap: anywhere;
    font-weight: 650;
}

@media (max-width: 640px) {
    .invitation-preview-copy {
        grid-template-columns: 1fr;
    }
}

.module-tab-panel {
    display: grid;
    gap: 14px;
}

.module-tab-panel[hidden] {
    display: none !important;
}

.module-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.module-section-head h2 {
    margin: 0 0 4px;
    font-size: 1.08rem;
}

.module-section-head p {
    margin: 0;
    color: #6d7890;
    font-size: 0.92rem;
    max-width: 78ch;
}

.select-enhanced {
    position: relative;
    width: 100%;
}

.select-enhanced-native {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
}

.select-enhanced-trigger {
    width: 100%;
    min-height: var(--control-height);
    padding: 8px var(--control-padding-x);
    border: 1px solid #d9dfeb;
    border-radius: 6px;
    background: #fff;
    color: var(--text);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    cursor: pointer;
    text-align: left;
}

.select-enhanced-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.select-enhanced-chevron {
    width: 10px;
    height: 10px;
    border-right: 1.5px solid #65728a;
    border-bottom: 1.5px solid #65728a;
    transform: rotate(45deg) translateY(-2px);
    transition: transform 0.18s ease;
    flex: 0 0 auto;
}

.select-enhanced.is-open .select-enhanced-chevron {
    transform: rotate(-135deg) translateY(-1px);
}

.select-enhanced-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 20;
    display: grid;
    gap: 2px;
    padding: 6px;
    background: #fff;
    border: 1px solid #d9dfeb;
    box-shadow: 0 14px 30px rgba(23, 32, 51, 0.12);
    max-height: 260px;
    overflow-y: auto;
}

.select-enhanced-menu[hidden] {
    display: none !important;
}

.select-enhanced-option {
    width: 100%;
    min-height: 36px;
    padding: 8px 10px;
    border: 0;
    background: transparent;
    color: var(--text);
    text-align: left;
    border-radius: 4px;
    cursor: pointer;
}

.select-enhanced-option:hover,
.select-enhanced-option.is-selected {
    background: #f4f7fc;
}

.article-subnav {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin: 2px 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid #edf1f5;
}

.article-subnav a {
    color: #6d7890;
    font-size: 0.9rem;
    padding-bottom: 8px;
    border-bottom: 2px solid transparent;
}

.article-subnav a.active {
    color: var(--primary);
    font-weight: 700;
    border-color: var(--primary);
}

.article-subnav span {
    color: inherit;
}

.article-bulk-shell {
    display: grid;
    gap: 10px;
}

.article-bulk-bar {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding: 2px 0 10px;
    border-bottom: 1px solid #edf1f5;
}

.article-bulk-left {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.bulk-select-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #59657b;
    font-size: 0.9rem;
}

.bulk-select-all input,
.article-overview-select input {
    width: 16px;
    height: 16px;
}

.article-card-list {
    display: grid;
    gap: 14px;
}

.article-card-list.is-list {
    gap: 0;
}

.article-list-head {
    display: grid;
    grid-template-columns: 28px minmax(0, 1.9fr) minmax(160px, 0.9fr) minmax(120px, 0.8fr) minmax(120px, 0.8fr) auto;
    gap: 16px;
    padding: 2px 0 10px;
    border-bottom: 1px solid #edf1f5;
    color: #7b879d;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.article-sort-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: inherit;
}

.article-sort-link.is-active {
    color: var(--primary);
}

.article-sort-icon {
    position: relative;
    width: 10px;
    height: 12px;
    opacity: 0.45;
}

.article-sort-icon::before,
.article-sort-icon::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
}

.article-sort-icon::before {
    top: 0;
    border-bottom: 5px solid currentColor;
}

.article-sort-icon::after {
    bottom: 0;
    border-top: 5px solid currentColor;
}

.article-sort-icon.asc::after,
.article-sort-icon.desc::before,
.article-sort-icon.none::before,
.article-sort-icon.none::after {
    opacity: 0.2;
}

.article-sort-link.is-active .article-sort-icon {
    opacity: 0.9;
}

.article-overview-card {
    display: grid;
    grid-template-columns: 28px minmax(0, 1.9fr) minmax(160px, 0.9fr) minmax(120px, 0.8fr) minmax(120px, 0.8fr) auto;
    gap: 18px;
    align-items: center;
    padding: 11px 0;
    border-top: 1px solid #edf1f5;
}

.article-overview-card:first-child {
    border-top: 0;
}

.article-overview-select {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 2px;
}

.article-overview-main {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.article-overview-main h3 {
    margin: 0;
    font-size: 1rem;
    line-height: 1.35;
}

.article-overview-main p {
    margin: 0;
    color: var(--muted);
    max-width: 68ch;
    font-size: 0.9rem;
}

.article-overview-main small,
.article-overview-category,
.article-overview-status small,
.article-overview-date small {
    color: #7c8798;
    font-size: 0.88rem;
}

.article-overview-status,
.article-overview-date {
    display: grid;
    gap: 6px;
}

.article-overview-date strong {
    font-size: 0.94rem;
}

.article-overview-actions {
    display: flex;
    gap: 10px;
    align-content: center;
    justify-content: flex-end;
    align-items: center;
}

.article-overview-actions form {
    margin: 0;
}

.article-status-pill.is-draft {
    background: rgba(108, 120, 144, 0.12);
    color: #556175;
}

.article-status-pill.is-review {
    background: rgba(234, 164, 46, 0.14);
    color: #9a6200;
}

.article-status-pill.is-published {
    background: rgba(47, 143, 100, 0.14);
    color: #256d4e;
}

.article-visibility-pill {
    background: rgba(79, 124, 255, 0.08);
    color: #4f7cff;
}

.article-overview-actions .btn {
    padding: 9px 12px;
}

.empty-state-card {
    display: grid;
    gap: 6px;
    padding: 18px 0 6px;
}

.article-action-menu {
    position: relative;
}

.article-action-menu summary {
    list-style: none;
}

.article-action-menu summary::-webkit-details-marker {
    display: none;
}

.article-action-trigger {
    width: 40px;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f4f6fb;
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.article-action-menu[open] .article-action-trigger {
    background: #eef3ff;
    color: var(--primary);
    border-color: rgba(79, 124, 255, 0.24);
}

.article-action-list {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 4;
    min-width: 180px;
    display: grid;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 14px 32px rgba(23, 32, 51, 0.12);
}

.empty-state-card p,
.empty-state-card strong {
    margin: 0;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th, td {
    text-align: left;
    padding: 14px 12px;
    border-bottom: 1px solid var(--line);
}

th {
    font-size: 0.86rem;
    color: var(--muted);
    font-weight: 600;
}

.btn {
    border: none;
    border-radius: 8px;
    min-height: var(--control-height);
    padding: 8px 14px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    line-height: 1.2;
    font-weight: 600;
    transition: 0.18s ease;
}

.btn:hover { transform: translateY(-1px); }

.btn-primary {
    background: linear-gradient(135deg, var(--primary), #6f8fff);
    color: #fff;
}

.btn-secondary {
    background: #f4f6fb;
    color: var(--text);
    border: 1px solid var(--line);
}

.btn-danger {
    background: #fff0f1;
    color: var(--danger);
    border: 1px solid #f0cdd1;
}

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

.form-grid.two-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.field {
    display: grid;
    gap: 8px;
}

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

label {
    font-weight: 600;
    color: var(--text);
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
select,
textarea,
input[type="file"] {
    width: 100%;
    border-radius: 8px;
    border: 1px solid var(--line);
    min-height: var(--control-height);
    padding: 8px var(--control-padding-x);
    background: #fff;
    color: var(--text);
    line-height: 1.35;
}

textarea {
    resize: vertical;
    min-height: 110px;
    padding-top: 12px;
    padding-bottom: 12px;
}

.actions {
    gap: 12px;
    flex-wrap: wrap;
}

.flash {
    padding: 14px 16px;
    border-radius: 14px;
    margin-bottom: 16px;
    border: 1px solid transparent;
}

.flash-body {
    min-width: 0;
}

.flash-close {
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(23, 32, 51, 0.08);
    color: currentColor;
    font-size: 1rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex: 0 0 auto;
}

.flash-close:hover {
    background: rgba(23, 32, 51, 0.14);
}

.flash-success {
    background: #eef9f3;
    border-color: #c9ead6;
    color: #1d6a48;
}

.flash-error {
    background: #fff2f3;
    border-color: #f1cbcf;
    color: #9d2a37;
}

.flash-info {
    background: #eef4ff;
    border-color: #d5e2ff;
    color: #305abf;
}

.toast-stack {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 120;
    width: min(420px, calc(100vw - 24px));
    display: grid;
    gap: 12px;
    pointer-events: none;
}

.toast-stack:empty {
    display: none;
}

.toast-stack .flash {
    margin: 0;
    padding: 14px 14px 14px 16px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
    box-shadow: 0 18px 40px rgba(23, 32, 51, 0.18);
    pointer-events: auto;
    transform: translateY(0);
    opacity: 1;
    transition: opacity 0.24s ease, transform 0.24s ease;
}

.toast-stack .flash.is-closing {
    opacity: 0;
    transform: translateY(10px);
}

.toast-stack .flash .flash-body,
.toast-stack .flash .flash-body * {
    color: inherit;
}

.toast-stack .flash .flash-body p:last-child,
.toast-stack .flash .flash-body ul:last-child,
.toast-stack .flash .flash-body ol:last-child {
    margin-bottom: 0;
}

.toast-stack .flash .flash-close {
    margin-top: -2px;
}

.support-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    margin: 18px 0 0;
    background: linear-gradient(135deg, rgba(255, 245, 226, 0.98), rgba(255, 236, 204, 0.98));
    border: 1px solid rgba(217, 146, 20, 0.34);
    color: #6a4708;
}

.support-banner strong,
.support-banner small {
    color: inherit;
}

.status-chip {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    background: rgba(79, 124, 255, 0.1);
    color: var(--primary);
    font-size: 0.82rem;
    font-weight: 600;
}

.status-chip.is-muted {
    background: #f4f6fb;
    color: var(--muted);
}

.stat-card-link {
    color: inherit;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.stat-card-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(34, 49, 73, 0.1);
}

.knowledge-feedback-list {
    display: grid;
    gap: 12px;
}

.knowledge-feedback-list article {
    padding: 16px;
    border: 1px solid var(--line);
    background: #f8fafc;
}

.knowledge-feedback-list article > div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.knowledge-feedback-list p {
    margin: 10px 0 0;
}

.empty-copy {
    color: var(--muted);
    padding: 8px 0;
}

.article-proposal-preview {
    margin-top: 10px;
}

.article-proposal-preview summary {
    cursor: pointer;
    color: var(--primary);
    font-weight: 600;
}

.article-proposal-preview .reading-body {
    margin-top: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #f8fafc;
}

.auth-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
}

.auth-card {
    width: min(540px, 100%);
    padding: 28px;
}

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

.auth-page {
    min-height: 100vh;
    margin: 0;
    overflow-x: hidden;
    background: #eef2f7;
    color: var(--text);
}

.auth-experience {
    display: grid;
    min-height: 100vh;
    grid-template-columns: minmax(430px, 44%) minmax(0, 56%);
    background: #fff;
}

.auth-login-side {
    position: relative;
    z-index: 2;
    min-width: 0;
    background:
        radial-gradient(circle at 0 100%, color-mix(in srgb, var(--secondary) 22%, transparent), transparent 32%),
        #fbfcfe;
}

.auth-login-inner {
    display: flex;
    width: min(560px, 100%);
    min-height: 100vh;
    margin: 0 auto;
    padding: clamp(34px, 5vh, 64px) clamp(38px, 6vw, 86px) 30px;
    flex-direction: column;
}

.auth-brand-lockup {
    display: inline-flex;
    width: fit-content;
    min-height: 48px;
    align-items: center;
    gap: 12px;
}

.auth-brand-lockup img {
    width: auto;
    max-width: 210px;
    max-height: 50px;
    object-fit: contain;
    object-position: left center;
}

.auth-brand-lockup strong {
    color: var(--text);
    font-size: 1.12rem;
}

.auth-brand-mark {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
    background: var(--primary);
    color: #fff;
    font-size: 1.22rem;
    font-weight: 850;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--primary) 24%, transparent);
}

.auth-login-copy {
    margin-top: clamp(72px, 14vh, 150px);
}

.auth-login-kicker {
    display: inline-flex;
    margin-bottom: 16px;
    align-items: center;
    gap: 8px;
    color: var(--primary);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.auth-login-kicker::before {
    width: 22px;
    height: 2px;
    border-radius: 99px;
    background: var(--primary);
    content: "";
}

.auth-login-copy h1 {
    margin-bottom: 13px;
    color: var(--text);
    font-size: clamp(2.4rem, 4vw, 4rem);
    letter-spacing: -.055em;
}

.auth-login-copy p {
    max-width: 39ch;
    margin-bottom: 0;
    color: #68748a;
    font-size: 1rem;
    line-height: 1.65;
}

.auth-login-error {
    margin-top: 24px;
}

.btn-microsoft {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 11px;
    border: 1px solid #d8dee8;
    border-radius: 10px;
    background: #fff;
    color: #202637;
    font-weight: 760;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .04);
}

.btn-microsoft:hover {
    border-color: #b7c2d3;
    background: #f8fafc;
    color: #111827;
}

.microsoft-symbol {
    display: grid;
    width: 18px;
    height: 18px;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 2px;
}

.microsoft-symbol i:nth-child(1) { background: #f25022; }
.microsoft-symbol i:nth-child(2) { background: #7fba00; }
.microsoft-symbol i:nth-child(3) { background: #00a4ef; }
.microsoft-symbol i:nth-child(4) { background: #ffb900; }

.auth-microsoft-button {
    width: 100%;
    min-height: 54px;
    margin-top: 34px;
    border-radius: 12px;
}

.auth-login-divider {
    display: flex;
    margin: 25px 0 0;
    align-items: center;
    gap: 12px;
    color: #98a2b3;
    font-size: .7rem;
    text-align: center;
}

.auth-login-divider::before,
.auth-login-divider::after {
    height: 1px;
    flex: 1;
    background: #e3e8f0;
    content: "";
}

.auth-login-form.has-sso {
    margin-top: 25px;
}

.auth-policy-option {
    align-items: flex-start;
}

.auth-login-form {
    display: grid;
    gap: 21px;
    margin-top: 34px;
}

.auth-login-form .field {
    display: grid;
    gap: 9px;
}

.auth-login-form .field > label {
    color: #253047;
    font-size: .78rem;
    font-weight: 760;
}

.auth-login-form input {
    width: 100%;
    min-height: 54px;
    padding: 0 16px;
    border: 1px solid #dce3ed;
    border-radius: 12px;
    outline: 0;
    background: #fff;
    color: var(--text);
    box-shadow: 0 1px 2px rgba(15, 23, 42, .02);
    transition: border-color .18s ease, box-shadow .18s ease;
}

.auth-login-form input::placeholder {
    color: #9aa4b6;
}

.auth-login-form input:focus {
    border-color: color-mix(in srgb, var(--primary) 72%, #fff);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 10%, transparent);
}

.auth-password-field {
    position: relative;
}

.auth-password-field input {
    padding-right: 56px;
}

.auth-password-field button {
    position: absolute;
    top: 7px;
    right: 7px;
    display: grid;
    width: 40px;
    height: 40px;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #7d8799;
    cursor: pointer;
}

.auth-password-field button:hover {
    background: #f2f5f9;
    color: var(--primary);
}

.auth-password-field svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
}

.auth-password-field button.is-visible svg {
    opacity: .55;
}

.auth-login-submit {
    display: flex;
    width: 100%;
    min-height: 54px;
    margin-top: 4px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border-radius: 12px;
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary) 20%, transparent);
}

.auth-login-submit span {
    font-size: 1.15rem;
    transition: transform .18s ease;
}

.auth-login-submit:hover span {
    transform: translateX(3px);
}

.auth-login-links {
    display: grid;
    gap: 14px;
    margin-top: 25px;
    color: #788397;
    font-size: .8rem;
}

.auth-login-links > span,
.auth-login-links > a {
    color: #788397;
    font-size: .8rem;
}

.auth-login-links a {
    color: var(--primary);
    font-weight: 730;
}

.auth-login-links > a {
    width: fit-content;
}

.auth-login-footer {
    display: flex;
    margin-top: auto;
    padding-top: 38px;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    color: #9aa4b6;
    font-size: .69rem;
}

.auth-login-footer span:last-child {
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.auth-showcase {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 100vh;
    overflow: hidden;
    padding: clamp(48px, 7vh, 86px) clamp(46px, 6vw, 92px) 38px;
    flex-direction: column;
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--primary) 28%, var(--auth-showcase-bg)) 0%, var(--auth-showcase-bg) 56%, color-mix(in srgb, #08121f 24%, var(--auth-showcase-bg)) 100%);
    color: var(--auth-showcase-text);
}

.auth-showcase-orb {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.auth-showcase-orb-one {
    top: -23vw;
    right: -15vw;
    width: 48vw;
    height: 48vw;
    border: 1px solid rgba(255, 255, 255, .07);
    background: rgba(255, 255, 255, .035);
}

.auth-showcase-orb-two {
    right: 24%;
    bottom: -25vw;
    width: 42vw;
    height: 42vw;
    border: 1px solid rgba(255, 255, 255, .06);
}

.auth-showcase-copy {
    position: relative;
    z-index: 1;
    max-width: 680px;
}

.auth-showcase-kicker {
    display: flex;
    margin-bottom: 22px;
    align-items: center;
    gap: 10px;
    color: color-mix(in srgb, var(--auth-showcase-text) 72%, transparent);
    font-size: .76rem;
    font-weight: 760;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.auth-showcase-kicker i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--accent) 15%, transparent);
}

.auth-showcase-copy h2 {
    margin-bottom: 18px;
    color: var(--auth-showcase-text);
    font-size: clamp(2.2rem, 3.7vw, 4.3rem);
    line-height: 1.03;
    letter-spacing: -.055em;
}

.auth-showcase-copy p {
    max-width: 58ch;
    margin-bottom: 0;
    color: color-mix(in srgb, var(--auth-showcase-text) 68%, transparent);
    font-size: .93rem;
    line-height: 1.7;
}

.auth-product-preview {
    position: relative;
    z-index: 2;
    width: min(760px, 96%);
    margin: clamp(38px, 6vh, 72px) auto 0;
}

.auth-preview-browser {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .34);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 32px 80px rgba(3, 10, 20, .32);
    transform: perspective(1200px) rotateX(1.5deg) rotateY(-2deg);
    transform-origin: center center;
}

.auth-preview-browserbar {
    display: grid;
    min-height: 42px;
    padding: 0 15px;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    border-bottom: 1px solid #e9edf3;
    background: #f7f9fc;
    color: #8a94a7;
    font-size: .63rem;
}

.auth-preview-browserbar > div {
    display: flex;
    gap: 5px;
}

.auth-preview-browserbar i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #d6dce6;
}

.auth-preview-browserbar span {
    overflow: hidden;
    max-width: 260px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.auth-preview-app {
    display: grid;
    min-height: 330px;
    grid-template-columns: 62px minmax(0, 1fr);
    background: #f4f7fb;
}

.auth-preview-sidebar {
    display: flex;
    padding: 18px 12px;
    align-items: center;
    flex-direction: column;
    gap: 17px;
    border-right: 1px solid #e5eaf2;
    background: #fff;
}

.auth-preview-logo {
    display: grid;
    width: 36px;
    height: 36px;
    margin-bottom: 8px;
    place-items: center;
    overflow: hidden;
    border-radius: 10px;
    background: color-mix(in srgb, var(--primary) 11%, #fff);
}

.auth-preview-logo img {
    width: 100%;
    max-height: 34px;
    object-fit: contain;
}

.auth-preview-logo span {
    color: var(--primary);
    font-size: 1rem;
    font-weight: 850;
}

.auth-preview-sidebar > i {
    display: block;
    width: 20px;
    height: 5px;
    border-radius: 99px;
    background: #dfe5ee;
}

.auth-preview-sidebar > i.is-active {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: var(--primary);
}

.auth-preview-content {
    padding: 28px 30px;
}

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

.auth-preview-heading > div {
    display: grid;
    gap: 6px;
}

.auth-preview-heading small,
.auth-preview-label,
.auth-preview-insight small {
    color: #8b95a7;
    font-size: .56rem;
    font-weight: 800;
    letter-spacing: .09em;
}

.auth-preview-heading strong {
    color: #172033;
    font-size: 1.18rem;
}

.auth-preview-heading > span {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 1px solid #e2e7ef;
    border-radius: 9px;
    color: #536078;
}

.auth-preview-search {
    display: flex;
    min-height: 48px;
    margin-top: 25px;
    padding: 0 15px;
    align-items: center;
    gap: 10px;
    border: 1px solid #e0e6ef;
    border-radius: 11px;
    background: #fff;
    color: #929caf;
    font-size: .7rem;
    box-shadow: 0 8px 20px rgba(23, 32, 51, .04);
}

.auth-preview-search svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: var(--primary);
    stroke-width: 1.8;
}

.auth-preview-label {
    margin-top: 26px;
}

.auth-preview-cards {
    display: grid;
    gap: 9px;
    margin-top: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.auth-preview-cards article {
    display: grid;
    min-width: 0;
    min-height: 100px;
    padding: 12px;
    align-content: space-between;
    border: 1px solid #e4e9f1;
    border-radius: 11px;
    background: #fff;
}

.auth-preview-cards article > span {
    color: var(--primary);
    font-size: .55rem;
    font-weight: 850;
}

.auth-preview-cards article div {
    display: grid;
    gap: 3px;
}

.auth-preview-cards strong {
    overflow: hidden;
    color: #202a3d;
    font-size: .7rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.auth-preview-cards small {
    display: -webkit-box;
    overflow: hidden;
    color: #8a94a6;
    font-size: .53rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.auth-preview-insight {
    position: absolute;
    right: -28px;
    bottom: -34px;
    display: grid;
    width: min(330px, 54%);
    min-height: 78px;
    padding: 14px 16px;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 11px;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, .7);
    border-radius: 14px;
    background: rgba(255, 255, 255, .96);
    color: #172033;
    box-shadow: 0 20px 44px rgba(3, 10, 20, .2);
}

.auth-preview-insight-icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 11px;
    background: color-mix(in srgb, var(--accent) 18%, #fff);
    color: color-mix(in srgb, var(--accent) 72%, #172033);
    font-weight: 900;
}

.auth-preview-insight > div {
    display: grid;
    gap: 3px;
}

.auth-preview-insight strong {
    font-size: .78rem;
}

.auth-preview-insight-value {
    color: var(--primary);
    font-size: 1.05rem;
    font-weight: 850;
}

.auth-showcase-foot {
    position: relative;
    z-index: 1;
    display: flex;
    margin-top: auto;
    padding-top: 72px;
    align-items: center;
    justify-content: center;
    gap: 13px;
    color: color-mix(in srgb, var(--auth-showcase-text) 53%, transparent);
    font-size: .66rem;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.auth-showcase-foot i {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--accent);
}

@media (max-width: 1180px) {
    .auth-experience {
        grid-template-columns: minmax(410px, 48%) minmax(0, 52%);
    }

    .auth-showcase {
        padding-inline: 42px;
    }

    .auth-preview-insight {
        right: -10px;
    }
}

@media (max-width: 900px) {
    .auth-experience {
        display: block;
    }

    .auth-login-inner {
        width: min(590px, 100%);
        padding-inline: 42px;
    }

    .auth-showcase {
        display: none;
    }
}

@media (max-width: 560px) {
    .auth-login-inner {
        padding: 26px 22px 20px;
    }

    .auth-login-copy {
        margin-top: 58px;
    }

    .auth-login-copy h1 {
        font-size: 2.65rem;
    }

    .auth-login-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }
}

@media (min-width: 901px) and (max-height: 780px) {
    .auth-login-copy {
        margin-top: 48px;
    }

    .auth-showcase {
        padding-block: 38px 24px;
    }

    .auth-product-preview {
        margin-top: 30px;
    }

    .auth-preview-app {
        min-height: 270px;
    }

    .auth-showcase-foot {
        padding-top: 50px;
    }
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(79, 124, 255, 0.1);
    color: var(--primary);
    font-size: 0.84rem;
    margin-bottom: 10px;
}

.portal-shell {
    min-height: 100vh;
    background: #fff;
}

.portal-header {
    display: block;
    padding: 34px 0 80px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--primary) 28%, var(--portal-header-bg)) 0%, var(--portal-header-bg) 100%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.portal-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 80px;
    width: min(1200px, calc(100% - 48px));
    margin-left: auto;
    margin-right: auto;
}

.portal-brand strong,
.portal-brand small,
.portal-header nav a {
    color: var(--portal-header-text);
}

.portal-header nav .portal-topic-suggest-link {
    padding: 8px 12px;
    border: 1px solid color-mix(in srgb, var(--portal-header-text) 42%, transparent);
}

.portal-brand img {
    max-height: var(--portal-logo-max-height);
    width: auto;
    object-fit: contain;
}

.portal-header nav {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    flex-wrap: wrap;
}

.portal-header nav a {
    padding: 0;
    background: transparent;
    border: 0;
    font-size: var(--font-size-ui);
}

.portal-header-search {
    position: relative;
    display: block;
    width: min(820px, 100%);
    align-items: center;
}

.portal-search-band {
    width: min(1200px, calc(100% - 48px));
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.portal-header-search input {
    min-width: 0;
    width: 100%;
    border: 0;
    border-radius: 0;
    padding: 22px 72px 22px 24px;
    background: var(--portal-header-search-bg);
    color: #223149;
    font-size: 1.08rem;
    box-shadow: 0 14px 34px rgba(8, 25, 44, 0.14);
}

.portal-header-search input::placeholder {
    color: #8a96ab;
}

.portal-search-submit {
    position: absolute;
    top: 50%;
    right: 18px;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border: 0;
    background: transparent;
    color: #7a889d;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.portal-search-submit svg {
    width: 24px;
    height: 24px;
    display: block;
}

.portal-shell.portal-header-style-solid .portal-header {
    background: var(--portal-header-bg);
}

.portal-shell.portal-header-style-minimal .portal-header {
    background: var(--portal-header-search-bg);
    border-bottom-color: #e6edf5;
}

.portal-shell.portal-header-style-minimal .portal-brand strong,
.portal-shell.portal-header-style-minimal .portal-brand small,
.portal-shell.portal-header-style-minimal .portal-header nav a {
    color: var(--portal-header-text);
}

.portal-shell.portal-header-style-minimal .portal-header-search input {
    box-shadow: none;
    border: 1px solid #dce5ef;
}

.portal-main {
    width: min(1200px, calc(100% - 48px));
    margin: 0 auto 64px;
    padding-top: 0;
}

.portal-search-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    margin: 32px 0 8px;
    padding: 24px;
    border: 1px solid #dfe8f1;
    background: #f8fafc;
}

.portal-search-summary h2,
.portal-search-summary p {
    margin: 6px 0 0;
}

.portal-topic-suggestion {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(320px, 1.2fr);
    gap: 30px;
    align-items: start;
    margin: 28px 0;
    padding: 28px;
    border: 1px solid #dfe8f1;
    background: #f8fafc;
    scroll-margin-top: 24px;
}

.portal-topic-suggestion.is-highlighted {
    border-color: color-mix(in srgb, var(--primary) 55%, #dfe8f1);
    box-shadow: 0 12px 30px color-mix(in srgb, var(--primary) 10%, transparent);
}

.portal-topic-suggestion h2 {
    margin: 8px 0;
}

.portal-topic-suggestion p {
    margin: 0;
    color: var(--muted);
}

.portal-topic-suggestion-form {
    display: grid;
    gap: 14px;
}

.portal-topic-suggestion-form label {
    display: grid;
    gap: 7px;
    color: var(--muted);
    font-size: var(--font-size-ui);
}

.portal-topic-suggestion-form input,
.portal-topic-suggestion-form textarea {
    width: 100%;
}

.article-feedback-card {
    margin-top: 44px;
    padding: 24px;
    border: 1px solid #dfe8f1;
    background: #f8fafc;
}

.article-feedback-card h2 {
    margin: 8px 0 6px;
    font-size: 1.35rem;
}

.article-feedback-card p {
    margin: 0;
    color: var(--muted);
}

.article-feedback-form {
    display: grid;
    gap: 14px;
    margin-top: 18px;
}

.article-feedback-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.article-feedback-form label {
    display: grid;
    gap: 7px;
    color: var(--muted);
    font-size: var(--font-size-ui);
}

.article-feedback-form textarea {
    width: 100%;
    resize: vertical;
}

.portal-subnav-band {
    background: var(--portal-subnav-bg);
    border-top: 1px solid #edf1f5;
    border-bottom: 1px solid #edf1f5;
}

.portal-subnav-inner {
    width: min(1200px, calc(100% - 48px));
    margin: 0 auto;
}

.portal-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    color: var(--muted);
    margin: 0;
    font-size: var(--font-size-ui);
    padding: 14px 0;
}

.portal-breadcrumbs a {
    color: var(--primary);
}

.portal-breadcrumbs span:last-child {
    color: var(--text);
}

.portal-hero {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 36px;
    padding: 44px 0 22px;
    margin-bottom: 18px;
    border-bottom: 1px solid #edf1f5;
}

.portal-kicker {
    display: inline-block;
    margin-bottom: 14px;
    color: #7f8a9d;
    font-size: calc(var(--font-size-ui) * 0.92);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.portal-hero h1 {
    margin-bottom: 16px;
    font-size: var(--font-size-h1);
    font-weight: 400;
    letter-spacing: -0.05em;
    line-height: 1.02;
}

.portal-hero p {
    max-width: 62ch;
    color: #5c687c;
}

.portal-hero-side {
    display: grid;
    gap: 16px;
    align-content: start;
    padding-top: 10px;
}

.portal-hero-side strong {
    display: block;
    padding-bottom: 16px;
    border-bottom: 1px solid #edf1f5;
    font-size: 1.02rem;
    font-weight: 600;
}

.portal-section {
    margin-top: 40px;
}

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

.compact-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.portal-list {
    display: grid;
    gap: 0;
    border-top: 1px solid #edf1f5;
}

.portal-list-link {
    display: grid;
    gap: 8px;
    padding: 18px 0;
    border-bottom: 1px solid #edf1f5;
}

.portal-list-link strong,
.portal-list-item strong {
    display: block;
    margin-top: 6px;
    color: var(--text);
    font-size: 1.08rem;
}

.portal-list-link p,
.portal-list-item p {
    margin-bottom: 0;
    max-width: 68ch;
}

.portal-list-type {
    color: #7f8a9d;
    font-size: calc(var(--font-size-ui) * 0.88);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.portal-list-grid {
    display: grid;
    gap: 0 28px;
}

.portal-list-item {
    padding: 18px 0;
    border-top: 1px solid #edf1f5;
}

.portal-home-dashboard {
    margin-top: -38px;
}

.portal-home-welcome {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.55fr);
    gap: 48px;
    align-items: center;
    padding: 38px 42px;
    border: 1px solid #e4e9f0;
    background: #fff;
    box-shadow: 0 24px 65px rgba(22, 35, 54, 0.1);
}

.portal-home-welcome h1 {
    margin: 0 0 12px;
    font-size: clamp(2.15rem, 4.2vw, var(--font-size-h1));
    font-weight: 400;
    letter-spacing: -0.05em;
    line-height: 1.02;
}

.portal-home-welcome p,
.portal-section-heading p {
    margin: 0;
    color: #657187;
    line-height: 1.7;
}

.portal-home-welcome-note {
    display: grid;
    gap: 5px;
    padding: 20px 0 20px 26px;
    border-left: 2px solid color-mix(in srgb, var(--primary) 68%, #dce4ed);
}

.portal-home-welcome-note span,
.portal-home-welcome-note small {
    color: #7f8a9d;
    font-size: calc(var(--font-size-ui) * 0.88);
}

.portal-home-welcome-note strong {
    color: var(--text);
    font-size: 1.08rem;
}

.portal-home-section {
    margin-top: 58px;
    scroll-margin-top: 24px;
}

.portal-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.portal-section-heading h2 {
    margin: 6px 0 0;
    font-size: clamp(1.65rem, 2.8vw, 2.15rem);
    font-weight: 500;
    letter-spacing: -0.035em;
}

.portal-section-heading a {
    flex: 0 0 auto;
    color: var(--primary);
    font-size: var(--font-size-ui);
}

.portal-category-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.portal-category-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 15px;
    align-items: start;
    min-height: 146px;
    padding: 22px;
    border: 1px solid #e2e8f0;
    color: var(--text);
    background: #fff;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.portal-category-card:hover,
.portal-category-card.is-active {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--primary) 42%, #e2e8f0);
    box-shadow: 0 16px 34px color-mix(in srgb, var(--primary) 9%, transparent);
}

.portal-category-card.is-active {
    background: color-mix(in srgb, var(--primary) 4%, #fff);
}

.portal-category-icon,
.portal-content-icon,
.portal-manual-mark {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 10px;
    color: var(--primary);
    background: color-mix(in srgb, var(--primary) 10%, #fff);
    font-weight: 800;
}

.portal-category-icon svg,
.portal-content-icon svg,
.portal-manual-mark svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.portal-manual-mark svg {
    width: 23px;
    height: 23px;
}

.portal-category-icon {
    width: 38px;
    height: 38px;
    font-size: 0.73rem;
}

.portal-category-copy {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.portal-category-copy strong {
    font-size: 1.02rem;
}

.portal-category-copy small {
    display: -webkit-box;
    overflow: hidden;
    color: #6f7b8f;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.portal-category-count {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 12px;
    align-self: end;
    grid-column: 2 / -1;
    color: #8a95a7;
    font-size: 0.75rem;
}

.portal-category-count span + span {
    position: relative;
    padding-left: 13px;
}

.portal-category-count span + span::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    width: 3px;
    height: 3px;
    border-radius: 999px;
    background: #a5afbd;
    transform: translateY(-50%);
}

.portal-category-breadcrumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
    color: #8a95a6;
    font-size: calc(var(--font-size-ui) * 0.9);
}

.portal-category-breadcrumbs a {
    color: #6d798d;
}

.portal-category-breadcrumbs a:hover {
    color: var(--primary);
}

.portal-category-breadcrumbs strong {
    color: var(--text);
    font-weight: 600;
}

.portal-topic-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.portal-topic-card {
    display: inline-grid;
    grid-template-columns: auto auto;
    gap: 2px 8px;
    align-items: center;
    padding: 13px 16px;
    border: 1px solid #e0e6ed;
    color: var(--text);
    background: #fff;
}

.portal-topic-card > span {
    grid-row: 1 / 3;
    color: var(--primary);
    font-size: 1.15rem;
    font-weight: 800;
}

.portal-topic-card small {
    color: #8994a5;
    font-size: 0.7rem;
}

.portal-topic-card:hover,
.portal-topic-card.is-active {
    border-color: var(--primary);
    background: color-mix(in srgb, var(--primary) 5%, #fff);
}

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

.portal-feature-card {
    display: flex;
    flex-direction: column;
    min-height: 260px;
    padding: 26px;
    border: 1px solid #e1e7ef;
    color: var(--text);
    background: linear-gradient(145deg, #fff 0%, #fafbfd 100%);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.portal-feature-card:first-child {
    color: var(--portal-header-text);
    border-color: transparent;
    background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 34%, var(--portal-header-bg)), var(--portal-header-bg));
}

.portal-feature-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 42px rgba(25, 38, 58, 0.11);
}

.portal-feature-card strong {
    display: block;
    margin-top: 18px;
    font-size: 1.32rem;
    line-height: 1.28;
}

.portal-feature-card p {
    display: -webkit-box;
    overflow: hidden;
    margin: 12px 0 24px;
    color: #6b768a;
    line-height: 1.65;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.portal-feature-card:first-child .portal-list-type,
.portal-feature-card:first-child p {
    color: color-mix(in srgb, var(--portal-header-text) 72%, transparent);
}

.portal-feature-link {
    margin-top: auto;
    color: var(--primary);
    font-size: var(--font-size-ui);
    font-weight: 700;
}

.portal-feature-card:first-child .portal-feature-link {
    color: var(--portal-header-text);
}

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

.portal-manual-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    min-height: 148px;
    padding: 24px;
    border: 1px solid #e1e7ef;
    color: var(--text);
    background: #fff;
}

.portal-manual-card:hover {
    border-color: color-mix(in srgb, var(--primary) 38%, #e1e7ef);
    background: #fbfcff;
}

.portal-manual-mark {
    width: 46px;
    height: 54px;
    border-radius: 7px 12px 12px 7px;
}

.portal-manual-copy {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.portal-manual-copy strong {
    font-size: 1.08rem;
}

.portal-manual-copy small {
    display: -webkit-box;
    overflow: hidden;
    color: #707c90;
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.portal-manual-meta {
    display: grid;
    gap: 10px;
    justify-items: end;
    color: #8792a3;
    font-size: 0.76rem;
    white-space: nowrap;
}

.portal-manual-meta b {
    color: var(--primary);
    font-size: 1.1rem;
}

.portal-recent-list {
    border-top: 1px solid #e4e9ef;
}

.portal-recent-list > a {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 16px;
    align-items: center;
    padding: 17px 2px;
    border-bottom: 1px solid #e8edf2;
    color: var(--text);
}

.portal-recent-list > a:hover strong {
    color: var(--primary);
}

.portal-content-icon {
    width: 36px;
    height: 36px;
    font-size: 0.68rem;
}

.portal-content-icon.is-manual {
    color: #84621b;
    background: #fff5dc;
}

.portal-recent-list a > span:nth-child(2) {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.portal-recent-list small,
.portal-recent-list time {
    color: #8994a6;
    font-size: 0.76rem;
}

.portal-recent-list b {
    color: var(--primary);
}

.portal-topic-suggestion-modern {
    display: block;
    margin-top: 64px;
    padding: 0;
    border: 1px solid #e0e7ef;
    background: linear-gradient(120deg, #f7f9fc, color-mix(in srgb, var(--primary) 5%, #fff));
}

.portal-topic-suggestion-modern > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 28px 30px;
    list-style: none;
    cursor: pointer;
}

.portal-topic-suggestion-modern > summary::-webkit-details-marker {
    display: none;
}

.portal-topic-suggestion-modern > summary > span:first-child {
    display: grid;
    gap: 6px;
}

.portal-topic-suggestion-modern > summary strong {
    font-size: 1.35rem;
}

.portal-topic-suggestion-modern > summary small {
    color: #6f7b8e;
}

.portal-topic-action {
    flex: 0 0 auto;
    color: var(--primary);
    font-weight: 700;
}

.portal-topic-suggestion-modern .portal-topic-suggestion-form {
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr) auto;
    align-items: end;
    padding: 0 30px 30px;
}

.portal-search-page {
    padding-top: 42px;
}

.portal-search-summary-modern {
    margin: 0;
    padding: 0 0 28px;
    border: 0;
    border-bottom: 1px solid #e3e8ef;
    background: transparent;
}

.portal-search-summary-modern h1 {
    margin: 8px 0 10px;
    font-size: clamp(2rem, 4vw, 3.25rem);
    font-weight: 400;
    letter-spacing: -0.045em;
}

.portal-back-home {
    display: block;
    margin-bottom: 30px;
    color: #6e7a8f;
    font-size: var(--font-size-ui);
}

.portal-result-filters {
    display: flex;
    gap: 8px;
    margin: 24px 0;
}

.portal-result-filters a {
    padding: 9px 14px;
    border: 1px solid #dde4ec;
    color: #68758a;
    background: #fff;
    font-size: var(--font-size-ui);
}

.portal-result-filters a.is-active {
    border-color: var(--text);
    color: #fff;
    background: var(--text);
}

.portal-search-results {
    display: grid;
    gap: 0;
    border-top: 1px solid #e4e9ef;
}

.portal-result-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    padding: 22px 3px;
    border-bottom: 1px solid #e4e9ef;
    color: var(--text);
}

.portal-result-card:hover .portal-result-copy strong,
.portal-result-card:hover .portal-card-arrow {
    color: var(--primary);
}

.portal-result-copy {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.portal-result-copy strong {
    font-size: 1.12rem;
}

.portal-result-copy small {
    overflow: hidden;
    color: #6f7a8d;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portal-card-arrow {
    color: #8190a3;
    font-size: 1.15rem;
}

.portal-empty-state {
    grid-column: 1 / -1;
    padding: 34px;
    border: 1px dashed #d7dfe8;
    color: var(--text);
    background: #fafbfd;
}

.portal-empty-state p {
    margin: 7px 0 0;
    color: #707c8e;
}

.pill {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(79, 124, 255, 0.1);
    color: var(--primary);
    font-size: 0.82rem;
}

.reading-surface {
    width: min(860px, 100%);
    margin: 0 auto;
    padding: 34px;
}

.article-page {
    display: grid;
    gap: 18px;
    padding-top: 44px;
}

.article-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.72fr) minmax(260px, 320px);
    gap: 56px;
    align-items: start;
}

.article-layout > * {
    min-width: 0;
}

.article-reading-surface {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0 0 8px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
}

.article-sidebar {
    position: sticky;
    top: 24px;
    display: grid;
    gap: 28px;
}

.article-sidebar-card {
    padding: 0 0 24px;
    border: 0;
    border-bottom: 1px solid #edf1f5;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.article-sidebar-card h3 {
    margin-bottom: 16px;
    font-size: calc(var(--font-size-ui) * 0.92);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #7f8a9d;
}

.article-meta-list {
    display: grid;
    gap: 14px;
}

.article-meta-list small {
    display: block;
    margin-bottom: 4px;
    color: var(--muted);
}

.article-meta-list strong {
    color: var(--text);
    font-size: 0.98rem;
}

.article-outline,
.article-related-list {
    display: grid;
    gap: 12px;
}

.article-topic-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.article-topic-links a {
    padding: 7px 9px;
    border: 1px solid #e0e6ee;
    color: var(--primary);
    background: #fff;
    font-size: calc(var(--font-size-ui) * 0.88);
}

.article-outline a,
.article-related-list a {
    color: var(--text);
    text-decoration: none;
    line-height: 1.55;
    font-size: var(--font-size-body);
}

.article-outline a:hover,
.article-related-list a:hover {
    color: var(--primary);
}

.article-outline .is-level-3 {
    padding-left: 12px;
}

.article-outline .is-level-4 {
    padding-left: 24px;
}

.portal-preview-toolbar {
    position: sticky;
    top: 0;
    z-index: 70;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 58px;
    padding: 8px max(24px, calc((100vw - 1200px) / 2));
    color: #fff;
    background: #11141c;
    box-shadow: 0 8px 24px rgba(11, 17, 30, 0.18);
}

.portal-preview-toolbar-copy {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.portal-preview-indicator {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: #f1b64b;
    box-shadow: 0 0 0 5px rgba(241, 182, 75, 0.13);
}

.portal-preview-toolbar strong,
.portal-preview-toolbar small {
    display: block;
}

.portal-preview-toolbar strong {
    font-size: 0.82rem;
    line-height: 1.2;
}

.portal-preview-toolbar small {
    margin-top: 4px;
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.69rem;
    line-height: 1.2;
}

.portal-preview-toolbar .btn {
    flex: 0 0 auto;
    min-height: 38px;
    border-color: #fff;
    color: #11141c;
    background: #fff;
    white-space: nowrap;
}

.portal-preview-toolbar .btn:hover {
    border-color: #eef1f6;
    background: #eef1f6;
}

.reading-head {
    margin-bottom: 30px;
    padding-bottom: 22px;
    border-bottom: 1px solid #edf1f5;
}

.reading-head h1 {
    margin-bottom: 16px;
    font-size: var(--font-size-h1);
    font-weight: 400;
    letter-spacing: -0.045em;
    line-height: 1.02;
}

.article-head-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin-bottom: 16px;
    color: #8390a4;
    font-size: var(--font-size-ui);
}

.article-head-meta span {
    position: relative;
}

.article-head-meta span + span::before {
    content: '';
    display: inline-block;
    width: 1px;
    height: 12px;
    margin-right: 18px;
    background: #dbe2eb;
    vertical-align: -1px;
}

.lead {
    font-size: calc(var(--font-size-body) * 1.06);
    color: #5c687c;
    line-height: 1.75;
}

.reading-body {
    color: var(--text);
    font-size: var(--font-size-body);
    line-height: 1.82;
}

.reading-body h2,
.reading-body h3,
.reading-body h4 {
    margin-top: 42px;
    margin-bottom: 12px;
    color: var(--text);
    font-weight: 500;
}

.reading-body h2 {
    font-size: var(--font-size-h2);
}

.reading-body h3 {
    font-size: var(--font-size-h3);
}

.prose-block {
    margin: 20px 0;
    color: var(--text);
}

.content-section-block {
    margin: 26px 0;
    padding: 18px 0 6px;
    border-top: 1px solid #edf1f5;
}

.content-section-block.no-title {
    padding-top: 0;
}

.content-section-block.is-muted {
    padding: 18px 20px 10px;
    background: #f8fbff;
    border: 1px solid #e6edf5;
}

.content-section-block.has-title.is-muted {
    padding-top: 8px;
}

.content-section-block.is-muted.no-title {
    padding-top: 0;
}

.content-section-block.is-emphasis {
    padding: 20px 22px 12px;
    background: linear-gradient(180deg, rgba(79, 124, 255, 0.05), rgba(79, 124, 255, 0.015));
    border: 1px solid rgba(79, 124, 255, 0.14);
}

.content-section-block.is-emphasis.no-title {
    padding-top: 2px;
}

.content-section-block.is-spacing-compact {
    margin: 16px 0;
    padding-top: 12px;
}

.content-section-block.is-spacing-compact.no-title {
    padding-top: 0;
}

.content-section-block.is-spacing-loose {
    margin: 40px 0;
    padding-top: 26px;
}

.content-section-block.is-spacing-loose.no-title {
    padding-top: 8px;
}

.content-section-block.has-title.is-spacing-compact {
    padding-top: 14px;
}

.content-section-block.has-title.is-spacing-loose {
    padding-top: 8px;
}

.content-section-block.has-title.is-muted.is-spacing-loose {
    padding-top: 6px;
}

.content-section-head {
    margin-bottom: 8px;
}

.content-section-head h2 {
    margin-bottom: 0;
    line-height: 1.08;
}

.content-section-body {
    display: grid;
    gap: 16px;
}

.content-section-block.no-title > .content-section-body {
    gap: 12px;
}

.content-section-body > :first-child {
    margin-top: 0 !important;
    padding-top: 0;
}

.content-section-body > :first-child:is(h2, h3, h4, .prose-block, .content-row-block, .article-reference-block, .note-box, .download-card, .content-image, .faq-list, .steps-list) {
    margin-top: 0 !important;
    padding-top: 0;
}

.content-section-block.no-title > .content-section-body > h2:first-child,
.content-section-block.no-title > .content-section-body > h3:first-child,
.content-section-block.no-title > .content-section-body > h4:first-child {
    margin-top: 0 !important;
    margin-bottom: 8px;
    line-height: 1.02;
}

.content-section-block.is-spacing-compact .content-section-body {
    gap: 8px;
}

.content-section-block.is-spacing-compact .prose-block,
.content-section-block.is-spacing-compact .content-row-block,
.content-section-block.is-spacing-compact .article-reference-block,
.content-section-block.is-spacing-compact .note-box,
.content-section-block.is-spacing-compact .download-card,
.content-section-block.is-spacing-compact .content-image {
    margin-top: 10px;
    margin-bottom: 10px;
}

.content-row-block {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin: 24px 0;
}

.content-row-block.is-wide-left {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.72fr);
}

.content-row-block.is-wide-right {
    grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.35fr);
}

.content-row-block.is-three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.content-section-block.is-spacing-loose .content-section-body {
    gap: 28px;
}

.content-section-block.is-spacing-loose .prose-block,
.content-section-block.is-spacing-loose .content-row-block,
.content-section-block.is-spacing-loose .article-reference-block,
.content-section-block.is-spacing-loose .note-box,
.content-section-block.is-spacing-loose .download-card,
.content-section-block.is-spacing-loose .content-image {
    margin-top: 30px;
    margin-bottom: 30px;
}

.content-row-column {
    min-width: 0;
}

.content-row-column > :first-child {
    margin-top: 0 !important;
    padding-top: 0;
}

.content-row-column > :first-child:is(h2, h3, h4, .prose-block, .article-reference-block, .note-box, .download-card, .content-image, .faq-list, .steps-list) {
    margin-top: 0 !important;
    padding-top: 0;
}

.back-link {
    margin-bottom: 22px;
    color: #6c7890;
    font-size: 0.96rem;
}

.back-link:hover {
    color: var(--primary);
}

.note-box {
    background: #f7fbff;
    border: 1px solid #d6e8f5;
    padding: 18px;
    border-radius: 0;
    margin: 18px 0;
}

.note-box strong,
.note-box p { color: var(--text); }

.article-reference-block {
    display: grid;
    gap: 16px;
    margin: 22px 0;
    padding: 18px 20px;
    border: 1px solid #e2e8f0;
    border-left: 4px solid var(--primary);
    background: #fbfcff;
}

.article-reference-block.is-empty,
.article-reference-block.is-warning {
    border-left-color: #d9a441;
    background: #fffaf0;
}

.article-reference-head {
    display: grid;
    gap: 6px;
}

.article-reference-head h3 {
    margin: 0;
    font-size: calc(var(--font-size-h3) * 0.94);
    line-height: 1.2;
}

.article-reference-head p,
.article-reference-block.is-empty p,
.article-reference-block.is-warning p {
    margin: 0;
    color: var(--muted);
}

.article-reference-body {
    display: grid;
    gap: 12px;
}

.article-reference-body > :first-child {
    margin-top: 0 !important;
}

.steps-list {
    display: grid;
    gap: 12px;
    padding-left: 22px;
}

.steps-list li {
    color: var(--text);
    padding-left: 4px;
}

.content-image {
    margin: 22px 0;
}

.content-image img {
    border-radius: 0;
    border: 1px solid var(--line);
    box-shadow: none;
}

.content-image figcaption {
    margin-top: 10px;
    color: var(--muted);
    font-size: 0.92rem;
}

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

.faq-list details {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    padding: 14px 16px;
}

.faq-list summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--text);
}

.download-card {
    background: #f9fbff;
    border: 1px solid var(--line);
    padding: 18px;
    border-radius: 18px;
    margin: 18px 0;
}

.download-card a {
    color: var(--primary);
    font-weight: 700;
}

.content-divider {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 26px 0;
    color: #8591a8;
    font-size: 0.84rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.content-divider::before,
.content-divider::after {
    content: "";
    flex: 1 1 auto;
    height: 1px;
    background: #e3e9f1;
}

.content-divider.is-space {
    display: block;
    height: 18px;
    margin: 24px 0;
}

.cta-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px 24px;
    align-items: center;
    padding: 22px;
    margin: 22px 0;
    border: 1px solid #d7e0ee;
    background: linear-gradient(180deg, #f9fbff 0%, #f3f7fd 100%);
}

.cta-card.is-muted {
    background: #f7f9fc;
    border-color: #e2e7ef;
}

.cta-card h3,
.cta-card p {
    margin: 0;
}

.cta-card h3,
.cta-card p,
.cta-card > :not(.cta-button) {
    grid-column: 1;
}

.cta-card p {
    color: var(--text);
}

.cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    padding: 10px 16px;
    background: var(--primary);
    color: #fff;
    font-weight: 700;
    border-radius: 0;
}

.content-button-wrap {
    margin: 20px 0;
}

.content-button-group {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 20px 0;
}

.content-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border: 1px solid transparent;
    font-weight: 700;
    border-radius: 0;
}

.content-button.is-primary {
    background: var(--primary);
    color: #fff;
}

.content-button.is-secondary {
    background: #f4f7fb;
    border-color: #d6deea;
    color: var(--text);
}

.content-button.is-ghost {
    background: transparent;
    border-color: #ccd6e4;
    color: var(--text);
}

.content-hero {
    display: grid;
    gap: 14px;
    padding: 28px;
    margin: 24px 0;
    border: 1px solid #d8e1ef;
    background: linear-gradient(180deg, #f9fbff 0%, #f2f7fd 100%);
}

.content-hero.is-muted {
    background: #f7f9fc;
    border-color: #e2e7ef;
}

.content-hero h2,
.content-hero p {
    margin: 0;
}

.content-hero p {
    color: var(--text);
    max-width: 72ch;
}

.content-embed {
    display: grid;
    gap: 10px;
    margin: 22px 0;
}

.content-embed-frame {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    background: #0f1724;
}

.content-embed-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.content-embed-fallback {
    display: grid;
    gap: 8px;
    padding: 18px;
    border: 1px solid var(--line);
    background: #f9fbff;
}

.content-embed-fallback strong {
    color: var(--text);
}

.content-embed-fallback a {
    color: var(--primary);
    word-break: break-all;
}

.block-editor {
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 18px;
    background: #fbfcff;
}

.block-editor-workspace {
    display: block;
}

.article-editor-shell {
    display: grid;
    gap: 18px;
    width: 100%;
}

.article-editor-shell + .content-grid {
    margin-top: 22px;
    margin-bottom: 22px;
}

.article-history-total {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 9px;
    border-radius: 6px;
    background: var(--shell-accent-soft, color-mix(in srgb, var(--primary) 9%, #fff));
    color: var(--primary);
    font-size: 0.7rem;
    font-weight: 750;
}

.article-history-list {
    display: grid;
    border: 1px solid var(--line);
    border-radius: 7px;
    overflow: hidden;
}

.article-history-item {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    min-height: 68px;
    padding: 11px 13px;
    background: #fff;
    border-bottom: 1px solid var(--line);
}

.article-history-item:last-child {
    border-bottom: 0;
}

.article-history-number {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 6px;
    background: color-mix(in srgb, var(--primary) 8%, #fff);
    color: var(--primary);
    font-size: 0.72rem;
    font-weight: 800;
}

.article-history-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.article-history-copy strong {
    color: var(--text);
    font-size: 0.8rem;
}

.article-history-copy > span,
.article-history-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.article-history-copy > span {
    color: var(--text);
    font-size: 0.75rem;
}

.article-history-copy small {
    color: var(--muted);
    font-size: 0.67rem;
}

.article-history-restore {
    margin: 0;
}

.article-editor-context-note {
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid #c9ead6;
    background: #eef9f3;
    color: #1d6a48;
    box-shadow: 0 8px 22px rgba(23, 32, 51, 0.04);
}

.article-editor-recovery-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 12px;
    border: 1px solid rgba(79, 124, 255, 0.18);
    border-radius: 12px;
    background: rgba(238, 244, 255, 0.98);
}

.article-editor-recovery-banner[hidden] {
    display: none !important;
}

.article-editor-recovery-banner span {
    color: #305abf;
    font-size: 0.86rem;
    font-weight: 600;
}

.article-editor-recovery-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.article-editor-state-card {
    display: grid;
    gap: 4px;
    min-height: var(--control-height);
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fbfcff;
}

.article-editor-state-card strong {
    color: var(--text);
    font-size: 0.96rem;
}

.workflow-split-button {
    display: inline-grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    min-width: min(320px, 100%);
}

.workflow-split-button > .btn {
    border-radius: 12px 0 0 12px;
}

.workflow-split-menu {
    position: relative;
}

.workflow-split-menu[open] {
    z-index: 4;
}

.workflow-split-toggle {
    min-width: 44px;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 0 12px 12px 0;
}

.workflow-split-toggle::marker,
.workflow-split-toggle::-webkit-details-marker {
    display: none;
}

.workflow-split-list {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 240px;
    display: grid;
    gap: 6px;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 16px 36px rgba(23, 32, 51, 0.14);
}

.workflow-split-list .btn {
    width: 100%;
    justify-content: flex-start;
}

.article-editor-autosave-status {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    min-height: 28px;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(127, 138, 157, 0.24);
    background: rgba(247, 250, 255, 0.96);
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.article-editor-autosave-status[data-state="pending"],
.article-editor-autosave-status[data-state="saving"] {
    color: #6d4b0f;
    border-color: rgba(217, 146, 20, 0.24);
    background: rgba(255, 247, 229, 0.96);
}

.article-editor-autosave-status[data-state="saved"] {
    color: #1d6a48;
    border-color: rgba(47, 143, 100, 0.22);
    background: rgba(238, 249, 243, 0.98);
}

.article-editor-autosave-status[data-state="error"] {
    color: #9d2a37;
    border-color: rgba(201, 80, 89, 0.24);
    background: rgba(255, 242, 243, 0.98);
}

.article-editor-grid {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr;
    gap: 18px;
    align-items: start;
}

.article-editor-journey {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 18px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 6px 18px rgba(20, 31, 51, 0.05);
}

.article-editor-command-bar {
    position: sticky;
    top: calc(var(--topbar-height) + 10px);
    z-index: 20;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 12px 28px rgba(23, 32, 51, 0.09);
    backdrop-filter: blur(14px);
    transition: top 0.28s ease, border-color 0.18s ease;
}

.article-editor-command-bar .article-editor-journey {
    min-width: 0;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
    border: 0;
    border-radius: inherit;
    background: transparent;
    box-shadow: none;
}

.article-editor-command-tools {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    border-left: 1px solid var(--line);
}

.article-editor-command-toggle,
.article-editor-command-close {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fff;
    color: var(--text);
    cursor: pointer;
    transition: color 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.article-editor-command-toggle:hover,
.article-editor-command-close:hover {
    color: var(--primary);
    border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
    background: color-mix(in srgb, var(--primary) 5%, #fff);
}

.article-editor-command-toggle svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.article-editor-command-toggle {
    width: auto;
    min-width: 108px;
    padding: 0 14px;
    display: inline-flex;
    gap: 8px;
    border-color: #11141c;
    background: #11141c;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 750;
}

.article-editor-command-toggle:hover {
    border-color: #242936;
    background: #242936;
    color: #fff;
}

.article-editor-command-close {
    font-size: 1.35rem;
    line-height: 1;
}

.article-editor-command-panel {
    position: absolute;
    inset: 0;
    left: auto;
    width: min(430px, 100%);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 8px 10px;
    border-radius: inherit;
    background: rgba(255, 255, 255, 0.99);
    box-shadow: -14px 0 30px rgba(23, 32, 51, 0.09);
    transform: translateX(100%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: transform 0.24s ease, opacity 0.18s ease, visibility 0s linear 0.24s;
}

.article-editor-command-bar.is-actions-open .article-editor-command-panel {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition-delay: 0s;
}

.article-editor-journey a {
    position: relative;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 10px;
    padding: 14px 16px;
    border-right: 1px solid var(--line);
    transition: background 0.16s ease;
}

.article-editor-journey a:last-child {
    border-right: 0;
}

.article-editor-journey a:hover {
    background: color-mix(in srgb, var(--primary) 6%, #fff);
}

.article-editor-journey a > span {
    grid-row: 1 / 3;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    align-self: center;
    border-radius: 50%;
    color: var(--primary);
    background: color-mix(in srgb, var(--primary) 10%, #fff);
    font-size: 0.72rem;
    font-weight: 800;
}

.article-editor-journey strong {
    color: var(--text);
    font-size: 0.77rem;
    line-height: 1.3;
}

.article-editor-journey small {
    overflow: hidden;
    color: var(--muted);
    font-size: 0.64rem;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#article-structure,
#article-search-signals,
#article-content,
#article-publishing {
    scroll-margin-top: calc(var(--topbar-height) + 92px);
}

.article-editor-grid > fieldset {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr;
    gap: 18px;
    align-items: start;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.article-editor-main,
.article-editor-sidebar {
    display: grid;
    gap: 18px;
}

.article-editor-secondary {
    display: grid;
    gap: 18px;
}

.article-editor-sidebar {
    position: fixed;
    top: calc(var(--topbar-height) + 18px);
    right: 18px;
    z-index: 52;
    width: min(500px, calc(100vw - 36px));
    max-height: calc(100vh - var(--topbar-height) - 36px);
    overflow: auto;
    padding-right: 2px;
    transform: translateX(calc(100% + 26px));
    opacity: 0;
    pointer-events: none;
    align-content: start;
    transition: top 0.28s ease, transform 0.22s ease, opacity 0.22s ease;
}

.article-editor-panel {
    display: grid;
    gap: 18px;
}

.editor-focus-backdrop {
    display: none;
}

.article-editor-settings-backdrop {
    position: fixed;
    inset: 0;
    z-index: 51;
    display: block;
    background: rgba(12, 19, 34, 0.42);
    backdrop-filter: blur(4px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
}

.article-editor-panel[data-focus-surface].is-focus-mode {
    position: fixed;
    inset: 20px 24px;
    z-index: 64;
    margin: 0;
    padding: 0;
    overflow: auto;
    border-radius: 22px;
    background: linear-gradient(180deg, #fdfefe 0%, #f6f9fd 100%);
    border-color: rgba(255, 255, 255, 0.72);
    box-shadow: 0 28px 80px rgba(10, 16, 30, 0.26);
}

.article-editor-panel[data-focus-surface].is-focus-mode .block-editor {
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0 28px 28px;
    min-height: calc(100vh - 180px);
}

.article-editor-panel[data-focus-surface].is-focus-mode .block-editor-workspace {
    min-height: calc(100vh - 260px);
}

.article-editor-panel[data-focus-surface].is-focus-mode .article-editor-section-head {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 22px 28px 14px;
    background: rgba(253, 254, 255, 0.92);
    border-bottom: 1px solid rgba(230, 234, 243, 0.9);
    backdrop-filter: blur(14px);
}

.article-editor-panel[data-focus-surface].is-focus-mode > .hint {
    margin: 0;
    padding: 0 28px 26px;
}

body.is-editor-focus-open .editor-focus-backdrop {
    position: fixed;
    inset: 0;
    z-index: 63;
    display: block;
    background: rgba(10, 14, 24, 0.58);
    backdrop-filter: blur(8px);
}

.article-editor-sticky {
    position: static;
    top: auto;
    align-self: auto;
    max-height: none;
    overflow: visible;
}

.article-editor-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.article-editor-collapsible {
    padding: 0 !important;
    overflow: hidden;
}

.article-editor-collapsible > summary {
    min-height: 72px;
    padding: 17px 20px;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.article-editor-collapsible > summary::-webkit-details-marker {
    display: none;
}

.article-editor-collapsible[open] > summary {
    border-bottom: 1px solid var(--line);
}

.article-editor-collapse-control {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 650;
}

.article-editor-collapse-control i {
    width: 9px;
    height: 9px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translate(-1px, -1px);
    transition: transform 0.18s ease;
}

.article-editor-collapsible[open] .article-editor-collapse-control i {
    transform: rotate(225deg) translate(-1px, -1px);
}

.article-editor-collapsible-body {
    display: grid;
    gap: 18px;
    padding: 20px;
}

.article-editor-section-head h3 {
    margin-bottom: 4px;
}

.search-metadata-panel {
    border: 1px solid #d9e2ef;
    border-radius: 18px;
    background: linear-gradient(180deg, #fbfcff 0%, #f6f9fd 100%);
    overflow: hidden;
}

.search-metadata-panel > summary {
    padding: 18px;
    cursor: pointer;
    list-style: none;
}

.search-metadata-panel > summary::-webkit-details-marker {
    display: none;
}

.search-metadata-panel[open] > summary {
    border-bottom: 1px solid #e3e9f2;
}

.search-metadata-body {
    display: grid;
    gap: 14px;
    padding: 18px;
}

.article-taxonomy-panel {
    margin-top: 8px;
    padding: 20px;
    border: 1px solid #e2e8f0;
    background: #fafbfd;
}

.article-taxonomy-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
    gap: 24px;
    margin-top: 16px;
}

.article-taxonomy-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 8px;
    max-height: 220px;
    overflow: auto;
}

.article-taxonomy-options label {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 10px;
    border: 1px solid #e4e9f0;
    background: #fff;
    cursor: pointer;
}

.article-taxonomy-options input {
    width: auto;
}

.article-taxonomy-grid textarea {
    width: 100%;
}

.article-taxonomy-grid small {
    color: var(--muted);
}

.search-metadata-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.search-metadata-head strong {
    display: block;
    margin-bottom: 4px;
    font-size: 0.98rem;
}

.search-metadata-head p {
    margin: 0;
    color: var(--muted);
    font-size: 0.92rem;
    line-height: 1.55;
}

.search-metadata-state {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
}

.search-metadata-state i {
    width: 9px;
    height: 9px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform .18s ease;
}

.search-metadata-panel[open] .search-metadata-state i {
    transform: rotate(225deg);
}

.ai-signal-conflict-backdrop {
    position: fixed;
    inset: 0;
    z-index: 300;
    background: rgba(15, 23, 42, .58);
    backdrop-filter: blur(4px);
}

.ai-signal-conflict-dialog {
    position: fixed;
    z-index: 301;
    top: 50%;
    left: 50%;
    width: min(960px, calc(100vw - 36px));
    max-height: min(820px, calc(100vh - 36px));
    padding: 24px;
    overflow: auto;
    border: 1px solid #dce3ed;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 28px 90px rgba(15, 23, 42, .28);
    transform: translate(-50%, -50%);
}

.ai-signal-conflict-head h2 {
    margin: 5px 0 7px;
}

.ai-signal-conflict-head p {
    margin: 0;
    color: var(--muted);
}

.ai-signal-conflict-tools,
.ai-signal-conflict-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
}

.ai-signal-conflict-groups {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 20px;
}

.ai-signal-conflict-group {
    min-width: 0;
    padding: 16px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #f8fafc;
}

.ai-signal-conflict-group h3 {
    margin: 0 0 12px;
    font-size: .95rem;
}

.ai-signal-conflict-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 3px 10px;
    align-items: start;
    padding: 10px 0;
    border-top: 1px solid #e5eaf1;
    cursor: pointer;
}

.ai-signal-conflict-row input {
    grid-row: 1 / span 2;
    width: auto;
    margin-top: 2px;
}

.ai-signal-conflict-row span {
    overflow-wrap: anywhere;
    font-size: .88rem;
    font-weight: 750;
}

.ai-signal-conflict-row small {
    color: var(--muted);
    font-size: .72rem;
}

.ai-signal-conflict-actions {
    justify-content: flex-end;
    padding-top: 18px;
    border-top: 1px solid #e5eaf1;
}

.search-metadata-actions,
.search-metadata-inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.search-metadata-inline-actions {
    margin-top: 8px;
}

.article-editor-actions {
    display: grid;
}

.article-editor-settings-close {
    display: inline-flex;
}

.article-editor-compact-copy {
    display: grid;
    gap: 2px;
}

.article-editor-compact-copy strong {
    font-size: 0.95rem;
}

.article-editor-compact-copy small {
    color: var(--muted);
    font-size: 0.84rem;
}

.article-editor-compact-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: nowrap;
}

.workflow-publish-list {
    width: min(390px, calc(100vw - 32px));
    min-width: min(390px, calc(100vw - 32px));
    max-height: calc(100vh - var(--topbar-height) - 110px);
    overflow-y: auto;
    gap: 9px;
    padding: 12px;
}

.workflow-publish-head {
    display: grid;
    gap: 2px;
    padding: 2px 2px 10px;
    border-bottom: 1px solid var(--line);
}

.workflow-publish-head > span,
.workflow-publish-label,
.workflow-publish-field > span {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 750;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.workflow-publish-head strong {
    color: var(--text);
    font-size: 0.88rem;
}

.workflow-publish-head small {
    color: var(--muted);
    font-size: 0.7rem;
}

.workflow-publish-field {
    display: grid;
    gap: 6px;
    text-align: left;
}

.workflow-publish-field > span small {
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
}

.workflow-publish-field select,
.workflow-publish-field textarea {
    width: 100%;
}

.workflow-publish-field textarea {
    min-height: 72px;
    resize: vertical;
}

.workflow-publish-label {
    padding: 5px 2px 0;
}

.workflow-publish-list .btn {
    min-height: 38px;
    border-radius: 6px;
}

.article-editor-command-panel .workflow-split-button > .btn-primary,
.article-editor-command-panel .workflow-split-toggle {
    border-color: #11141c;
    background: #11141c;
    color: #fff;
    box-shadow: 0 4px 10px rgba(17, 20, 28, 0.18);
}

.article-editor-command-panel .workflow-split-button > .btn-primary:hover,
.article-editor-command-panel .workflow-split-toggle:hover {
    border-color: #242936;
    background: #242936;
}

body.is-editor-settings-open .article-editor-sidebar {
    transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
}

body.is-editor-settings-open .article-editor-settings-backdrop {
    opacity: 1;
    pointer-events: auto;
}

body.is-topbar-hidden .article-editor-command-bar {
    top: 10px;
}

body.is-topbar-hidden .article-editor-sidebar {
    top: 18px;
}

.block-toolbar {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 18px;
}

.blocks-list {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.block-item {
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
    padding: 14px;
    transition: border-color 120ms ease, box-shadow 120ms ease, background 120ms ease;
}

.block-item:has(.nested-block-area) {
    background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
    border-color: #d8e1ef;
}

.block-item:has(.layout-row-editor) {
    background: linear-gradient(180deg, #fbfcff 0%, #f3f7fc 100%);
    border-color: #d4ddea;
}

.block-item.is-selected {
    border-color: rgba(79, 124, 255, 0.38);
    box-shadow: 0 0 0 4px rgba(79, 124, 255, 0.08);
    background: #fcfdff;
}

.block-item.is-dragging {
    opacity: 0.45;
}

.block-item.is-drop-target {
    border-color: rgba(79, 124, 255, 0.42);
    box-shadow: 0 0 0 4px rgba(79, 124, 255, 0.1);
}

.block-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.block-meta,
.block-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}

.block-edit-trigger {
    width: 38px;
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f6f8fc;
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.95rem;
}

.block-edit-trigger:hover {
    background: #eef3ff;
    color: var(--primary);
    border-color: rgba(79, 124, 255, 0.24);
}

.block-grab {
    width: 38px;
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f6f8fc;
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: grab;
    font-weight: 700;
    letter-spacing: -0.08em;
}

.block-grab:active {
    cursor: grabbing;
}

.block-type-pill {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(79, 124, 255, 0.1);
    color: var(--primary);
    font-size: 0.8rem;
    font-weight: 600;
}

.block-menu {
    position: relative;
}

.block-menu summary {
    list-style: none;
}

.block-menu summary::-webkit-details-marker {
    display: none;
}

.block-menu-trigger {
    width: 38px;
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f6f8fc;
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.block-menu[open] .block-menu-trigger {
    background: #eef3ff;
    color: var(--primary);
    border-color: rgba(79, 124, 255, 0.24);
}

.block-menu-list {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 5;
    min-width: 180px;
    display: grid;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 14px 32px rgba(23, 32, 51, 0.12);
}

.block-body {
    display: grid;
    gap: 12px;
}

.block-summary {
    display: grid;
    gap: 4px;
}

.block-summary strong {
    font-size: 0.95rem;
}

.block-summary p {
    margin: 0;
    color: var(--muted);
    font-size: 0.92rem;
}

.block-item:has(.nested-block-area) .block-summary {
    padding: 10px 12px;
    border: 1px solid #e3eaf4;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.82);
}

.block-item:not(:has(.nested-block-area)):not(:has(.layout-row-editor)) {
    padding: 12px;
}

.block-item:not(:has(.nested-block-area)):not(:has(.layout-row-editor)) .block-head {
    margin-bottom: 8px;
}

.block-item:not(:has(.nested-block-area)):not(:has(.layout-row-editor)) .block-summary {
    gap: 2px;
}

.block-settings-head p {
    margin: 0;
}

.block-settings-head {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: flex-start;
}

.block-settings-head h4 {
    margin: 8px 0 6px;
    font-size: 1.06rem;
}

.block-settings-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
    color: #7a869d;
    font-size: 0.82rem;
    line-height: 1.45;
}

.block-settings-breadcrumb span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.block-settings-breadcrumb span:not(:last-child)::after {
    content: ">";
    color: #a4aec0;
}

.block-settings-body {
    display: grid;
    gap: 14px;
}

.block-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 62;
    background: rgba(14, 22, 37, 0.42);
    backdrop-filter: blur(3px);
}

.block-modal {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 63;
    width: min(760px, calc(100vw - 32px));
    max-height: min(82vh, 920px);
    overflow: auto;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 28px 70px rgba(23, 32, 51, 0.2);
}

body.is-editor-focus-open .block-modal-backdrop {
    background: rgba(10, 14, 24, 0.18);
    backdrop-filter: blur(2px);
}

body.is-editor-focus-open .block-modal {
    left: 28px;
    right: 28px;
    top: 28px;
    bottom: 28px;
    transform: none;
    z-index: 65;
    width: auto;
    max-height: none;
    padding: 0;
    border-radius: 20px;
    border: 1px solid rgba(230, 234, 243, 0.9);
    background: linear-gradient(180deg, #ffffff 0%, #f7f9fd 100%);
    box-shadow: 0 24px 70px rgba(10, 16, 30, 0.18);
}

.block-modal-head {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
    margin-bottom: 16px;
}

body.is-editor-focus-open .block-modal-head {
    position: sticky;
    top: 0;
    z-index: 2;
    margin-bottom: 0;
    padding: 22px 24px 14px;
    background: rgba(255, 255, 255, 0.92);
    border-bottom: 1px solid rgba(230, 234, 243, 0.92);
    backdrop-filter: blur(12px);
}

.block-modal-body {
    display: grid;
    gap: 14px;
}

body.is-editor-focus-open .block-modal-body {
    padding: 22px 24px 24px;
    align-content: start;
}

.block-modal-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: 4px;
}

body.is-editor-focus-open .block-modal-actions {
    position: sticky;
    bottom: 0;
    margin: 0 -24px -24px;
    padding: 16px 24px 20px;
    background: rgba(255, 255, 255, 0.94);
    border-top: 1px solid rgba(230, 234, 243, 0.92);
    backdrop-filter: blur(12px);
}

.block-settings-note {
    padding: 14px 16px;
    border: 1px solid var(--line);
    background: #f8fbff;
    color: var(--muted);
}

.block-settings-note p {
    margin: 0;
}

.article-reference-picker-field {
    min-width: 0;
}

.article-reference-picker {
    display: grid;
    gap: 10px;
}

.article-reference-selected {
    display: grid;
    gap: 3px;
    padding: 10px 12px;
    border: 1px solid #e5eaf2;
    border-radius: 6px;
    background: #f8fbff;
}

.article-reference-selected span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
}

.article-reference-selected strong {
    color: var(--text);
    font-size: 0.94rem;
    line-height: 1.35;
}

.article-reference-picker input[type="search"] {
    width: 100%;
}

.article-reference-results {
    display: grid;
    gap: 4px;
    max-height: 280px;
    padding: 6px;
    overflow-y: auto;
    border: 1px solid #d9dfeb;
    border-radius: 6px;
    background: #fff;
}

.article-reference-option {
    display: grid;
    gap: 2px;
    width: 100%;
    min-height: 44px;
    padding: 8px 10px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: var(--text);
    text-align: left;
    cursor: pointer;
}

.article-reference-option[hidden] {
    display: none !important;
}

.article-reference-option:hover,
.article-reference-option:focus,
.article-reference-option.is-selected {
    outline: 0;
    background: #f4f7fc;
}

.article-reference-option strong {
    font-size: 0.94rem;
    line-height: 1.32;
}

.article-reference-option small {
    color: var(--muted);
    font-size: 0.82rem;
}

.block-library-backdrop {
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(14, 22, 37, 0.36);
    backdrop-filter: blur(3px);
}

.block-library {
    position: fixed;
    inset: 8vh 6vw auto;
    z-index: 61;
    max-height: 78vh;
    overflow: auto;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 24px 60px rgba(23, 32, 51, 0.22);
}

.block-library-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 18px;
}

.block-library-head h4 {
    margin: 0 0 6px;
    font-size: 1.18rem;
}

.block-library-head p {
    margin: 0;
    color: var(--muted);
}

.block-library-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}

.block-library-tab {
    padding: 10px 14px;
    border: 1px solid var(--line);
    background: #f8fbff;
    color: var(--muted);
    font-weight: 600;
    cursor: pointer;
    border-radius: 999px;
}

.block-library-tab.is-active {
    background: rgba(79, 124, 255, 0.1);
    color: var(--primary);
    border-color: rgba(79, 124, 255, 0.2);
}

.block-library-groups {
    display: grid;
    gap: 20px;
}

.block-library-group {
    display: grid;
    gap: 10px;
}

.block-library-group h5 {
    margin: 0;
    font-size: 0.88rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #7b879d;
}

.block-library-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px;
}

.block-library-item {
    display: grid;
    gap: 6px;
    text-align: left;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fbfcff;
    cursor: pointer;
    transition: border-color 120ms ease, transform 120ms ease, box-shadow 120ms ease;
}

.block-library-item:hover {
    border-color: rgba(79, 124, 255, 0.32);
    box-shadow: 0 10px 26px rgba(79, 124, 255, 0.08);
    transform: translateY(-1px);
}

.block-library-item strong {
    font-size: 0.96rem;
}

.block-library-item span {
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.45;
}

.nested-block-area {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px dashed #ccd7e7;
    border-radius: 16px;
    background: rgba(248, 250, 255, 0.88);
}

.nested-block-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.nested-block-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.nested-block-list {
    display: grid;
    gap: 12px;
    min-height: 34px;
}

.nested-block-list.is-drop-target {
    outline: 2px dashed rgba(79, 124, 255, 0.38);
    outline-offset: 4px;
}

.layout-row-editor {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.layout-row-editor.is-three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.layout-row-editor > .nested-block-area {
    min-height: 180px;
}

.nested-block-toolbar .btn,
.block-toolbar .btn {
    border-style: dashed;
}

.hint {
    margin-top: 10px;
    font-size: 0.92rem;
}

.manual-picker {
    display: grid;
    gap: 12px;
}

.manual-option {
    display: grid;
    grid-template-columns: auto 1fr 80px;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
}

.sort-input {
    text-align: center;
}

.branding-preview {
    border-radius: 24px;
    border: 1px solid var(--line);
    overflow: hidden;
    background: #fff;
}

.branding-logo-preview {
    display: grid;
    gap: 10px;
    justify-items: start;
    padding: 14px;
    border: 1px solid var(--line);
    background: #fbfcff;
}

.branding-logo-preview img {
    max-height: 72px;
    width: auto;
    object-fit: contain;
}

.branding-preview-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 22px 24px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--preview-primary) 28%, var(--preview-header-bg)) 0%, var(--preview-header-bg) 100%);
}

.branding-preview--solid .branding-preview-header {
    background: var(--preview-header-bg);
}

.branding-preview--minimal .branding-preview-header {
    background: var(--preview-search-bg);
    border-bottom: 1px solid #e6edf5;
}

.branding-preview-brand,
.branding-preview-nav,
.branding-preview-search,
.branding-preview-content {
    display: flex;
    align-items: center;
}

.branding-preview-brand {
    gap: 12px;
}

.branding-preview-brand img {
    max-height: var(--preview-logo-height);
    width: auto;
    object-fit: contain;
}

.branding-preview-logo-fallback {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--preview-primary), var(--preview-secondary));
    color: #fff;
    font-weight: 700;
}

.branding-preview-header strong,
.branding-preview-nav span {
    color: var(--preview-header-text);
}

.branding-preview--minimal .branding-preview-header strong,
.branding-preview--minimal .branding-preview-nav span {
    color: var(--preview-header-text);
}

.branding-preview-nav {
    gap: 16px;
    flex-wrap: wrap;
}

.branding-preview-nav span {
    font-size: 0.9rem;
}

.branding-preview-search {
    gap: 0;
    padding: 24px;
    background: var(--preview-subnav-bg);
    border-bottom: 1px solid #edf1f5;
}

.branding-preview-search input {
    flex: 1 1 auto;
    border: 0;
    padding: 16px 18px;
    background: var(--preview-search-bg);
    color: #8a96ab;
}

.branding-preview-search span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 104px;
    padding: 16px 18px;
    background: var(--preview-accent);
    color: #102537;
    font-weight: 600;
}

.branding-preview-subnav {
    display: flex;
    gap: 8px;
    padding: 14px 24px;
    border-bottom: 1px solid #edf1f5;
    background: var(--preview-subnav-bg);
}

.branding-preview-content {
    align-items: stretch;
    gap: 28px;
    padding: 24px;
}

.branding-preview-content article,
.branding-preview-content aside {
    flex: 1 1 0;
}

.branding-preview-content aside {
    padding-left: 24px;
    border-left: 1px solid #edf1f5;
}

.branding-preview-kicker {
    display: inline-block;
    margin-bottom: 12px;
    color: #7f8a9d;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.branding-hero {
    padding: 24px;
}

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

.branding-cards article {
    background: rgba(255,255,255,0.88);
    border: 1px solid rgba(255,255,255,0.8);
    border-radius: 18px;
    padding: 18px;
}

.story-map-board-shell {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dfe4eb;
    border-radius: 10px;
    background: #f4f6f9;
}

.story-map-editor {
    display: grid;
    gap: 16px;
}

.story-map-import-panel {
    margin-top: 18px;
}

.story-map-import-actions {
    margin-top: 16px;
}

.story-map-editor-head,
.story-map-board-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
}

.story-map-editor-head {
    min-height: 76px;
    padding: 14px 16px 14px 2px;
    border-bottom: 1px solid #e2e6ec;
}

.story-map-editor-head h2 {
    margin: 2px 0 3px;
    color: var(--shell-text, var(--text));
    font-size: 1.42rem;
    letter-spacing: -0.025em;
}

.story-map-editor-head p {
    margin: 0;
    color: var(--muted);
    font-size: 0.8rem;
}

.story-map-editor-kicker,
.story-map-board-toolbar span {
    color: #8a95a6;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.story-map-editor-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

.story-map-meta-panel {
    position: relative;
}

.story-map-meta-panel > summary {
    list-style: none;
    cursor: pointer;
}

.story-map-meta-panel > summary::-webkit-details-marker {
    display: none;
}

.story-map-meta-popover {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 45;
    width: min(620px, calc(100vw - 56px));
    padding: 22px;
    border: 1px solid #dce2e9;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 22px 54px rgba(24, 34, 50, 0.17);
}

.story-map-meta-popover > div:first-child {
    display: grid;
    gap: 3px;
    margin-bottom: 18px;
}

.story-map-meta-popover small {
    color: var(--muted);
}

.story-map-board-toolbar {
    min-height: 52px;
    padding: 8px 12px 8px 18px;
    border-bottom: 1px solid #dfe4eb;
    background: #fff;
}

.story-map-board-toolbar > div {
    display: grid;
    gap: 2px;
}

.story-map-board-toolbar strong {
    font-size: 0.82rem;
}

.story-map-board {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    align-items: flex-start;
    min-height: 460px;
    padding: 18px;
}

.story-map-activity {
    border: 1px solid #d9dfe7;
    border-radius: 10px;
    background: #eef1f5;
    padding: 14px;
    display: grid;
    gap: 14px;
    min-width: 320px;
    width: max-content;
    flex: 0 0 auto;
}

.story-map-activity.is-dragging,
.story-map-step.is-dragging,
.story-map-feature.is-dragging {
    opacity: 0.45;
    transform: scale(0.985);
}

.story-map-drop-slot {
    position: relative;
    width: 0;
    min-width: 0;
    align-self: stretch;
    border-radius: 999px;
    opacity: 0;
    pointer-events: none;
    transition: background 0.18s ease, box-shadow 0.18s ease;
}

.story-map-drop-slot::after {
    content: '';
    position: absolute;
    inset: 0;
    margin: auto;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(79, 124, 255, 0.75), rgba(120, 95, 255, 0.92));
    box-shadow: 0 0 0 1px rgba(79, 124, 255, 0.12);
    opacity: 0;
    transform: scale(0.72);
    transition: opacity 0.16s ease, transform 0.16s ease;
}

.story-map-drop-slot.is-step-slot,
.story-map-drop-slot.is-feature-slot {
    width: 100%;
    min-width: 0;
    min-height: 0;
    height: 0;
}

.story-map-drop-slot.is-step-slot {
    width: 0;
    min-width: 0;
    align-self: stretch;
}

.story-map-drop-slot.is-feature-slot {
    width: 100%;
    min-width: 100%;
    align-self: auto;
}

.story-map-drop-slot[data-story-map-drop-slot="activity"]::after {
    width: 6px;
    height: 100%;
    min-height: 140px;
}

.story-map-drop-slot[data-story-map-drop-slot="step"]::after {
    width: 6px;
    height: 100%;
    min-height: 240px;
}

.story-map-drop-slot[data-story-map-drop-slot="feature"]::after {
    width: 100%;
    height: 6px;
}

.story-map-board.is-dragging-activity .story-map-drop-slot[data-story-map-drop-slot="activity"],
.story-map-board.is-dragging-step .story-map-drop-slot[data-story-map-drop-slot="step"],
.story-map-board.is-dragging-feature .story-map-drop-slot[data-story-map-drop-slot="feature"] {
    opacity: 1;
    pointer-events: auto;
}

.story-map-board.is-dragging-activity .story-map-drop-slot[data-story-map-drop-slot="activity"] {
    width: 18px;
    min-width: 18px;
}

.story-map-board.is-dragging-step .story-map-drop-slot[data-story-map-drop-slot="step"],
.story-map-board.is-dragging-feature .story-map-drop-slot[data-story-map-drop-slot="feature"] {
    min-height: 10px;
    height: 10px;
}

.story-map-board.is-dragging-step .story-map-drop-slot[data-story-map-drop-slot="step"] {
    width: 14px;
    min-width: 14px;
    min-height: auto;
    height: auto;
}

.story-map-activity-create {
    min-width: 300px;
    background: #f8fafc;
    border-style: dashed;
}

.story-map-activity-head,
.story-map-step-head,
.story-map-feature-head,
.story-map-meta,
.story-map-activity-title,
.story-map-item-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.story-map-activity-title {
    justify-content: flex-start;
    flex: 1 1 auto;
    min-width: 0;
}

.story-map-item-actions {
    margin-left: auto;
    flex: 0 0 auto;
}

.story-map-activity-title h3,
.story-map-step-head strong,
.story-map-feature-head strong {
    margin: 0;
}

.story-map-activity-title h3 {
    font-size: 0.94rem;
    letter-spacing: -0.015em;
}

.story-map-activity-title small,
.story-map-step-head small {
    color: #8490a2;
    font-size: 0.68rem;
}

.story-map-step-head strong {
    font-size: 0.8rem;
}

.story-map-step-head {
    align-items: flex-start;
    min-height: 40px;
}

.story-map-step-head > div:first-child {
    display: grid;
    gap: 3px;
    min-width: 0;
    padding-top: 2px;
}

.story-map-step-head > div:first-child > strong,
.story-map-step-head > div:first-child > small {
    display: block;
}

.story-map-step-head .story-map-item-actions {
    align-self: flex-start;
}

.story-map-feature-head strong {
    font-size: 0.78rem;
    line-height: 1.4;
}

.story-map-feature-content p {
    color: #697589;
    font-size: 0.72rem;
    line-height: 1.55;
}

.story-map-settings summary {
    border: 1px solid var(--line);
    background: #fff;
    color: #657186;
    border-radius: 6px;
    width: 32px;
    min-width: 32px;
    height: 32px;
    cursor: pointer;
    font-weight: 600;
    font-size: 1.15rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.story-map-drag-handle {
    border: 1px solid var(--line);
    background: #fff;
    color: var(--muted);
    border-radius: 6px;
    width: 32px;
    min-width: 32px;
    height: 32px;
    cursor: grab;
    font-weight: 700;
    letter-spacing: -0.08em;
}

.story-map-drag-handle:active {
    cursor: grabbing;
}

.story-map-accent {
    width: 3px;
    min-height: 38px;
    border-radius: 999px;
    background: var(--primary);
}

.story-map-steps {
    display: flex;
    gap: 12px;
    overflow-x: visible;
    padding-bottom: 4px;
    align-items: flex-start;
    min-width: max-content;
}

.story-map-step {
    border: 1px solid #dfe4ea;
    border-radius: 8px;
    background: #fff;
    padding: 13px;
    display: grid;
    gap: 14px;
    align-content: start;
    min-height: 100%;
    min-width: 290px;
    width: 290px;
}

.story-map-step-create {
    background: rgba(255, 255, 255, 0.55);
    border-style: dashed;
}

.story-map-features {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.story-map-feature {
    border: 1px solid #e0e5eb;
    border-radius: 7px;
    background: #fff;
    padding: 12px;
    display: grid;
    gap: 10px;
    box-shadow: 0 4px 12px rgba(28, 40, 58, 0.045);
}

.story-map-feature-head {
    align-items: flex-start;
}

.story-map-feature-content {
    border: 0;
    background: transparent;
    padding: 0;
    text-align: left;
    cursor: pointer;
    display: grid;
    gap: 10px;
}

.story-map-feature-content p {
    margin: 0;
}

.story-map-feature-user-story {
    color: #526079;
    font-size: 0.78rem;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}

.story-map-story-status {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    padding: 2px 7px;
    border-radius: 999px;
    background: #eef2f7;
    color: #536174;
    font-size: 0.66rem;
    font-weight: 700;
}

.story-map-story-status.is-in_development {
    background: #fff3d6;
    color: #8a5a00;
}

.story-map-story-status.is-rolled_out {
    background: #e6f7ef;
    color: #19724c;
}

.release-admin-layout{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:18px;align-items:start}.release-admin-list{position:sticky;top:84px;padding:14px}.release-admin-list-item{display:grid;gap:5px;padding:13px 14px;border-radius:10px;color:inherit;text-decoration:none}.release-admin-list-item:hover,.release-admin-list-item.is-active{background:#f0f4fb}.release-admin-list-item small{color:#728098}.release-admin-content{display:grid;gap:18px}.release-copy-source{position:fixed;left:-9999px;width:1px;height:1px}.release-admin-items{display:grid;gap:10px;margin-bottom:20px}.release-admin-items article{display:flex;justify-content:space-between;gap:18px;padding:18px;border:1px solid #e1e6ed;border-radius:12px;background:#fff}.release-admin-items h3{margin:9px 0 6px}.release-admin-items p{margin:0;color:#526079;line-height:1.55}.release-admin-items small{margin-left:8px;color:#718096}.release-item-form{border-top:1px solid #e1e6ed;padding-top:20px}.release-type{display:inline-flex;padding:4px 9px;border-radius:999px;background:#edf1f6;color:#526079;font-size:.72rem;font-weight:800}.release-type.is-feature{background:#e9efff;color:#3159be}.release-type.is-improvement{background:#e9f7ef;color:#18704a}.release-type.is-bugfix{background:#fff0ed;color:#a23d31}.release-type.is-solution{background:#e8f7fa;color:#126b78}.release-type.is-security{background:#fff3d8;color:#855a00}.release-type.is-technical{background:#f0ebff;color:#6541a5}

.portal-releases-page,.portal-release-detail{max-width:1180px;margin:0 auto;padding:36px 20px 80px}.portal-releases-hero{max-width:780px;margin-bottom:36px}.portal-releases-hero h1,.portal-release-detail>header h1{margin:8px 0 12px}.portal-releases-hero p,.portal-release-detail>header p{color:#66748c;font-size:1.08rem;line-height:1.65}.portal-release-list{display:grid;gap:12px}.portal-release-list>a{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:22px;align-items:center;padding:22px 24px;border:1px solid #e0e5ec;border-radius:14px;background:#fff;color:inherit;text-decoration:none;transition:.18s ease}.portal-release-list>a:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(25,39,66,.08)}.portal-release-list time{color:#66748c;font-weight:700}.portal-release-list h2{margin:0 0 6px}.portal-release-list p{margin:0;color:#66748c}.portal-release-list>a>span{font-weight:700;color:var(--portal-accent,#4f7cff)}.portal-release-detail>header{max-width:840px;margin:28px 0 44px}.portal-release-group{margin-top:42px}.portal-release-group>h2{padding-bottom:14px;border-bottom:1px solid #dfe5ed}.portal-release-group>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.portal-release-group article{padding:24px;border:1px solid #e0e5ec;border-radius:14px;background:#fff}.portal-release-group h3{margin:13px 0 9px}.portal-release-group p{margin:0;color:#53617a;line-height:1.65}.portal-release-item-meta{display:flex;gap:8px;align-items:center}.portal-release-item-meta>span:last-child:not(:first-child){font-size:.78rem;color:#718096}.portal-release-detail>footer{margin-top:42px;padding:22px 24px;border-radius:14px;background:#f3f6fa;color:#526079;line-height:1.6}@media(max-width:800px){.release-admin-layout{grid-template-columns:1fr}.release-admin-list{position:static}.portal-release-list>a{grid-template-columns:1fr}.portal-release-group>div{grid-template-columns:1fr}}

.portal-release-filters{display:flex;gap:12px;align-items:end;margin:0 0 30px;padding:16px;border:1px solid #e0e5ec;border-radius:14px;background:#fff}.portal-release-filters label{display:grid;gap:6px;min-width:200px}.portal-release-filters label span,.portal-release-mobile-jump>span{color:#6c7890;font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.portal-release-filters select,.portal-release-mobile-jump select{min-height:42px;padding:0 38px 0 12px;border:1px solid #d9e0e9;border-radius:9px;background:#fff}.portal-release-filters button{min-height:42px;padding:0 18px;border:0;border-radius:9px;background:var(--portal-accent,#4f7cff);color:#fff;font-weight:800}.portal-release-filters>a{align-self:center;color:#66748c}.portal-release-timeline-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:42px;align-items:start}.portal-release-timeline-nav{position:sticky;top:24px;max-height:calc(100vh - 48px);overflow:auto}.portal-release-timeline-nav>span{display:block;margin-bottom:12px;color:#77849b;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.portal-release-timeline-nav nav{display:grid;border-left:1px solid #dde3eb}.portal-release-timeline-nav a{display:grid;gap:3px;padding:11px 14px;border-left:3px solid transparent;color:#69768c;text-decoration:none}.portal-release-timeline-nav a:hover,.portal-release-timeline-nav a.is-active{border-left-color:var(--portal-accent,#4f7cff);background:#f3f6fb;color:#172033}.portal-release-timeline-nav time{font-size:.74rem}.portal-release-timeline-nav strong{font-size:.86rem;line-height:1.35}.portal-release-timeline-content{display:grid;gap:32px;min-width:0}.portal-release-timeline-entry{scroll-margin-top:24px;padding:30px;border:1px solid #dfe5ed;border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(28,40,58,.05)}.portal-release-timeline-entry>header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 20px;padding-bottom:22px;border-bottom:1px solid #e3e8ef}.portal-release-timeline-entry>header h2{margin:7px 0 0}.portal-release-timeline-entry>header>a{color:var(--portal-accent,#4f7cff);font-size:.82rem;font-weight:700;text-decoration:none}.portal-release-timeline-entry>header>p{grid-column:1/-1;margin:8px 0 0;color:#617087;line-height:1.65}.portal-release-timeline-entry .portal-release-group{margin-top:28px}.portal-release-timeline-entry .portal-release-group>h3{padding-bottom:11px;border-bottom:1px solid #e2e7ee;font-size:1rem}.portal-release-timeline-entry .portal-release-group article{box-shadow:none}.portal-release-timeline-entry .portal-release-group h4{margin:13px 0 9px;font-size:1rem}.portal-release-timeline-entry>footer{margin-top:28px;padding:18px 20px;border-radius:11px;background:#f3f6fa;color:#59677e;line-height:1.6}.portal-release-load-more{display:flex;justify-content:space-between;align-items:center;padding:17px 20px;border:1px solid #dce3ec;border-radius:12px;background:#fff;color:#172033;font-weight:800;text-decoration:none}.portal-release-load-more span{color:#77849b;font-size:.8rem;font-weight:600}.portal-release-mobile-jump{display:none}
@media(max-width:850px){.portal-release-filters{align-items:stretch;flex-direction:column}.portal-release-filters label{min-width:0}.portal-release-timeline-layout{grid-template-columns:1fr;gap:18px}.portal-release-timeline-nav{display:none}.portal-release-mobile-jump{display:grid;gap:7px;margin-bottom:18px}.portal-release-timeline-entry{padding:22px}.portal-release-timeline-entry>header{grid-template-columns:1fr}.portal-release-timeline-entry>header>p{grid-column:1}.portal-release-timeline-entry .portal-release-group>div{grid-template-columns:1fr}}

.release-admin-item-actions{display:flex;flex:0 0 auto;gap:8px;align-items:flex-start}.release-admin-items article.is-highlight{border-color:#b9dfe5;background:#f5fbfc}.release-highlight-label,.portal-release-highlight-kicker{display:inline-flex;margin-left:7px;color:#126b78;font-size:.7rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.portal-release-highlight-kicker{margin:0 0 12px}
.release-teams-publish .panel-head{align-items:flex-start}.release-teams-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.release-teams-actions>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 16px;align-items:center;padding:16px;border:1px solid #e1e6ed;background:#f8fafc}.release-teams-actions .eyebrow,.release-teams-actions small{grid-column:1}.release-teams-actions strong{grid-column:1}.release-teams-actions form{grid-column:2;grid-row:1/5}.release-teams-actions small,.release-teams-publish .field-hint{color:#718096}.release-delivery-history{display:grid;gap:0;margin-top:20px;border-top:1px solid #e1e6ed;padding-top:16px}.release-delivery-history>.eyebrow{margin-bottom:7px}.release-delivery-history>div{display:grid;grid-template-columns:10px minmax(120px,.4fr) 1fr;gap:9px;align-items:center;padding:8px 0;border-bottom:1px solid #edf0f4}.release-delivery-history small{color:#718096}.status-dot{width:8px;height:8px;border-radius:50%;background:#9aa5b5}.status-dot.is-success{background:#25a56a}.status-dot.is-danger{background:#d64d55}
.release-channel-profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.release-channel-profile{display:grid;gap:15px;margin:0;padding:18px;border:1px solid #dfe5ed;background:#f8fafc}.release-channel-profile legend{display:flex;align-items:center;gap:9px;padding:0 6px}.release-channel-profile legend span{padding:3px 7px;background:#e8eef9;color:#3f5f9d;font-size:.68rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.release-channel-profile.is-production legend span{background:#e7f6ee;color:#18704a}.release-channel-profile .manual-option{margin:0;background:#fff}.release-channel-profile .manual-option.is-danger strong{color:#b43c45}
.portal-release-timeline-entry{padding:0 0 46px;border:0;border-bottom:1px solid #dfe5ed;border-radius:0;background:transparent;box-shadow:none}.portal-release-timeline-entry:last-of-type{border-bottom:0}.portal-release-group article{border-radius:0;box-shadow:none}.portal-release-group article.is-highlight{grid-column:1/-1;border-color:#9fd5de;border-left:4px solid #24a5b8;background:linear-gradient(90deg,#f1fbfc 0%,#fff 65%);padding:30px}.portal-release-group article.is-highlight h3,.portal-release-group article.is-highlight h4{font-size:1.15rem}.portal-release-group article.is-highlight p{max-width:900px}.portal-release-timeline-entry>footer{border-radius:0}
@media(max-width:850px){.portal-release-timeline-entry{padding:0 0 34px}.portal-release-group article.is-highlight{padding:22px}.release-admin-item-actions{flex-direction:column}.release-teams-actions,.release-channel-profile-grid{grid-template-columns:1fr}.release-teams-actions>div{grid-template-columns:1fr}.release-teams-actions form{grid-column:1;grid-row:auto;margin-top:8px}}

.story-map-steps.is-drop-target,
.story-map-features.is-drop-target,
.story-map-board.is-drop-target,
.story-map-drop-slot.is-drop-target {
    outline: 2px dashed rgba(79, 124, 255, 0.4);
    outline-offset: 6px;
}

.story-map-step.is-drop-target,
.story-map-feature.is-drop-target {
    border-color: rgba(79, 124, 255, 0.45);
    box-shadow: 0 0 0 3px rgba(79, 124, 255, 0.12);
}

.story-map-activity.is-drop-target {
    border-color: rgba(79, 124, 255, 0.4);
    box-shadow: 0 0 0 4px rgba(79, 124, 255, 0.1);
}

.story-map-drop-slot.is-drop-target {
    background: rgba(79, 124, 255, 0.14);
    box-shadow: inset 0 0 0 1px rgba(79, 124, 255, 0.2);
}

.story-map-drop-slot.is-drop-target::after {
    opacity: 1;
    transform: scale(1);
}

.story-map-board.is-refreshing {
    opacity: 0.72;
    transition: opacity 0.18s ease;
    pointer-events: none;
}

.story-map-feature-topline {
    width: 100%;
    height: 3px;
    border-radius: 999px;
    background: var(--primary);
}

.story-map-feature-topline.is-create {
    background: #c7ced8;
}

.story-map-feature-create {
    border-style: dashed;
    background: #fafbfc;
}

.story-map-feature-trigger {
    width: 100%;
    text-align: left;
    cursor: pointer;
}

.story-map-feature-trigger p {
    margin-bottom: 0;
}

.story-map-meta {
    flex-wrap: wrap;
}

.story-map-meta span {
    display: inline-flex;
    padding: 5px 9px;
    background: rgba(79, 124, 255, 0.1);
    color: var(--primary);
    border-radius: 5px;
    font-size: 0.68rem;
}

.compact-story-form {
    gap: 10px;
}

.story-map-settings {
    display: grid;
    gap: 10px;
    position: relative;
}

.story-map-settings summary {
    list-style: none;
}

.story-map-settings summary::-webkit-details-marker {
    display: none;
}

.story-map-settings-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 20;
    width: 270px;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 40px rgba(23, 32, 51, 0.14);
}

.story-map-menu-action {
    width: 100%;
    border: 0;
    background: transparent;
    color: var(--text);
    padding: 10px 12px;
    border-radius: 5px;
    text-align: left;
    cursor: pointer;
    font: inherit;
}

.story-map-menu-action:hover {
    background: #f5f7fc;
}

.story-map-menu-link {
    display: block;
    color: var(--text);
    text-decoration: none;
    padding: 10px 12px;
    border-radius: 5px;
}

.story-map-menu-link:hover {
    background: #f5f7fc;
}

.story-map-menu-subform {
    border-bottom: 1px solid #edf0f4;
}

.story-map-menu-subform > summary {
    width: 100%;
    height: auto;
    padding: 10px 12px;
    border: 0;
    border-radius: 5px;
    color: var(--text);
    background: transparent;
    justify-content: flex-start;
    font-size: inherit;
}

.story-map-menu-subform > summary:hover {
    background: #f5f7fa;
}

.story-map-menu-subform > summary::after {
    content: '+';
    margin-left: auto;
    color: var(--primary);
    font-weight: 800;
}

.story-map-menu-subform[open] > summary::after {
    content: '−';
}

.story-map-menu-subform form {
    display: grid;
    gap: 9px;
    padding: 6px 8px 12px;
}

.story-map-menu-subform .field {
    gap: 5px;
}

.story-map-menu-subform input {
    padding: 9px 10px;
}

body.is-story-map-focus-mode {
    overflow: hidden;
}

.story-map-board-shell.is-focus-mode {
    position: fixed;
    inset: 10px;
    z-index: 90;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    border-color: #cfd6df;
    background: #f4f6f9;
    box-shadow: 0 28px 90px rgba(15, 23, 36, 0.26);
}

.story-map-board-shell.is-focus-mode .story-map-board {
    flex-direction: row;
    min-height: 0;
    height: 100%;
    overflow: auto;
}

.story-map-board-shell.is-focus-mode .story-map-activity {
    min-width: 320px;
}

.story-map-board-shell.is-focus-mode .story-map-steps {
    flex-direction: row;
    min-width: max-content;
    overflow: visible;
}

.story-map-board-shell.is-focus-mode .story-map-board-toolbar {
    min-height: 58px;
    padding-inline: 20px;
}

.story-map-link-icon {
    width: 32px;
    min-width: 32px;
    height: 32px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--muted);
}

.story-map-link-icon svg {
    width: 16px;
    height: 16px;
    fill: currentColor;
}

.story-map-title-input {
    width: 100%;
    min-width: 0;
    border: 1px solid rgba(79, 124, 255, 0.35);
    border-radius: 10px;
    background: #fff;
    padding: 6px 10px;
    font: inherit;
    color: inherit;
}

[data-story-map-title] {
    cursor: text;
}

[data-story-map-title].is-editing {
    display: block;
}

body.is-story-map-canvas-open {
    overflow: hidden;
}

.story-map-canvas-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(12, 19, 34, 0.22);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
    z-index: 60;
}

.story-map-canvas {
    position: fixed;
    top: 0;
    right: 0;
    width: min(520px, 100vw);
    max-width: 100vw;
    height: 100vh;
    background: #fff;
    border-left: 1px solid #dfe4f2;
    box-shadow: -24px 0 60px rgba(23, 32, 51, 0.18);
    transform: translateX(100%);
    transition: transform 0.22s ease;
    z-index: 70;
    display: grid;
    grid-template-rows: auto 1fr;
}

.story-map-canvas.is-open {
    transform: translateX(0);
}

.story-map-canvas-backdrop.is-open {
    opacity: 1;
    pointer-events: auto;
}

.story-map-canvas-head {
    padding: 20px 22px 16px;
    border-bottom: 1px solid #e8edf8;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
}

.story-map-canvas-close {
    width: 40px;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f6f8fc;
    cursor: pointer;
    font-size: 1.4rem;
    line-height: 1;
}

.story-map-canvas-form {
    padding: 20px 22px 28px;
    overflow-y: auto;
    display: grid;
    gap: 16px;
    align-content: start;
}

.story-map-canvas-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    align-items: center;
}

.story-map-canvas-detail-link.is-hidden {
    display: none;
}

.story-map-canvas.is-loading .story-map-canvas-form {
    opacity: 0.55;
    pointer-events: none;
}

.story-map-activity-create-form {
    max-width: 460px;
}

.manual-layout {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 56px;
    padding-top: 44px;
}

.manual-sidebar {
    position: sticky;
    top: 24px;
    align-self: start;
    padding: 0 0 8px;
    border-radius: 0;
    background: transparent;
    border: 0;
}

.manual-sidebar h1 {
    margin-bottom: 14px;
    font-size: var(--font-size-h1);
    font-weight: 400;
    letter-spacing: -0.04em;
}

.manual-sidebar-section {
    margin-top: 28px;
    padding-top: 18px;
    border-top: 1px solid #edf1f5;
}

.manual-sidebar-section h3 {
    margin-bottom: 16px;
    font-size: calc(var(--font-size-ui) * 0.92);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #7f8a9d;
}

.manual-sidebar ol {
    padding-left: 20px;
    display: grid;
    gap: 12px;
}

.manual-content {
    display: grid;
    gap: 40px;
}

.manual-content .reading-surface {
    width: 100%;
    margin: 0;
    padding: 0 0 14px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
}

.manual-intro {
    border-bottom: 1px solid #edf1f5;
}

.back-link {
    display: inline-flex;
    margin-bottom: 18px;
    color: var(--primary);
}

body.is-drawer-open {
    overflow: hidden;
}

@media (max-width: 1100px) {
    :root {
        --shell-width: min(100vw - 24px, 1320px);
    }

    .ai-signal-conflict-groups {
        grid-template-columns: 1fr;
    }

    .ai-signal-conflict-dialog {
        padding: 18px;
    }

    .smart-topbar {
        grid-template-columns: 1fr auto;
    }

    .topbar-spacer {
        display: none;
    }

    .stats-grid,
    .two-up,
    .portal-hero,
    .card-grid,
    .compact-grid,
    .manual-layout,
    .branding-cards,
    .form-grid.two-col {
        grid-template-columns: 1fr;
    }

    .portal-home-welcome {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .portal-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .portal-manual-grid,
    .portal-topic-suggestion-modern .portal-topic-suggestion-form {
        grid-template-columns: 1fr;
    }

    .portal-topic-suggestion-modern .portal-topic-suggestion-form .btn {
        justify-self: start;
    }

    .article-taxonomy-grid {
        grid-template-columns: 1fr;
    }

    .article-filter-bar {
        grid-template-columns: 1fr;
    }

    .article-list-head {
        display: none;
    }

    .article-bulk-bar {
        flex-direction: column;
        align-items: stretch;
    }

    .article-overview-card {
        grid-template-columns: 28px 1fr;
        gap: 12px;
    }

    .article-overview-actions {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .story-map-board {
        flex-direction: column;
        overflow-x: visible;
    }

    .story-map-activity {
        min-width: 0;
    }

    .story-map-steps {
        flex-direction: column;
        overflow-x: visible;
        min-width: 0;
    }

    .story-map-canvas {
        width: 100vw;
    }

    .layout-row-editor,
    .content-row-block {
        grid-template-columns: 1fr;
    }

    .cta-card {
        grid-template-columns: 1fr;
    }

    .cta-button {
        grid-column: 1;
        grid-row: auto;
        justify-self: start;
    }

    .content-button-group {
        flex-direction: column;
        align-items: flex-start;
    }

    .block-modal {
        width: calc(100vw - 20px);
        max-height: 88vh;
        padding: 16px;
    }

    body.is-editor-focus-open .block-modal {
        left: 18px;
        right: 18px;
        top: 18px;
        bottom: 18px;
        width: auto;
        max-height: none;
        padding: 0;
    }

    .block-toolbar,
    .nested-block-head {
        display: grid;
    }

    .block-library {
        inset: 4vh 16px auto;
        max-height: 86vh;
    }

    .article-editor-grid {
        grid-template-columns: 1fr;
    }

    .article-editor-grid > fieldset {
        grid-template-columns: 1fr;
    }

    .article-editor-panel[data-focus-surface].is-focus-mode {
        inset: 16px 18px;
    }

    .search-metadata-head {
        display: grid;
        grid-template-columns: 1fr;
    }

    .article-editor-sticky {
        position: static;
    }

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

    .article-sidebar {
        position: static;
    }

    .manual-layout {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .manual-sidebar {
        position: static;
    }
}

@media (max-width: 1360px) {
    .article-editor-grid {
        grid-template-columns: 1fr;
    }

    .article-editor-grid > fieldset {
        grid-template-columns: 1fr;
    }

    .article-editor-command-panel {
        justify-content: flex-end;
    }

    .article-editor-command-panel-copy {
        display: none;
    }

    .article-editor-command-bar .article-editor-journey small,
    .article-editor-command-tools .article-editor-autosave-status {
        display: none;
    }

    .article-editor-compact-actions {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 10px;
        flex-wrap: wrap;
    }

    .article-editor-sidebar {
        position: fixed;
        top: calc(var(--topbar-height) + 18px);
        right: 18px;
        z-index: 52;
        width: min(460px, calc(100vw - 36px));
        max-height: calc(100vh - var(--topbar-height) - 36px);
        overflow: auto;
        padding-right: 2px;
        transform: translateX(calc(100% + 26px));
        opacity: 0;
        pointer-events: none;
        transition: top 0.28s ease, transform 0.22s ease, opacity 0.22s ease;
    }

    body.is-editor-settings-open .article-editor-sidebar {
        transform: translateX(0);
        opacity: 1;
        pointer-events: auto;
    }

    .article-editor-settings-backdrop {
        position: fixed;
        inset: 0;
        z-index: 51;
        display: block;
        background: rgba(12, 19, 34, 0.42);
        backdrop-filter: blur(4px);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.22s ease;
    }

    body.is-editor-settings-open .article-editor-settings-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    .article-editor-settings-close {
        display: inline-flex;
    }

    body.is-topbar-hidden .article-editor-sidebar {
        top: 18px;
    }
}

@media (max-width: 760px) {
    :root {
        --shell-width: min(100vw - 20px, 1320px);
    }

    .admin-shell {
        grid-template-columns: 1fr;
    }

    .context-sidebar {
        display: none;
    }

    .smart-topbar {
        margin-top: 10px;
        padding: 14px 16px;
        border-left: 0;
    }

    .story-map-editor-head {
        align-items: flex-start;
        flex-direction: column;
        padding-right: 0;
    }

    .story-map-editor-actions {
        width: 100%;
        justify-content: space-between;
    }

    .story-map-meta-popover {
        position: fixed;
        top: 12px;
        right: 12px;
        left: 12px;
        width: auto;
        max-height: calc(100vh - 24px);
        overflow: auto;
    }

    .story-map-board-shell.is-focus-mode {
        inset: 4px;
    }

    .story-map-board-toolbar {
        padding-left: 12px;
    }

    body.is-editor-focus-open .block-modal {
        left: 8px;
        right: 8px;
        top: 8px;
        bottom: 8px;
        border-radius: 18px;
    }

    .article-editor-compact-actions {
        justify-content: stretch;
    }

    .article-editor-compact-actions .btn {
        width: 100%;
        justify-content: center;
    }

    .article-editor-panel[data-focus-surface].is-focus-mode {
        inset: 8px;
        border-radius: 18px;
    }

    body.is-topbar-hidden .article-editor-sidebar {
        top: 10px;
    }

    .profile-copy {
        display: none;
    }

    .main-panel,
    .portal-header {
        padding-top: 18px;
    }

    .portal-main {
        width: min(100% - 24px, 1200px);
    }

    .portal-home-dashboard {
        margin-top: -24px;
    }

    .portal-home-welcome {
        padding: 26px 22px;
    }

    .portal-home-welcome-note {
        padding: 4px 0 4px 18px;
    }

    .portal-home-section {
        margin-top: 42px;
    }

    .portal-category-grid,
    .portal-feature-grid,
    .portal-manual-grid {
        grid-template-columns: 1fr;
    }

    .article-taxonomy-options {
        grid-template-columns: 1fr;
    }

    .portal-category-card,
    .portal-feature-card {
        min-height: 0;
    }

    .portal-manual-card {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .portal-manual-meta {
        grid-column: 2;
        grid-template-columns: auto auto;
        justify-content: space-between;
        justify-items: start;
    }

    .portal-recent-list > a {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .portal-recent-list time {
        display: none;
    }

    .portal-topic-suggestion-modern > summary {
        align-items: flex-start;
        padding: 24px 22px;
    }

    .portal-topic-action {
        font-size: 0;
    }

    .portal-topic-action::after {
        content: '→';
        font-size: 1rem;
    }

    .portal-topic-suggestion-modern .portal-topic-suggestion-form {
        padding: 0 22px 24px;
    }

    .portal-search-page {
        padding-top: 30px;
    }

    .portal-header-inner,
    .portal-search-band,
    .portal-subnav-inner {
        width: min(100% - 24px, 1200px);
    }

    .portal-preview-toolbar {
        min-height: 54px;
        padding: 8px 14px;
    }

    .portal-preview-toolbar small {
        display: none;
    }

    .portal-preview-toolbar .btn {
        min-height: 36px;
        padding-inline: 12px;
        font-size: 0.78rem;
    }

    .portal-header-inner,
    .portal-header-search,
    .article-layout {
        display: grid;
        grid-template-columns: 1fr;
    }

    .reading-surface,
    .portal-hero,
    .panel-card,
    .auth-card {
        padding: 20px;
    }

    .manual-option {
        grid-template-columns: 1fr;
        justify-items: start;
    }

    .article-sidebar {
        position: static;
    }

    .context-drawer {
        width: min(100vw, 420px);
        padding: 18px;
    }

    .support-banner {
        flex-direction: column;
        align-items: stretch;
    }
}

.landing-shell {
    background:
        radial-gradient(circle at top left, rgba(79, 124, 255, 0.08), transparent 26%),
        linear-gradient(180deg, #f8faff 0%, #f3f6fb 220px, #f6f8fc 220px, #f6f8fc 100%);
}

.landing-header-shell {
    width: 100%;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0.78) 100%);
    border-bottom: 1px solid rgba(230, 234, 243, 0.9);
    backdrop-filter: blur(14px);
}

.landing-topbar {
    width: min(1180px, calc(100vw - 64px));
    margin: 0 auto;
    padding: 20px 0;
}

.landing-topbar-inner {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
}

.landing-brand img {
    max-height: 42px;
    width: auto;
}

.landing-nav {
    display: flex;
    align-items: center;
    gap: 18px;
}

.landing-nav a:not(.btn) {
    color: var(--text);
    font-size: var(--font-size-ui);
}

.landing-main {
    display: grid;
    gap: 56px;
    padding-top: 18px;
}

.landing-hero,
.landing-section {
    width: min(1180px, calc(100vw - 64px));
    margin: 0 auto;
}

.landing-hero {
    padding: 56px 0 16px;
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
    gap: 36px;
    align-items: start;
    position: relative;
}

.landing-hero-copy h1 {
    max-width: 10.5ch;
    margin-bottom: 20px;
}

.landing-hero-copy p {
    max-width: 56ch;
    font-size: 1.08rem;
}

.landing-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 24px;
}

.landing-showcase {
    display: grid;
    gap: 18px;
    padding-top: 8px;
}

.landing-showcase-panel,
.landing-showcase-metrics,
.landing-feature-grid article,
.landing-steps article,
.landing-cta {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 6px;
    box-shadow: 0 18px 40px rgba(23, 32, 51, 0.05);
}

.landing-showcase-panel {
    padding: 30px;
    display: grid;
    gap: 8px;
}

.landing-showcase-panel small,
.landing-showcase-metrics span,
.landing-steps article strong {
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.74rem;
    font-weight: 700;
}

.landing-showcase-panel strong {
    font-size: 1.35rem;
}

.landing-showcase-metrics {
    padding: 20px 24px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.landing-showcase-metrics div {
    display: grid;
    gap: 4px;
}

.landing-showcase-metrics strong {
    font-size: 1rem;
}

.landing-section {
    display: grid;
    gap: 22px;
}

.landing-section .section-head {
    align-items: end;
}

.landing-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.landing-feature-grid article {
    padding: 26px;
}

.landing-feature-grid h3 {
    margin-bottom: 10px;
}

.landing-section-alt {
    padding: 6px 0;
}

.landing-split {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    gap: 30px;
    align-items: start;
}

.landing-steps {
    display: grid;
    gap: 14px;
}

.landing-steps article {
    padding: 24px;
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 18px;
}

.landing-steps article strong {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(79, 124, 255, 0.08);
    color: var(--text);
    border: 1px solid rgba(79, 124, 255, 0.12);
}

.landing-cta {
    padding: 30px;
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
    background: linear-gradient(135deg, #fff 0%, rgba(255, 255, 255, 0.86) 100%);
}

@media (max-width: 960px) {
    .landing-topbar-inner,
    .landing-hero,
    .landing-split,
    .landing-feature-grid {
        grid-template-columns: 1fr;
    }

    .landing-topbar-inner {
        display: grid;
    }

    .landing-nav {
        flex-wrap: wrap;
    }

    .landing-showcase-metrics {
        grid-template-columns: 1fr;
    }

    .landing-cta {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Public Wissiqo marketing page */
.landing-shell {
    --landing-ink: #12182a;
    --landing-muted: #667085;
    --landing-blue: #5168f4;
    --landing-blue-dark: #3549d7;
    --landing-lime: #b8eb69;
    --landing-soft: #f5f7fc;
    background: #fff;
    color: var(--landing-ink);
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    overflow-x: hidden;
}

.landing-shell .portal-main {
    width: 100%;
    max-width: none;
    margin: 0;
    padding-left: 0;
    padding-right: 0;
}

.landing-header-shell {
    position: sticky;
    z-index: 100;
    top: 0;
    background: rgba(255, 255, 255, 0.88);
    border-bottom: 1px solid rgba(18, 24, 42, 0.08);
    backdrop-filter: blur(18px);
}

.landing-topbar {
    width: min(1240px, calc(100vw - 56px));
    padding: 15px 0;
}

.landing-topbar-inner {
    display: flex;
}

.landing-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--landing-ink);
    text-decoration: none;
}

.landing-brand > span {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    color: #fff;
    background: var(--landing-ink);
    font-size: 19px;
    font-weight: 850;
    letter-spacing: -0.08em;
    box-shadow: 0 8px 18px rgba(18, 24, 42, 0.16);
}

.landing-brand > strong {
    font-size: 1.22rem;
    letter-spacing: -0.04em;
}

.landing-nav {
    gap: 28px;
}

.landing-nav a:not(.landing-nav-cta) {
    color: #475066;
    font-size: 0.88rem;
    font-weight: 650;
    text-decoration: none;
}

.landing-nav a:hover {
    color: var(--landing-ink);
}

.landing-nav-cta,
.landing-button {
    min-height: 46px;
    padding: 0 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border: 1px solid transparent;
    border-radius: 11px;
    font-size: 0.88rem;
    font-weight: 750;
    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.landing-shell .landing-nav a.landing-nav-cta,
.landing-button.is-primary {
    color: #fff;
    background: var(--landing-ink);
    box-shadow: 0 10px 22px rgba(18, 24, 42, 0.13);
}

.landing-nav-cta {
    min-height: 42px;
    padding: 0 17px;
}

.landing-shell .landing-nav a.landing-nav-cta:hover,
.landing-button.is-primary:hover {
    color: #fff;
    background: #212b45;
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(18, 24, 42, 0.19);
}

.landing-button.is-secondary {
    color: var(--landing-ink);
    background: #fff;
    border-color: #dfe3ec;
}

.landing-button.is-secondary:hover {
    border-color: #bfc6d5;
    transform: translateY(-2px);
}

.landing-main {
    display: block;
    padding: 0;
}

.landing-hero {
    width: min(1240px, calc(100vw - 56px));
    min-height: 710px;
    padding: 92px 0 86px;
    display: grid;
    grid-template-columns: minmax(430px, 0.9fr) minmax(560px, 1.1fr);
    gap: 58px;
    align-items: center;
}

.landing-hero-copy {
    position: relative;
    z-index: 4;
}

.landing-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 21px;
    color: #626c82;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.105em;
    text-transform: uppercase;
}

.landing-eyebrow > i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--landing-lime);
    box-shadow: 0 0 0 5px rgba(184, 235, 105, 0.18);
}

.landing-hero-copy h1 {
    max-width: 12.5ch;
    margin: 0;
    color: var(--landing-ink);
    font-size: clamp(3rem, 4.15vw, 4.1rem);
    font-weight: 790;
    letter-spacing: -0.058em;
    line-height: 1.02;
}

.landing-hero-copy h1 em,
.landing-section-heading h2 em,
.landing-dark-copy h2 em {
    color: var(--landing-blue);
    font-style: normal;
}

.landing-hero-lead {
    max-width: 590px;
    margin: 27px 0 0;
    color: var(--landing-muted);
    font-size: 1.06rem;
    line-height: 1.72;
}

.landing-actions {
    margin-top: 30px;
}

.landing-hero-assurances {
    display: flex;
    flex-wrap: wrap;
    gap: 17px;
    margin-top: 25px;
    color: #7a8396;
    font-size: 0.74rem;
    font-weight: 650;
}

.landing-hero-assurances span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.landing-hero-assurances i {
    color: #5a9c32;
    font-style: normal;
}

.landing-product-visual {
    position: relative;
    min-width: 0;
    padding: 30px 0 34px;
}

.landing-visual-glow {
    position: absolute;
    width: 600px;
    height: 520px;
    top: -18px;
    left: 8%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(81, 104, 244, 0.17), rgba(184, 235, 105, 0.08) 48%, transparent 70%);
    filter: blur(12px);
}

.landing-browser {
    position: relative;
    z-index: 2;
    width: 720px;
    max-width: 100%;
    overflow: hidden;
    border: 1px solid rgba(20, 27, 45, 0.12);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 32px 70px rgba(27, 38, 74, 0.18), 0 8px 24px rgba(27, 38, 74, 0.08);
    transform: perspective(1400px) rotateY(-2.5deg) rotateX(1deg);
    transform-origin: center left;
}

.landing-browser-bar {
    height: 34px;
    padding: 0 13px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    color: #8b93a6;
    background: #f8f9fc;
    border-bottom: 1px solid #e8ebf2;
    font-size: 0.57rem;
}

.landing-browser-dots {
    display: flex;
    gap: 5px;
}

.landing-browser-dots i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #d4d9e4;
}

.landing-browser-dots i:first-child { background: #f1a8a8; }
.landing-browser-dots i:nth-child(2) { background: #f1d18f; }
.landing-browser-dots i:nth-child(3) { background: #b8dca0; }
.landing-browser-secure { justify-self: end; color: #6ea24b; font-style: normal; }

.landing-app-preview {
    height: 450px;
    display: grid;
    grid-template-columns: 142px 1fr;
    color: #1b2234;
    background: #f5f6fa;
}

.landing-app-sidebar {
    padding: 14px 11px;
    background: #fff;
    border-right: 1px solid #e7e9ef;
}

.landing-preview-brand {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 16px;
    font-size: 0.68rem;
}

.landing-preview-brand b {
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    border-radius: 6px;
    color: #fff;
    background: #171d2c;
}

.landing-preview-workspace {
    padding: 9px;
    display: grid;
    gap: 2px;
    border: 1px solid #e1e5ed;
    border-radius: 6px;
}

.landing-preview-workspace small,
.landing-app-sidebar nav > small {
    color: #9aa2b3;
    font-size: 0.42rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.landing-preview-workspace strong { font-size: 0.55rem; }
.landing-app-sidebar nav { display: grid; gap: 3px; margin-top: 12px; }
.landing-app-sidebar nav > small { margin: 8px 6px 2px; }

.landing-app-sidebar nav > span {
    min-height: 27px;
    padding: 0 7px;
    display: flex;
    align-items: center;
    gap: 6px;
    border-radius: 5px;
    color: #6a7386;
    font-size: 0.52rem;
}

.landing-app-sidebar nav > span.is-active {
    color: #fff;
    background: #171d2c;
    box-shadow: 0 6px 12px rgba(18, 24, 42, 0.13);
}

.landing-app-preview .sidebar-nav-icon,
.landing-feature-icon .sidebar-nav-icon,
.landing-floating-card .sidebar-nav-icon,
.landing-mini-portal .sidebar-nav-icon,
.landing-cycle .sidebar-nav-icon {
    width: 13px;
    height: 13px;
    min-width: 13px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 13px;
}

.landing-app-preview .sidebar-nav-icon svg,
.landing-feature-icon .sidebar-nav-icon svg,
.landing-floating-card .sidebar-nav-icon svg,
.landing-mini-portal .sidebar-nav-icon svg,
.landing-cycle .sidebar-nav-icon svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.landing-app-content { min-width: 0; }

.landing-app-topbar {
    height: 40px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border-bottom: 1px solid #e7e9ef;
}

.landing-app-topbar > span {
    padding: 4px 8px;
    border-radius: 20px;
    color: #69738b;
    background: #eef1fa;
    font-size: 0.45rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.landing-app-topbar > div { display: flex; align-items: center; gap: 7px; }
.landing-app-topbar > div i { width: 18px; height: 18px; border: 1px solid #e0e4ec; border-radius: 5px; }
.landing-app-topbar > div b { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 6px; background: #e7e9ef; font-size: 0.45rem; }

.landing-app-heading {
    margin: 15px;
    padding: 19px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #dfe3eb;
    border-radius: 8px;
    background: linear-gradient(110deg, #fff 0%, #f7f8fb 68%, #e8eaf0 100%);
}

.landing-app-heading small,
.landing-stat-grid small,
.landing-preview-list > div small,
.landing-ai-card > small {
    color: #818a9e;
    font-size: 0.43rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.landing-app-heading h2 { margin: 3px 0; font-size: 1.03rem; letter-spacing: -0.04em; }
.landing-app-heading p { margin: 0; color: #788195; font-size: 0.5rem; }
.landing-app-heading button { padding: 8px 10px; border: 0; border-radius: 5px; color: #fff; background: #171d2c; font-size: 0.47rem; font-weight: 700; }

.landing-stat-grid {
    margin: 0 15px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.landing-stat-grid article {
    min-width: 0;
    padding: 11px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 2px 7px;
    border: 1px solid #e2e5ec;
    border-radius: 7px;
    background: #fff;
}

.landing-stat-grid article > span {
    grid-row: span 2;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 6px;
    color: #404b65;
    background: #f0f2f7;
}

.landing-stat-grid strong { font-size: 0.76rem; }
.landing-stat-grid em { grid-column: 1 / -1; margin-top: 5px; color: #858da0; font-size: 0.42rem; font-style: normal; }

.landing-preview-lower {
    margin: 10px 15px;
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    gap: 9px;
}

.landing-preview-list,
.landing-ai-card {
    border: 1px solid #e0e4ec;
    border-radius: 7px;
    background: #fff;
}

.landing-preview-list > div { padding: 10px 11px 7px; display: grid; gap: 2px; }
.landing-preview-list > div b { font-size: 0.58rem; }
.landing-preview-list > p { margin: 0; padding: 9px 11px; display: grid; grid-template-columns: auto 1fr auto; gap: 7px; align-items: center; border-top: 1px solid #edf0f5; }
.landing-preview-list > p > i { width: 5px; height: 5px; border-radius: 50%; background: #56b37a; }
.landing-preview-list > p span { display: grid; gap: 2px; }
.landing-preview-list > p b { font-size: 0.47rem; }
.landing-preview-list > p small { color: #929bad; font-size: 0.4rem; }
.landing-preview-list > p em { color: #63816c; font-size: 0.39rem; font-style: normal; }

.landing-ai-card { padding: 11px; position: relative; overflow: hidden; }
.landing-ai-card::after { content: ""; position: absolute; width: 80px; height: 80px; right: -25px; top: -30px; border-radius: 50%; background: rgba(81, 104, 244, 0.09); }
.landing-ai-mark { width: 24px; height: 24px; margin-bottom: 10px; display: grid; place-items: center; border-radius: 7px; color: #fff; background: var(--landing-blue); font-size: 0.65rem; }
.landing-ai-card > strong { margin-top: 4px; display: block; font-size: 0.62rem; }
.landing-ai-card > p { padding: 7px; color: #59637a; background: #f5f6fa; border-radius: 5px; font-size: 0.44rem; line-height: 1.45; }
.landing-ai-card > div { display: flex; align-items: center; gap: 3px; color: #8b94a7; font-size: 0.38rem; }
.landing-ai-card > div i { width: 3px; height: 3px; border-radius: 50%; background: var(--landing-blue); }
.landing-ai-card > div span { margin-left: 3px; }

.landing-floating-card {
    position: absolute;
    z-index: 4;
    padding: 12px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid rgba(22, 29, 48, 0.1);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 17px 35px rgba(27, 38, 74, 0.15);
    backdrop-filter: blur(10px);
}

.landing-floating-card > span {
    width: 31px;
    height: 31px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: var(--landing-blue);
    background: #eef0ff;
}

.landing-floating-card div { display: grid; gap: 2px; }
.landing-floating-card small { color: #929bad; font-size: 0.4rem; font-weight: 800; letter-spacing: 0.08em; }
.landing-floating-card strong { font-size: 0.58rem; }
.landing-floating-card.is-search { left: -34px; bottom: 3px; }
.landing-floating-card.is-status { right: -14px; top: 6px; }
.landing-floating-card.is-status > span { color: #4e8d31; background: #eef8e9; font-weight: 800; }

.landing-context-strip {
    width: min(1240px, calc(100vw - 56px));
    margin: 0 auto;
    padding: 25px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #e9ebf1;
    border-bottom: 1px solid #e9ebf1;
    color: #8a92a4;
    font-size: 0.75rem;
}

.landing-context-strip > span { text-transform: uppercase; letter-spacing: 0.09em; font-size: 0.62rem; font-weight: 800; }
.landing-context-strip > div { display: flex; align-items: center; gap: 22px; }
.landing-context-strip b { color: #596277; font-weight: 650; }
.landing-context-strip i { width: 3px; height: 3px; border-radius: 50%; background: #cbd0db; }

.landing-section {
    width: min(1240px, calc(100vw - 56px));
}

.landing-product-section {
    padding: 125px 0 130px;
    gap: 50px;
}

.landing-section-heading {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.65fr);
    column-gap: 80px;
    align-items: end;
}

.landing-section-heading .landing-eyebrow { grid-column: 1 / -1; }
.landing-section-heading h2,
.landing-dark-copy h2,
.landing-cta h2 {
    margin: 0;
    color: var(--landing-ink);
    font-size: clamp(2.4rem, 4.2vw, 4rem);
    line-height: 1.07;
    letter-spacing: -0.055em;
}

.landing-section-heading > p {
    margin: 0 0 5px;
    color: var(--landing-muted);
    font-size: 0.96rem;
    line-height: 1.7;
}

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

.landing-bento-card {
    min-height: 370px;
    padding: 34px;
    position: relative;
    overflow: hidden;
    border: 1px solid #e3e6ee;
    border-radius: 20px;
    background: #f8f9fc;
}

.landing-bento-card.is-wide {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(300px, 1.15fr);
    gap: 36px;
    grid-column: 1 / -1;
    align-items: center;
}

.landing-feature-icon {
    width: 40px;
    height: 40px;
    margin-bottom: 28px;
    display: grid;
    place-items: center;
    border: 1px solid #dde1eb;
    border-radius: 11px;
    color: var(--landing-blue);
    background: #fff;
    box-shadow: 0 7px 15px rgba(30, 40, 70, 0.06);
    font-size: 1rem;
}

.landing-feature-icon .sidebar-nav-icon { width: 18px; height: 18px; }
.landing-bento-card > span,
.landing-bento-card.is-wide > div:first-child > span {
    display: block;
    margin-bottom: 9px;
    color: #7d869a;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.1em;
}

.landing-bento-card h3 {
    max-width: 17ch;
    margin: 0 0 13px;
    color: var(--landing-ink);
    font-size: 1.65rem;
    line-height: 1.15;
    letter-spacing: -0.035em;
}

.landing-bento-card > p,
.landing-bento-card > div:first-child > p {
    max-width: 50ch;
    color: var(--landing-muted);
    font-size: 0.88rem;
    line-height: 1.65;
}

.landing-bento-card.is-portal {
    min-height: 430px;
    background: linear-gradient(135deg, #f7f8fc 0%, #eef1ff 100%);
}

.landing-bento-card.is-portal .landing-bento-copy {
    grid-column: 2;
    grid-row: 1;
}

.landing-bento-card.is-portal .landing-mini-portal {
    grid-column: 1;
    grid-row: 1;
}

.landing-feature-list {
    margin: 25px 0 0;
    padding: 0;
    display: grid;
    gap: 16px;
    list-style: none;
}

.landing-feature-list li {
    display: grid;
    grid-template-columns: 27px minmax(0, 1fr);
    gap: 11px;
    align-items: start;
}

.landing-feature-list li > i {
    width: 27px;
    height: 27px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: #4f7a38;
    background: #ecf7e6;
    font-size: .62rem;
    font-style: normal;
    font-weight: 850;
}

.landing-feature-list li > span {
    display: grid;
    gap: 3px;
}

.landing-feature-list b {
    color: var(--landing-ink);
    font-size: .72rem;
}

.landing-feature-list small {
    color: #7b8497;
    font-size: .62rem;
    line-height: 1.45;
}

.landing-mini-portal {
    align-self: end;
    overflow: hidden;
    border: 1px solid #dce1ed;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 20px 35px rgba(40, 52, 95, 0.1);
}

.landing-mini-portal > div {
    min-height: 105px;
    padding: 20px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 11px;
    color: #fff;
    background: #171d2c;
}

.landing-mini-portal > div > b { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 7px; color: #171d2c; background: var(--landing-lime); }
.landing-mini-portal > div > span { font-size: 0.82rem; font-weight: 700; }
.landing-mini-portal > div > i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 7px; background: rgba(255,255,255,.1); }
.landing-mini-portal section { padding: 14px 18px 17px; }
.landing-mini-portal section > small { color: #929bad; font-size: 0.47rem; font-weight: 800; letter-spacing: .08em; }
.landing-mini-portal section p { margin: 8px 0 0; padding: 9px 0; display: grid; grid-template-columns: 25px 1fr auto; align-items: center; border-top: 1px solid #edf0f5; font-size: .62rem; }
.landing-mini-portal section p span { color: #8993a7; }
.landing-mini-portal section p em { color: var(--landing-blue); font-style: normal; }

.landing-bento-card.is-ai { background: #171d2c; border-color: #171d2c; color: #fff; }
.landing-bento-card.is-ai::after { content: ""; position: absolute; width: 280px; height: 280px; right: -100px; top: -100px; border-radius: 50%; background: rgba(81, 104, 244, 0.2); filter: blur(8px); }
.landing-bento-card.is-ai .landing-feature-icon { color: #fff; background: var(--landing-blue); border-color: transparent; }
.landing-bento-card.is-ai h3 { color: #fff; }
.landing-bento-card.is-ai > p { color: #aeb7c9; }
.landing-mini-chat { margin-top: 24px; padding: 15px; position: relative; z-index: 2; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: rgba(255,255,255,.06); }
.landing-mini-chat > p { width: 78%; margin: 0 0 11px auto; padding: 9px 11px; border-radius: 8px 8px 2px 8px; color: #dbe0ec; background: rgba(255,255,255,.08); font-size: .61rem; }
.landing-mini-chat > div { display: grid; grid-template-columns: 20px 1fr; gap: 8px; color: #dbe0ec; font-size: .59rem; line-height: 1.5; }
.landing-mini-chat > div i { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 5px; color: #fff; background: var(--landing-blue); font-style: normal; }
.landing-mini-chat > small { margin: 9px 0 0 28px; display: block; color: #828da2; font-size: .48rem; }

.landing-mini-workflow { margin-top: 40px; display: flex; align-items: center; justify-content: space-between; gap: 7px; }
.landing-mini-workflow b { padding: 9px 11px; border: 1px solid #dfe3ec; border-radius: 8px; color: #59637a; background: #fff; font-size: .59rem; }
.landing-mini-workflow b:last-child { color: #4f7a38; border-color: #dbead2; background: #f3faef; }
.landing-mini-workflow i { color: #adb4c2; font-style: normal; }

.landing-mini-flow { height: 95px; margin-top: 25px; position: relative; display: flex; align-items: center; justify-content: center; }
.landing-mini-flow i { width: 30px; height: 30px; position: relative; z-index: 2; border: 2px solid #8797f4; border-radius: 8px; background: #fff; box-shadow: 0 5px 12px rgba(35,48,85,.08); }
.landing-mini-flow i:first-child, .landing-mini-flow i:last-child { border-radius: 50%; border-color: #8fc464; }
.landing-mini-flow span { width: 38px; height: 2px; background: #cbd1df; }
.landing-mini-flow b { width: 38px; height: 40px; position: absolute; left: 50%; top: 41px; border-left: 2px solid #cbd1df; border-bottom: 2px solid #cbd1df; }

.landing-bento-card.is-workspaces { background: #fff; }
.landing-workspace-stack { display: grid; gap: 10px; }
.landing-workspace-stack p { margin: 0; padding: 14px; display: grid; grid-template-columns: 35px 1fr auto; gap: 11px; align-items: center; border: 1px solid #e2e5ec; border-radius: 10px; background: #f8f9fc; box-shadow: 0 8px 20px rgba(37,46,75,.04); }
.landing-workspace-stack p:nth-child(2) { transform: translateX(18px); }
.landing-workspace-stack p i { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: #1a2133; font-size: .57rem; font-style: normal; font-weight: 800; }
.landing-workspace-stack p:nth-child(2) i { background: var(--landing-blue); }
.landing-workspace-stack p:nth-child(3) i { color: #344021; background: var(--landing-lime); }
.landing-workspace-stack p span { display: grid; gap: 3px; }
.landing-workspace-stack p b { font-size: .68rem; }
.landing-workspace-stack p small, .landing-workspace-stack p em { color: #8b94a6; font-size: .52rem; font-style: normal; }

.landing-dark-section {
    padding: 112px 0;
    color: #fff;
    background:
        radial-gradient(circle at 15% 30%, rgba(81, 104, 244, 0.25), transparent 28%),
        radial-gradient(circle at 86% 75%, rgba(184, 235, 105, 0.08), transparent 25%),
        #121827;
}

.landing-dark-inner {
    width: min(1240px, calc(100vw - 56px));
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(340px, .88fr) minmax(450px, 1.12fr);
    gap: 82px;
    align-items: start;
}

.landing-eyebrow.is-light { color: #aeb6c7; }
.landing-dark-copy h2 { color: #fff; }
.landing-dark-copy h2 { max-width: 11ch; font-size: clamp(2.8rem, 4vw, 3.7rem); }
.landing-dark-copy h2 em { color: var(--landing-lime); }
.landing-dark-copy > p { max-width: 48ch; margin: 25px 0 28px; color: #aeb6c7; line-height: 1.75; }
.landing-dark-copy > a { display: inline-flex; gap: 14px; color: #fff; font-size: .85rem; font-weight: 750; text-decoration: none; }
.landing-dark-copy > a span { color: var(--landing-lime); }

.landing-cycle { display: grid; }
.landing-cycle article { min-height: 112px; padding: 23px 4px; display: grid; grid-template-columns: 38px 1fr 48px; gap: 18px; align-items: center; border-bottom: 1px solid rgba(255,255,255,.11); }
.landing-cycle article:first-child { border-top: 1px solid rgba(255,255,255,.11); }
.landing-cycle article > strong { color: #707b90; font-size: .62rem; letter-spacing: .08em; }
.landing-cycle article > div h3 { margin: 0 0 5px; color: #fff; font-size: 1.02rem; }
.landing-cycle article > div p { margin: 0; color: #8e99ad; font-size: .76rem; }
.landing-cycle article > span { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; color: var(--landing-lime); background: rgba(255,255,255,.045); }
.landing-cycle .sidebar-nav-icon { width: 18px; height: 18px; }

.landing-closing-section { padding: 120px 0; }
.landing-cta {
    min-height: 330px;
    padding: 60px;
    position: relative;
    overflow: hidden;
    border: 1px solid #dfe3ec;
    border-radius: 22px;
    background:
        radial-gradient(circle at 92% 20%, rgba(81, 104, 244, .15), transparent 26%),
        radial-gradient(circle at 5% 100%, rgba(184, 235, 105, .17), transparent 24%),
        #f7f8fc;
    box-shadow: none;
}
.landing-cta::after { content: "w"; position: absolute; right: 4%; bottom: -42%; color: rgba(81,104,244,.045); font-size: 25rem; font-weight: 900; line-height: 1; transform: rotate(-8deg); }
.landing-cta > div { position: relative; z-index: 2; }
.landing-cta h2 { font-size: clamp(2.2rem, 3.5vw, 3.25rem); }
.landing-cta p { max-width: 600px; color: var(--landing-muted); line-height: 1.65; }
.landing-cta .landing-actions { display: grid; justify-items: stretch; min-width: 205px; }
.landing-login-link { color: #7d8698; font-size: .7rem; text-align: center; text-decoration: none; }
.landing-login-link b { color: var(--landing-ink); }

.landing-footer {
    width: min(1240px, calc(100vw - 56px));
    margin: 0 auto;
    padding: 30px 0 42px;
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 50px;
    align-items: end;
    border-top: 1px solid #e6e9f0;
}
.landing-brand.is-footer > span { width: 28px; height: 28px; border-radius: 8px; font-size: 15px; }
.landing-footer > div p { margin: 9px 0 0; color: #9299a8; font-size: .7rem; }
.landing-footer nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px 22px; }
.landing-footer nav a, .landing-footer > small { color: #747d90; font-size: .7rem; text-decoration: none; }

@media (max-width: 1080px) {
    .landing-hero {
        grid-template-columns: 1fr;
        padding-top: 72px;
    }

    .landing-hero-copy {
        max-width: 760px;
    }

    .landing-hero-copy h1 {
        max-width: 12ch;
    }

    .landing-product-visual {
        width: min(760px, 100%);
        margin: 0 auto;
    }

    .landing-section-heading {
        grid-template-columns: 1fr;
    }

    .landing-section-heading > p {
        max-width: 650px;
        margin-top: 22px;
    }

    .landing-dark-inner {
        grid-template-columns: 1fr;
        gap: 50px;
    }
}

@media (max-width: 760px) {
    .landing-topbar,
    .landing-hero,
    .landing-context-strip,
    .landing-section,
    .landing-dark-inner,
    .landing-footer {
        width: min(100% - 32px, 1240px);
    }

    .landing-nav > a:not(.landing-nav-cta) {
        display: none;
    }

    .landing-nav {
        gap: 8px;
    }

    .landing-nav-cta {
        min-height: 38px;
        font-size: .76rem;
    }

    .landing-hero {
        min-height: 0;
        padding: 60px 0 70px;
    }

    .landing-hero-copy h1 {
        font-size: clamp(2.7rem, 14vw, 4rem);
    }

    .landing-hero-lead {
        font-size: .94rem;
    }

    .landing-hero-assurances {
        display: grid;
        gap: 8px;
    }

    .landing-product-visual {
        width: 720px;
        max-width: none;
        transform: scale(.68);
        transform-origin: top left;
        margin-bottom: -145px;
    }

    .landing-floating-card.is-search { left: 10px; }
    .landing-floating-card.is-status { right: 10px; }

    .landing-context-strip {
        display: grid;
        gap: 15px;
        overflow: hidden;
    }

    .landing-context-strip > div {
        min-width: max-content;
        gap: 15px;
    }

    .landing-product-section,
    .landing-dark-section,
    .landing-closing-section {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .landing-section-heading h2,
    .landing-dark-copy h2 {
        font-size: 2.45rem;
    }

    .landing-bento-grid,
    .landing-bento-card.is-wide {
        grid-template-columns: 1fr;
    }

    .landing-bento-card.is-wide {
        grid-column: auto;
    }

    .landing-bento-card.is-portal .landing-bento-copy,
    .landing-bento-card.is-portal .landing-mini-portal {
        grid-column: auto;
        grid-row: auto;
    }

    .landing-bento-card.is-portal .landing-bento-copy {
        order: 1;
    }

    .landing-bento-card.is-portal .landing-mini-portal {
        order: 2;
    }

    .landing-bento-card {
        min-height: 0;
        padding: 25px;
    }

    .landing-mini-portal,
    .landing-workspace-stack,
    .landing-mini-chat {
        margin-top: 25px;
    }

    .landing-workspace-stack p:nth-child(2) {
        transform: none;
    }

    .landing-cta {
        padding: 36px 27px;
        align-items: flex-start;
    }

    .landing-cta .landing-actions {
        width: 100%;
    }

    .landing-footer {
        grid-template-columns: 1fr;
        gap: 25px;
        align-items: start;
    }
}

.process-step-branches,
.process-step-options-list {
    display: grid;
    gap: 14px;
}

.process-step-branch,
.process-step-option-card {
    border: 1px solid var(--line);
    background: var(--panel);
    padding: 14px;
    border-radius: 10px;
}

.process-step-option-fields {
    display: grid;
    gap: 12px;
}

.process-step-option-actions {
    margin-top: 10px;
    display: flex;
    justify-content: flex-end;
}

.process-step-block {
    display: grid;
    gap: 18px;
    padding: 22px 24px;
    border: 1px solid var(--line);
    background: #fff;
}

.process-step-block.is-note {
    background: #fbfcff;
}

.process-step-block.is-check {
    background: #fcfcf7;
}

.process-step-block.is-result {
    background: #f8fbf7;
}

.process-step-block.is-decision {
    background: #fafbff;
}

.process-step-head {
    display: grid;
    gap: 8px;
}

.process-step-head h3 {
    margin: 0;
}

.process-step-head p {
    margin: 0;
    color: var(--muted);
}

.process-step-type {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    padding: 5px 10px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--muted);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
}

.process-step-options {
    display: grid;
    gap: 14px;
}

.process-step-option {
    display: grid;
    gap: 14px;
    padding: 18px 20px;
    border: 1px solid var(--line);
    background: #fff;
}

.process-step-option-head {
    display: grid;
    gap: 5px;
}

.process-step-option-head strong {
    font-size: 1rem;
}

.process-step-option-head small {
    color: var(--muted);
}

.process-step-option-body > :first-child {
    margin-top: 0;
}

.process-step-after {
    display: grid;
    gap: 12px;
    padding-top: 8px;
    border-top: 1px solid var(--line);
}

.process-step-after-head span {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    background: #fff;
    border: 1px solid var(--line);
    color: var(--muted);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
}

.process-step-after-body > :first-child {
    margin-top: 0;
}

.bpmn-process-reference { display: grid; gap: 24px; }
.bpmn-process-reference-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 20px 22px; border: 1px solid color-mix(in srgb, var(--primary) 18%, #dce3ec); border-radius: 16px; background: color-mix(in srgb, var(--primary) 5%, white); }
.bpmn-process-reference-head > div { display: grid; gap: 6px; }
.bpmn-process-reference-head span { color: var(--primary); font-size: 0.7rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.bpmn-process-reference-head h2, .bpmn-process-reference-head p { margin: 0; }
.bpmn-process-reference-head p { color: var(--muted); line-height: 1.55; }
.bpmn-process-reference-steps { display: grid; gap: 14px; }
.process-article-context-note { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.process-article-context-note > div { display: grid; gap: 3px; }
.process-article-context-note span { color: var(--muted); font-size: 0.78rem; }
.bpmn-create-article-form { margin: 0; }

@media (max-width: 720px) {
    .bpmn-process-reference-head,
    .process-article-context-note {
        align-items: stretch;
        flex-direction: column;
    }
    .bpmn-process-reference-head .btn,
    .process-article-context-note .btn { align-self: flex-start; }
}

.process-flow-preview,
.process-flow-section-list,
.process-flow-node-list {
    display: grid;
    gap: 14px;
}

.process-flow-editor-inline {
    display: grid;
    gap: 16px;
}

.process-flow-import-card {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid rgba(79, 124, 255, 0.18);
    background: linear-gradient(180deg, rgba(79, 124, 255, 0.05) 0%, rgba(255, 255, 255, 0.96) 100%);
    border-radius: 12px;
}

.process-flow-import-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.process-flow-import-head p {
    margin: 4px 0 0;
}

.process-flow-import-warnings {
    display: grid;
    gap: 8px;
    padding: 12px 14px;
    border: 1px solid rgba(222, 171, 68, 0.28);
    background: rgba(255, 248, 224, 0.92);
    border-radius: 10px;
}

.process-flow-import-warnings strong {
    color: var(--text);
}

.process-flow-import-warnings ul {
    margin: 0;
    padding-left: 18px;
}

.process-flow-import-warnings li {
    color: var(--muted);
}

.process-flow-section-card {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    background: rgba(79, 124, 255, 0.03);
    border-radius: 10px;
}

.process-flow-section-head {
    display: grid;
    gap: 12px;
}

.process-flow-section-meta,
.process-flow-node-meta {
    display: grid;
    gap: 6px;
}

.process-flow-section-fields {
    display: grid;
    gap: 12px;
}

.process-flow-section-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.process-flow-node-preview,
.process-flow-node-card,
.process-flow-node {
    display: grid;
    gap: 10px;
    padding: 16px 18px;
    border: 1px solid var(--line);
    background: var(--panel);
    border-radius: 10px;
}

.process-flow-node-preview-head,
.process-flow-node-top {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
}

.process-flow-node-preview span,
.process-flow-node-type {
    color: var(--muted);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
}

.process-flow-node-grid {
    display: grid;
    gap: 12px;
}

.process-flow-output-shell,
.process-flow-output-list {
    display: grid;
    gap: 12px;
}

.process-flow-output-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 10px;
}

.process-flow-node-actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.process-flow-block {
    display: grid;
    gap: 24px;
}

.process-flow-head {
    display: grid;
    gap: 8px;
}

.process-flow-head h2,
.process-flow-node h3 {
    margin: 0;
}

.process-flow-head p,
.process-flow-node p {
    margin: 0;
    color: var(--muted);
}

.process-flow-canvas-wrap {
    overflow-x: auto;
    padding-bottom: 10px;
}

.process-flow-svg {
    display: block;
    width: auto;
    min-width: 0;
    max-width: none;
    height: auto;
}

.process-flow-edge {
    fill: none;
    stroke: #9aa7bc;
    stroke-width: 2;
    marker-end: url(#process-flow-arrow);
    stroke-linecap: square;
    stroke-linejoin: miter;
}

.process-flow-edge-label rect {
    fill: #fff;
    stroke: var(--line);
}

.process-flow-edge-label text {
    fill: var(--muted);
    font-size: var(--font-size-body);
    text-anchor: middle;
    dominant-baseline: middle;
    font-weight: 700;
}

.process-flow-node-box {
    fill: #fff;
    stroke: var(--line);
}

.process-flow-node-accent {
    fill: rgba(127, 138, 157, 0.42);
}

.process-flow-node-glyph-shell {
    fill: rgba(127, 138, 157, 0.08);
    stroke: rgba(127, 138, 157, 0.22);
}

.process-flow-node-glyph {
    fill: var(--muted);
    font-size: var(--font-size-ui);
    font-weight: 700;
    text-anchor: middle;
}

.process-flow-node-svg {
    outline: none;
}

.process-flow-node-svg.is-selected .process-flow-node-box,
.process-flow-node-svg:focus-visible .process-flow-node-box {
    stroke: var(--primary);
    stroke-width: 2;
}

.process-flow-node-svg.is-start .process-flow-node-box {
    fill: #f8fbff;
    stroke: rgba(79, 124, 255, 0.26);
}

.process-flow-node-svg.is-start .process-flow-node-accent,
.process-flow-node-svg.is-start .process-flow-node-glyph-shell {
    fill: rgba(79, 124, 255, 0.18);
    stroke: rgba(79, 124, 255, 0.32);
}

.process-flow-node-svg.is-decision .process-flow-node-box {
    fill: #fafbff;
    stroke: rgba(79, 124, 255, 0.24);
}

.process-flow-node-svg.is-decision .process-flow-node-accent,
.process-flow-node-svg.is-decision .process-flow-node-glyph-shell {
    fill: rgba(79, 124, 255, 0.16);
    stroke: rgba(79, 124, 255, 0.30);
}

.process-flow-node-svg.is-merge .process-flow-node-box {
    fill: #fcfbf7;
    stroke: rgba(195, 155, 45, 0.24);
}

.process-flow-node-svg.is-merge .process-flow-node-accent,
.process-flow-node-svg.is-merge .process-flow-node-glyph-shell {
    fill: rgba(195, 155, 45, 0.18);
    stroke: rgba(195, 155, 45, 0.34);
}

.process-flow-node-svg.is-result .process-flow-node-box {
    fill: #f8fbf7;
    stroke: rgba(112, 156, 88, 0.24);
}

.process-flow-node-svg.is-result .process-flow-node-accent,
.process-flow-node-svg.is-result .process-flow-node-glyph-shell {
    fill: rgba(112, 156, 88, 0.18);
    stroke: rgba(112, 156, 88, 0.34);
}

.process-flow-node-kind {
    fill: var(--muted);
    font-size: var(--font-size-ui);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
}

.process-flow-node-title {
    fill: var(--text);
    font-size: var(--font-size-h4);
    font-weight: 700;
}

.process-flow-node-text {
    fill: var(--muted);
    font-size: var(--font-size-body);
}

.process-flow-node-detail-link circle {
    fill: #ffffff;
    stroke: var(--line);
}

.process-flow-node-detail-link text {
    fill: var(--muted);
    font-size: var(--font-size-ui);
    font-weight: 700;
    text-anchor: middle;
}

.process-flow-detail-copy,
.process-flow-detail-transitions {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.process-flow-detail-copy h4,
.process-flow-detail-transitions h4 {
    margin-bottom: 0;
}

.process-flow-detail-empty p {
    margin-bottom: 0;
}

.process-flow-detail-transition-list {
    display: grid;
    gap: 10px;
}

.process-flow-detail-transition-item {
    display: grid;
    gap: 4px;
    padding: 12px 0;
    border-top: 1px solid #edf1f5;
}

.process-flow-detail-transition-item:first-child {
    padding-top: 0;
    border-top: 0;
}

.process-flow-detail-transition-item small {
    margin: 0;
}

.process-flow-detail-transition-item strong {
    color: var(--text);
    font-size: var(--font-size-body);
}

.richtext-shell {
    display: grid;
    gap: 12px;
}

.richtext-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.richtext-editor {
    min-height: 280px;
    padding: 16px 18px;
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 6px;
    overflow-y: auto;
}

.richtext-editor:focus {
    outline: 0;
    border-color: rgba(79, 124, 255, 0.42);
    box-shadow: 0 0 0 3px rgba(79, 124, 255, 0.08);
}

.richtext-editor p:last-child,
.richtext-editor ul:last-child,
.richtext-editor ol:last-child,
.richtext-editor h2:last-child,
.richtext-editor h3:last-child,
.richtext-editor h4:last-child {
    margin-bottom: 0;
}

.richtext-editor mark,
.richtext-block mark {
    background: #fff1a8;
    color: inherit;
    padding: 0 0.12em;
}

.richtext-editor a,
.richtext-block a {
    color: var(--primary);
    text-decoration: underline;
}

.richtext-editor ol,
.richtext-block ol {
    list-style: none;
    margin: 0 0 1rem;
    padding-left: 0;
    counter-reset: item;
}

.richtext-editor ol li,
.richtext-block ol li {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    column-gap: 0.65rem;
    align-items: start;
    margin: 0.22rem 0;
    color: var(--text);
}

.richtext-editor ol li::before,
.richtext-block ol li::before {
    counter-increment: item;
    content: counters(item, ".") ".";
    grid-column: 1;
    color: var(--muted);
    font-size: var(--font-size-body);
    font-weight: 700;
    white-space: nowrap;
}

.richtext-editor ol li > *,
.richtext-block ol li > * {
    grid-column: 2;
}

.richtext-editor ol li > ol,
.richtext-editor ol li > ul,
.richtext-block ol li > ol,
.richtext-block ol li > ul {
    margin-top: 0.35rem;
}

.richtext-editor ol ol,
.richtext-block ol ol {
    margin-top: 0.35rem;
    margin-bottom: 0.35rem;
    padding-left: 1.4rem;
}

.richtext-editor ul,
.richtext-block ul {
    margin: 0 0 1rem;
    padding-left: 1.35rem;
}

.richtext-editor ul ul,
.richtext-block ul ul {
    margin-top: 0.35rem;
    margin-bottom: 0.35rem;
}

.block-library-item.is-recommended {
    border-color: rgba(79, 124, 255, 0.32);
    background: linear-gradient(180deg, rgba(79, 124, 255, 0.06), rgba(79, 124, 255, 0.02));
}

.block-library-item.is-legacy {
    opacity: 0.88;
}

.block-library-item small {
    display: inline-block;
    margin-top: 8px;
    color: var(--muted);
    font-size: var(--font-size-ui);
    font-weight: 700;
}

.block-library-secondary {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #edf1f5;
}

.block-library-secondary summary {
    cursor: pointer;
    color: var(--muted);
    font-size: var(--font-size-ui);
    font-weight: 700;
    list-style: none;
}

.block-library-secondary summary::-webkit-details-marker {
    display: none;
}

.block-library-secondary summary::after {
    content: ' +';
}

.block-library-secondary[open] summary::after {
    content: ' -';
}

.block-library-grid.is-secondary {
    margin-top: 14px;
}

.codeblock-shell {
    display: grid;
    gap: 14px;
}

.codeblock-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
}

.codeblock-toolbar .field {
    margin: 0;
    min-width: 180px;
}

.codeblock-toolbar-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.codeblock-editor {
    min-height: 320px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    background: #0f1724;
    color: #e8edf7;
    border-radius: 6px;
    font-family: "Cascadia Code", "Fira Code", Consolas, monospace;
    font-size: 0.95rem;
    line-height: 1.6;
    resize: vertical;
    white-space: pre;
    overflow-wrap: normal;
    overflow-x: auto;
}

.content-code-block {
    margin: 24px 0;
    border: 1px solid #dbe2ed;
    background: #0f1724;
    color: #e8edf7;
}

.content-code-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
}

.content-code-head-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.content-code-head strong,
.content-code-head span {
    color: #f4f7fb;
    font-size: var(--font-size-ui);
}

.content-code-head span {
    opacity: 0.78;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.content-code-copy {
    min-height: 30px;
    padding: 6px 10px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.06);
    color: #f4f7fb;
    border-radius: 4px;
    cursor: pointer;
    font-size: var(--font-size-ui);
    font-weight: 700;
}

.content-code-copy:hover {
    background: rgba(255, 255, 255, 0.12);
}

.content-code-block pre {
    margin: 0;
    padding: 18px 20px;
    overflow-x: auto;
}

.content-code-block code {
    font-family: "Cascadia Code", "Fira Code", Consolas, monospace;
    font-size: 0.95rem;
    line-height: 1.65;
    color: inherit;
    white-space: pre;
}

.content-code-block .token-key {
    color: #8cc7ff;
}

.content-code-block .token-string {
    color: #b7e68a;
}

.content-code-block .token-number {
    color: #f4c37a;
}

.content-code-block .token-keyword {
    color: #ff9ab5;
    font-weight: 700;
}

.content-code-block .token-punctuation {
    color: #8ea0bd;
}

.table-editor-shell {
    display: grid;
    gap: 16px;
}

.table-size-picker {
    display: grid;
    gap: 10px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    background: #f8fbff;
}

.table-size-grid {
    display: grid;
    grid-template-columns: repeat(6, 22px);
    gap: 6px;
}

.table-size-cell {
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid #d6deea;
    background: #fff;
    cursor: pointer;
}

.table-size-cell.is-active,
.table-size-cell:hover {
    background: rgba(79, 124, 255, 0.12);
    border-color: rgba(79, 124, 255, 0.38);
}

.table-editor-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.table-editor-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    background: #fff;
}

.table-editor-grid {
    width: 100%;
    border-collapse: collapse;
    min-width: 520px;
}

.table-editor-grid td {
    position: relative;
    border: 1px solid #e6ebf3;
    vertical-align: top;
    padding: 0;
    min-width: 140px;
}

.table-editor-grid textarea {
    width: 100%;
    min-height: 84px;
    padding: 12px 14px;
    border: 0;
    resize: vertical;
    background: transparent;
}

.table-remove-row,
.table-remove-column {
    position: absolute;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 1px solid #dbe2ed;
    background: #fff;
    color: var(--muted);
    cursor: pointer;
    line-height: 1;
}

.table-remove-row {
    top: 6px;
    right: 6px;
}

.table-remove-column {
    bottom: 6px;
    right: 6px;
}

.content-table-block {
    margin: 24px 0;
}

.content-table-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 0;
    padding: 10px 14px;
    border: 1px solid #dde4ef;
    border-bottom: 0;
    background: #fbfcff;
}

.content-table-title strong {
    color: var(--text);
    font-size: var(--font-size-ui);
    font-weight: 700;
}

.content-table-wrap {
    overflow-x: auto;
    border: 1px solid #dde4ef;
    border-top: 0;
    background: #fff;
}

.content-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 520px;
}

.content-table th,
.content-table td {
    padding: 12px 14px;
    border: 1px solid #e7edf5;
    text-align: left;
    vertical-align: top;
    color: var(--text);
    font-size: var(--font-size-body);
}

.content-table th {
    background: #f7faff;
    font-weight: 700;
}

.content-table-expand,
.content-table-dialog-close {
    min-height: 34px;
    padding: 6px 10px;
    border: 1px solid #d9dfeb;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    font-size: var(--font-size-ui);
    font-weight: 700;
}

.content-table-expand:hover,
.content-table-dialog-close:hover {
    background: #f5f8fd;
    color: var(--text);
}

.content-table-dialog {
    width: 92vw;
    max-width: none;
    max-height: 92vh;
    height: 92vh;
    margin: auto;
    padding: 0;
    border: 1px solid var(--line);
    background: #fff;
    box-shadow: 0 28px 70px rgba(23, 32, 51, 0.2);
    overflow: hidden;
    overscroll-behavior: contain;
}

.content-table-dialog::backdrop {
    background: rgba(14, 22, 37, 0.42);
    backdrop-filter: blur(3px);
}

.content-table-dialog-shell {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 0;
    height: 100%;
}

.content-table-dialog-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid #edf1f5;
}

.content-table-dialog-head strong {
    color: var(--text);
}

.content-table-dialog-body {
    padding: 20px;
    min-height: 0;
    height: 100%;
}

.content-table-wrap.is-fullscreen {
    height: 100%;
    max-height: none;
    overflow: auto;
    overscroll-behavior: contain;
}

.content-table.is-fullscreen {
    min-width: 900px;
}

@media (max-width: 780px) {
    .content-table-dialog {
        width: calc(100vw - 16px);
        height: calc(100vh - 16px);
        max-height: calc(100vh - 16px);
    }

    .content-table-dialog-head,
    .content-table-dialog-body {
        padding: 14px;
    }
}

/* BPMN MVP --------------------------------------------------------------- */
.bpmn-kicker {
    display: block;
    margin-bottom: 5px;
    color: var(--primary);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.bpmn-overview-intro {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 24px;
    padding: 28px 32px;
    border: 1px solid color-mix(in srgb, var(--primary) 18%, #dfe7ef);
    border-radius: 20px;
    background: linear-gradient(125deg, color-mix(in srgb, var(--primary) 8%, white), #fff 58%, color-mix(in srgb, var(--secondary) 18%, white));
}

.bpmn-overview-intro h2 { margin: 0 0 8px; }
.bpmn-overview-intro p { max-width: 680px; margin: 0; color: var(--muted); }
.bpmn-mini-flow { display: flex; align-items: center; flex: 0 0 auto; }
.bpmn-mini-flow span { display: grid; place-items: center; min-width: 70px; height: 46px; padding: 0 12px; border: 2px solid var(--primary); border-radius: 9px; background: #fff; color: var(--text); font-size: 0.74rem; font-weight: 800; }
.bpmn-mini-flow span.is-round { min-width: 52px; width: 52px; height: 52px; padding: 0; border-radius: 50%; }
.bpmn-mini-flow span.is-diamond { min-width: 42px; width: 42px; height: 42px; padding: 0; border-radius: 7px; transform: rotate(45deg); }
.bpmn-mini-flow span.is-diamond { color: transparent; }
.bpmn-mini-flow span.is-diamond::after { content: '?'; color: var(--text); transform: rotate(-45deg); }
.bpmn-mini-flow i { width: 24px; height: 2px; background: var(--primary); }
.bpmn-empty-list { padding: 34px 10px; text-align: center; color: var(--muted); }
.bpmn-empty-list strong { color: var(--text); }
.bpmn-empty-list p { margin: 6px 0 0; }
.bpmn-import-divider { display: flex; align-items: center; gap: 10px; margin: 24px 0 16px; color: var(--muted); font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.bpmn-import-divider::before, .bpmn-import-divider::after { content: ''; flex: 1; height: 1px; background: #e6eaf0; }
.bpmn-import-form { display: flex; align-items: stretch; gap: 10px; }
.bpmn-file-picker { position: relative; display: flex; align-items: center; flex: 1; min-width: 0; padding: 10px 12px; border: 1px dashed #cad4e1; border-radius: 11px; background: #f9fbfd; cursor: pointer; }
.bpmn-file-picker:hover { border-color: var(--primary); background: color-mix(in srgb, var(--primary) 5%, white); }
.bpmn-file-picker input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.bpmn-file-picker span { display: grid; min-width: 0; gap: 2px; }
.bpmn-file-picker strong { overflow: hidden; color: var(--text); font-size: 0.76rem; text-overflow: ellipsis; white-space: nowrap; }
.bpmn-file-picker small { color: var(--muted); font-size: 0.66rem; }
.bpmn-editor-bar [data-bpmn-export].is-loading { opacity: 0.55; pointer-events: none; }
.bpmn-editor-bar [data-bpmn-tidy]:disabled { opacity: 0.55; pointer-events: none; }

.bpmn-editor {
    margin: -8px -12px -20px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #f5f7fb;
    box-shadow: 0 12px 34px rgba(32, 45, 70, 0.08);
}

body.bpmn-focus-mode { overflow: hidden; }
body.bpmn-focus-mode .bpmn-editor,
.bpmn-editor:fullscreen,
.bpmn-editor:-webkit-full-screen {
    position: fixed;
    z-index: 1000;
    inset: 0;
    display: flex;
    flex-direction: column;
    width: 100vw;
    height: 100vh;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: #f5f7fb;
    box-shadow: none;
}
body.bpmn-focus-mode .bpmn-editor-bar,
.bpmn-editor:fullscreen .bpmn-editor-bar,
.bpmn-editor:-webkit-full-screen .bpmn-editor-bar { flex: 0 0 auto; }
body.bpmn-focus-mode .bpmn-workspace,
.bpmn-editor:fullscreen .bpmn-workspace,
.bpmn-editor:-webkit-full-screen .bpmn-workspace {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
}
body.bpmn-focus-mode [data-bpmn-focus],
.bpmn-editor:fullscreen [data-bpmn-focus],
.bpmn-editor:-webkit-full-screen [data-bpmn-focus] {
    border-color: color-mix(in srgb, var(--primary) 35%, #dce3ed);
    background: color-mix(in srgb, var(--primary) 8%, white);
    color: var(--primary);
}

.bpmn-editor-bar {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 74px;
    padding: 12px 16px;
    border-bottom: 1px solid #e1e6ef;
    background: #fff;
}

.bpmn-back { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid #dce3ed; border-radius: 11px; color: var(--text); font-size: 1.3rem; text-decoration: none; }
.bpmn-back:hover { border-color: var(--primary); color: var(--primary); }
.bpmn-title-fields { display: grid; flex: 1; gap: 1px; }
.bpmn-title-fields input { width: 100%; padding: 2px 5px; border: 1px solid transparent; border-radius: 5px; background: transparent; }
.bpmn-title-fields input:first-child { color: var(--text); font-size: 1.05rem; font-weight: 800; }
.bpmn-title-fields input:last-child { color: var(--muted); font-size: 0.78rem; }
.bpmn-title-fields input:hover, .bpmn-title-fields input:focus { border-color: #dce3ed; outline: none; background: #fbfcfe; }
.bpmn-save-state { display: flex; align-items: center; gap: 7px; color: #4a6b5a; font-size: 0.76rem; font-weight: 700; white-space: nowrap; }
.bpmn-save-state span { width: 8px; height: 8px; border-radius: 50%; background: #45a56f; }
.bpmn-save-state.is-saving span { background: #e0a93b; animation: bpmn-pulse 1s infinite; }
.bpmn-save-state.is-error { color: #a73c3c; }
.bpmn-save-state.is-error span { background: #d84f4f; }
@keyframes bpmn-pulse { 50% { opacity: 0.35; } }

.bpmn-workspace { display: grid; grid-template-columns: 220px minmax(0, 1fr) auto; min-height: 680px; height: calc(100vh - 255px); }
.bpmn-palette { z-index: 3; display: flex; flex-direction: column; gap: 9px; padding: 22px 15px; border-right: 1px solid #e1e6ef; background: #fff; overflow-y: auto; }
.bpmn-palette h3 { margin: 0 0 5px; font-size: 1rem; }
.bpmn-palette > div > p { margin: 0 0 12px; color: var(--muted); font-size: 0.78rem; line-height: 1.45; }
.bpmn-palette > button { display: flex; align-items: center; gap: 11px; width: 100%; padding: 10px; border: 1px solid #e2e7ef; border-radius: 12px; background: #fff; color: var(--text); text-align: left; cursor: grab; transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease; }
.bpmn-palette > button:hover { z-index: 1; border-color: color-mix(in srgb, var(--primary) 55%, #dce2eb); box-shadow: 0 7px 20px rgba(36, 52, 79, 0.1); transform: translateY(-2px); }
.bpmn-palette > button:active { cursor: grabbing; }
.bpmn-palette > button > span:last-child { display: grid; gap: 2px; }
.bpmn-palette > button strong { font-size: 0.8rem; }
.bpmn-palette > button small { color: var(--muted); font-size: 0.68rem; }
.bpmn-palette-icon { display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 34px; border: 2px solid #506377; border-radius: 7px; background: #f7fafc; font-size: 0.78rem; font-weight: 900; }
.bpmn-palette-icon.is-start, .bpmn-palette-icon.is-end { border-radius: 50%; }
.bpmn-palette-icon.is-start { border-color: #41a06b; background: #eaf8ef; }
.bpmn-palette-icon.is-end { border: 4px double #d05a5a; background: #fff0f0; }
.bpmn-palette-icon.is-decision { width: 30px; height: 30px; margin: 2px; border-color: #d49737; background: #fff8e8; color: transparent; transform: rotate(45deg); }
.bpmn-palette-icon.is-decision::after { content: '?'; color: var(--text); transform: rotate(-45deg); }
.bpmn-palette-icon.is-wait { border-color: #6573bc; background: #f0f1ff; }
.bpmn-palette-tip { margin-top: auto; padding: 12px !important; border-radius: 11px; background: color-mix(in srgb, var(--primary) 7%, white); }
.bpmn-palette-tip strong { font-size: 0.75rem; }
.bpmn-palette-tip p { margin: 4px 0 0 !important; font-size: 0.7rem !important; }

.bpmn-canvas-wrap { position: relative; min-width: 0; overflow: auto; background: #f7f9fc; }
.bpmn-canvas { position: relative; width: 5000px; height: 3000px; background-color: #f8fafc; background-image: radial-gradient(#ccd5e2 1px, transparent 1px); background-size: 22px 22px; transition: box-shadow 150ms ease; }
.bpmn-canvas.is-drop-ready { box-shadow: inset 0 0 0 4px color-mix(in srgb, var(--primary) 50%, transparent); }
.bpmn-canvas-empty { position: sticky; top: 190px; left: calc(50% - 160px); display: grid; justify-items: center; width: 320px; padding: 30px; border: 2px dashed #c9d2df; border-radius: 18px; background: rgba(255, 255, 255, 0.78); color: var(--muted); text-align: center; pointer-events: none; backdrop-filter: blur(4px); }
.bpmn-canvas-empty[hidden] { display: none; }
.bpmn-canvas-empty span { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 12px; border-radius: 50%; background: color-mix(in srgb, var(--primary) 10%, white); color: var(--primary); font-size: 1.5rem; }
.bpmn-canvas-empty strong { color: var(--text); }
.bpmn-canvas-empty p { margin: 5px 0 0; font-size: 0.78rem; }
.bpmn-connections { position: absolute; z-index: 1; inset: 0; overflow: visible; pointer-events: none; }
.bpmn-connections path { fill: none; stroke: #667b92; stroke-width: 2; stroke-linecap: square; stroke-linejoin: miter; vector-effect: non-scaling-stroke; }
.bpmn-connections path.bpmn-association { stroke: #8a97a6; stroke-width: 1.5; stroke-dasharray: 5 5; }
.bpmn-connections marker path { fill: #7b8da1; stroke: none; }
.bpmn-connections .bpmn-edge-label rect { fill: #fff; stroke: #d5dee9; stroke-width: 1; filter: drop-shadow(0 2px 4px rgba(52, 68, 89, 0.08)); }
.bpmn-connections .bpmn-edge-label text { fill: #43566d; font-size: 11.5px; font-weight: 800; text-anchor: middle; }

.bpmn-node { position: absolute; z-index: 3; display: flex; align-items: center; gap: 10px; box-sizing: border-box; width: 190px; height: 88px; min-height: 88px; padding: 11px 13px; border: 2px solid #708397; border-radius: 13px; background: #fff; color: var(--text); text-align: left; touch-action: none; cursor: grab; box-shadow: 0 8px 19px rgba(36, 51, 74, 0.09); user-select: none; }
.bpmn-node:hover, .bpmn-node.is-selected { border-color: var(--primary); box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 13%, transparent), 0 10px 24px rgba(36, 51, 74, 0.13); }
.bpmn-node.is-dragging { z-index: 5; cursor: grabbing; opacity: 0.9; }
.bpmn-node.is-connect-source { border-color: #2f72ff; box-shadow: 0 0 0 4px rgba(47, 114, 255, 0.2), 0 10px 24px rgba(36, 51, 74, 0.13); }
.bpmn-node.is-connect-target { cursor: crosshair; }
.bpmn-node.is-connect-target::after { content: ''; position: absolute; inset: -7px; border: 2px dashed rgba(47, 114, 255, 0.48); border-radius: inherit; opacity: 0; transition: opacity 120ms ease; }
.bpmn-node.is-connect-target:hover::after { opacity: 1; }
.bpmn-node-icon { display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 34px; border: 2px solid #5f7488; border-radius: 7px; background: #f2f6fa; font-size: 0.78rem; font-weight: 900; }
.bpmn-node-copy { display: grid; min-width: 0; gap: 3px; }
.bpmn-node-copy small { color: var(--muted); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; }
.bpmn-node-copy strong { display: -webkit-box; overflow: hidden; font-size: 0.78rem; line-height: 1.3; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.bpmn-node-copy em { overflow: hidden; color: var(--primary); font-size: 0.65rem; font-style: normal; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.bpmn-node.is-start, .bpmn-node.is-end { width: 124px; min-height: 84px; border-radius: 42px; }
.bpmn-node.is-start { border-color: #42a66e; background: #f1fbf5; }
.bpmn-node.is-start .bpmn-node-icon { border-radius: 50%; border-color: #42a66e; background: #dff4e8; }
.bpmn-node.is-end { border: 4px double #ce5656; background: #fff6f6; }
.bpmn-node.is-end .bpmn-node-icon { border: 4px double #ce5656; border-radius: 50%; background: #fce0e0; }
.bpmn-node.is-decision { border-color: #d49a3f; background: #fffaf0; }
.bpmn-node.is-decision .bpmn-node-icon { width: 31px; height: 31px; margin: 2px; border-color: #d49a3f; background: #ffedbd; color: transparent; transform: rotate(45deg); }
.bpmn-node.is-decision .bpmn-node-icon::after { content: '?'; color: var(--text); transform: rotate(-45deg); }
.bpmn-node.is-inclusive-gateway { border-color: #c9861d; background: #fffbf1; }
.bpmn-node.is-inclusive-gateway .bpmn-node-icon::after { content: '\25CB'; font-size: 1.2rem; line-height: 1; }
.bpmn-node.is-call-activity { border-width: 3px; border-color: #536c85; box-shadow: inset 0 0 0 2px #fff, 0 8px 19px rgba(36, 51, 74, 0.09); }
.bpmn-node.is-call-activity .bpmn-node-icon::after { content: '\2197'; margin-left: 2px; color: #536c85; font-size: 0.72rem; font-weight: 900; }
.bpmn-node.is-wait { border-color: #6876bd; background: #f7f7ff; }
.bpmn-node.is-wait .bpmn-node-icon { border-color: #6876bd; background: #e6e8fc; }

/* BPMN-nahe Geometrie: Events und Gateways bleiben kompakt, damit importierte
   BPMN-DI-Koordinaten nicht durch breite wissiqo-Karten kollidieren. */
.bpmn-node.is-start,
.bpmn-node.is-end,
.bpmn-node.is-wait,
.bpmn-node.is-decision {
    width: 64px;
    height: 64px;
    min-height: 64px;
    padding: 7px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}
.bpmn-node.is-start:hover,
.bpmn-node.is-start.is-selected,
.bpmn-node.is-end:hover,
.bpmn-node.is-end.is-selected,
.bpmn-node.is-wait:hover,
.bpmn-node.is-wait.is-selected,
.bpmn-node.is-decision:hover,
.bpmn-node.is-decision.is-selected { border: 0; background: transparent; box-shadow: none; }
.bpmn-node.is-start .bpmn-node-icon,
.bpmn-node.is-end .bpmn-node-icon,
.bpmn-node.is-wait .bpmn-node-icon,
.bpmn-node.is-decision .bpmn-node-icon {
    width: 48px;
    height: 48px;
    margin: 0;
    box-sizing: border-box;
}
.bpmn-node.is-start .bpmn-node-icon { border: 2px solid #36a365; border-radius: 50%; background: #eefaf3; }
.bpmn-node.is-end .bpmn-node-icon { border: 5px double #ce5656; border-radius: 50%; background: #fff1f1; }
.bpmn-node.is-wait .bpmn-node-icon { border: 4px double #6876bd; border-radius: 50%; background: #f3f3ff; }
.bpmn-node.is-decision .bpmn-node-icon { width: 42px; height: 42px; margin: 3px; border: 2px solid #d0922e; border-radius: 6px; background: #fff3cf; transform: rotate(45deg); }
.bpmn-node.is-start .bpmn-node-copy,
.bpmn-node.is-end .bpmn-node-copy,
.bpmn-node.is-wait .bpmn-node-copy,
.bpmn-node.is-decision .bpmn-node-copy {
    position: absolute;
    top: 67px;
    left: -43px;
    display: block;
    width: 150px;
    color: var(--text);
    text-align: center;
    pointer-events: none;
}
.bpmn-node.is-start .bpmn-node-copy small,
.bpmn-node.is-end .bpmn-node-copy small,
.bpmn-node.is-wait .bpmn-node-copy small,
.bpmn-node.is-decision .bpmn-node-copy small,
.bpmn-node.is-start .bpmn-node-copy em,
.bpmn-node.is-end .bpmn-node-copy em,
.bpmn-node.is-wait .bpmn-node-copy em,
.bpmn-node.is-decision .bpmn-node-copy em { display: none; }
.bpmn-node.is-start .bpmn-node-copy strong,
.bpmn-node.is-end .bpmn-node-copy strong,
.bpmn-node.is-wait .bpmn-node-copy strong,
.bpmn-node.is-decision .bpmn-node-copy strong {
    display: -webkit-box;
    padding: 2px 5px;
    background: rgba(248, 250, 252, 0.9);
    font-size: 0.68rem;
    line-height: 1.3;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}
.bpmn-node.is-start.is-selected .bpmn-node-icon,
.bpmn-node.is-end.is-selected .bpmn-node-icon,
.bpmn-node.is-wait.is-selected .bpmn-node-icon,
.bpmn-node.is-decision.is-selected .bpmn-node-icon { box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 16%, transparent); }
.bpmn-node.is-inclusive-gateway .bpmn-node-icon { border-color: #c9861d; background: #fff4d7; }
.bpmn-node.is-inclusive-gateway .bpmn-node-icon::after { content: '\25CB'; font-size: 1.25rem; line-height: 1; }
.bpmn-artifact { position: absolute; box-sizing: border-box; color: #526174; touch-action: none; user-select: none; }
.bpmn-artifact.is-group { z-index: 0; border: 2px dashed color-mix(in srgb, var(--primary) 48%, #8997a7); border-radius: 16px; background: color-mix(in srgb, var(--primary) 3%, transparent); pointer-events: none; }
.bpmn-artifact.is-group .bpmn-artifact-copy { position: absolute; top: -13px; left: 18px; max-width: calc(100% - 36px); padding: 3px 9px; border-radius: 999px; background: #f8fafc; color: color-mix(in srgb, var(--primary) 75%, #37485a); font-size: 0.68rem; font-weight: 800; line-height: 1.4; pointer-events: auto; cursor: grab; }
.bpmn-artifact.is-text-annotation { z-index: 2; min-width: 80px; min-height: 50px; padding: 12px 14px 12px 17px; border-left: 2px solid #7c8999; background: linear-gradient(#7c8999, #7c8999) left top / 16px 2px no-repeat, linear-gradient(#7c8999, #7c8999) left bottom / 16px 2px no-repeat, rgba(255, 255, 255, 0.9); font-size: 0.72rem; line-height: 1.45; white-space: pre-wrap; cursor: grab; }
.bpmn-artifact.is-text-annotation .bpmn-artifact-copy { display: block; overflow: hidden; max-height: 100%; }
.bpmn-artifact.is-text-annotation.is-selected { box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 13%, transparent); }
.bpmn-artifact.is-group.is-selected { border-color: var(--primary); background: color-mix(in srgb, var(--primary) 6%, transparent); }
.bpmn-artifact.is-dragging { z-index: 8; opacity: 0.86; cursor: grabbing; }
.bpmn-connect-menu { position: absolute; z-index: 8; display: flex; align-items: flex-start; gap: 9px; width: max-content; max-width: 340px; padding: 8px 9px; border: 1px solid #d9e0ea; border-radius: 10px; background: #fff; box-shadow: 0 10px 28px rgba(30, 43, 63, 0.18); }
.bpmn-connect-menu[hidden] { display: none; }
.bpmn-connect-menu-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 7px; background: #2f72ff; color: #fff; font-size: 1.05rem; font-weight: 900; }
.bpmn-connect-menu-body { display: grid; gap: 7px; width: 230px; }
.bpmn-connect-menu-body > span { display: grid; gap: 2px; }
.bpmn-connect-menu strong { font-size: 0.7rem; }
.bpmn-connect-menu small { overflow: hidden; color: var(--muted); font-size: 0.62rem; text-overflow: ellipsis; white-space: nowrap; }
.bpmn-connect-menu > button { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 7px; background: #f1f4f8; color: var(--muted); font-size: 1rem; cursor: pointer; }
.bpmn-connect-existing { display: grid; gap: 4px; padding-top: 7px; border-top: 1px solid #edf0f4; }
.bpmn-connect-existing[hidden] { display: none; }
.bpmn-connect-existing-row { display: grid; grid-template-columns: minmax(0, 1fr) 24px; align-items: center; gap: 6px; }
.bpmn-connect-existing-row > span { overflow: hidden; color: #52657a; font-size: 0.64rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.bpmn-connect-existing-row > button { display: grid; place-items: center; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 6px; background: #fff0f0; color: #b43e3e; font-size: 0.9rem; cursor: pointer; }

.bpmn-inspector { z-index: 4; width: 330px; padding: 20px; border-left: 1px solid #e1e6ef; background: #fff; overflow-y: auto; box-shadow: -10px 0 25px rgba(33, 47, 69, 0.06); }
.bpmn-inspector[hidden] { display: none; }
.bpmn-inspector-head { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 22px; }
.bpmn-inspector-head h3 { margin: 0; font-size: 1rem; }
.bpmn-inspector-head button, .bpmn-help-dialog > button:first-child { width: 32px; height: 32px; border: 0; border-radius: 8px; background: #f1f4f8; color: var(--muted); font-size: 1.25rem; cursor: pointer; }
.bpmn-inspector label { display: grid; gap: 7px; margin-bottom: 17px; color: var(--text); font-size: 0.74rem; font-weight: 800; }
.bpmn-inspector label small { color: var(--muted); font-weight: 500; }
.bpmn-inspector input, .bpmn-inspector textarea, .bpmn-inspector select { width: 100%; padding: 10px 11px; border: 1px solid #d8e0ea; border-radius: 9px; background: #fff; color: var(--text); font: inherit; font-size: 0.78rem; font-weight: 500; resize: vertical; }
.bpmn-inspector input:focus, .bpmn-inspector textarea:focus, .bpmn-inspector select:focus { border-color: var(--primary); outline: 3px solid color-mix(in srgb, var(--primary) 12%, transparent); }
.bpmn-artifact-help { margin: -4px 0 20px; color: var(--muted); font-size: 0.7rem; line-height: 1.5; }
.bpmn-imported-semantics { display: grid; gap: 6px; margin: 5px 0 20px; padding: 14px; border: 1px solid color-mix(in srgb, var(--primary) 16%, #e0e6ee); border-radius: 11px; background: color-mix(in srgb, var(--primary) 5%, white); }
.bpmn-imported-semantics[hidden], .bpmn-imported-semantics [hidden] { display: none; }
.bpmn-imported-semantics > strong { color: var(--text); font-size: 0.76rem; line-height: 1.4; }
.bpmn-imported-semantics > p { margin: 0 0 7px; color: var(--muted); font-size: 0.7rem; line-height: 1.45; }
.bpmn-imported-semantics label { margin: 4px 0 0; }
.bpmn-decision-paths { display: grid; gap: 11px; margin: 5px 0 20px; padding: 15px 0 20px; border-top: 1px solid #edf0f4; border-bottom: 1px solid #edf0f4; }
.bpmn-decision-paths[hidden] { display: none; }
.bpmn-decision-paths-head strong, .bpmn-decision-paths-head small { display: block; }
.bpmn-decision-paths-head strong { font-size: 0.78rem; }
.bpmn-decision-paths-head small { margin-top: 4px; color: var(--muted); font-size: 0.68rem; line-height: 1.4; }
.bpmn-decision-path-list { display: grid; gap: 9px; }
.bpmn-decision-path-row { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr) 32px; gap: 6px; align-items: center; }
.bpmn-decision-path-row input, .bpmn-decision-path-row select { min-width: 0; padding: 8px; font-size: 0.7rem; }
.bpmn-decision-path-remove { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 8px; background: #fff0f0; color: #b43e3e; font-size: 1.05rem; cursor: pointer; }
.bpmn-decision-path-empty { margin: 0; color: var(--muted); font-size: 0.72rem; }
.bpmn-decision-paths > .btn { justify-self: start; padding: 8px 10px; font-size: 0.7rem; }
.bpmn-inspector-actions { padding-top: 15px; border-top: 1px solid #edf0f4; }

.bpmn-help-dialog { width: min(560px, calc(100vw - 32px)); padding: 34px; border: 0; border-radius: 20px; color: var(--text); box-shadow: 0 25px 80px rgba(20, 29, 45, 0.28); }
.bpmn-help-dialog::backdrop { background: rgba(18, 27, 42, 0.48); backdrop-filter: blur(3px); }
.bpmn-help-dialog > button:first-child { position: absolute; top: 16px; right: 16px; }
.bpmn-help-dialog h2 { margin: 0 0 24px; }
.bpmn-help-dialog ol { display: grid; gap: 18px; margin: 0 0 27px; padding: 0; list-style: none; counter-reset: steps; }
.bpmn-help-dialog li { position: relative; display: grid; gap: 3px; padding-left: 45px; counter-increment: steps; }
.bpmn-help-dialog li::before { content: counter(steps); position: absolute; left: 0; display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; background: color-mix(in srgb, var(--primary) 12%, white); color: var(--primary); font-weight: 900; }
.bpmn-help-dialog li span { color: var(--muted); font-size: 0.83rem; line-height: 1.45; }

@media (max-width: 1050px) {
    .bpmn-mini-flow { display: none; }
    .bpmn-workspace { grid-template-columns: 180px minmax(0, 1fr) auto; }
    .bpmn-inspector { width: 300px; }
}

@media (max-width: 760px) {
    .bpmn-overview-intro { padding: 22px; }
    .bpmn-editor { margin-inline: 0; }
    .bpmn-editor-bar { flex-wrap: wrap; }
    .bpmn-title-fields { min-width: calc(100% - 60px); }
    .bpmn-save-state { margin-left: 56px; }
    .bpmn-import-form { align-items: stretch; flex-direction: column; }
    .bpmn-workspace { display: block; height: auto; min-height: 0; }
    .bpmn-palette { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: none; border-right: 0; border-bottom: 1px solid #e1e6ef; }
    .bpmn-palette > div:first-child, .bpmn-palette-tip { grid-column: 1 / -1; }
    .bpmn-canvas-wrap { height: 540px; }
    .bpmn-inspector { position: absolute; right: 0; bottom: 0; width: min(310px, calc(100vw - 28px)); height: 540px; }
}

/* Turbine-inspired application shell --------------------------------------- */
.admin-shell {
    --sidebar-width: 288px;
    --topbar-height: 64px;
    --control-height: 40px;
    --shell-accent-soft: color-mix(in srgb, var(--primary) 10%, #ffffff);
    --shell-accent-softer: color-mix(in srgb, var(--primary) 6%, #ffffff);
    --shell-line: #e7eaf0;
    --shell-text: #182033;
    --shell-muted: #727b8f;
    grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
    color: var(--shell-text);
    background: color-mix(in srgb, var(--primary) 6%, #f6f8fb);
    transition: grid-template-columns 0.22s ease;
}

.admin-shell .context-sidebar {
    z-index: 41;
    top: var(--topbar-height);
    height: calc(100vh - var(--topbar-height));
    margin-top: var(--topbar-height);
    padding: 0;
    overflow: hidden;
    background: #fff;
    border-right: 1px solid var(--shell-line);
    box-shadow: none;
}

.admin-shell .context-sidebar-inner {
    height: 100%;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: color-mix(in srgb, var(--primary) 18%, #d9dee8) transparent;
}

.admin-shell .brand-mark {
    position: sticky;
    top: 0;
    z-index: 2;
    min-height: var(--topbar-height);
    padding: 9px 18px;
    gap: 11px;
    background: #fff;
    border-bottom: 1px solid var(--shell-line);
}

.admin-shell .brand-mark strong {
    display: block;
    max-width: 154px;
    overflow: hidden;
    color: var(--shell-text);
    font-size: 1.06rem;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .brand-mark small {
    display: block;
    max-width: 154px;
    margin-top: 3px;
    overflow: hidden;
    color: var(--shell-muted);
    font-size: 0.7rem;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .brand-dot,
.admin-shell .shell-logo {
    height: 48px;
    border-radius: 0;
}

.admin-shell .brand-dot {
    width: 48px;
    flex: 0 0 48px;
    background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 58%, var(--secondary)));
    box-shadow: 0 6px 14px color-mix(in srgb, var(--primary) 22%, transparent);
}

.admin-shell .brand-dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1rem;
    font-weight: 800;
}

.admin-shell .shell-logo {
    display: block;
    width: min(100%, 216px);
    flex: 1 1 auto;
    overflow: visible;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.admin-shell .shell-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: left center;
}

.admin-shell .workspace-switcher {
    position: sticky;
    top: 0;
    z-index: 5;
    padding: 4px 14px 13px;
    background: #fff;
    border-bottom: 1px solid var(--shell-line);
}

.admin-shell .sidebar-global-actions {
    padding: 13px 14px 3px;
    background: #fff;
}

.admin-shell .sidebar-context-label {
    display: block;
    margin: 0 0 5px;
    padding: 0 3px;
    color: #9aa2b1;
    font-size: 0.58rem;
    font-weight: 750;
    letter-spacing: 0.095em;
    line-height: 1.3;
    text-transform: uppercase;
}

.admin-shell .sidebar-context-heading {
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.admin-shell .sidebar-context-heading .sidebar-context-label {
    margin-bottom: 0;
}

.admin-shell .sidebar-workspace-settings {
    width: 25px;
    height: 25px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 25px;
    border-radius: 5px;
    color: #8b94a4;
    transition: color 0.15s ease, background 0.15s ease;
}

.admin-shell .sidebar-workspace-settings:hover,
.admin-shell .sidebar-workspace-settings.active {
    color: var(--primary);
    background: var(--shell-accent-soft);
}

.admin-shell .sidebar-workspace-settings .sidebar-nav-icon,
.admin-shell .sidebar-workspace-settings .sidebar-nav-icon svg {
    width: 16px;
    height: 16px;
}

.admin-shell .sidebar-global-actions a {
    min-height: 38px;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr) 12px;
    align-items: center;
    gap: 9px;
    padding: 7px 6px;
    border: 0;
    border-radius: 6px;
    color: #5d687b;
    background: transparent;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.admin-shell .sidebar-global-actions a:hover,
.admin-shell .sidebar-global-actions a.active {
    color: var(--primary);
    background: var(--shell-accent-soft);
}

.admin-shell .sidebar-global-actions .sidebar-nav-icon {
    width: 20px;
    height: 20px;
}

.admin-shell .sidebar-global-actions .sidebar-nav-icon svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.admin-shell .sidebar-global-copy {
    min-width: 0;
    display: grid;
}

.admin-shell .sidebar-global-arrow {
    justify-self: end;
    color: #a0a8b6;
    font-size: 1rem;
    line-height: 1;
}

.admin-shell .sidebar-global-actions strong {
    overflow: hidden;
    font-size: 0.82rem;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .workspace-switcher-trigger {
    width: 100%;
    min-height: 42px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) 12px;
    align-items: center;
    gap: 9px;
    padding: 7px 8px;
    border: 1px solid var(--shell-line);
    border-radius: 6px;
    background: #f7f8fa;
    color: var(--shell-text);
    text-align: left;
    cursor: pointer;
    transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}

.admin-shell .workspace-switcher-trigger:hover,
.admin-shell .workspace-switcher.is-open .workspace-switcher-trigger {
    border-color: color-mix(in srgb, var(--primary) 38%, var(--shell-line));
    background: var(--shell-accent-softer);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 8%, transparent);
}

.admin-shell .workspace-switcher-trigger-icon,
.admin-shell .workspace-switcher-item-icon {
    display: inline-grid;
    place-items: center;
    color: var(--primary);
}

.admin-shell .workspace-switcher-trigger-icon .sidebar-nav-icon,
.admin-shell .workspace-switcher-item-icon .sidebar-nav-icon {
    width: 20px;
    height: 20px;
}

.admin-shell .workspace-switcher-trigger-copy {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.admin-shell .workspace-switcher-trigger-copy small {
    color: #929aaa;
    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.15;
    text-transform: uppercase;
}

.admin-shell .workspace-switcher-trigger-copy strong {
    overflow: hidden;
    font-size: 0.82rem;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .workspace-switcher-chevron {
    width: 7px;
    height: 7px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform 0.16s ease;
}

.admin-shell .workspace-switcher.is-open .workspace-switcher-chevron {
    transform: rotate(225deg) translate(-1px, -1px);
}

.admin-shell .workspace-switcher-panel {
    position: absolute;
    top: calc(100% + 4px);
    left: 14px;
    right: 14px;
    max-height: min(560px, calc(100vh - 142px));
    overflow-y: auto;
    border: 1px solid var(--shell-line);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 18px 38px rgba(20, 31, 51, 0.18);
}

.admin-shell .workspace-switcher-search {
    position: sticky;
    top: 0;
    z-index: 1;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    padding: 10px;
    background: #fff;
    border-bottom: 1px solid var(--shell-line);
}

.admin-shell .workspace-switcher-search svg {
    width: 17px;
    height: 17px;
    justify-self: center;
    color: #8992a3;
}

.admin-shell .workspace-switcher-search input {
    min-height: 36px;
    padding: 6px 7px;
    border: 0;
    border-radius: 0;
    outline: 0;
    box-shadow: none;
    font-size: 0.75rem;
}

.admin-shell .workspace-switcher-group {
    display: grid;
    padding: 7px;
}

.admin-shell .workspace-switcher-group + .workspace-switcher-group {
    border-top: 1px solid var(--shell-line);
}

.admin-shell .workspace-switcher-label {
    padding: 7px 7px 5px;
    color: #939baa;
    font-size: 0.62rem;
    font-weight: 750;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.admin-shell .workspace-switcher-item {
    min-width: 0;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 9px 8px;
    border-radius: 5px;
    color: #566176;
    transition: color 0.15s ease, background 0.15s ease;
}

.admin-shell .workspace-switcher-item:hover,
.admin-shell .workspace-switcher-item:focus-visible,
.admin-shell .workspace-switcher-item.is-current {
    color: var(--shell-text);
    background: var(--shell-accent-soft);
}

.admin-shell .workspace-switcher-item > span:nth-child(2) {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.admin-shell .workspace-switcher-item strong,
.admin-shell .workspace-switcher-item small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .workspace-switcher-item strong {
    font-size: 0.8rem;
    font-weight: 650;
}

.admin-shell .workspace-switcher-item small {
    color: #8790a1;
    font-size: 0.67rem;
}

.admin-shell .workspace-switcher-item-icon {
    width: 24px;
    height: 24px;
    border-radius: 5px;
    background: color-mix(in srgb, var(--primary) 9%, #fff);
    font-size: 0.68rem;
    font-weight: 750;
}

.admin-shell .workspace-switcher-check {
    color: var(--primary);
    font-size: 0.8rem;
    font-weight: 800;
}

.admin-shell .workspace-switcher-search-state {
    padding: 11px 14px;
    border-bottom: 1px solid var(--shell-line);
    color: #7d8698;
    font-size: 0.7rem;
}

.admin-shell .workspace-switcher-results {
    display: grid;
}

.admin-shell .workspace-switcher-recents [data-workspace-switcher-recent-items] {
    display: grid;
}

.admin-shell .sidebar-nav {
    display: block;
    margin: 0;
    padding: 10px 13px 28px;
}

.admin-shell .sidebar-primary-links,
.admin-shell .sidebar-nav-group-items {
    display: grid;
    gap: 2px;
}

.admin-shell .sidebar-nav-group {
    margin-top: 15px;
    padding-top: 10px;
    border-top: 1px solid var(--shell-line);
}

.admin-shell .sidebar-nav-group > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 30px;
    padding: 5px 11px;
    color: #8d96a7;
    font-size: 0.65rem;
    font-weight: 750;
    letter-spacing: 0.085em;
    line-height: 1.3;
    text-transform: uppercase;
    cursor: pointer;
    list-style: none;
    border-radius: 5px;
    transition: color 0.15s ease, background 0.15s ease;
}

.admin-shell .sidebar-nav-group > summary::-webkit-details-marker {
    display: none;
}

.admin-shell .sidebar-nav-group > summary:hover,
.admin-shell .sidebar-nav-group.has-active-item > summary {
    color: var(--shell-text);
    background: var(--shell-accent-softer);
}

.admin-shell .sidebar-group-chevron {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translate(-1px, -1px);
    transition: transform 0.16s ease;
}

.admin-shell .sidebar-nav-group[open] .sidebar-group-chevron {
    transform: rotate(225deg) translate(-1px, -1px);
}

.admin-shell .sidebar-nav-group-items {
    padding-top: 3px;
}

.admin-shell .sidebar-section-label {
    margin: 19px 0 7px;
    padding: 0 11px;
    color: #9aa1af;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    line-height: 1.4;
    text-transform: uppercase;
}

.admin-shell .sidebar-section-label:first-child {
    margin-top: 0;
}

.admin-shell .sidebar-nav a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 40px;
    margin: 2px 0;
    padding: 8px 11px;
    overflow: hidden;
    border-radius: 6px;
    color: #626b7d;
    font-size: 0.86rem;
    font-weight: 500;
    transition: background 0.16s ease, color 0.16s ease, transform 0.16s ease;
}

.admin-shell .sidebar-nav a:hover {
    color: var(--primary);
    background: var(--shell-accent-softer);
}

.admin-shell .sidebar-nav a.active {
    color: #fff;
    background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 82%, #111827));
    box-shadow: none;
}

.admin-shell .sidebar-nav a:focus-visible,
.admin-shell .sidebar-global-actions a:focus-visible,
.admin-shell .workspace-switcher-trigger:focus-visible,
.admin-shell .profile-chip:focus-visible,
.admin-shell .topbar-personal-link:focus-visible,
.admin-shell .notification-bell:focus-visible,
.admin-shell .topbar-admin-trigger:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--primary) 22%, transparent);
    outline-offset: 2px;
}

.admin-shell .sidebar-nav-icon {
    display: inline-grid;
    place-items: center;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    color: currentColor;
}

.admin-shell .sidebar-nav-icon svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

html.is-sidebar-collapsed .admin-shell {
    --sidebar-width: 76px;
}

html.is-sidebar-collapsed .admin-shell .brand-mark {
    justify-content: center;
    padding-inline: 12px;
}

html.is-sidebar-collapsed .admin-shell .workspace-switcher {
    padding: 7px 11px 11px;
}

html.is-sidebar-collapsed .admin-shell .sidebar-global-actions {
    padding: 11px 11px 2px;
}

html.is-sidebar-collapsed .admin-shell .sidebar-global-actions a {
    display: flex;
    justify-content: center;
    min-height: 44px;
    padding: 7px;
}

html.is-sidebar-collapsed .admin-shell .sidebar-context-label,
html.is-sidebar-collapsed .admin-shell .sidebar-global-copy,
html.is-sidebar-collapsed .admin-shell .sidebar-global-arrow {
    display: none;
}

html.is-sidebar-collapsed .admin-shell .sidebar-context-heading {
    justify-content: center;
    margin-bottom: 4px;
}

html.is-sidebar-collapsed .admin-shell .workspace-switcher-trigger {
    display: flex;
    justify-content: center;
    min-height: 44px;
    padding: 7px;
}

html.is-sidebar-collapsed .admin-shell .workspace-switcher-trigger-copy,
html.is-sidebar-collapsed .admin-shell .workspace-switcher-chevron,
html.is-sidebar-collapsed .admin-shell .sidebar-nav-group > summary,
html.is-sidebar-collapsed .admin-shell .sidebar-nav a > span:not(.sidebar-nav-icon) {
    display: none;
}

html.is-sidebar-collapsed .admin-shell .sidebar-nav {
    padding-inline: 10px;
}

html.is-sidebar-collapsed .admin-shell .sidebar-nav-group {
    margin-top: 10px;
    padding-top: 10px;
}

html.is-sidebar-collapsed .admin-shell .sidebar-nav-group-items {
    display: grid !important;
    padding-top: 0;
}

html.is-sidebar-collapsed .admin-shell .sidebar-nav a {
    justify-content: center;
    padding-inline: 8px;
}

html.is-sidebar-collapsed .admin-shell .workspace-switcher-panel {
    display: none;
}

.admin-shell .content-shell {
    min-width: 0;
    min-height: 100vh;
    padding-top: var(--topbar-height);
}

.admin-shell .smart-topbar {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 50;
    width: 100%;
    height: var(--topbar-height);
    min-height: var(--topbar-height);
    margin: 0;
    padding: 0 24px;
    grid-template-columns: minmax(150px, 0.65fr) minmax(260px, 1fr) auto;
    gap: 24px;
    background: rgba(255, 255, 255, 0.97);
    border: 0;
    border-bottom: 1px solid var(--shell-line);
    box-shadow: 0 2px 7px rgba(23, 32, 51, 0.035);
    backdrop-filter: blur(12px);
}

.admin-shell .topbar-brand {
    min-width: 0;
    gap: 18px;
}

.admin-shell .topbar-brand-divider {
    width: 1px;
    height: 30px;
    flex: 0 0 1px;
    background: var(--shell-line);
}

.admin-shell .topbar-customer-brand {
    min-width: 0;
    max-width: 280px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: var(--shell-text);
}

.admin-shell .topbar-customer-brand .shell-logo {
    width: auto;
    max-width: 250px;
    height: 44px;
    flex: 0 1 auto;
}

.admin-shell .topbar-customer-brand .shell-logo img {
    width: auto;
    max-width: 100%;
}

.admin-shell .topbar-customer-brand .brand-dot {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 7px;
    box-shadow: none;
}

.admin-shell .topbar-customer-brand > strong {
    overflow: hidden;
    font-size: 1rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .page-meta .eyebrow {
    color: var(--shell-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.admin-shell .burger-trigger {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border: 0;
    border-radius: 7px;
    background: transparent;
}

.admin-shell .burger-trigger:hover {
    color: var(--primary);
    background: var(--shell-accent-soft);
}

.admin-shell .burger-trigger span {
    width: 17px;
    height: 1.5px;
}

.admin-shell .topbar-spacer {
    justify-content: flex-start;
}

.admin-shell .topbar-reserved {
    min-width: 0;
}

.admin-shell .workspace-search {
    width: min(430px, 100%);
    margin: 0;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 0;
    border: 1px solid var(--shell-line);
    border-radius: 6px;
    background: #f8f9fb;
}

.admin-shell .workspace-search.is-expanded,
.admin-shell .workspace-search:focus-within {
    width: min(520px, 100%);
    border-color: color-mix(in srgb, var(--primary) 38%, var(--shell-line));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 9%, transparent);
}

.admin-shell .workspace-search-lens {
    width: 34px;
    height: 38px;
    border-radius: 0;
    background: transparent;
    color: #8a92a2;
}

.admin-shell .workspace-search input {
    min-height: 38px;
    padding: 7px 12px 7px 3px;
    border: 0;
    border-radius: 0 6px 6px 0;
    outline: 0;
    background: transparent;
    box-shadow: none;
    font-size: 0.82rem;
}

.admin-shell .workspace-search-dropdown {
    top: calc(100% + 8px);
    border-radius: 6px;
    border-color: var(--shell-line);
    box-shadow: 0 14px 34px rgba(20, 31, 51, 0.13);
}

.admin-shell .topbar-actions {
    gap: 18px;
}

.admin-shell .topbar-portal-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 42px;
    min-height: 42px;
    padding: 7px 14px;
    border: 1px solid var(--shell-line);
    border-radius: 6px;
    color: #596477;
    background: #fff;
    font-size: 0.75rem;
    font-weight: 650;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.admin-shell .topbar-portal-link:hover {
    color: var(--primary);
    border-color: color-mix(in srgb, var(--primary) 30%, var(--shell-line));
    background: var(--shell-accent-softer);
}

.admin-shell .topbar-portal-link svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.admin-shell .topbar-portal-menu {
    position: relative;
}

.admin-shell .topbar-portal-menu > summary {
    cursor: pointer;
    list-style: none;
}

.admin-shell .topbar-portal-menu > summary::-webkit-details-marker {
    display: none;
}

.admin-shell .topbar-portal-menu[open] > summary {
    color: var(--primary);
    border-color: color-mix(in srgb, var(--primary) 30%, var(--shell-line));
    background: var(--shell-accent-softer);
}

.admin-shell .topbar-portal-chevron {
    width: 7px;
    height: 7px;
    margin-left: 2px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform 0.16s ease;
}

.admin-shell .topbar-portal-menu[open] .topbar-portal-chevron {
    transform: rotate(225deg) translate(-1px, -1px);
}

.admin-shell .topbar-portal-list {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 46;
    display: grid;
    width: 260px;
    padding: 7px;
    border: 1px solid var(--shell-line);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 16px 36px rgba(20, 31, 51, 0.14);
}

.admin-shell .topbar-portal-list a {
    display: grid;
    gap: 2px;
    padding: 10px 11px;
    border-radius: 5px;
    color: var(--shell-text);
}

.admin-shell .topbar-context-list {
    width: min(330px, calc(100vw - 28px));
    padding: 10px;
}

.admin-shell .topbar-context-list a {
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    padding: 13px 12px;
}

.admin-shell .topbar-context-list a > span:last-child {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.admin-shell .topbar-menu-icon {
    width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    color: currentColor;
}

.admin-shell .topbar-menu-icon svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.admin-shell .topbar-portal-list a:hover {
    color: var(--primary);
    background: var(--shell-accent-softer);
}

.admin-shell .topbar-portal-list strong {
    font-size: 0.78rem;
}

.admin-shell .topbar-portal-list small {
    color: var(--shell-muted);
    font-size: 0.67rem;
}

.admin-shell .notification-bell {
    width: 42px;
    height: 42px;
    min-height: 42px;
    border-radius: 6px;
    border-color: transparent;
    background: transparent;
    color: var(--shell-text);
}

.admin-shell .notification-bell:hover {
    border-color: transparent;
    background: #f2f3f6;
}

.admin-shell .topbar-admin-menu {
    position: relative;
}

.admin-shell .topbar-admin-trigger {
    cursor: pointer;
    list-style: none;
}

.admin-shell .topbar-admin-trigger::-webkit-details-marker {
    display: none;
}

.admin-shell .topbar-admin-menu[open] .topbar-admin-trigger,
.admin-shell .topbar-admin-menu.is-active .topbar-admin-trigger {
    color: var(--primary);
    border-color: color-mix(in srgb, var(--primary) 30%, var(--shell-line));
    background: var(--shell-accent-softer);
}

.admin-shell .topbar-admin-list {
    width: min(310px, calc(100vw - 28px));
    max-height: min(570px, calc(100vh - 92px));
    overflow-y: auto;
}

.admin-shell .topbar-admin-list header {
    display: grid;
    gap: 2px;
    margin: -1px -1px 5px;
    padding: 11px 12px 10px;
    border-bottom: 1px solid var(--shell-line);
}

.admin-shell .topbar-admin-list header strong {
    color: var(--shell-text);
    font-size: 0.82rem;
}

.admin-shell .topbar-admin-list header small {
    color: var(--shell-muted);
    font-size: 0.65rem;
    line-height: 1.4;
}

.admin-shell .topbar-admin-list a {
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
}

.admin-shell .topbar-admin-list a.active {
    color: var(--primary);
    background: var(--shell-accent-soft);
}

.admin-shell .topbar-admin-list .sidebar-nav-icon {
    width: 20px;
    height: 20px;
}

.admin-shell .topbar-admin-list .sidebar-nav-icon svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.admin-shell .profile-chip {
    height: 42px;
    min-height: 42px;
    padding: 3px 7px;
    gap: 12px;
    border: 0;
    border-radius: 6px;
    background: transparent;
}

.admin-shell .profile-chip:hover {
    background: #f6f7fa;
}

.admin-shell .topbar-user-menu {
    position: relative;
}

.admin-shell .topbar-user-menu > summary {
    cursor: pointer;
    list-style: none;
}

.admin-shell .topbar-user-menu > summary::-webkit-details-marker {
    display: none;
}

.admin-shell .topbar-user-menu[open] .profile-chip {
    background: #f2f3f6;
}

.admin-shell .topbar-user-chevron {
    width: 8px;
    height: 8px;
    margin: -4px 3px 0 1px;
    border-right: 1.6px solid currentColor;
    border-bottom: 1.6px solid currentColor;
    transform: rotate(45deg);
    transition: transform 0.16s ease;
}

.admin-shell .topbar-user-menu[open] .topbar-user-chevron {
    margin-top: 3px;
    transform: rotate(225deg);
}

.admin-shell .profile-mobile-icon {
    display: none;
}

.admin-shell .topbar-user-list {
    width: min(290px, calc(100vw - 28px));
    padding: 10px;
}

.admin-shell .topbar-user-list header {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 11px;
    margin: 0 0 8px;
    padding: 8px 9px 14px;
    border-bottom: 1px solid var(--shell-line);
}

.admin-shell .topbar-user-list header .avatar-badge {
    width: 38px;
    height: 38px;
}

.admin-shell .topbar-user-list header > span:last-child {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.admin-shell .topbar-user-list header strong {
    overflow: hidden;
    color: var(--shell-text);
    font-size: 0.82rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .topbar-user-list header small {
    color: var(--shell-muted);
    font-size: 0.68rem;
}

.admin-shell .topbar-user-list a {
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 42px;
}

.admin-shell .topbar-user-list a > span:last-child {
    min-width: 0;
}

.admin-shell .topbar-user-list .sidebar-nav-icon,
.admin-shell .topbar-user-list .topbar-menu-icon {
    width: 21px;
    height: 21px;
}

.admin-shell .topbar-user-list .sidebar-nav-icon svg,
.admin-shell .topbar-user-list .topbar-menu-icon svg {
    width: 19px;
    height: 19px;
}

.admin-shell .topbar-user-separator {
    height: 1px;
    margin: 8px 4px;
    background: var(--shell-line);
}

.admin-shell .topbar-personal-link {
    position: relative;
    width: 42px;
    height: 42px;
    min-height: 42px;
    margin-left: 6px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 42px;
    border: 1px solid transparent;
    border-radius: 6px;
    color: var(--shell-text);
    background: transparent;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

.admin-shell .topbar-personal-link::before {
    content: '';
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: -13px;
    width: 1px;
    background: var(--shell-line);
}

.admin-shell .topbar-personal-link:hover {
    transform: none;
    border-color: transparent;
    background: #f2f3f6;
}

.admin-shell .topbar-personal-link.active {
    color: var(--primary);
    border-color: transparent;
    background: var(--shell-accent-soft);
}

.admin-shell .topbar-personal-link svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
}

.admin-shell .app-launcher-more {
    display: none;
}

.admin-shell .avatar-badge {
    width: 34px;
    height: 34px;
    border-radius: 6px;
    background: var(--shell-accent-soft);
    color: var(--primary);
    box-shadow: none;
    font-size: 0.74rem;
}

.admin-shell .profile-copy strong {
    color: var(--shell-text);
    font-size: 0.8rem;
}

.admin-shell .profile-copy {
    min-width: 0;
    text-align: left;
}

.admin-shell .profile-copy small {
    color: var(--shell-muted);
    font-size: 0.67rem;
}

.admin-shell .main-panel {
    width: 100%;
    padding: 22px 24px 42px;
}

.admin-shell .page-intro {
    align-items: center;
    margin: 0 0 20px;
    padding: 0 1px 16px;
    border-bottom: 1px solid color-mix(in srgb, var(--primary) 8%, var(--shell-line));
}

.admin-shell .page-intro h1 {
    margin: 0 0 4px;
    color: var(--shell-text);
    font-size: clamp(1.3rem, 2vw, 1.65rem);
    line-height: 1.25;
    letter-spacing: -0.025em;
}

.admin-shell .page-intro p {
    max-width: 74ch;
    margin: 0;
    color: var(--shell-muted);
    font-size: 0.78rem;
    line-height: 1.45;
}

.admin-shell .stats-grid,
.admin-shell .content-grid,
.admin-shell .card-grid {
    gap: 16px;
}

.admin-shell .stats-grid {
    margin-bottom: 20px;
}

.admin-shell .stat-card,
.admin-shell .panel-card,
.admin-shell .reading-surface,
.admin-shell .auth-card {
    background: #fff;
    border: 1px solid var(--shell-line);
    border-radius: 7px;
    box-shadow: 0 2px 8px rgba(20, 31, 51, 0.045);
}

.admin-shell .stat-card {
    position: relative;
    min-height: 104px;
    padding: 18px 18px 17px 66px;
    overflow: hidden;
}

.admin-shell .stat-card::before {
    content: "";
    position: absolute;
    top: 19px;
    left: 17px;
    width: 36px;
    height: 36px;
    border-radius: 5px;
    background: var(--shell-accent-soft);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 10%, transparent);
}

.admin-shell .stat-card::after {
    content: "";
    position: absolute;
    top: 30px;
    left: 28px;
    width: 14px;
    height: 14px;
    border: 2px solid var(--primary);
    border-radius: 3px;
}

.admin-shell .stat-card span {
    margin-bottom: 5px;
    color: var(--shell-muted);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.055em;
}

.admin-shell .stat-card strong {
    color: var(--shell-text);
    font-size: 1.35rem;
}

.admin-shell .panel-card {
    padding: 19px 20px;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.admin-shell .panel-card:hover {
    border-color: color-mix(in srgb, var(--primary) 16%, var(--shell-line));
    box-shadow: 0 8px 22px rgba(20, 31, 51, 0.065);
}

.admin-shell .panel-head,
.admin-shell .section-head {
    margin: -2px -20px 17px;
    padding: 0 20px 14px;
    border-bottom: 1px solid var(--shell-line);
}

.admin-shell .panel-head h2,
.admin-shell .panel-head h3,
.admin-shell .section-head h2,
.admin-shell .section-head h3 {
    margin-bottom: 0;
    color: var(--shell-text);
    font-size: 0.96rem;
    letter-spacing: -0.01em;
}

.admin-shell .list-table {
    gap: 0;
    border: 1px solid var(--shell-line);
    border-radius: 6px;
    overflow: hidden;
}

.admin-shell .list-row {
    min-height: 52px;
    padding: 11px 14px;
    border: 0;
    border-bottom: 1px solid var(--shell-line);
    border-radius: 0;
}

.admin-shell .list-row:last-child {
    border-bottom: 0;
}

.admin-shell .category-tree {
    display: grid;
    gap: 0;
    overflow: hidden;
    border: 0;
    border-radius: 7px;
    background: transparent;
}

.admin-shell .category-tree-row {
    position: relative;
    width: 100%;
    min-height: 58px;
    margin: 0;
    padding: 10px 14px;
    border: 0;
    border-bottom: 1px solid var(--shell-line);
    border-radius: 0;
    background: #fff;
}

.admin-shell .category-tree-row:last-child {
    border-bottom: 0;
}

.admin-shell .category-tree-row.is-root {
    min-height: 66px;
    margin-top: 14px;
    padding-block: 12px;
    background: color-mix(in srgb, var(--primary) 7%, #fff);
    border: 1px solid color-mix(in srgb, var(--primary) 14%, var(--shell-line));
    border-radius: 7px;
}

.admin-shell .category-tree-row.is-root:first-child {
    margin-top: 0;
}

.admin-shell .category-tree-row.is-child {
    background: rgba(255, 255, 255, 0.88);
}

.admin-shell .category-tree-main {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 10px;
    padding-left: calc(var(--category-depth, 0) * 22px);
}

.admin-shell .category-tree-marker {
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
}

.admin-shell .category-tree-marker svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: var(--primary);
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.admin-shell .category-tree-marker > span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--primary) 64%, #fff);
}

.admin-shell .category-tree-copy {
    min-width: 0;
}

.admin-shell .category-tree-title {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.admin-shell .category-tree-title strong {
    overflow: hidden;
    color: var(--shell-text);
    font-size: 0.84rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .category-tree-copy small {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 3px;
    color: var(--shell-muted);
    font-size: 0.7rem;
}

.admin-shell .category-tree-level {
    color: var(--primary);
    font-weight: 600;
}

.admin-shell .category-tree-row.is-child .category-tree-level {
    color: var(--shell-muted);
    font-weight: 500;
}

.admin-shell .category-tree-row .inline-actions {
    flex: 0 0 auto;
    gap: 7px;
}

.admin-shell .category-tree-row .btn {
    min-height: 34px;
    padding: 6px 10px;
    font-size: 0.7rem;
}

.admin-shell table {
    font-size: 0.82rem;
}

.admin-shell th,
.admin-shell td {
    padding: 12px 13px;
    border-bottom-color: var(--shell-line);
}

.admin-shell th {
    background: #fafbfc;
    color: #858d9d;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.admin-shell tbody tr {
    transition: background 0.15s ease;
}

.admin-shell tbody tr:hover {
    background: var(--shell-accent-softer);
}

.admin-shell .btn {
    border-radius: 5px;
    font-size: 0.78rem;
    box-shadow: none;
}

.admin-shell .btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 12px rgba(20, 31, 51, 0.08);
}

.admin-shell .btn-primary {
    background: var(--primary);
    box-shadow: 0 4px 10px color-mix(in srgb, var(--primary) 20%, transparent);
}

.admin-shell .btn-primary:hover {
    background: color-mix(in srgb, var(--primary) 88%, #101827);
}

.admin-shell .btn-secondary {
    background: #fff;
    border-color: #dde2ea;
}

.admin-shell input[type="text"],
.admin-shell input[type="email"],
.admin-shell input[type="password"],
.admin-shell input[type="number"],
.admin-shell input[type="search"],
.admin-shell select,
.admin-shell textarea,
.admin-shell input[type="file"] {
    border-color: #dfe3ea;
    border-radius: 5px;
    box-shadow: none;
    font-size: 0.82rem;
}

.admin-shell input:focus,
.admin-shell select:focus,
.admin-shell textarea:focus {
    border-color: color-mix(in srgb, var(--primary) 62%, #dfe3ea);
    outline: 3px solid color-mix(in srgb, var(--primary) 9%, transparent);
}

.admin-shell label {
    font-size: 0.78rem;
}

.admin-shell .pill,
.admin-shell [class*="-pill"] {
    border-radius: 4px;
}

.admin-shell .module-tabs {
    gap: 3px;
    padding: 3px;
    border-radius: 6px;
    background: #eef1f6;
}

.admin-shell .module-tab {
    border-radius: 4px;
    font-size: 0.78rem;
}

.admin-shell .module-tab.is-active {
    color: var(--primary);
}

.admin-shell .context-drawer {
    border-radius: 0;
    background: #fff;
}

.admin-shell .drawer-nav a,
.admin-shell .drawer-link-card {
    border-radius: 6px;
}

.article-import-layout {
    display: grid;
    grid-template-columns: minmax(0, 920px);
    gap: 20px;
    align-items: start;
}

.article-import-layout.has-preview {
    grid-template-columns: minmax(420px, 0.9fr) minmax(480px, 1.1fr);
}

.article-import-source-card {
    position: sticky;
    top: 18px;
}

.article-import-form textarea {
    min-height: 520px;
    resize: vertical;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.85rem;
    line-height: 1.55;
    tab-size: 2;
}

.article-import-preview-stack {
    display: grid;
    gap: 20px;
    min-width: 0;
}

.article-import-metadata {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 0;
}

.article-import-metadata > div {
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f8fafc;
}

.article-import-metadata dt {
    margin-bottom: 4px;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.article-import-metadata dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.article-import-warnings {
    margin-top: 16px;
    padding: 14px 16px;
    border: 1px solid #f2d38a;
    border-radius: 8px;
    background: #fff9e8;
    color: #6f5310;
}

.article-import-warnings ul {
    margin: 8px 0 0;
    padding-left: 20px;
}

.article-import-rendered-preview {
    width: 100%;
    margin: 0;
}

.article-import-choice-card {
    border-color: rgba(79, 124, 255, 0.35);
    background: linear-gradient(145deg, rgba(79, 124, 255, 0.08), #fff 65%);
}

/* Demo-ready workspace dashboard */
.admin-shell .dashboard-welcome {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    min-height: 178px;
    margin-bottom: 20px;
    padding: 30px 32px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--shell-line));
    border-radius: 10px;
    background:
        radial-gradient(circle at 90% 15%, color-mix(in srgb, var(--secondary) 55%, transparent), transparent 30%),
        linear-gradient(125deg, color-mix(in srgb, var(--primary) 9%, #fff), #fff 58%);
    box-shadow: 0 12px 30px rgba(20, 31, 51, 0.07);
}

.admin-shell .dashboard-welcome::after {
    content: "";
    position: absolute;
    right: -55px;
    bottom: -105px;
    width: 240px;
    height: 240px;
    border: 32px solid color-mix(in srgb, var(--primary) 8%, transparent);
    border-radius: 50%;
    pointer-events: none;
}

.admin-shell .dashboard-welcome-copy {
    position: relative;
    z-index: 1;
    max-width: 680px;
}

.admin-shell .dashboard-eyebrow,
.admin-shell .panel-kicker {
    display: block;
    margin-bottom: 6px;
    color: var(--primary);
    font-size: 0.66rem;
    font-weight: 750;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.admin-shell .dashboard-welcome h2 {
    margin: 0 0 8px;
    color: var(--shell-text);
    font-size: clamp(1.65rem, 3vw, 2.35rem);
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.admin-shell .dashboard-welcome p {
    max-width: 64ch;
    margin: 0;
    color: var(--shell-muted);
    font-size: 0.88rem;
}

.admin-shell .dashboard-welcome p strong {
    color: var(--shell-text);
}

.admin-shell .dashboard-quick-actions {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 9px;
    min-width: 300px;
}

.admin-shell .btn-quiet {
    color: var(--primary);
    background: transparent;
    border-color: transparent;
}

.admin-shell .dashboard-stats {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.admin-shell .dashboard-stats .stat-card {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: start;
    column-gap: 12px;
    min-height: 126px;
    padding: 19px 17px 16px;
}

.admin-shell .dashboard-stats .stat-card::before,
.admin-shell .dashboard-stats .stat-card::after {
    display: none;
}

.admin-shell .dashboard-stats .stat-card-icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    margin: 0;
    border: 1px solid color-mix(in srgb, var(--primary) 12%, var(--shell-line));
    border-radius: 7px;
    color: var(--primary);
    background: var(--shell-accent-soft);
}

.admin-shell .dashboard-stats .stat-card-icon .sidebar-nav-icon,
.admin-shell .dashboard-stats .stat-card-icon svg {
    width: 20px;
    height: 20px;
    margin: 0;
}

.admin-shell .dashboard-stats .stat-card-copy {
    display: grid;
    min-width: 0;
    margin: 0;
}

.admin-shell .dashboard-stats .stat-card-copy > span {
    margin-bottom: 4px;
}

.admin-shell .dashboard-stats .stat-card-copy strong {
    line-height: 1.1;
}

.admin-shell .dashboard-stats .stat-card-copy small {
    display: block;
    margin-top: 8px;
    color: var(--shell-muted);
    font-size: 0.66rem;
    line-height: 1.35;
}

.admin-shell .dashboard-content-grid {
    margin-bottom: 20px;
}

.admin-shell .dashboard-content-grid .panel-card,
.admin-shell .dashboard-content-grid + .panel-card {
    min-width: 0;
}

.admin-shell .panel-head .text-link {
    flex: 0 0 auto;
}

.admin-shell .text-link {
    color: var(--primary);
    font-size: 0.74rem;
    font-weight: 650;
}

.admin-shell .text-link:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.admin-shell .dashboard-content-grid .list-row > div,
.admin-shell .dashboard-content-grid .list-row > div small {
    min-width: 0;
}

.admin-shell .dashboard-content-grid .list-row > div small,
.admin-shell .dashboard-content-grid + .panel-card .list-row > div small {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 5px;
}

/* Persönlicher, workspaceübergreifender Arbeitsbereich */
.admin-shell .my-work-welcome {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    min-height: 150px;
    margin-bottom: 16px;
    padding: 27px 30px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--shell-line));
    border-radius: 10px;
    background:
        radial-gradient(circle at 84% 24%, color-mix(in srgb, var(--secondary) 46%, transparent), transparent 28%),
        linear-gradient(128deg, color-mix(in srgb, var(--primary) 9%, #fff), #fff 62%);
}

.admin-shell .my-work-welcome > div:first-child {
    min-width: 0;
}

.admin-shell .my-work-eyebrow {
    display: block;
    margin-bottom: 7px;
    color: var(--primary);
    font-size: 0.65rem;
    font-weight: 750;
    letter-spacing: 0.095em;
    text-transform: uppercase;
}

.admin-shell .my-work-welcome h2 {
    margin: 0 0 8px;
    font-size: clamp(1.65rem, 3vw, 2.25rem);
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.admin-shell .my-work-welcome p {
    max-width: 68ch;
    margin: 0;
    color: var(--shell-muted);
    font-size: 0.86rem;
    line-height: 1.55;
}

.admin-shell .my-work-welcome p strong {
    color: var(--shell-text);
}

.admin-shell .my-work-context {
    position: relative;
    z-index: 1;
    width: 142px;
    min-height: 86px;
    flex: 0 0 142px;
    display: grid;
    place-content: center;
    gap: 2px;
    padding: 14px;
    border: 1px solid color-mix(in srgb, var(--primary) 16%, var(--shell-line));
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.82);
    text-align: center;
    box-shadow: 0 8px 22px rgba(20, 31, 51, 0.055);
}

.admin-shell .my-work-context span {
    color: var(--primary);
    font-size: 1.55rem;
    font-weight: 780;
    line-height: 1;
}

.admin-shell .my-work-context small {
    color: var(--shell-muted);
    font-size: 0.64rem;
    line-height: 1.35;
}

.admin-shell .my-work-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.admin-shell .my-work-stats > a {
    min-width: 0;
    min-height: 104px;
    display: grid;
    align-content: start;
    padding: 16px 17px;
    border: 1px solid var(--shell-line);
    border-radius: 8px;
    color: var(--shell-text);
    background: #fff;
    box-shadow: 0 2px 8px rgba(20, 31, 51, 0.04);
    transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.admin-shell .my-work-stats > a:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--primary) 24%, var(--shell-line));
    box-shadow: 0 8px 20px rgba(20, 31, 51, 0.065);
}

.admin-shell .my-work-stats span {
    color: var(--shell-muted);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.admin-shell .my-work-stats strong {
    margin: 6px 0 5px;
    color: var(--shell-text);
    font-size: 1.45rem;
    line-height: 1;
}

.admin-shell .my-work-stats small {
    overflow: hidden;
    color: var(--shell-muted);
    font-size: 0.65rem;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .my-work-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.75fr);
    align-items: start;
    gap: 16px;
}

.admin-shell .my-work-main-column,
.admin-shell .my-work-side-column {
    min-width: 0;
    display: grid;
    gap: 16px;
}

.admin-shell .my-work-panel {
    min-width: 0;
    scroll-margin-top: calc(var(--topbar-height) + 18px);
}

.admin-shell .my-work-panel .panel-head p {
    margin: 4px 0 0;
    color: var(--shell-muted);
    font-size: 0.69rem;
}

.admin-shell .my-work-list,
.admin-shell .my-work-compact-list {
    display: grid;
}

.admin-shell .my-work-item {
    min-width: 0;
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 13px 4px;
    border-bottom: 1px solid var(--shell-line);
    color: var(--shell-text);
}

.admin-shell .my-work-item:first-child {
    padding-top: 2px;
}

.admin-shell .my-work-item:last-child {
    padding-bottom: 2px;
    border-bottom: 0;
}

.admin-shell .my-work-item:hover .my-work-item-copy strong {
    color: var(--primary);
}

.admin-shell .my-work-item-mark {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #94a3b8;
    box-shadow: 0 0 0 4px rgba(148, 163, 184, 0.12);
}

.admin-shell .my-work-item-mark.is-task {
    background: #8b5cf6;
    box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.11);
}

.admin-shell .my-work-item-mark.is-review {
    background: #e9a82f;
    box-shadow: 0 0 0 4px rgba(233, 168, 47, 0.12);
}

.admin-shell .my-work-item.is-overdue .my-work-item-mark {
    background: #dc4c5d;
    box-shadow: 0 0 0 4px rgba(220, 76, 93, 0.11);
}

.admin-shell .my-work-item-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.admin-shell .my-work-item-copy strong,
.admin-shell .my-work-item-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .my-work-item-copy strong {
    font-size: 0.8rem;
    line-height: 1.35;
    transition: color 0.15s ease;
}

.admin-shell .my-work-item-copy small {
    color: var(--shell-muted);
    font-size: 0.65rem;
}

.admin-shell .my-work-item-meta {
    min-width: 112px;
    display: grid;
    justify-items: end;
    gap: 4px;
    text-align: right;
}

.admin-shell .my-work-item-meta > span {
    display: inline-flex;
    padding: 3px 7px;
    border-radius: 999px;
    color: #596477;
    background: #f2f4f7;
    font-size: 0.61rem;
    font-weight: 700;
}

.admin-shell .my-work-item-meta > span.priority-urgent { color: #a52d3c; background: #fff0f1; }
.admin-shell .my-work-item-meta > span.priority-high { color: #9a6110; background: #fff7e8; }
.admin-shell .my-work-item-meta > span.priority-low { color: #48728a; background: #edf7fb; }

.admin-shell .my-work-item-meta small {
    color: var(--shell-muted);
    font-size: 0.62rem;
}

.admin-shell .my-work-item.is-overdue .my-work-item-meta small {
    color: #bd3949;
    font-weight: 700;
}

.admin-shell .my-work-compact-list a {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 11px 2px;
    border-bottom: 1px solid var(--shell-line);
    color: var(--shell-text);
}

.admin-shell .my-work-compact-list a:first-child { padding-top: 1px; }
.admin-shell .my-work-compact-list a:last-child { padding-bottom: 1px; border-bottom: 0; }

.admin-shell .my-work-compact-list a > span {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.admin-shell .my-work-compact-list strong,
.admin-shell .my-work-compact-list small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .my-work-compact-list strong {
    font-size: 0.75rem;
    line-height: 1.35;
}

.admin-shell .my-work-compact-list a:hover strong { color: var(--primary); }
.admin-shell .my-work-compact-list small,
.admin-shell .my-work-compact-list time { color: var(--shell-muted); font-size: 0.62rem; }

.admin-shell .my-work-compact-list em {
    padding: 3px 7px;
    border-radius: 999px;
    color: #a52d3c;
    background: #fff0f1;
    font-size: 0.59rem;
    font-style: normal;
    font-weight: 700;
}

.admin-shell .my-work-empty {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 80px;
    padding: 14px;
    border: 1px dashed color-mix(in srgb, var(--primary) 18%, var(--shell-line));
    border-radius: 7px;
    background: var(--shell-accent-softer);
}

.admin-shell .my-work-empty > span {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 7px;
    color: var(--primary);
    background: #fff;
    font-weight: 800;
}

.admin-shell .my-work-empty strong { display: block; font-size: 0.75rem; }
.admin-shell .my-work-empty p { margin: 3px 0 0; color: var(--shell-muted); font-size: 0.65rem; line-height: 1.4; }
.admin-shell .my-work-empty.is-compact { min-height: 72px; padding: 11px; }

.admin-shell .content-state {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin: 0;
    color: #7b8495;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0;
}

.admin-shell .content-state::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #aeb5c1;
}

.admin-shell .content-state.is-published { color: #267a56; }
.admin-shell .content-state.is-published::before { background: #35a873; }
.admin-shell .content-state.is-review { color: #9b6711; }
.admin-shell .content-state.is-review::before { background: #e1a63c; }
.admin-shell .content-state.is-draft::before { background: #8792a6; }

.admin-shell .empty-state.compact {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    min-height: 92px;
    padding: 15px;
    border: 1px dashed color-mix(in srgb, var(--primary) 22%, var(--shell-line));
    border-radius: 7px;
    background: var(--shell-accent-softer);
}

.admin-shell .empty-state.compact.is-success {
    background: #f5fbf8;
    border-color: #cfe8dc;
}

.admin-shell .empty-state-icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 7px;
    color: var(--primary);
    background: #fff;
    box-shadow: 0 3px 10px rgba(20, 31, 51, 0.07);
    font-weight: 800;
}

.admin-shell .empty-state.is-success .empty-state-icon {
    color: #267a56;
}

.admin-shell .empty-state.compact strong {
    display: block;
    color: var(--shell-text);
    font-size: 0.78rem;
}

.admin-shell .empty-state.compact p {
    margin: 3px 0 0;
    color: var(--shell-muted);
    font-size: 0.69rem;
    line-height: 1.4;
}

.admin-shell .article-empty-state {
    display: grid;
    justify-items: center;
    gap: 9px;
    padding: 46px 24px;
    text-align: center;
    border-style: dashed;
    background: linear-gradient(145deg, var(--shell-accent-softer), #fff 72%);
}

.admin-shell .article-empty-state .empty-state-visual {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    margin-bottom: 5px;
    border-radius: 14px;
    color: var(--primary);
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--primary) 16%, var(--shell-line));
    box-shadow: 0 10px 24px color-mix(in srgb, var(--primary) 12%, transparent);
    font-size: 1.3rem;
}

.admin-shell .article-empty-state strong {
    color: var(--shell-text);
    font-size: 1rem;
}

.admin-shell .article-empty-state p {
    max-width: 54ch;
    margin: 0 0 8px;
    font-size: 0.76rem;
}

@media (max-width: 1100px) {
    .admin-shell .my-work-layout {
        grid-template-columns: 1fr;
    }

    .admin-shell .my-work-side-column {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-shell .my-work-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-shell .smart-topbar {
        grid-template-columns: minmax(150px, 1fr) auto;
    }

    .admin-shell .topbar-reserved {
        display: none;
    }

    .admin-shell .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-shell .dashboard-welcome {
        align-items: flex-start;
        flex-direction: column;
        gap: 22px;
    }

    .admin-shell .dashboard-quick-actions {
        justify-content: flex-start;
        min-width: 0;
    }

    .article-editor-journey {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .article-editor-journey a:nth-child(2) {
        border-right: 0;
    }

    .article-editor-journey a:nth-child(-n + 2) {
        border-bottom: 1px solid var(--line);
    }

    .article-editor-command-bar .article-editor-journey a:nth-child(2) {
        border-right: 1px solid var(--line);
    }

    .article-editor-command-bar .article-editor-journey a:nth-child(-n + 2) {
        border-bottom: 0;
    }

    .article-import-layout.has-preview {
        grid-template-columns: 1fr;
    }

    .article-import-source-card {
        position: static;
    }
}

@media (max-width: 760px) {
    .admin-shell .my-work-welcome {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px 20px;
    }

    .admin-shell .my-work-context {
        width: 100%;
        min-height: 70px;
        grid-template-columns: auto auto;
        place-content: center;
    }

    .admin-shell .my-work-side-column {
        grid-template-columns: 1fr;
    }

    .admin-shell .my-work-item {
        grid-template-columns: 10px minmax(0, 1fr);
    }

    .admin-shell .my-work-item-meta {
        grid-column: 2;
        min-width: 0;
        justify-items: start;
        text-align: left;
    }

    .article-import-metadata {
        grid-template-columns: 1fr;
    }

    .article-import-form textarea {
        min-height: 380px;
    }
    .notification-item {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .notification-item time {
        grid-column: 2;
    }

    .portal-search-summary {
        align-items: stretch;
        flex-direction: column;
    }

    .portal-topic-suggestion {
        grid-template-columns: 1fr;
        padding: 20px;
    }

    .portal-search-summary .btn,
    .article-feedback-actions .btn {
        width: 100%;
    }

    .knowledge-feedback-list article > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .admin-shell {
        grid-template-columns: 1fr;
    }

    .admin-shell .context-sidebar {
        display: none;
    }

    .admin-shell .smart-topbar {
        height: var(--topbar-height);
        min-height: var(--topbar-height);
        margin: 0;
        padding: 0 14px;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px;
        border-radius: 0;
    }

    .admin-shell .topbar-portal-link {
        justify-content: center;
        width: auto;
        height: 38px;
        min-height: 38px;
        padding-inline: 10px;
    }

    .admin-shell .topbar-brand {
        gap: 8px;
    }

    .admin-shell .topbar-brand-divider {
        height: 26px;
    }

    .admin-shell .topbar-customer-brand {
        max-width: 96px;
    }

    .admin-shell .topbar-customer-brand .shell-logo {
        max-width: 96px;
        height: 38px;
    }

    .admin-shell .topbar-customer-brand > strong {
        max-width: 74px;
        font-size: 0.75rem;
    }

    .admin-shell .topbar-actions {
        gap: 4px;
    }

    .admin-shell .topbar-admin-menu {
        display: none;
    }

    .admin-shell .notification-bell,
    .admin-shell .profile-chip,
    .admin-shell .topbar-personal-link {
        width: 38px;
        height: 38px;
        min-height: 38px;
        flex-basis: 38px;
    }

    .admin-shell .profile-chip {
        justify-content: center;
        padding: 0;
    }

    .admin-shell .profile-copy,
    .admin-shell .topbar-user-chevron {
        display: none;
    }

    .admin-shell .profile-mobile-icon {
        display: inline-grid;
        place-items: center;
    }

    .admin-shell .profile-mobile-icon .sidebar-nav-icon,
    .admin-shell .profile-mobile-icon .sidebar-nav-icon svg {
        width: 20px;
        height: 20px;
    }

    .admin-shell .topbar-personal-link {
        margin-left: 5px;
    }

    .admin-shell .topbar-personal-link::before {
        left: -7px;
    }

    .admin-shell .app-launcher-grid {
        display: none;
    }

    .admin-shell .app-launcher-more {
        display: block;
    }

    .admin-shell .page-meta {
        min-width: 0;
    }

    .admin-shell .page-meta .eyebrow {
        max-width: 34vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .admin-shell .main-panel {
        padding: 18px 14px 34px;
    }

    .admin-shell .page-intro {
        align-items: flex-start;
        margin-bottom: 16px;
    }

    .admin-shell .stats-grid {
        grid-template-columns: 1fr;
    }

    .admin-shell .dashboard-welcome {
        padding: 24px 20px;
    }

    .admin-shell .dashboard-quick-actions,
    .admin-shell .dashboard-quick-actions .btn {
        width: 100%;
    }

    .admin-shell .empty-state.compact {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .admin-shell .empty-state.compact .btn {
        grid-column: 1 / -1;
        width: 100%;
    }

    .article-editor-journey {
        grid-template-columns: 1fr;
    }

    .article-editor-command-bar {
        top: 72px;
        grid-template-columns: minmax(0, 1fr) 52px;
    }

    .article-editor-command-bar .article-editor-journey {
        grid-template-columns: repeat(4, minmax(118px, 1fr));
        overflow-x: auto;
        scrollbar-width: none;
    }

    .article-editor-command-bar .article-editor-journey::-webkit-scrollbar {
        display: none;
    }

    .article-editor-command-bar .article-editor-journey a,
    .article-editor-command-bar .article-editor-journey a:nth-child(2) {
        min-height: 52px;
        padding: 9px 10px;
        border-right: 1px solid var(--line);
        border-bottom: 0;
    }

    .article-editor-command-tools {
        padding: 6px;
    }

    .article-editor-command-toggle {
        width: 40px;
        min-width: 40px;
        padding: 0;
    }

    .article-editor-command-toggle > span {
        display: none;
    }

    .article-editor-command-panel {
        min-height: 100%;
        padding-left: 8px;
        overflow-x: auto;
    }

    .article-editor-command-panel .article-editor-compact-actions {
        flex-wrap: nowrap;
    }

    .article-editor-command-panel .btn {
        width: auto;
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .article-editor-collapse-control > span {
        display: none;
    }

    .article-history-item {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .article-history-restore {
        grid-column: 1 / -1;
    }

    .article-history-restore .btn {
        width: 100%;
    }

    .article-editor-journey a,
    .article-editor-journey a:nth-child(2) {
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }

    .article-editor-journey a:last-child {
        border-bottom: 0;
    }

    .admin-shell .panel-card {
        padding: 16px;
    }

    .admin-shell .panel-head,
    .admin-shell .section-head {
        margin-inline: -16px;
        padding-inline: 16px;
    }
}

@media (max-width: 720px) {
    .admin-shell .saas-doc-article {
        padding: 18px;
    }

    .admin-shell .saas-doc-article-head {
        margin: -18px -18px 26px;
        padding: 22px 18px;
    }
}
.landing-beta-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 22px;
    padding: 7px 12px 7px 7px;
    border: 1px solid #dfe5f1;
    border-radius: 999px;
    background: #fff;
    color: #667089;
    font-size: 12px;
    font-weight: 700;
}

.landing-beta-badge strong,
.beta-notice strong,
.landing-nav-cta b {
    display: inline-flex;
    align-items: center;
    padding: 5px 8px;
    border-radius: 999px;
    background: #b7f34b;
    color: #12182a;
    font-size: 10px;
    letter-spacing: .12em;
}

.landing-nav-cta b { margin-right: 4px; }

.beta-notice {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 20px 0;
    padding: 16px;
    border: 1px solid #dfe7be;
    border-radius: 14px;
    background: #f8fbe9;
    color: #4e586c;
    line-height: 1.55;
}

.beta-consent a,
.landing-contact-form a,
.legal-page a { color: #315fe9; }

.landing-contact-section {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(520px, 1.2fr);
    gap: clamp(48px, 8vw, 120px);
    align-items: start;
}

.landing-contact-copy h2,
.legal-page h1 {
    margin: 18px 0;
    color: #12182a;
    font-size: clamp(40px, 5vw, 72px);
    line-height: .98;
    letter-spacing: -.055em;
}

.landing-contact-copy > p { max-width: 540px; color: #667089; font-size: 18px; line-height: 1.7; }
.landing-contact-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.landing-contact-meta span { padding: 9px 12px; border-radius: 999px; background: #eef2fa; color: #526078; font-size: 12px; font-weight: 700; }

.landing-contact-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    padding: clamp(24px, 4vw, 44px);
    border: 1px solid #dde3ef;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(39, 52, 82, .09);
}
.landing-contact-form .full { grid-column: 1 / -1; }
.landing-contact-form label { display: block; margin-bottom: 8px; color: #303b52; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.landing-contact-form input,
.landing-contact-form textarea { width: 100%; border: 1px solid #d9e0ec; border-radius: 12px; background: #f9fbfe; padding: 14px 15px; color: #12182a; font: inherit; }
.landing-contact-submit { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.landing-contact-submit small { max-width: 360px; color: #768198; line-height: 1.5; }
.contact-honeypot { position: absolute !important; left: -10000px !important; }

.legal-page {
    width: min(1120px, calc(100% - 48px));
    min-height: 60vh;
    margin: 0 auto;
    padding: clamp(72px, 10vw, 140px) 0;
}
.legal-page h1 { max-width: 900px; }
.legal-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 42px; }
.legal-grid article,
.legal-prose { padding: clamp(24px, 4vw, 44px); border: 1px solid #dfe5ef; border-radius: 22px; background: #fff; }
.legal-grid h2,
.legal-prose h2 { margin: 0 0 10px; color: #182136; font-size: 20px; }
.legal-grid p,
.legal-prose p { color: #5f6c84; line-height: 1.75; }
.legal-prose { max-width: 900px; }
.legal-prose h2 { margin-top: 34px; }
.legal-warning { max-width: 900px; margin: 24px 0; padding: 18px 20px; border: 1px solid #ffc7c7; border-radius: 14px; background: #fff4f4; color: #8c2d2d; }
.legal-warning p { margin: 6px 0 0; }

@media (max-width: 900px) {
    .landing-contact-section { grid-template-columns: 1fr; }
    .landing-contact-form { grid-template-columns: 1fr; }
    .landing-contact-form .full { grid-column: auto; }
    .landing-contact-submit { grid-column: auto; align-items: stretch; flex-direction: column; }
    .legal-grid { grid-template-columns: 1fr; }
}

/* Workspace settings: clear separation between personal and workspace administration. */
.admin-shell .workspace-settings-overview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 14px;
    padding: 22px 24px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background:
        radial-gradient(circle at 92% 20%, rgba(79, 124, 255, .14), transparent 24%),
        linear-gradient(135deg, #fff 0%, #f6f8fd 100%);
}

.admin-shell .workspace-settings-overview h2 {
    margin: 3px 0 5px;
    font-size: clamp(22px, 2vw, 30px);
    letter-spacing: -.035em;
}

.admin-shell .workspace-settings-overview p {
    max-width: 760px;
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.admin-shell .workspace-settings-kicker {
    color: #68758c;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.admin-shell .workspace-settings-tabs {
    position: sticky;
    z-index: 24;
    top: calc(var(--topbar-height) + 10px);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    margin-bottom: 16px;
    padding: 7px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 10px 30px rgba(30, 42, 70, .07);
    backdrop-filter: blur(14px);
}

.admin-shell .workspace-settings-tabs button {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 11px;
    align-items: center;
    min-width: 0;
    padding: 12px 13px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: var(--ink);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}

.admin-shell .workspace-settings-tabs button > span {
    grid-row: 1 / 3;
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    background: #eef2f8;
    color: #6f7d93;
    font-size: 10px;
    font-weight: 800;
}

.admin-shell .workspace-settings-tabs button strong {
    min-width: 0;
    overflow: hidden;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .workspace-settings-tabs button small {
    min-width: 0;
    overflow: hidden;
    color: #7d899d;
    font-size: 10px;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .workspace-settings-tabs button:hover {
    background: #f5f7fb;
}

.admin-shell .workspace-settings-tabs button.active {
    background: #151b29;
    color: #fff;
    box-shadow: 0 8px 20px rgba(21, 27, 41, .18);
}

.admin-shell .workspace-settings-tabs button.active > span {
    background: rgba(255, 255, 255, .12);
    color: #fff;
}

.admin-shell .workspace-settings-tabs button.active small {
    color: rgba(255, 255, 255, .66);
}

.admin-shell .workspace-settings-panel[hidden] {
    display: none !important;
}

.admin-shell .workspace-settings-panel-stack {
    display: grid;
    gap: 16px;
}

.admin-shell .workspace-branding-layout {
    grid-template-columns: minmax(0, 1.2fr) minmax(350px, .8fr);
    align-items: start;
}

.admin-shell .workspace-branding-form {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-shell .workspace-branding-form .full,
.admin-shell .workspace-branding-form .actions {
    grid-column: 1 / -1;
}

.admin-shell .workspace-branding-preview-card {
    position: sticky;
    top: calc(var(--topbar-height) + 102px);
}

.admin-shell .workspace-access-layout {
    align-items: start;
}

.admin-shell .workspace-access-layout > .panel-card:last-child {
    grid-column: 1 / -1;
}

@media (max-width: 1180px) {
    .admin-shell .workspace-settings-tabs {
        display: flex;
        overflow-x: auto;
        scrollbar-width: thin;
    }

    .admin-shell .workspace-settings-tabs button {
        flex: 0 0 210px;
    }

    .admin-shell .workspace-branding-layout,
    .admin-shell .workspace-access-layout {
        grid-template-columns: 1fr;
    }

    .admin-shell .workspace-branding-preview-card {
        position: static;
    }

    .admin-shell .workspace-access-layout > .panel-card:last-child {
        grid-column: auto;
    }
}

@media (max-width: 760px) {
    .admin-shell .workspace-settings-overview {
        align-items: stretch;
        flex-direction: column;
        padding: 18px;
    }

    .admin-shell .workspace-settings-overview .btn {
        width: 100%;
    }

    .admin-shell .workspace-settings-tabs {
        top: calc(var(--topbar-height) + 6px);
    }

    .admin-shell .workspace-branding-form {
        grid-template-columns: 1fr;
    }

    .admin-shell .workspace-branding-form .full,
    .admin-shell .workspace-branding-form .actions {
        grid-column: auto;
    }
}

/* Organisation settings: status first, then clearly grouped management areas. */
.admin-shell .tenant-settings-overview {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 22px 30px;
    margin-bottom: 14px;
    padding: 24px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 18px;
    background:
        radial-gradient(circle at 88% 8%, rgba(183, 243, 75, .22), transparent 26%),
        linear-gradient(135deg, #151b29 0%, #202a3d 100%);
    color: #fff;
}

.admin-shell .tenant-settings-kicker {
    color: #b7f34b;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.admin-shell .tenant-settings-overview h2 {
    margin: 5px 0 6px;
    color: #fff;
    font-size: clamp(24px, 2.4vw, 34px);
    letter-spacing: -.04em;
}

.admin-shell .tenant-settings-overview-copy p {
    max-width: 760px;
    margin: 0;
    color: rgba(255, 255, 255, .68);
    line-height: 1.55;
}

.admin-shell .tenant-settings-overview-actions {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
}

.admin-shell .tenant-settings-overview-actions .btn {
    border-color: #b7f34b;
    background: #b7f34b;
    color: #151b29;
}

.admin-shell .tenant-settings-metrics {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid rgba(255, 255, 255, .12);
}

.admin-shell .tenant-settings-metrics a {
    display: grid;
    gap: 2px;
    padding: 17px 18px 2px;
    border-right: 1px solid rgba(255, 255, 255, .12);
    color: inherit;
    text-decoration: none;
}

.admin-shell .tenant-settings-metrics a:first-child {
    padding-left: 0;
}

.admin-shell .tenant-settings-metrics a:last-child {
    border-right: 0;
}

.admin-shell .tenant-settings-metrics strong {
    color: #fff;
    font-size: 20px;
    letter-spacing: -.03em;
}

.admin-shell .tenant-settings-metrics span {
    color: rgba(255, 255, 255, .56);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.admin-shell .tenant-settings-navigation {
    position: sticky;
    z-index: 24;
    top: calc(var(--topbar-height) + 10px);
    display: grid;
    grid-template-columns: .85fr 1.25fr .9fr;
    gap: 8px;
    margin-bottom: 16px;
    padding: 7px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 10px 30px rgba(30, 42, 70, .07);
    backdrop-filter: blur(14px);
}

.admin-shell .tenant-settings-navigation-group {
    min-width: 0;
    padding: 7px;
    border-right: 1px solid #e8ecf3;
}

.admin-shell .tenant-settings-navigation-group:last-child {
    border-right: 0;
}

.admin-shell .tenant-settings-navigation-group > span {
    display: block;
    margin: 0 5px 6px;
    color: #98a1b2;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.admin-shell .tenant-settings-navigation-group > div {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 5px;
}

.admin-shell .tenant-settings-navigation-link {
    position: relative;
    display: grid;
    gap: 2px;
    min-width: 0;
    padding: 10px 27px 10px 10px;
    border-radius: 10px;
    color: #263149;
    text-decoration: none;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}

.admin-shell .tenant-settings-navigation-link strong,
.admin-shell .tenant-settings-navigation-link small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .tenant-settings-navigation-link strong {
    font-size: 12px;
}

.admin-shell .tenant-settings-navigation-link small {
    color: #8490a4;
    font-size: 9px;
}

.admin-shell .tenant-settings-navigation-link i {
    position: absolute;
    top: 50%;
    right: 10px;
    color: #9ca6b7;
    font-style: normal;
    transform: translateY(-50%);
}

.admin-shell .tenant-settings-navigation-link:hover {
    background: #f3f6fa;
}

.admin-shell .tenant-settings-navigation-link.is-active {
    background: #151b29;
    color: #fff;
    box-shadow: 0 7px 18px rgba(21, 27, 41, .16);
}

.admin-shell .tenant-settings-navigation-link.is-active small,
.admin-shell .tenant-settings-navigation-link.is-active i {
    color: rgba(255, 255, 255, .62);
}

.admin-shell .tenant-settings-home-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
    gap: 16px;
    align-items: start;
}

.admin-shell .tenant-settings-inheritance-card {
    background: linear-gradient(145deg, #f7f9fc, #fff);
}

.admin-shell .tenant-settings-inheritance-card h2 {
    margin: 6px 0 18px;
}

.admin-shell .tenant-settings-levels {
    display: grid;
}

.admin-shell .tenant-settings-levels > div {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 14px 0;
    border-top: 1px solid #e6ebf3;
}

.admin-shell .tenant-settings-levels > div > span {
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border-radius: 9px;
    background: #edf1f7;
    color: #6d788d;
    font-size: 9px;
    font-weight: 800;
}

.admin-shell .tenant-settings-levels p,
.admin-shell .tenant-settings-levels strong,
.admin-shell .tenant-settings-levels small {
    display: block;
    margin: 0;
}

.admin-shell .tenant-settings-levels strong {
    margin-bottom: 3px;
    color: #202a3d;
    font-size: 13px;
}

.admin-shell .tenant-settings-levels small {
    color: #778399;
    font-size: 11px;
    line-height: 1.45;
}

@media (max-width: 1180px) {
    .admin-shell .tenant-settings-navigation {
        display: flex;
        overflow-x: auto;
        scrollbar-width: thin;
    }

    .admin-shell .tenant-settings-navigation-group {
        flex: 0 0 auto;
        min-width: 310px;
    }

    .admin-shell .tenant-settings-home-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .admin-shell .tenant-settings-overview {
        grid-template-columns: 1fr;
        padding: 19px;
    }

    .admin-shell .tenant-settings-overview-actions {
        justify-content: stretch;
    }

    .admin-shell .tenant-settings-overview-actions .btn {
        width: 100%;
    }

    .admin-shell .tenant-settings-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-shell .tenant-settings-metrics a,
    .admin-shell .tenant-settings-metrics a:first-child {
        padding: 13px 10px;
        border-right: 1px solid rgba(255, 255, 255, .12);
        border-bottom: 1px solid rgba(255, 255, 255, .12);
    }

    .admin-shell .tenant-settings-metrics a:nth-child(2n) {
        border-right: 0;
    }

    .admin-shell .tenant-settings-metrics a:nth-last-child(-n + 2) {
        border-bottom: 0;
    }

    .admin-shell .tenant-settings-navigation {
        top: calc(var(--topbar-height) + 6px);
    }
}

.admin-shell .sidebar-global-actions .sidebar-context-heading > a.sidebar-workspace-settings {
    display: inline-grid;
    grid-template-columns: 1fr;
    width: 25px;
    min-width: 25px;
    height: 25px;
    min-height: 25px;
    padding: 0;
    place-items: center;
    border-radius: 5px;
    color: #8b94a4;
}

.admin-shell .sidebar-global-actions .sidebar-context-heading > a.sidebar-workspace-settings:hover,
.admin-shell .sidebar-global-actions .sidebar-context-heading > a.sidebar-workspace-settings.active {
    color: var(--primary);
    background: var(--shell-accent-soft);
}

.admin-shell .tenant-role-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(360px, .8fr);
    gap: 16px;
    align-items: start;
}

.admin-shell .tenant-role-list {
    position: sticky;
    top: calc(var(--topbar-height) + 126px);
}

.admin-shell .tenant-role-permission-groups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 10px;
}

.admin-shell .tenant-role-permission-groups fieldset {
    display: grid;
    gap: 8px;
    min-width: 0;
    margin: 0;
    padding: 12px;
    border: 1px solid #e1e6ef;
    border-radius: 12px;
    background: #f8fafc;
}

.admin-shell .tenant-role-permission-groups legend {
    padding: 0 5px;
    color: #667287;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.admin-shell .tenant-role-permission-groups .manual-option {
    min-height: 0;
    padding: 10px;
    background: #fff;
}

.admin-shell .tenant-role-cards {
    display: grid;
    gap: 10px;
}

.admin-shell .tenant-role-cards > article {
    padding: 15px;
    border: 1px solid #e1e6ef;
    border-radius: 13px;
    background: #fff;
}

.admin-shell .tenant-role-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.admin-shell .tenant-role-card-head > div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.admin-shell .tenant-role-card-head strong {
    color: #202a3d;
    font-size: 14px;
}

.admin-shell .tenant-role-card-head small {
    overflow: hidden;
    color: #7a869a;
    font-size: 10px;
    line-height: 1.45;
    text-overflow: ellipsis;
}

.admin-shell .tenant-role-card-head > span {
    flex: 0 0 auto;
    padding: 5px 7px;
    border-radius: 999px;
    background: #edf2f8;
    color: #677389;
    font-size: 9px;
    font-weight: 800;
}

.admin-shell .tenant-role-card-permissions {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin: 13px 0;
}

.admin-shell .tenant-role-card-permissions span {
    padding: 5px 7px;
    border-radius: 6px;
    background: #f3f6fa;
    color: #667287;
    font-size: 9px;
    font-weight: 700;
}

.admin-shell .tenant-role-card-actions {
    display: flex;
    gap: 7px;
    padding-top: 12px;
    border-top: 1px solid #edf0f5;
}

.admin-shell .tenant-role-card-actions form {
    margin: 0;
}

.admin-shell .tenant-role-card-actions .btn {
    min-height: 33px;
    padding: 7px 10px;
    font-size: 10px;
}

@media (max-width: 1180px) {
    .admin-shell .tenant-role-layout {
        grid-template-columns: 1fr;
    }

    .admin-shell .tenant-role-list {
        position: static;
    }
}

@media (max-width: 760px) {
    .admin-shell .tenant-role-permission-groups {
        grid-template-columns: 1fr;
    }

    .admin-shell .tenant-role-card-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-shell .tenant-role-card-actions .btn {
        width: 100%;
    }
}

.admin-shell .tenant-member-access-editor {
    margin-bottom: 16px;
    border-color: rgba(79, 124, 255, .24);
    box-shadow: 0 16px 40px rgba(37, 55, 90, .08);
}

.admin-shell .tenant-member-organization-role {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 340px);
    gap: 8px 20px;
    align-items: center;
    margin-bottom: 16px;
    padding: 15px;
    border: 1px solid #e0e6f0;
    border-radius: 12px;
    background: #f8fafc;
}

.admin-shell .tenant-member-organization-role > div,
.admin-shell .tenant-member-organization-role > div strong,
.admin-shell .tenant-member-organization-role > div small {
    display: block;
}

.admin-shell .tenant-member-organization-role > div strong {
    margin-bottom: 3px;
    color: #202a3d;
    font-size: 13px;
}

.admin-shell .tenant-member-organization-role small {
    color: #78849a;
    font-size: 10px;
    line-height: 1.45;
}

.admin-shell .tenant-member-organization-role > .full {
    grid-column: 1 / -1;
}

.admin-shell .tenant-member-workspace-access-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.admin-shell .tenant-member-workspace-access-grid > article {
    display: grid;
    grid-template-columns: minmax(0, .7fr) minmax(180px, 1.3fr) auto;
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 14px;
    border: 1px solid #e1e6ef;
    border-radius: 12px;
    background: #fff;
}

.admin-shell .tenant-member-workspace-access-grid > article > div:first-child,
.admin-shell .tenant-member-workspace-access-grid > article > div:first-child strong,
.admin-shell .tenant-member-workspace-access-grid > article > div:first-child small {
    display: block;
    min-width: 0;
}

.admin-shell .tenant-member-workspace-access-grid > article > div:first-child strong {
    overflow: hidden;
    color: #202a3d;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .tenant-member-workspace-access-grid > article > div:first-child small {
    margin-top: 3px;
    overflow: hidden;
    color: #8a95a8;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-shell .tenant-member-workspace-access-grid .field {
    margin: 0;
}

.admin-shell .tenant-member-workspace-access-grid .field label {
    display: none;
}

.admin-shell .tenant-member-workspace-access-grid select {
    min-height: 38px;
}

.admin-shell .tenant-member-access-note {
    display: flex;
    gap: 11px;
    align-items: flex-start;
    margin-top: 14px;
    padding: 13px 14px;
    border: 1px solid rgba(48, 171, 116, .22);
    border-radius: 11px;
    background: rgba(48, 171, 116, .07);
}

.admin-shell .tenant-member-access-note > span {
    display: grid;
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    place-items: center;
    border-radius: 8px;
    background: #fff;
    color: #238a5f;
    font-weight: 800;
}

.admin-shell .tenant-member-access-note p,
.admin-shell .tenant-member-access-note strong,
.admin-shell .tenant-member-access-note small {
    display: block;
    margin: 0;
}

.admin-shell .tenant-member-access-note strong {
    margin-bottom: 3px;
    color: #225d49;
    font-size: 11px;
}

.admin-shell .tenant-member-access-note small {
    color: #5d8173;
    font-size: 10px;
    line-height: 1.45;
}

@media (max-width: 1180px) {
    .admin-shell .tenant-member-workspace-access-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .admin-shell .tenant-member-organization-role,
    .admin-shell .tenant-member-workspace-access-grid > article {
        grid-template-columns: 1fr;
    }

    .admin-shell .tenant-member-workspace-access-grid > article > .pill {
        justify-self: start;
    }
}

/* Release-Rich-Content steht bewusst am Dateiende, damit ältere Release-Regeln es nicht zurücksetzen. */
.release-admin-items .release-rich-content p,
.portal-release-group .release-rich-content p,
.portal-release-detail .release-rich-content p,
.portal-release-timeline-entry .release-rich-content p {
    margin: .5em 0;
    color: inherit;
    line-height: 1.62;
}

/* Einheitliche Verwaltungs- und Editor-Grammatik */
.management-view,.entity-editor{width:min(1380px,100%);margin:0 auto}.management-view{display:grid;gap:14px}.management-commandbar,.entity-editor-bar{display:flex;gap:20px;align-items:center;justify-content:space-between}.management-commandbar{padding:4px 2px 14px;border-bottom:1px solid #dce2ea}.management-commandbar h2,.entity-editor-section-head h2,.entity-editor-inspector-head h2{margin:4px 0}.management-commandbar p,.entity-editor-section-head p,.entity-editor-inspector-note p{margin:3px 0 0;color:#6c7890;line-height:1.5}.management-toolbar{display:flex;gap:8px;align-items:center;padding:10px 12px;border:1px solid #dde3eb;border-radius:12px;background:#fff}.management-search{flex:1}.management-search input{width:100%;min-height:40px;border:0;background:transparent}.management-search input:focus{outline:0}.management-list{overflow:visible;border:1px solid #dde3eb;border-radius:12px;background:#fff}.management-row{display:grid;grid-template-columns:minmax(280px,1fr) minmax(260px,.65fr) auto;gap:22px;align-items:center;padding:15px 17px;border-bottom:1px solid #e5e9ef}.management-row:last-child{border-bottom:0}.management-row:hover{background:#fafbfd}.management-row.is-muted{opacity:.65}.management-row-primary{min-width:0}.management-row-primary>strong,.management-row-primary>span{display:block}.management-row-primary>span{margin-top:2px;color:#738097;font-size:.78rem}.management-row-primary>p{display:-webkit-box;overflow:hidden;margin:7px 0 0;color:#536078;font-size:.85rem;line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:2}.management-row-meta,.management-row-actions{display:flex;gap:8px;align-items:center}.management-row-meta{flex-wrap:wrap;color:#758197;font-size:.76rem}.management-row-actions{justify-content:flex-end}.management-more{position:relative}.management-more>summary{display:grid;width:38px;height:38px;place-items:center;border:1px solid #dce2ea;border-radius:9px;cursor:pointer;list-style:none}.management-more>summary::-webkit-details-marker{display:none}.management-more[open]>form{position:absolute;z-index:20;top:44px;right:0;min-width:150px;padding:6px;border:1px solid #dce2ea;border-radius:10px;background:#fff;box-shadow:0 12px 30px rgba(15,23,42,.14)}.management-more form button{width:100%;padding:9px 10px;border:0;border-radius:7px;background:transparent;color:#b42335;text-align:left;cursor:pointer}.management-more form button:hover{background:#fff0f2}.management-empty{display:grid;justify-items:center;gap:7px;padding:54px 20px;text-align:center}.management-empty p{margin:0 0 10px;color:#758197}
.entity-editor{display:grid;gap:14px}.entity-editor-bar{position:sticky;z-index:35;top:0;min-height:62px;padding:9px 12px;border:1px solid #dce2ea;border-radius:12px;background:rgba(255,255,255,.96);box-shadow:0 8px 22px rgba(15,23,42,.06);backdrop-filter:blur(12px)}.entity-editor-back{color:#526078;font-size:.82rem;font-weight:750;text-decoration:none}.entity-editor-identity{display:grid;min-width:0;margin-right:auto}.entity-editor-identity strong{overflow:hidden;max-width:520px;text-overflow:ellipsis;white-space:nowrap}.entity-editor-bar-actions{display:flex;gap:8px}.entity-editor-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,310px);gap:14px;align-items:start}.entity-editor-main{display:grid;gap:14px;min-width:0}.entity-editor-section,.entity-editor-inspector{border:1px solid #dce2ea;border-radius:12px;background:#fff}.entity-editor-section{padding:22px}.entity-editor-section-head{margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid #e5e9ef}.entity-editor-inspector{position:sticky;top:76px;display:grid;gap:17px;padding:19px}.entity-editor-inspector-head{padding-bottom:13px;border-bottom:1px solid #e5e9ef}.entity-editor-inspector .field{margin:0}.entity-editor-inspector-note{padding:12px;border-radius:9px;background:#f4f6fa}.entity-editor-inspector-note strong{font-size:.82rem}.entity-editor-inspector-note p{font-size:.76rem}.entity-editor .form-grid{margin:0}
@media(max-width:960px){.entity-editor-grid{grid-template-columns:1fr}.entity-editor-inspector{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.entity-editor-inspector-head,.entity-editor-inspector-note{grid-column:1/-1}.management-row{grid-template-columns:minmax(0,1fr) auto}.management-row-meta{grid-column:1}.management-row-actions{grid-column:2;grid-row:1/3}}
@media(max-width:680px){.management-commandbar{align-items:flex-start}.management-commandbar p{display:none}.management-toolbar{align-items:stretch;flex-wrap:wrap}.management-search{flex-basis:100%}.management-row{grid-template-columns:1fr;padding:14px}.management-row-meta,.management-row-actions{grid-column:1;grid-row:auto}.management-row-actions{justify-content:flex-start}.entity-editor-bar{top:0;display:grid;grid-template-columns:1fr auto}.entity-editor-back{grid-column:1/-1}.entity-editor-identity{max-width:calc(100vw - 170px)}.entity-editor-bar-actions{grid-column:2;grid-row:2}.entity-editor-bar-actions .btn-secondary{display:none}.entity-editor-grid{display:block}.entity-editor-main{margin-bottom:12px}.entity-editor-section{padding:17px}.entity-editor-inspector{grid-template-columns:1fr;padding:17px}.entity-editor-inspector-head,.entity-editor-inspector-note{grid-column:1}.entity-editor .form-grid.two-col{grid-template-columns:1fr}}

/* Feinjustierung des gemeinsamen Standards: artikelnahe Radien, linksbündig und überlaufsicher. */
.management-view,
.entity-editor {
    width: 100%;
    max-width: none;
    margin-right: 0;
    margin-left: 0;
}

.management-toolbar,
.management-list,
.entity-editor-bar,
.entity-editor-section,
.entity-editor-inspector,
.entity-editor-inspector-note,
.entity-editor .manual-option,
.release-rich-editor-shell,
.release-preview-tabs,
.release-preview-pane,
.release-preview-document,
.release-admin-items article,
.management-more > summary,
.management-more[open] > form,
.release-item-edit[open] > form {
    border-radius: 7px;
}

.entity-editor-grid,
.entity-editor-main,
.entity-editor-section,
.entity-editor-inspector,
.entity-editor-inspector .field,
.entity-editor-inspector .manual-option,
.entity-editor-inspector .manual-option > div {
    min-width: 0;
    max-width: 100%;
}

.entity-editor-inspector input,
.entity-editor-inspector select,
.entity-editor-inspector textarea {
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

.entity-editor-inspector .manual-option {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 12px;
}

.entity-editor-inspector .manual-option strong,
.entity-editor-inspector .manual-option small {
    display: block;
    overflow-wrap: anywhere;
}

/* Artikel folgen derselben Verwaltungs- und Editor-Grammatik. */
.article-management-view {
    gap: 12px;
}

.article-create-options {
    display: grid;
    gap: 18px;
}

.article-create-options .entity-editor-section-head {
    margin-bottom: 0;
}

.article-create-options .article-template-choice-grid {
    gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.article-create-options .article-template-choice-card {
    min-height: 150px;
    padding: 16px;
    border-radius: 7px;
}

.article-create-options .article-template-choice-card .btn {
    justify-self: start;
}

.article-management-tools {
    display: grid;
    gap: 10px;
}

.article-management-tools .article-subnav {
    margin: 0;
}

.article-management-tools .article-filter-bar {
    grid-template-columns: minmax(220px, 1.45fr) repeat(4, minmax(140px, 1fr)) auto;
    padding: 10px;
    border: 1px solid #dde3eb;
    border-radius: 7px;
    background: #fff;
}

.article-management-tools .article-filter-bar .actions.full {
    grid-column: auto;
    flex-wrap: nowrap;
}

.article-overview-listing,
.article-bulk-shell {
    min-width: 0;
}

.article-bulk-bar {
    padding: 8px 2px 10px;
}

.article-management-row {
    grid-template-columns: minmax(320px, 1.2fr) minmax(300px, .8fr) auto;
}

.article-management-primary {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.article-management-primary > input {
    width: 16px;
    height: 16px;
    margin-top: 3px;
}

.article-management-primary > div {
    min-width: 0;
}

.article-management-primary strong,
.article-management-primary span {
    display: block;
}

.article-management-primary span {
    margin-top: 2px;
    color: #738097;
    font-size: .75rem;
}

.article-management-primary p {
    display: -webkit-box;
    overflow: hidden;
    margin: 6px 0 0;
    color: #536078;
    font-size: .82rem;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.article-entity-bar {
    position: static;
    min-height: 58px;
    box-shadow: none;
}

.article-entity-state {
    display: flex;
    gap: 8px;
    align-items: center;
}

.article-entity-state small {
    color: #6c7890;
    font-size: .72rem;
}

.article-entity-editor .article-editor-grid > fieldset.article-entity-grid {
    grid-template-columns: minmax(0, 1fr) minmax(260px, 310px);
    gap: 14px;
}

.article-entity-editor .article-editor-main {
    gap: 14px;
}

.article-entity-editor .entity-editor-section {
    border-radius: 7px;
}

.article-entity-editor .entity-editor-inspector {
    top: calc(var(--topbar-height) + 86px);
    align-self: start;
}

.article-entity-meta {
    display: grid;
    gap: 9px;
}

.article-entity-meta > div {
    display: grid;
    gap: 2px;
    padding-bottom: 9px;
    border-bottom: 1px solid #e5e9ef;
}

.article-entity-meta span {
    color: #748097;
    font-size: .68rem;
    font-weight: 750;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.article-entity-meta strong {
    overflow-wrap: anywhere;
    color: #253147;
    font-size: .82rem;
}

.article-entity-audiences {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.article-entity-audiences > div:first-child p {
    margin: 3px 0 0;
    color: #6c7890;
    font-size: .76rem;
}

.article-editor-followup {
    gap: 14px;
    margin-top: 14px;
    margin-bottom: 22px;
}

@media (max-width: 1280px) {
    .article-management-tools .article-filter-bar {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .article-management-tools .article-filter-search {
        grid-column: span 2;
    }

    .article-management-tools .article-filter-bar .actions.full {
        grid-column: span 2;
        justify-content: flex-start;
    }

    .article-management-row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .article-management-row .management-row-meta {
        grid-column: 1;
    }

    .article-management-row .management-row-actions {
        grid-column: 2;
        grid-row: 1 / 3;
    }
}

@media (max-width: 1100px) {
    .article-entity-editor .article-editor-grid > fieldset.article-entity-grid {
        grid-template-columns: 1fr;
    }

    .article-entity-editor .entity-editor-inspector {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .article-entity-editor .entity-editor-inspector-head,
    .article-entity-editor .article-entity-meta,
    .article-entity-editor .entity-editor-inspector-note,
    .article-entity-editor .article-entity-audiences {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {
    .article-create-options .article-template-choice-grid {
        grid-template-columns: 1fr;
    }

    .article-management-tools .article-filter-bar {
        grid-template-columns: 1fr;
    }

    .article-management-tools .article-filter-search,
    .article-management-tools .article-filter-bar .actions.full {
        grid-column: 1;
    }

    .article-management-row,
    .article-management-row .management-row-meta,
    .article-management-row .management-row-actions {
        grid-column: 1;
        grid-row: auto;
    }

    .article-management-row .management-row-actions {
        justify-content: flex-start;
    }

    .article-entity-bar {
        grid-template-columns: 1fr auto;
    }

    .article-entity-state {
        grid-column: 2;
        grid-row: 2;
    }

    .article-entity-editor .entity-editor-inspector {
        grid-template-columns: 1fr;
    }
}

.entity-editor > form {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.management-row[href] {
    grid-template-columns: minmax(0, 1fr) auto;
    color: inherit;
    text-decoration: none;
}

.management-action-popover {
    position: absolute;
    z-index: 20;
    top: 44px;
    right: 0;
    display: grid;
    min-width: 190px;
    padding: 6px;
    border: 1px solid #dce2ea;
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .14);
}

.management-action-popover a,
.management-action-popover button {
    display: block;
    width: 100%;
    padding: 9px 10px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #253147;
    font: inherit;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.management-action-popover a:hover,
.management-action-popover button:hover {
    background: #f4f6fa;
}

.management-action-popover button.is-danger {
    color: #b42335;
}

.category-management-row {
    --category-indent: calc(var(--category-depth, 0) * 24px);
}

.category-management-row .management-row-primary {
    padding-left: var(--category-indent);
}

.category-management-row[style*="--category-depth: 0"] .management-row-primary > strong::before {
    content: "▣";
    margin-right: 9px;
    color: #6c7890;
}

@media (max-width: 680px) {
    .category-management-row .management-row-primary {
        padding-left: calc(var(--category-depth, 0) * 12px);
    }
}

.entity-editor-inspector .manual-option small {
    margin-top: 3px;
    color: #6c7890;
    line-height: 1.45;
}
