/* /Components/LoreCardEditor.razor.rz.scp.css */
.lore-editor-backdrop[b-5hhecgnv7q] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1090;
}

.lore-editor[b-5hhecgnv7q] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(560px, 94vw);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
    z-index: 1091;
}

.lore-editor-header[b-5hhecgnv7q] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.lore-editor-body[b-5hhecgnv7q] {
    padding: 1rem 1.25rem 1.25rem;
    overflow-y: auto;
}

/* Embedded inside another modal: no shell, inherit host padding. */
.lore-editor-embedded[b-5hhecgnv7q] {
    display: block;
}

.lore-section-label[b-5hhecgnv7q] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--accent, #ffae42);
    margin: 1rem 0 0.75rem;
}

.lore-section-label[b-5hhecgnv7q]::before,
.lore-section-label[b-5hhecgnv7q]::after {
    content: "";
    flex: 1;
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
}

/* Avatar */
.lore-media-panel[b-5hhecgnv7q] {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    margin: 0.25rem 0 1.35rem;
    padding: 1rem;
    box-sizing: border-box;
    max-width: 100%;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background:
        radial-gradient(circle at 20% 15%, rgba(255, 174, 66, 0.11), transparent 32%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.015));
}

.lore-avatar-frame[b-5hhecgnv7q] {
    position: relative;
    justify-self: center;
    width: 132px;
    height: 132px;
    display: grid;
    place-items: center;
}

.lore-avatar-ring[b-5hhecgnv7q] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1px solid rgba(255, 174, 66, 0.34);
    box-shadow: 0 0 0 8px rgba(255, 174, 66, 0.045);
    pointer-events: none;
}

.lore-avatar[b-5hhecgnv7q] {
    position: relative;
    z-index: 1;
    width: 118px;
    height: 118px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0.18);
    background:
        linear-gradient(135deg, rgba(255, 174, 66, 0.16), rgba(66, 148, 255, 0.14)),
        rgba(255, 255, 255, 0.04);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.38);
}

.lore-avatar img[b-5hhecgnv7q] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lore-avatar-placeholder[b-5hhecgnv7q] {
    font-size: 2.3rem;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.82);
}

.lore-avatar-overlay[b-5hhecgnv7q] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
}

.lore-file-input[b-5hhecgnv7q] {
    display: none;
}

.lore-media-actions[b-5hhecgnv7q] {
    display: grid;
    gap: 0.65rem;
    min-width: 0;
}

.lore-media-button[b-5hhecgnv7q] {
    width: 100%;
    min-width: 0;
    min-height: 3.4rem;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 8px;
    background: rgba(18, 18, 22, 0.92);
    color: var(--text-primary, #f3f3f4);
    cursor: pointer;
    text-align: left;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

.lore-media-button > span:last-of-type[b-5hhecgnv7q] {
    min-width: 0;
}

.lore-media-button:hover:not(:disabled)[b-5hhecgnv7q] {
    border-color: rgba(255, 174, 66, 0.58);
    background: rgba(255, 174, 66, 0.08);
    transform: translateY(-1px);
}

.lore-media-button:disabled[b-5hhecgnv7q] {
    cursor: wait;
    opacity: 0.66;
}

.lore-media-button strong[b-5hhecgnv7q],
.lore-media-button small[b-5hhecgnv7q] {
    display: block;
    line-height: 1.2;
}

.lore-media-button strong[b-5hhecgnv7q] {
    font-size: 0.9rem;
    font-weight: 750;
}

.lore-media-button small[b-5hhecgnv7q] {
    margin-top: 0.15rem;
    color: var(--text-muted, #9a9aa4);
    font-size: 0.74rem;
}

.lore-media-icon[b-5hhecgnv7q] {
    flex: 0 0 auto;
    width: 2.1rem;
    height: 2.1rem;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.055);
    color: var(--accent, #ffae42);
}

.lore-media-icon svg[b-5hhecgnv7q] {
    width: 1.15rem;
    height: 1.15rem;
    fill: currentColor;
}

.lore-image-prompt[b-5hhecgnv7q] {
    grid-column: 1 / -1;
    min-width: 0;
    padding: 0.8rem;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 8px;
    background: rgba(8, 8, 12, 0.52);
}

.lore-image-prompt-header[b-5hhecgnv7q],
.lore-image-prompt-footer[b-5hhecgnv7q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.lore-image-prompt-header[b-5hhecgnv7q] {
    margin-bottom: 0.45rem;
}

.lore-image-prompt-footer[b-5hhecgnv7q] {
    margin-top: 0.55rem;
}

.lore-image-prompt-close[b-5hhecgnv7q] {
    padding: 0;
    color: var(--accent, #ffae42);
    font-size: 0.8rem;
    font-weight: 700;
    text-decoration: none;
}

.lore-image-prompt-close:hover[b-5hhecgnv7q],
.lore-image-prompt-close:focus[b-5hhecgnv7q] {
    color: var(--accent-strong, #ff9f1a);
    text-decoration: none;
}

.lore-image-prompt textarea[b-5hhecgnv7q] {
    resize: vertical;
    min-height: 4.8rem;
}

.lore-media-error[b-5hhecgnv7q] {
    grid-column: 1 / -1;
    margin: -0.25rem 0 0;
    color: #ff7f7f;
    font-size: 0.82rem;
}

.lore-editor-tabs[b-5hhecgnv7q] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
    margin: 0 0 1rem;
    padding: 0.3rem;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.035);
}

.lore-editor-tab[b-5hhecgnv7q] {
    min-width: 0;
    border: 0;
    border-radius: 6px;
    padding: 0.5rem 0.65rem;
    background: transparent;
    color: var(--text-muted, #aaa);
    font-size: 0.86rem;
    font-weight: 700;
}

.lore-editor-tab.active[b-5hhecgnv7q] {
    background: var(--accent, #ffae42);
    color: #1a1205;
}

.lore-skill-summary[b-5hhecgnv7q] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: space-between;
    margin-bottom: 0.65rem;
    color: var(--text-muted, #aaa);
    font-size: 0.86rem;
}

.lore-skill-warning[b-5hhecgnv7q] {
    margin-bottom: 0.75rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid rgba(255, 174, 66, 0.35);
    border-radius: 8px;
    background: rgba(255, 174, 66, 0.08);
    color: var(--accent, #ffae42);
    font-size: 0.82rem;
}

.lore-skill-legend[b-5hhecgnv7q] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.85rem;
    padding: 0.55rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.028);
}

.lore-skill-legend span[b-5hhecgnv7q] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 1.65rem;
    padding: 0.25rem 0.55rem;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.18);
    color: var(--text-muted, #aaa);
    font-size: 0.76rem;
    line-height: 1.15;
}

.lore-skill-legend strong[b-5hhecgnv7q] {
    display: inline-grid;
    place-items: center;
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 4px;
    background: rgba(255, 174, 66, 0.14);
    color: var(--accent, #ffae42);
    font-size: 0.75rem;
    line-height: 1;
}

.lore-skill-empty[b-5hhecgnv7q] {
    padding: 0.9rem;
    border: 1px dashed rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    color: var(--text-muted, #aaa);
    background: rgba(255, 255, 255, 0.03);
}

.lore-skill-assist[b-5hhecgnv7q] {
    margin-bottom: 0.85rem;
}

.lore-skill-list[b-5hhecgnv7q],
.lore-skill-preview[b-5hhecgnv7q] {
    display: grid;
    gap: 0.55rem;
}

.lore-skill-row[b-5hhecgnv7q] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 4.75rem;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.035);
}

.lore-skill-row.compact[b-5hhecgnv7q] {
    padding: 0.55rem;
}

.lore-skill-row strong[b-5hhecgnv7q],
.lore-skill-row p[b-5hhecgnv7q],
.lore-skill-row small[b-5hhecgnv7q] {
    display: block;
}

.lore-skill-row strong[b-5hhecgnv7q] {
    color: var(--text-primary, #f3f3f4);
    font-size: 0.9rem;
}

.lore-skill-row p[b-5hhecgnv7q],
.lore-skill-row small[b-5hhecgnv7q] {
    margin: 0.18rem 0 0;
    color: var(--text-muted, #aaa);
    font-size: 0.78rem;
    line-height: 1.35;
}

.lore-skill-level[b-5hhecgnv7q] {
    width: 100%;
    text-align: center;
}

/* Secret info: blurred with a veil until the user clicks to reveal. */
.secret-info-wrap[b-5hhecgnv7q] {
    position: relative;
}

.secret-info-wrap.is-masked[b-5hhecgnv7q] {
    cursor: pointer;
}

.secret-info-wrap.is-masked textarea[b-5hhecgnv7q] {
    filter: blur(6px);
    user-select: none;
    pointer-events: none;
}

.secret-info-veil[b-5hhecgnv7q] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    border-radius: 0.375rem;
    background: rgba(8, 8, 12, 0.35);
    color: var(--text-muted, #9a9aa4);
    font-size: 0.82rem;
    font-weight: 600;
    transition: color 0.15s ease, background 0.15s ease;
}

.secret-info-wrap.is-masked:hover .secret-info-veil[b-5hhecgnv7q],
.secret-info-wrap.is-masked:focus-visible .secret-info-veil[b-5hhecgnv7q] {
    color: var(--accent, #ffae42);
    background: rgba(8, 8, 12, 0.45);
}

.secret-info-wrap.is-masked:focus-visible[b-5hhecgnv7q] {
    outline: 2px solid rgba(255, 174, 66, 0.35);
    outline-offset: 2px;
    border-radius: 0.375rem;
}

.secret-info-veil svg[b-5hhecgnv7q] {
    width: 1rem;
    height: 1rem;
    fill: currentColor;
}

/* Weight segmented control */
.weight-segments[b-5hhecgnv7q] {
    display: flex;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0.6rem;
    overflow: hidden;
}

.weight-segment[b-5hhecgnv7q] {
    flex: 1;
    border: none;
    background: transparent;
    color: var(--text-muted, #aaa);
    padding: 0.45rem 0.25rem;
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.weight-segment + .weight-segment[b-5hhecgnv7q] {
    border-left: 1px solid rgba(255, 255, 255, 0.12);
}

.weight-segment:hover[b-5hhecgnv7q] {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}

.weight-segment.active[b-5hhecgnv7q] {
    background: var(--accent, #ffae42);
    color: #1a1a1a;
    font-weight: 600;
}

/* Chip input (triggers + linked pieces) */
.chip-input[b-5hhecgnv7q] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 0.5rem;
    padding: 0.4rem 0.55rem;
    min-height: 2.4rem;
    background: rgba(255, 255, 255, 0.03);
}

.chip-input .chip[b-5hhecgnv7q] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 1rem;
    padding: 0.15rem 0.55rem;
    font-size: 0.8rem;
}

.chip-dot[b-5hhecgnv7q] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: var(--accent, #ffae42);
    display: inline-block;
}

.chip-x[b-5hhecgnv7q] {
    border: none;
    background: transparent;
    color: inherit;
    cursor: pointer;
    line-height: 1;
    padding: 0;
    font-size: 1rem;
    opacity: 0.7;
}

.chip-x:hover[b-5hhecgnv7q] {
    opacity: 1;
}

.chip-entry[b-5hhecgnv7q] {
    border: none;
    background: transparent;
    color: inherit;
    outline: none;
    flex: 1;
    min-width: 8rem;
    font-size: 0.85rem;
}

@media (max-width: 620px) {
    .lore-editor-body[b-5hhecgnv7q] {
        padding: 0.85rem;
    }

    /* Narrow layout: avatar sits on the left with both image actions in one row beside it. */
    .lore-media-panel[b-5hhecgnv7q] {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.75rem;
        padding: 0.9rem;
    }

    .lore-avatar-frame[b-5hhecgnv7q] {
        justify-self: start;
        width: 96px;
        height: 96px;
    }

    .lore-avatar[b-5hhecgnv7q] {
        width: 86px;
        height: 86px;
    }

    .lore-avatar-placeholder[b-5hhecgnv7q] {
        font-size: 1.7rem;
    }

    .lore-media-actions[b-5hhecgnv7q] {
        width: 100%;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.5rem;
    }

    /* Compact buttons: icon over label, subtitle dropped so the pair fits beside the avatar. */
    .lore-media-button[b-5hhecgnv7q] {
        flex-direction: column;
        justify-content: center;
        gap: 0.35rem;
        min-height: 0;
        padding: 0.55rem 0.4rem;
        text-align: center;
    }

    .lore-media-button strong[b-5hhecgnv7q] {
        font-size: 0.8rem;
    }

    .lore-media-button small[b-5hhecgnv7q] {
        display: none;
    }

    .lore-media-icon[b-5hhecgnv7q] {
        width: 1.8rem;
        height: 1.8rem;
    }

    .lore-skill-row[b-5hhecgnv7q] {
        grid-template-columns: 1fr;
    }

    .lore-skill-level[b-5hhecgnv7q] {
        max-width: 6rem;
    }
}
/* /Components/RichTextEditor.razor.rz.scp.css */
.scenario-introduction-editor[b-n7ter5pmx1] {
    --rich-editor-border: rgba(255, 255, 255, 0.14);
    --rich-editor-surface: rgba(12, 12, 14, 0.88);
    --rich-editor-toolbar: rgba(255, 255, 255, 0.055);
    --rich-editor-text: var(--text, #f4f4f5);
    --rich-editor-placeholder: #d7dbe5;
    --rich-editor-muted: #a9adb7;
}

.scenario-introduction-editor[b-n7ter5pmx1]  .rich-text-editor {
    border: 1px solid var(--rich-editor-border);
    border-radius: 8px;
    overflow: hidden;
    background: var(--rich-editor-surface);
}

.scenario-introduction-editor[b-n7ter5pmx1]  .rich-text-editor-modebar {
    position: absolute;
    top: -0.18rem;
    right: 5.6rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.25rem;
    margin: 0;
}

.scenario-introduction-editor[b-n7ter5pmx1]  .rich-text-editor-mode-button {
    min-height: 1.55rem;
    border: 1px solid var(--rich-editor-border);
    border-radius: 6px;
    padding: 0.12rem 0.45rem;
    background: rgba(255, 255, 255, 0.04);
    color: var(--rich-editor-muted);
    font-size: 0.68rem;
    font-weight: 750;
    line-height: 1.1;
}

.scenario-introduction-editor[b-n7ter5pmx1]  .rich-text-editor-mode-button[aria-pressed="true"] {
    border-color: var(--accent, #ff9f1c);
    background: rgba(255, 159, 28, 0.13);
    color: var(--rich-editor-text);
}

.scenario-introduction-editor[b-n7ter5pmx1]  .rich-text-editor-hidden {
    display: none;
}

.scenario-introduction-editor[b-n7ter5pmx1]  .rich-text-editor-source {
    width: 100%;
    min-height: 260px;
    border: 1px solid var(--rich-editor-border);
    border-radius: 8px;
    padding: 0.65rem 0.75rem;
    background: var(--rich-editor-surface);
    color: var(--rich-editor-text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: 0.82rem;
    line-height: 1.45;
    resize: vertical;
}

.scenario-introduction-editor[b-n7ter5pmx1]  .rich-text-editor-source:focus {
    border-color: var(--accent, #7dd3fc);
    box-shadow: 0 0 0 0.16rem rgba(125, 211, 252, 0.16);
    outline: none;
}

@media (max-width: 767.98px) {
    .scenario-introduction-editor[b-n7ter5pmx1]  .rich-text-editor-modebar {
        position: static;
        justify-content: flex-start;
        margin: 0 0 0.35rem;
    }
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-toolbar.ql-snow {
    display: flex;
    flex-wrap: wrap;
    gap: 0.15rem 0.25rem;
    border: 0;
    border-bottom: 1px solid var(--rich-editor-border);
    background: var(--rich-editor-toolbar);
    padding: 0.35rem 0.45rem;
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-container.ql-snow {
    min-height: 190px;
    border: 0;
    color: var(--rich-editor-text);
    font-family: inherit;
    font-size: 0.88rem;
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-editor {
    min-height: 190px;
    line-height: 1.45;
    padding: 0.65rem 0.75rem;
    color: var(--rich-editor-text);
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-editor.ql-blank::before {
    color: var(--rich-editor-placeholder) !important;
    font-style: italic;
    font-weight: 500;
    opacity: 1 !important;
    left: 0.75rem;
    right: 0.75rem;
    text-shadow: none;
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow .ql-stroke {
    stroke: var(--rich-editor-muted);
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow .ql-fill,
.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow .ql-stroke.ql-fill {
    fill: var(--rich-editor-muted);
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow .ql-picker,
.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow .ql-picker-label {
    color: var(--rich-editor-text);
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow .ql-picker-options {
    border-color: var(--rich-editor-border);
    background: #16191f;
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow .ql-picker-item {
    color: var(--rich-editor-text);
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow button:hover .ql-stroke,
.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow button.ql-active .ql-stroke,
.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow .ql-picker-label:hover .ql-stroke,
.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow .ql-picker-label.ql-active .ql-stroke {
    stroke: var(--accent, #7dd3fc);
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow button:hover .ql-fill,
.scenario-introduction-editor[b-n7ter5pmx1]  .ql-snow button.ql-active .ql-fill {
    fill: var(--accent, #7dd3fc);
}

.scenario-introduction-editor[b-n7ter5pmx1]  .ql-editor img {
    max-width: 100%;
    border-radius: 8px;
}

.scenario-introduction-editor[b-n7ter5pmx1]  .rich-text-editor-error {
    margin-top: 0.35rem;
    color: #ff8a8a;
    font-size: 0.78rem;
}
/* /Components/ScenarioEditor.razor.rz.scp.css */
.recommend-dialog[b-uol5aehl4h] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(440px, 92vw);
    max-height: 82vh;
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
    z-index: 1080;
}

.recommend-dialog-header[b-uol5aehl4h] {
    padding: 0.65rem 1rem;
    cursor: move;
    touch-action: none;
    user-select: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.recommend-dialog-body[b-uol5aehl4h] {
    padding: 1rem;
    overflow-y: auto;
}

.recommend-item[b-uol5aehl4h] {
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0.5rem;
    padding: 0.5rem 0.75rem;
}

.scenario-editor-heading .section-title[b-uol5aehl4h] {
    margin-bottom: 0.2rem;
}

.scenario-editor-heading .text-muted-soft[b-uol5aehl4h] {
    margin-bottom: 0;
    font-size: 0.86rem;
}

.scenario-main-panel[b-uol5aehl4h] {
    padding: 0.9rem;
}

.scenario-cover-details-grid[b-uol5aehl4h] {
    display: grid;
    grid-template-columns: minmax(320px, 0.42fr) minmax(0, 1fr);
    gap: 0.95rem;
    align-items: stretch;
    margin-bottom: 0.65rem;
}

.scenario-cover-column[b-uol5aehl4h],
.scenario-details-column[b-uol5aehl4h] {
    min-width: 0;
}

.scenario-cover-column[b-uol5aehl4h] {
    display: flex;
    flex-direction: column;
}

.scenario-cover-frame[b-uol5aehl4h] {
    position: relative;
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    width: 100%;
    overflow: hidden;
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    background: #141416;
    outline: none;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
}

.scenario-cover-frame:focus-visible[b-uol5aehl4h] {
    box-shadow: 0 0 0 2px rgba(255, 159, 28, 0.4);
}

.scenario-cover-frame img[b-uol5aehl4h] {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.18s ease, filter 0.18s ease;
}

.scenario-cover-frame:hover img[b-uol5aehl4h],
.scenario-cover-frame:focus-within img[b-uol5aehl4h],
.scenario-cover-frame:focus img[b-uol5aehl4h] {
    filter: brightness(0.72);
    transform: scale(1.015);
}

.scenario-cover-empty[b-uol5aehl4h] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    color: var(--text-muted);
    text-align: center;
}

.scenario-cover-empty span[b-uol5aehl4h] {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 159, 28, 0.45);
    border-radius: 999px;
    color: var(--accent);
    font-size: 1.4rem;
    line-height: 1;
}

.scenario-cover-empty strong[b-uol5aehl4h] {
    font-size: 0.84rem;
}

.scenario-cover-actions[b-uol5aehl4h],
.scenario-cover-busy[b-uol5aehl4h] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.scenario-cover-busy[b-uol5aehl4h] {
    z-index: 3;
    background: rgba(0, 0, 0, 0.58);
}

.scenario-cover-actions[b-uol5aehl4h] {
    z-index: 2;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.85rem 1rem;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.22), rgba(0, 0, 0, 0.62));
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.16s ease;
}

.scenario-cover-frame:hover .scenario-cover-actions[b-uol5aehl4h],
.scenario-cover-frame:focus-within .scenario-cover-actions[b-uol5aehl4h],
.scenario-cover-frame:focus .scenario-cover-actions[b-uol5aehl4h] {
    opacity: 1;
    pointer-events: auto;
}

.scenario-cover-action[b-uol5aehl4h] {
    width: min(220px, 100%);
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    border: 1px solid rgba(255, 159, 28, 0.8);
    border-radius: 8px;
    background: rgba(23, 23, 24, 0.86);
    color: var(--text-primary);
    font-size: 0.86rem;
    font-weight: 650;
    line-height: 1.1;
    backdrop-filter: blur(4px);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.scenario-cover-action:hover[b-uol5aehl4h],
.scenario-cover-action:focus-visible[b-uol5aehl4h] {
    background: var(--accent);
    border-color: var(--accent);
    color: #111112;
}

.scenario-cover-action:disabled[b-uol5aehl4h] {
    cursor: not-allowed;
    opacity: 0.55;
}

.scenario-cover-action-icon[b-uol5aehl4h] {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
}

.scenario-cover-action-icon svg[b-uol5aehl4h] {
    width: 100%;
    height: 100%;
    display: block;
    fill: currentColor;
}

.scenario-cover-prompt[b-uol5aehl4h] {
    margin-top: 0.55rem;
    padding: 0.6rem;
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.025);
}

.scenario-cover-prompt-header[b-uol5aehl4h],
.scenario-cover-prompt-footer[b-uol5aehl4h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.scenario-cover-prompt-header[b-uol5aehl4h] {
    margin-bottom: 0.35rem;
}

.scenario-cover-prompt-footer[b-uol5aehl4h] {
    margin-top: 0.4rem;
}

.scenario-cover-error[b-uol5aehl4h] {
    margin-top: 0.45rem;
    color: #ff8a8a;
    font-size: 0.78rem;
    line-height: 1.3;
}

.scenario-editor-disclosure[b-uol5aehl4h],
.scenario-side-section[b-uol5aehl4h] {
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.018);
    overflow: hidden;
}

.scenario-side-section[b-uol5aehl4h] {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.028), rgba(255, 255, 255, 0.012)),
        rgba(14, 15, 18, 0.82);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.scenario-editor-disclosure[b-uol5aehl4h] {
    margin-top: 0.85rem;
}

.scenario-collapse-summary[b-uol5aehl4h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 38px;
    padding: 0.52rem 0.65rem;
    cursor: pointer;
    list-style: none;
    user-select: none;
    border-radius: 8px;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.scenario-collapse-summary[b-uol5aehl4h]::-webkit-details-marker {
    display: none;
}

.scenario-collapse-summary[b-uol5aehl4h]::after {
    content: "";
    width: 0.45rem;
    height: 0.45rem;
    flex: 0 0 auto;
    border-right: 2px solid var(--accent);
    border-bottom: 2px solid var(--accent);
    transform: rotate(45deg);
    transition: transform 0.15s ease;
}

.scenario-side-section > .scenario-collapse-summary[b-uol5aehl4h] {
    justify-content: flex-start;
    min-height: 44px;
    padding: 0.56rem 0.72rem;
    background: rgba(255, 255, 255, 0.015);
}

.scenario-side-section > .scenario-collapse-summary[b-uol5aehl4h]::after {
    margin-left: 0.62rem;
}

.scenario-side-section > .scenario-collapse-summary .section-title[b-uol5aehl4h] {
    flex: 1 1 auto;
    min-width: 0;
    color: var(--accent);
    font-size: 0.94rem;
    line-height: 1;
    font-weight: 850;
    letter-spacing: 0.005em;
}

.scenario-editor-disclosure[open] > .scenario-collapse-summary[b-uol5aehl4h],
.scenario-side-section[open] > .scenario-collapse-summary[b-uol5aehl4h] {
    border-bottom: 1px solid var(--border-subtle);
    border-radius: 8px 8px 0 0;
    background: rgba(255, 159, 28, 0.045);
}

.scenario-side-section[open] > .scenario-collapse-summary[b-uol5aehl4h] {
    background:
        linear-gradient(90deg, rgba(255, 159, 28, 0.075), rgba(255, 255, 255, 0.018)),
        rgba(18, 18, 20, 0.94);
}

.scenario-editor-disclosure[open] > .scenario-collapse-summary[b-uol5aehl4h]::after,
.scenario-side-section[open] > .scenario-collapse-summary[b-uol5aehl4h]::after {
    transform: rotate(225deg);
}

.scenario-collapse-summary:hover[b-uol5aehl4h],
.scenario-collapse-summary:focus-visible[b-uol5aehl4h] {
    background: rgba(255, 255, 255, 0.04);
    outline: none;
}

.scenario-collapse-title[b-uol5aehl4h] {
    color: var(--accent);
    font-size: 0.82rem;
    font-weight: 850;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.scenario-collapse-meta[b-uol5aehl4h] {
    min-width: 0;
    flex: 1 1 auto;
    color: var(--text-muted);
    font-size: 0.7rem;
    font-weight: 600;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.scenario-collapse-count[b-uol5aehl4h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.12rem;
    flex: 0 0 auto;
    min-height: 22px;
    min-width: 48px;
    padding: 0.08rem 0.5rem;
    border: 1px solid rgba(255, 159, 28, 0.32);
    border-radius: 999px;
    background: rgba(255, 159, 28, 0.11);
    color: var(--accent);
    font-size: 0.66rem;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.scenario-collapse-count-value[b-uol5aehl4h] {
    color: #ffd28a;
}

.scenario-collapse-count-divider[b-uol5aehl4h] {
    color: rgba(255, 209, 138, 0.55);
}

.scenario-disclosure-body[b-uol5aehl4h] {
    display: flex;
    flex-direction: column;
    gap: 0.62rem;
    padding: 0.65rem;
}

.scenario-field-block[b-uol5aehl4h] {
    position: relative;
    min-width: 0;
}

.scenario-field-heading[b-uol5aehl4h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.28rem;
}

.scenario-introduction-field .scenario-field-heading[b-uol5aehl4h] {
    padding-right: 0;
}

.scenario-main-panel .mb-2[b-uol5aehl4h] {
    margin-bottom: 0.45rem !important;
}

.scenario-main-panel .form-control-sm[b-uol5aehl4h],
.scenario-main-panel .btn-sm[b-uol5aehl4h] {
    font-size: 0.78rem;
}

.scenario-main-panel textarea.form-control-sm[b-uol5aehl4h] {
    line-height: 1.28;
}

.scenario-main-panel .settings-counter[b-uol5aehl4h] {
    display: block;
    margin-top: 0.18rem;
    margin-left: auto;
    text-align: right;
    font-size: 0.64rem !important;
    line-height: 1.1;
    font-weight: 600;
    opacity: 0.78;
}

.scenario-introduction-editor[b-uol5aehl4h] {
    --rich-editor-border: rgba(255, 255, 255, 0.14);
    --rich-editor-surface: rgba(12, 12, 14, 0.88);
    --rich-editor-toolbar: rgba(255, 255, 255, 0.055);
    --rich-editor-text: var(--text, #f4f4f5);
    --rich-editor-muted: #a9adb7;
}

.scenario-introduction-editor[b-uol5aehl4h]  .rich-text-editor {
    border: 1px solid var(--rich-editor-border);
    border-radius: 8px;
    overflow: hidden;
    background: var(--rich-editor-surface);
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-toolbar.ql-snow {
    display: flex;
    flex-wrap: wrap;
    gap: 0.15rem 0.25rem;
    border: 0;
    border-bottom: 1px solid var(--rich-editor-border);
    background: var(--rich-editor-toolbar);
    padding: 0.35rem 0.45rem;
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-container.ql-snow {
    min-height: 190px;
    border: 0;
    color: var(--rich-editor-text);
    font-family: inherit;
    font-size: 0.88rem;
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-editor {
    min-height: 190px;
    line-height: 1.45;
    padding: 0.65rem 0.75rem;
    color: var(--rich-editor-text);
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-container .ql-editor.ql-blank::before,
.scenario-introduction-editor[b-uol5aehl4h]  .ql-container .ql-editor.ql-blank[data-placeholder]::before {
    color: #c5cad5 !important;
    font-style: italic;
    opacity: 0.9 !important;
    left: 0.75rem;
    right: 0.75rem;
    text-shadow: none;
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow .ql-stroke {
    stroke: var(--rich-editor-muted);
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow .ql-fill,
.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow .ql-stroke.ql-fill {
    fill: var(--rich-editor-muted);
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow .ql-picker,
.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow .ql-picker-label {
    color: var(--rich-editor-text);
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow .ql-picker-options {
    border-color: var(--rich-editor-border);
    background: #16191f;
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow .ql-picker-item {
    color: var(--rich-editor-text);
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow button:hover .ql-stroke,
.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow button.ql-active .ql-stroke,
.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow .ql-picker-label:hover .ql-stroke,
.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow .ql-picker-label.ql-active .ql-stroke {
    stroke: var(--accent, #7dd3fc);
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow button:hover .ql-fill,
.scenario-introduction-editor[b-uol5aehl4h]  .ql-snow button.ql-active .ql-fill {
    fill: var(--accent, #7dd3fc);
}

.scenario-introduction-editor[b-uol5aehl4h]  .ql-editor img {
    max-width: 100%;
    border-radius: 8px;
}

.scenario-introduction-editor[b-uol5aehl4h]  .rich-text-editor-error {
    margin-top: 0.35rem;
    color: #ff8a8a;
    font-size: 0.78rem;
}

.scenario-settings-panel[b-uol5aehl4h] {
    padding: 0.85rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.scenario-settings-panel .section-title[b-uol5aehl4h] {
    font-size: 0.98rem;
}

.scenario-settings-panel .form-check[b-uol5aehl4h] {
    min-height: 1.15rem;
    padding-left: 2.25rem;
    margin-bottom: 0;
}

.scenario-settings-panel .form-check-input[b-uol5aehl4h] {
    width: 1.9rem;
    height: 1rem;
    margin-left: -2.25rem;
    margin-top: 0.16rem;
}

.scenario-settings-panel .form-check-label[b-uol5aehl4h] {
    font-size: 0.82rem;
    line-height: 1.2;
}

.scenario-settings-panel .text-muted-soft.small[b-uol5aehl4h] {
    font-size: 0.72rem;
    line-height: 1.25;
    margin-top: 0.12rem;
}

.scenario-side-section-body[b-uol5aehl4h] {
    padding: 0.65rem;
}

.scenario-settings-panel .badge[b-uol5aehl4h] {
    padding: 0.22rem 0.45rem;
    font-size: 0.66rem;
}

.scenario-settings-panel .btn-sm[b-uol5aehl4h],
.scenario-limit-action[b-uol5aehl4h] {
    padding: 0.22rem 0.55rem;
    font-size: 0.76rem;
    line-height: 1.2;
}

.scenario-limit-action[b-uol5aehl4h] {
    min-height: 30px;
}

.lore-card-row[b-uol5aehl4h] {
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0.45rem;
    padding: 0.42rem 0.55rem;
    background: rgba(255, 255, 255, 0.02);
}

.scenario-lore-section[b-uol5aehl4h] {
    padding: 0.85rem;
}

details.scenario-lore-section[b-uol5aehl4h] {
    padding: 0;
}

.scenario-lore-section .section-title[b-uol5aehl4h] {
    font-size: 1rem;
}

.scenario-lore-section .text-muted-soft.small[b-uol5aehl4h] {
    font-size: 0.75rem;
}

.scenario-lore-section .btn-sm[b-uol5aehl4h] {
    padding: 0.18rem 0.55rem;
    font-size: 0.78rem;
    line-height: 1.25;
}

.scenario-lore-section .chip[b-uol5aehl4h] {
    padding: 0.12rem 0.38rem;
    font-size: 0.68rem;
    line-height: 1.2;
}

.scenario-lore-body-head .btn[b-uol5aehl4h] {
    flex: 0 0 auto;
}

.min-width-0[b-uol5aehl4h] {
    min-width: 0;
}

.lore-card-thumb[b-uol5aehl4h] {
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    border-radius: 50%;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.78rem;
    color: var(--text-muted, #8a8a8a);
}

.lore-card-thumb img[b-uol5aehl4h] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-shell {
    gap: 0.7rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-toolbar {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 0.15rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-search {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 34px;
    padding: 0.25rem 0.45rem;
    gap: 0.4rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-search span,
.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-sort span {
    font-size: 0.66rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-search .form-control,
.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-sort .form-select {
    min-height: 30px;
    padding: 0.22rem 0.45rem;
    font-size: 0.78rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-actions {
    flex: 0 0 auto;
    min-width: max-content;
    gap: 0.45rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-sort {
    min-height: 34px;
    padding: 0.2rem 0.45rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-sort .form-select {
    min-width: 124px;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-actions .btn {
    padding: 0.28rem 0.6rem;
    font-size: 0.78rem;
    line-height: 1.2;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-tabs {
    gap: 0.35rem;
    margin-bottom: 0.2rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-tab {
    min-height: 30px;
    padding: 0.24rem 0.5rem;
    font-size: 0.76rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-sections {
    gap: 0.55rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-section {
    padding: 0;
    border-radius: 0.5rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-section-header {
    min-height: 34px;
    padding: 0.32rem 0.45rem;
    gap: 0.45rem;
    margin-bottom: 0;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-section-toggle {
    padding: 0.05rem 0;
    font-size: 0.78rem;
    gap: 0.35rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-chevron {
    width: 14px;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-section-header .btn {
    padding: 0.2rem 0.5rem;
    font-size: 0.76rem;
    line-height: 1.2;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-grid {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 0.65rem;
    padding: 0.65rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-card {
    min-height: 130px;
    padding: 0.65rem 0.7rem 0.7rem 0.82rem;
    gap: 0.4rem;
    border-radius: 0.5rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .lore-card-top {
    gap: 0.45rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .lore-grid-thumb {
    width: 34px;
    height: 34px;
    font-size: 0.74rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-card-header {
    gap: 0.25rem;
    margin-bottom: 0.2rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-type-chip,
.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-meta,
.scenario-lore-section-compact[b-uol5aehl4h]  .lore-lab-card-status,
.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-card-chips .chip {
    font-size: 0.66rem;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-card-title {
    font-size: 0.9rem;
    line-height: 1.15;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-card-preview {
    min-height: 2.3rem;
    font-size: 0.74rem;
    line-height: 1.28;
}

.scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-card-chips {
    gap: 0.25rem;
}

@media (max-width: 767.98px) {
    .scenario-cover-details-grid[b-uol5aehl4h] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .scenario-cover-frame[b-uol5aehl4h] {
        flex: initial;
        min-height: 0;
        aspect-ratio: auto;
    }

    .scenario-introduction-field .scenario-field-heading[b-uol5aehl4h] {
        padding-right: 0;
    }

    .scenario-collapse-summary[b-uol5aehl4h] {
        min-height: 36px;
        padding: 0.48rem 0.55rem;
    }

    .scenario-collapse-title[b-uol5aehl4h],
    .scenario-settings-panel .section-title[b-uol5aehl4h] {
        font-size: 0.78rem;
    }

    .scenario-collapse-meta[b-uol5aehl4h] {
        display: none;
    }

    .scenario-disclosure-body[b-uol5aehl4h],
    .scenario-side-section-body[b-uol5aehl4h] {
        padding: 0.55rem;
    }

    .scenario-cover-actions[b-uol5aehl4h] {
        position: static;
        flex-direction: row;
        opacity: 1;
        pointer-events: auto;
        padding: 0.55rem;
        background: rgba(0, 0, 0, 0.42);
    }

    .scenario-cover-frame[b-uol5aehl4h] {
        display: flex;
        flex-direction: column;
        aspect-ratio: auto;
    }

    .scenario-cover-frame img[b-uol5aehl4h],
    .scenario-cover-empty[b-uol5aehl4h] {
        aspect-ratio: 16 / 9;
        height: auto;
        min-height: 0;
    }

    .scenario-cover-action[b-uol5aehl4h] {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
        padding: 0 0.45rem;
        font-size: 0.78rem;
    }

    .scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-toolbar,
    .scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-search,
    .scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-actions,
    .scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-sort,
    .scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-sort .form-select,
    .scenario-lore-section-compact[b-uol5aehl4h]  .memory-lab-actions .btn {
        width: 100%;
        min-width: 0;
    }

    .scenario-lore-body-head[b-uol5aehl4h] {
        flex-direction: column;
        align-items: stretch !important;
    }
}

.skill-edit-list[b-uol5aehl4h] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.skill-edit-card[b-uol5aehl4h] {
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.02);
    padding: 0.55rem 0.6rem;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.skill-edit-card:hover[b-uol5aehl4h] {
    border-color: rgba(255, 255, 255, 0.18);
}

.skill-edit-card.confirming[b-uol5aehl4h] {
    border-color: rgba(220, 53, 69, 0.55);
    background: rgba(220, 53, 69, 0.06);
}

.skill-edit-head[b-uol5aehl4h] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.4rem;
}

.skill-edit-name[b-uol5aehl4h] {
    font-weight: 600;
    flex: 1 1 auto;
    min-width: 0;
}

.skill-edit-desc[b-uol5aehl4h] {
    resize: vertical;
    font-size: 0.85rem;
}

/* Icon remove button */
.skill-edit-remove[b-uol5aehl4h] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

.skill-edit-remove:hover[b-uol5aehl4h] {
    color: #ff6b6b;
    background: rgba(220, 53, 69, 0.12);
    border-color: rgba(220, 53, 69, 0.35);
}

.skill-edit-remove svg[b-uol5aehl4h] {
    width: 16px;
    height: 16px;
    fill: currentColor;
}

/* Inline confirm */
.skill-edit-confirm[b-uol5aehl4h] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.skill-edit-confirm-label[b-uol5aehl4h] {
    font-size: 0.78rem;
    color: #ff8a8a;
    font-weight: 600;
}

.skill-edit-confirm .btn[b-uol5aehl4h] {
    padding: 0.12rem 0.5rem;
    font-size: 0.78rem;
    line-height: 1.3;
}

/* Compact editor field labels (main form + triggers) */
.editor-label[b-uol5aehl4h] {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-muted);
    margin-bottom: 0.2rem;
}

.trigger-edit-label[b-uol5aehl4h] {
    display: block;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-muted);
    margin: 0.45rem 0 0.2rem;
}

.skill-edit-card + .skill-edit-card .trigger-edit-label:first-of-type[b-uol5aehl4h],
.trigger-edit-label:first-of-type[b-uol5aehl4h] {
    margin-top: 0.25rem;
}

.trigger-edit-chance[b-uol5aehl4h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0.5rem 0 0.1rem;
}

.trigger-edit-pct[b-uol5aehl4h] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text);
}

.skill-edit-card .form-range[b-uol5aehl4h] {
    margin-top: 0.1rem;
}
/* /Layout/MainLayout.razor.rz.scp.css */
.page[b-j7hdv9tlxk] {
    display: flex;
    min-height: 100vh;
    background: var(--bg-base);
}

main[b-j7hdv9tlxk] {
    flex: 1;
    min-width: 0;
    background: var(--bg-base);
    min-height: 100vh;
}

.memory-index-global[b-j7hdv9tlxk] {
    position: sticky;
    top: 0;
    z-index: 1200;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(8rem, 16rem) auto;
    gap: 0.85rem;
    align-items: center;
    margin: 0;
    padding: 0.7rem clamp(1rem, 2vw, 2rem);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(22, 22, 23, 0.96);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
    backdrop-filter: blur(10px);
}

.memory-index-global.is-active[b-j7hdv9tlxk] {
    border-color: rgba(243, 178, 80, 0.28);
}

.memory-index-global.is-failed[b-j7hdv9tlxk] {
    border-color: rgba(229, 72, 77, 0.36);
}

.memory-index-global.is-ready[b-j7hdv9tlxk] {
    grid-template-columns: minmax(0, 1fr);
    border-color: rgba(135, 191, 80, 0.3);
}

.memory-index-global-copy[b-j7hdv9tlxk] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.memory-index-global-copy strong[b-j7hdv9tlxk] {
    color: var(--text-main);
    font-size: 0.88rem;
    line-height: 1.2;
}

.memory-index-global-copy span[b-j7hdv9tlxk] {
    color: var(--text-muted);
    font-size: 0.78rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.memory-index-global-meter[b-j7hdv9tlxk] {
    height: 0.45rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

.memory-index-global-meter span[b-j7hdv9tlxk] {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--accent), #87bf50);
    transition: width 0.25s ease;
}

.sidebar[b-j7hdv9tlxk] {
    flex: 0 0 auto;
    background: #101011;
    border-right: 1px solid var(--border-subtle);
    z-index: 20;
}

.content[b-j7hdv9tlxk] {
    min-height: 100vh;
    padding: 1.5rem clamp(1rem, 2vw, 2rem);
}

@media (max-width: 760px) {
    .page[b-j7hdv9tlxk] {
        display: block;
    }

    /* NavMenu supplies its own sticky top bar + fixed drawer on mobile; the wrapper
       must not add a box of its own (which would otherwise show a thin bordered strip). */
    .sidebar[b-j7hdv9tlxk] {
        display: contents;
    }

    .content[b-j7hdv9tlxk] {
        padding: 1rem;
    }

    .memory-index-global[b-j7hdv9tlxk] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.55rem;
        padding: 0.7rem 1rem;
    }

    .memory-index-global-copy span[b-j7hdv9tlxk] {
        white-space: normal;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
.fl-sidebar[b-3ascedb6k5] {
    --sidebar-width: 285px;
    --sidebar-collapsed-width: 64px;
    width: var(--sidebar-width);
    height: 100vh;
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    background: #101011;
    color: var(--text-primary);
    transition: width 0.2s ease;
}

.fl-sidebar.is-collapsed[b-3ascedb6k5] {
    width: var(--sidebar-collapsed-width);
}

.fl-brand-row[b-3ascedb6k5] {
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055);
}

.fl-brand[b-3ascedb6k5] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    color: #fff;
    text-decoration: none;
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1;
}

.fl-brand:hover[b-3ascedb6k5] {
    color: #fff;
}

.fl-brand-mark[b-3ascedb6k5] {
    position: relative;
    width: 33px;
    height: 27px;
    flex: 0 0 auto;
}

.fl-brand-mark[b-3ascedb6k5]::before,
.fl-brand-mark[b-3ascedb6k5]::after {
    content: "";
    position: absolute;
    left: 0;
    height: 8px;
    border-radius: 999px 999px 999px 2px;
    background: linear-gradient(90deg, #ff4b2f, #ff9f1c);
    transform: skewX(-22deg) rotate(-12deg);
}

.fl-brand-mark[b-3ascedb6k5]::before {
    top: 3px;
    width: 32px;
}

.fl-brand-mark[b-3ascedb6k5]::after {
    top: 15px;
    width: 22px;
    left: 4px;
}

.fl-brand-text[b-3ascedb6k5] {
    white-space: nowrap;
}

.fl-brand-text span[b-3ascedb6k5] {
    color: var(--accent);
}

.fl-collapse-btn[b-3ascedb6k5] {
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 1.6rem;
    font-weight: 800;
    line-height: 1;
    padding: 0.25rem;
    cursor: pointer;
    opacity: 0.9;
}

.fl-collapse-btn:hover[b-3ascedb6k5] {
    color: var(--accent);
}

.fl-primary-nav[b-3ascedb6k5] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 0.95rem 0.9rem;
}

.fl-primary-nav[b-3ascedb6k5] {
    padding-bottom: 0.6rem;
}

.fl-nav-link[b-3ascedb6k5],
.fl-auth-link[b-3ascedb6k5] {
    position: relative;
    min-height: 46px;
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0 1rem;
    border-radius: 8px;
    color: #d9dce5;
    text-decoration: none;
    font-weight: 600;
    white-space: nowrap;
    transition: background 0.15s ease, color 0.15s ease;
}

.fl-nav-link:hover[b-3ascedb6k5],
.fl-auth-link:hover[b-3ascedb6k5] {
    color: #fff;
    background: rgba(255, 255, 255, 0.045);
}

.fl-nav-link.active[b-3ascedb6k5],
.fl-auth-link.active[b-3ascedb6k5] {
    color: #fff;
    background: #20170b;
}

.fl-nav-link.active[b-3ascedb6k5]::before {
    content: "";
    position: absolute;
    left: -0.9rem;
    top: 12px;
    bottom: 12px;
    width: 4px;
    border-radius: 999px;
    background: var(--accent);
}

.fl-nav-link.active .fl-icon[b-3ascedb6k5],
.fl-auth-link.active .fl-icon[b-3ascedb6k5] {
    color: var(--accent);
}

.fl-icon[b-3ascedb6k5] {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    color: #85858a;
    background-color: currentColor;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: 20px 20px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: 20px 20px;
}

.fl-icon-home[b-3ascedb6k5] { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 10.8 12 3l9 7.8v9.7a.5.5 0 0 1-.5.5h-5.2v-6.4H8.7V21H3.5a.5.5 0 0 1-.5-.5v-9.7Z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 10.8 12 3l9 7.8v9.7a.5.5 0 0 1-.5.5h-5.2v-6.4H8.7V21H3.5a.5.5 0 0 1-.5-.5v-9.7Z'/%3E%3C/svg%3E"); }
.fl-icon-compass[b-3ascedb6k5] { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm4.8 6.2-2.2 6.4-6.4 2.2 2.2-6.4 6.4-2.2Z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm4.8 6.2-2.2 6.4-6.4 2.2 2.2-6.4 6.4-2.2Z'/%3E%3C/svg%3E"); }
.fl-icon-wand[b-3ascedb6k5] { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4.7 19.3 9.9-9.9-2-2-9.9 9.9 2 2Zm11.5-11.5 1.4-1.4-2-2-1.4 1.4 2 2Zm2.3 4.2 1.5-1.5-1.5-1.5-1.5 1.5 1.5 1.5ZM8 5.5 9.5 4 8 2.5 6.5 4 8 5.5Z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4.7 19.3 9.9-9.9-2-2-9.9 9.9 2 2Zm11.5-11.5 1.4-1.4-2-2-1.4 1.4 2 2Zm2.3 4.2 1.5-1.5-1.5-1.5-1.5 1.5 1.5 1.5ZM8 5.5 9.5 4 8 2.5 6.5 4 8 5.5Z'/%3E%3C/svg%3E"); }
.fl-icon-book[b-3ascedb6k5] { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 4.5A2.5 2.5 0 0 1 7.5 2H20v17H7.5A2.5 2.5 0 0 0 5 21.5v-17Z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 4.5A2.5 2.5 0 0 1 7.5 2H20v17H7.5A2.5 2.5 0 0 0 5 21.5v-17Z'/%3E%3C/svg%3E"); }
.fl-icon-gear[b-3ascedb6k5] { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.4 13a7.9 7.9 0 0 0 0-2l2.1-1.6-2-3.5-2.5 1a7.7 7.7 0 0 0-1.7-1L14.9 3.3h-4L10.5 5.9a7.7 7.7 0 0 0-1.7 1l-2.5-1-2 3.5L6.4 11a7.9 7.9 0 0 0 0 2l-2.1 1.6 2 3.5 2.5-1a7.7 7.7 0 0 0 1.7 1l.4 2.6h4l.4-2.6a7.7 7.7 0 0 0 1.7-1l2.5 1 2-3.5L19.4 13Zm-7.4 2.5a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.4 13a7.9 7.9 0 0 0 0-2l2.1-1.6-2-3.5-2.5 1a7.7 7.7 0 0 0-1.7-1L14.9 3.3h-4L10.5 5.9a7.7 7.7 0 0 0-1.7 1l-2.5-1-2 3.5L6.4 11a7.9 7.9 0 0 0 0 2l-2.1 1.6 2 3.5 2.5-1a7.7 7.7 0 0 0 1.7 1l.4 2.6h4l.4-2.6a7.7 7.7 0 0 0 1.7-1l2.5 1 2-3.5L19.4 13Zm-7.4 2.5a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Z'/%3E%3C/svg%3E"); }
.fl-icon-user[b-3ascedb6k5] { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm-9 9a9 9 0 1 1 18 0H3Z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm-9 9a9 9 0 1 1 18 0H3Z'/%3E%3C/svg%3E"); }
/* Experimental Chat Room feature (docs/ChatRoom-Feature.md): speech-bubble icon + "Experimental" pill. */
.fl-icon-chat[b-3ascedb6k5] { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 3h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H9l-5 4v-4H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Zm3 5.5h10v-2H7v2Zm0 4h7v-2H7v2Z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 3h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H9l-5 4v-4H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Zm3 5.5h10v-2H7v2Zm0 4h7v-2H7v2Z'/%3E%3C/svg%3E"); }

.fl-nav-badge[b-3ascedb6k5] {
    margin-left: 0.45rem;
    font-size: 0.56rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.14rem 0.42rem;
    border-radius: 999px;
    color: #ffc46b;
    background: rgba(255, 159, 28, 0.14);
    border: 1px solid rgba(255, 159, 28, 0.4);
    vertical-align: middle;
}

.fl-avatar[b-3ascedb6k5] {
    width: 31px;
    height: 31px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: radial-gradient(circle at 30% 25%, #ffd08a, #356b54 45%, #212126 100%);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.28);
    font-size: 0.68rem;
    font-weight: 800;
}

.fl-user-name[b-3ascedb6k5] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fl-account[b-3ascedb6k5] {
    margin-top: auto;
    padding: 0.8rem 0.9rem 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.055);
}

.fl-user[b-3ascedb6k5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    color: #fff;
    font-weight: 700;
}

.fl-avatar-user[b-3ascedb6k5] {
    background: linear-gradient(135deg, #ff5a2f, #ffb11f);
}

.fl-logout[b-3ascedb6k5] {
    width: 100%;
    margin-top: 0.55rem;
    border: 1px solid var(--border-subtle);
    border-radius: 9px;
    background: #1d1d1f;
    color: var(--text-muted);
    min-height: 34px;
    font-weight: 700;
}

.fl-logout:hover[b-3ascedb6k5] {
    color: var(--accent);
    border-color: rgba(255, 159, 28, 0.45);
}

.fl-sidebar.is-collapsed .fl-brand-text[b-3ascedb6k5],
.fl-sidebar.is-collapsed .fl-label[b-3ascedb6k5],
.fl-sidebar.is-collapsed .fl-user-name[b-3ascedb6k5],
.fl-sidebar.is-collapsed .fl-logout[b-3ascedb6k5] {
    display: none;
}

.fl-sidebar.is-collapsed .fl-brand-row[b-3ascedb6k5],
.fl-sidebar.is-collapsed .fl-primary-nav[b-3ascedb6k5],
.fl-sidebar.is-collapsed .fl-account[b-3ascedb6k5] {
    padding-left: 0.55rem;
    padding-right: 0.55rem;
}

.fl-sidebar.is-collapsed .fl-brand-row[b-3ascedb6k5] {
    justify-content: center;
    flex-direction: column;
    height: 86px;
    gap: 0.25rem;
}

.fl-sidebar.is-collapsed .fl-nav-link[b-3ascedb6k5],
.fl-sidebar.is-collapsed .fl-auth-link[b-3ascedb6k5] {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
}

.fl-sidebar.is-collapsed .fl-nav-link.active[b-3ascedb6k5]::before {
    left: -0.55rem;
}

/* Mobile drawer chrome — hidden on desktop, activated in the media query below. */
.fl-mobile-topbar[b-3ascedb6k5] {
    display: none;
}

.fl-backdrop[b-3ascedb6k5] {
    display: none;
}

@media (max-width: 760px) {
    /* Compact sticky top bar: hamburger + brand. Sits in normal flow so content stacks below it. */
    .fl-mobile-topbar[b-3ascedb6k5] {
        position: sticky;
        top: 0;
        z-index: 45;
        display: flex;
        align-items: center;
        gap: 0.6rem;
        height: 56px;
        padding: 0 0.75rem;
        background: #101011;
        border-bottom: 1px solid var(--border-subtle);
    }

    .fl-hamburger[b-3ascedb6k5] {
        flex: 0 0 auto;
        width: 44px;
        height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 0;
        border-radius: 8px;
        background: transparent;
        color: #d9dce5;
        cursor: pointer;
    }

    .fl-hamburger:hover[b-3ascedb6k5],
    .fl-hamburger:focus-visible[b-3ascedb6k5] {
        color: #fff;
        background: rgba(255, 255, 255, 0.06);
        outline: none;
    }

    .fl-hamburger-bars[b-3ascedb6k5] {
        width: 22px;
        height: 22px;
        background-color: currentColor;
        mask-repeat: no-repeat;
        mask-position: center;
        mask-size: 22px 22px;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center;
        -webkit-mask-size: 22px 22px;
        mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 6h18v2H3V6Zm0 5h18v2H3v-2Zm0 5h18v2H3v-2Z'/%3E%3C/svg%3E");
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 6h18v2H3V6Zm0 5h18v2H3v-2Zm0 5h18v2H3v-2Z'/%3E%3C/svg%3E");
    }

    .fl-mobile-topbar .fl-brand[b-3ascedb6k5] {
        font-size: 1.2rem;
    }

    /* Dimmed overlay behind the open drawer. */
    .fl-backdrop[b-3ascedb6k5] {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 40;
        background: rgba(0, 0, 0, 0.5);
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.25s ease, visibility 0.25s ease;
    }

    .fl-backdrop.is-open[b-3ascedb6k5] {
        opacity: 1;
        visibility: visible;
    }

    /* Sidebar becomes an off-canvas drawer sliding in from the left. */
    .fl-sidebar[b-3ascedb6k5],
    .fl-sidebar.is-collapsed[b-3ascedb6k5] {
        position: fixed;
        top: 0;
        left: 0;
        width: min(300px, 82vw);
        height: 100vh;
        height: 100dvh;
        transform: translateX(-100%);
        transition: transform 0.25s ease;
        z-index: 50;
        overflow-y: auto;
        border-right: 1px solid var(--border-subtle);
    }

    .fl-sidebar.is-mobile-open[b-3ascedb6k5] {
        transform: translateX(0);
    }

    /* The desktop collapse toggle is meaningless on mobile — the hamburger replaces it. */
    .fl-collapse-btn[b-3ascedb6k5] {
        display: none;
    }
}

/*
   Blazor NavLink renders its own <a> element inside this component. With CSS isolation,
   ::deep is required so the sidebar styles apply to those generated anchors instead of
   falling back to global underlined link styles.
*/
.fl-sidebar[b-3ascedb6k5]  a,
.fl-sidebar[b-3ascedb6k5]  a:hover,
.fl-sidebar[b-3ascedb6k5]  a:focus,
.fl-sidebar[b-3ascedb6k5]  a:active,
.fl-sidebar[b-3ascedb6k5]  a:visited {
    text-decoration: none;
}

.fl-sidebar[b-3ascedb6k5]  .fl-nav-link,
.fl-sidebar[b-3ascedb6k5]  .fl-auth-link {
    position: relative;
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 0.95rem;
    padding: 0 1rem;
    border: 1px solid transparent;
    border-radius: 9px;
    color: #cdd2dc;
    background: transparent;
    font-weight: 650;
    line-height: 1;
    white-space: nowrap;
    outline: none;
    box-shadow: inset 0 0 0 1px transparent;
    transition:
        color 0.16s ease,
        background 0.16s ease,
        border-color 0.16s ease,
        box-shadow 0.16s ease,
        transform 0.16s ease;
}

.fl-sidebar[b-3ascedb6k5]  .fl-nav-link:hover,
.fl-sidebar[b-3ascedb6k5]  .fl-auth-link:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.055);
    border-color: rgba(255, 255, 255, 0.035);
    transform: translateX(2px);
}

.fl-sidebar[b-3ascedb6k5]  .fl-nav-link:hover .fl-icon,
.fl-sidebar[b-3ascedb6k5]  .fl-auth-link:hover .fl-icon {
    color: #d9d9dd;
}

.fl-sidebar[b-3ascedb6k5]  .fl-nav-link:focus-visible,
.fl-sidebar[b-3ascedb6k5]  .fl-auth-link:focus-visible {
    outline: 2px solid rgba(255, 159, 28, 0.7);
    outline-offset: 2px;
}

.fl-sidebar[b-3ascedb6k5]  .fl-nav-link.active,
.fl-sidebar[b-3ascedb6k5]  .fl-auth-link.active {
    color: #fff;
    background: linear-gradient(90deg, rgba(43, 29, 10, 0.98), rgba(35, 25, 12, 0.96));
    border-color: rgba(255, 255, 255, 0.58);
    box-shadow:
        inset 0 0 0 1px rgba(255, 159, 28, 0.12),
        0 12px 28px rgba(0, 0, 0, 0.22);
}

.fl-sidebar[b-3ascedb6k5]  .fl-nav-link.active::before {
    content: "";
    position: absolute;
    left: -0.9rem;
    top: 12px;
    bottom: 12px;
    width: 4px;
    border-radius: 999px;
    background: linear-gradient(180deg, #ffb11f, #ff7a18);
    box-shadow: 0 0 14px rgba(255, 159, 28, 0.65);
}

.fl-sidebar[b-3ascedb6k5]  .fl-nav-link.active .fl-icon,
.fl-sidebar[b-3ascedb6k5]  .fl-auth-link.active .fl-icon,
.fl-sidebar[b-3ascedb6k5]  .fl-nav-link.active .fl-label,
.fl-sidebar[b-3ascedb6k5]  .fl-auth-link.active .fl-label {
    color: var(--accent);
}

.fl-sidebar.is-collapsed[b-3ascedb6k5]  .fl-nav-link,
.fl-sidebar.is-collapsed[b-3ascedb6k5]  .fl-auth-link {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}

.fl-sidebar.is-collapsed[b-3ascedb6k5]  .fl-nav-link.active::before {
    left: -0.55rem;
}

.fl-sidebar.is-collapsed[b-3ascedb6k5]  .fl-nav-link:hover,
.fl-sidebar.is-collapsed[b-3ascedb6k5]  .fl-auth-link:hover {
    transform: none;
}
/* /Pages/ApiTestPage.razor.rz.scp.css */
.fl-page-toolbar h1[b-d2ls3hhq73] {
    color: #fff;
}

.grid-scroll[b-d2ls3hhq73] {
    max-height: 50vh;
    overflow: auto;
    padding: 0;
    border: 1px solid var(--border, #2a2a31);
    border-radius: 0.5rem;
}

.model-grid[b-d2ls3hhq73] {
    font-size: 0.85rem;
    width: 100%;
    /* Dark-mode Bootstrap table variables so body rows match the surrounding theme. */
    --bs-table-bg: transparent;
    --bs-table-color: #e6e6ea;
    --bs-table-border-color: #2a2a31;
    --bs-table-hover-bg: rgba(255, 255, 255, 0.06);
    --bs-table-hover-color: #fff;
    color: #e6e6ea;
}

/* Sticky header + filter rows so they stay visible while scrolling the list. */
.model-grid thead th[b-d2ls3hhq73] {
    position: sticky;
    background: var(--bg-elevated, #1b1b1f);
    color: #fff;
    border-bottom-color: #2a2a31;
    z-index: 2;
}

.model-grid thead tr:first-child th[b-d2ls3hhq73] {
    top: 0;
}

.model-grid thead tr.filter-row th[b-d2ls3hhq73] {
    top: 2.25rem;
    z-index: 1;
}

.model-grid th.sortable[b-d2ls3hhq73] {
    cursor: pointer;
    white-space: nowrap;
    user-select: none;
}

.sort-ind[b-d2ls3hhq73] {
    margin-left: 0.25rem;
    color: var(--accent, #ff9f1c);
    font-size: 0.75rem;
}

/* Dark inputs (filter row + request controls). */
.form-control[b-d2ls3hhq73] {
    background-color: #16161a;
    color: #e6e6ea;
    border-color: #2a2a31;
}

.form-control:focus[b-d2ls3hhq73] {
    background-color: #16161a;
    color: #fff;
    border-color: var(--accent, #ff9f1c);
    box-shadow: 0 0 0 0.15rem rgba(255, 159, 28, 0.25);
}

.form-control[b-d2ls3hhq73]::placeholder {
    color: #7a7a85;
}

.form-label[b-d2ls3hhq73] {
    color: #c7c7d1;
}

.filter-row .form-control[b-d2ls3hhq73] {
    min-width: 6rem;
    font-size: 0.75rem;
}

.model-grid td.mono[b-d2ls3hhq73],
.model-grid td.num[b-d2ls3hhq73],
.mono[b-d2ls3hhq73] {
    font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
}

.model-grid td.num[b-d2ls3hhq73] {
    text-align: right;
    white-space: nowrap;
}

.model-grid td.desc-col[b-d2ls3hhq73] {
    min-width: 22rem;
    max-width: 38rem;
}

.model-grid tbody tr[b-d2ls3hhq73] {
    cursor: pointer;
}

.model-grid tbody tr.selected-row[b-d2ls3hhq73],
.model-grid tbody tr.selected-row:hover[b-d2ls3hhq73] {
    background: rgba(255, 159, 28, 0.18);
    --bs-table-hover-bg: rgba(255, 159, 28, 0.18);
    color: #fff;
}

.select-col[b-d2ls3hhq73] {
    width: 2.25rem;
    text-align: center;
}

.response-text[b-d2ls3hhq73] {
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 28rem;
    overflow: auto;
    margin: 0;
    color: #e6e6ea;
}

h5[b-d2ls3hhq73] {
    color: #fff;
}

.meta-list[b-d2ls3hhq73] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.25rem 0.75rem;
}

.meta-list dt[b-d2ls3hhq73] {
    font-weight: 600;
    color: var(--text-secondary, #9aa);
}

.meta-list dd[b-d2ls3hhq73] {
    margin: 0;
    color: #e6e6ea;
    word-break: break-word;
}
/* /Pages/ChatRoom/CharacterImportDialog.razor.rz.scp.css */
/* EXPERIMENTAL Chat Room feature — removal recipe in docs/ChatRoom-Feature.md. */

.cr-dialog-backdrop[b-sm17br3rjr] {
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.cr-dialog[b-sm17br3rjr] {
    width: min(560px, 100%);
    max-height: min(78vh, 640px);
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 1.1rem 1.2rem 1.2rem;
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    background: var(--bg-panel, #161618);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

.cr-dialog-header[b-sm17br3rjr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
}

.cr-dialog-header h3[b-sm17br3rjr] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 800;
}

.cr-dialog-hint[b-sm17br3rjr] {
    color: var(--text-muted);
    font-size: 0.83rem;
    margin: 0;
}

.cr-icon-btn[b-sm17br3rjr] {
    border: 0;
    background: transparent;
    color: var(--text-muted);
    font-size: 0.95rem;
    padding: 0.15rem 0.4rem;
    border-radius: 6px;
    cursor: pointer;
}

.cr-icon-btn:hover[b-sm17br3rjr] {
    color: #fff;
    background: rgba(255, 255, 255, 0.07);
}

.cr-dialog-controls[b-sm17br3rjr] {
    display: flex;
    gap: 0.5rem;
}

.cr-dialog-search[b-sm17br3rjr] {
    flex: 1 1 auto;
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: var(--border-subtle);
}

.cr-dialog-search:focus[b-sm17br3rjr] {
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: rgba(255, 159, 28, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(255, 159, 28, 0.12);
}

.cr-dialog-sort[b-sm17br3rjr] {
    flex: 0 0 auto;
    width: auto;
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: var(--border-subtle);
}

.cr-character-row-session[b-sm17br3rjr] {
    color: var(--text-muted);
    font-weight: 400;
}

.cr-dialog-loading[b-sm17br3rjr],
.cr-dialog-empty[b-sm17br3rjr] {
    padding: 2rem 0.5rem;
    text-align: center;
    color: var(--text-muted);
}

.cr-dialog-back[b-sm17br3rjr] {
    align-self: flex-start;
    border: 0;
    background: transparent;
    color: var(--accent);
    font-weight: 700;
    font-size: 0.9rem;
    padding: 0.15rem 0.2rem;
    cursor: pointer;
}

.cr-dialog-list[b-sm17br3rjr] {
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    scrollbar-width: thin;
    padding-right: 0.2rem;
}

.cr-session-row[b-sm17br3rjr] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
    text-align: left;
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--border-subtle);
    border-radius: 10px;
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    cursor: pointer;
    transition: border-color 0.15s ease;
}

.cr-session-row:hover[b-sm17br3rjr] {
    border-color: rgba(255, 159, 28, 0.5);
}

.cr-session-row-title[b-sm17br3rjr] {
    font-weight: 800;
}

.cr-session-row-meta[b-sm17br3rjr] {
    color: var(--text-muted);
    font-size: 0.78rem;
}

.cr-character-row[b-sm17br3rjr] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--border-subtle);
    border-radius: 10px;
    background: var(--bg-card, #1d1d1f);
}

.cr-character-row.is-disabled[b-sm17br3rjr] {
    opacity: 0.55;
}

.cr-character-row-info[b-sm17br3rjr] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1 1 auto;
}

.cr-character-row-name[b-sm17br3rjr] {
    font-weight: 800;
}

.cr-character-row-meta[b-sm17br3rjr] {
    color: var(--accent);
    font-size: 0.74rem;
    font-weight: 700;
}

.cr-character-row-desc[b-sm17br3rjr] {
    color: var(--text-muted);
    font-size: 0.78rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.cr-typing[b-sm17br3rjr] {
    display: inline-flex;
    gap: 5px;
    align-items: center;
}

.cr-typing span[b-sm17br3rjr] {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--text-muted);
    animation: cr-typing-bounce-b-sm17br3rjr 1.2s infinite ease-in-out;
}

.cr-typing span:nth-child(2)[b-sm17br3rjr] { animation-delay: 0.15s; }
.cr-typing span:nth-child(3)[b-sm17br3rjr] { animation-delay: 0.3s; }

@keyframes cr-typing-bounce-b-sm17br3rjr {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.45; }
    30% { transform: translateY(-4px); opacity: 1; }
}
/* /Pages/ChatRoom/ChatRoomAvatar.razor.rz.scp.css */
.cr-avatar[b-lkwnd61fkt] {
    flex: 0 0 auto;
    border-radius: 999px;
    object-fit: cover;
    border: 2px solid rgba(255, 255, 255, 0.22);
    background: #1d1d1f;
}

.cr-avatar-initials[b-lkwnd61fkt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at 30% 25%, #ffd08a, #356b54 45%, #212126 100%);
    color: #fff;
    font-weight: 800;
    line-height: 1;
    user-select: none;
}
/* /Pages/ChatRoom/ChatRoomListPage.razor.rz.scp.css */
/* EXPERIMENTAL Chat Room feature — removal recipe in docs/ChatRoom-Feature.md. */

.cr-page[b-m2iiryq2o0] {
    max-width: 1080px;
    margin-inline: auto;
}

.cr-page-header[b-m2iiryq2o0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.35rem;
}

.cr-page-title-row[b-m2iiryq2o0] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.cr-page-title[b-m2iiryq2o0] {
    margin: 0;
    font-size: 1.55rem;
    font-weight: 800;
}

.cr-page-subtitle[b-m2iiryq2o0] {
    color: var(--text-muted);
    max-width: 62ch;
    margin-bottom: 1.4rem;
}

.cr-experimental-chip[b-m2iiryq2o0] {
    flex: 0 0 auto;
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.18rem 0.5rem;
    border-radius: 999px;
    color: #ffc46b;
    background: rgba(255, 159, 28, 0.14);
    border: 1px solid rgba(255, 159, 28, 0.4);
}

.cr-room-grid[b-m2iiryq2o0] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 1rem;
}

.cr-room-card[b-m2iiryq2o0] {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    padding: 1rem 1.05rem;
    border: 1px solid var(--border-subtle);
    border-radius: 13px;
    background: var(--bg-card, #1d1d1f);
    cursor: pointer;
    transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.cr-room-card:hover[b-m2iiryq2o0] {
    border-color: rgba(255, 159, 28, 0.45);
    transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.25);
}

.cr-room-card-top[b-m2iiryq2o0] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}

.cr-room-card-title[b-m2iiryq2o0] {
    margin: 0;
    font-size: 1.02rem;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cr-icon-btn[b-m2iiryq2o0] {
    flex: 0 0 auto;
    border: 0;
    background: transparent;
    color: var(--text-muted);
    font-size: 0.85rem;
    padding: 0.15rem 0.4rem;
    border-radius: 6px;
    cursor: pointer;
    line-height: 1.2;
}

.cr-icon-btn:hover[b-m2iiryq2o0] {
    color: #fff;
    background: rgba(255, 255, 255, 0.07);
}

.cr-delete-btn:hover[b-m2iiryq2o0] {
    color: #ff8f8f;
}

.cr-room-card-avatars[b-m2iiryq2o0] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 36px;
    flex-wrap: wrap;
}

.cr-room-card-empty[b-m2iiryq2o0] {
    color: var(--text-muted);
    font-size: 0.85rem;
    font-style: italic;
}

.cr-room-card-more[b-m2iiryq2o0] {
    color: var(--text-muted);
    font-size: 0.8rem;
    font-weight: 700;
}

.cr-room-card-meta[b-m2iiryq2o0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    color: var(--text-muted);
    font-size: 0.78rem;
}

.cr-empty-state[b-m2iiryq2o0] {
    margin: 3rem auto;
    text-align: center;
    color: var(--text-muted);
    max-width: 420px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
}

.cr-empty-icon[b-m2iiryq2o0] {
    font-size: 2.2rem;
}

.cr-typing[b-m2iiryq2o0] {
    display: inline-flex;
    gap: 5px;
    align-items: center;
}

.cr-typing span[b-m2iiryq2o0] {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--text-muted);
    animation: cr-typing-bounce-b-m2iiryq2o0 1.2s infinite ease-in-out;
}

.cr-typing span:nth-child(2)[b-m2iiryq2o0] { animation-delay: 0.15s; }
.cr-typing span:nth-child(3)[b-m2iiryq2o0] { animation-delay: 0.3s; }

@keyframes cr-typing-bounce-b-m2iiryq2o0 {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.45; }
    30% { transform: translateY(-4px); opacity: 1; }
}
/* /Pages/ChatRoom/ChatRoomMemorySyncDialog.razor.rz.scp.css */
/* EXPERIMENTAL Chat Room feature — removal recipe in docs/ChatRoom-Feature.md. */

.cr-dialog-backdrop[b-o9i1d6y6ta] {
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.cr-dialog[b-o9i1d6y6ta] {
    width: min(560px, 100%);
    max-height: min(78vh, 640px);
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    padding: 1.1rem 1.2rem 1.2rem;
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    background: var(--bg-panel, #161618);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

.cr-dialog-header[b-o9i1d6y6ta] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
}

.cr-dialog-header h3[b-o9i1d6y6ta] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 800;
}

.cr-icon-btn[b-o9i1d6y6ta] {
    border: 0;
    background: transparent;
    color: var(--text-muted);
    font-size: 0.95rem;
    padding: 0.15rem 0.4rem;
    border-radius: 6px;
    cursor: pointer;
}

.cr-icon-btn:hover[b-o9i1d6y6ta] {
    color: #fff;
    background: rgba(255, 255, 255, 0.07);
}

.cr-sync-warning[b-o9i1d6y6ta] {
    font-size: 0.85rem;
    line-height: 1.5;
    color: #ffd9a8;
    background: rgba(229, 130, 40, 0.12);
    border: 1px solid rgba(229, 130, 40, 0.4);
    border-radius: 10px;
    padding: 0.7rem 0.85rem;
}

.cr-sync-warning code[b-o9i1d6y6ta] {
    color: #ffc46b;
    background: rgba(0, 0, 0, 0.25);
    padding: 0.05rem 0.3rem;
    border-radius: 4px;
}

.cr-dialog-loading[b-o9i1d6y6ta],
.cr-dialog-empty[b-o9i1d6y6ta] {
    padding: 2rem 0.5rem;
    text-align: center;
    color: var(--text-muted);
}

.cr-dialog-list[b-o9i1d6y6ta] {
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    scrollbar-width: thin;
    padding-right: 0.2rem;
}

.cr-character-row[b-o9i1d6y6ta] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--border-subtle);
    border-radius: 10px;
    background: var(--bg-card, #1d1d1f);
}

.cr-character-row-info[b-o9i1d6y6ta] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1 1 auto;
}

.cr-character-row-name[b-o9i1d6y6ta] {
    font-weight: 800;
}

.cr-character-row-meta[b-o9i1d6y6ta] {
    color: var(--text-muted);
    font-size: 0.78rem;
}

.cr-sync-unavailable[b-o9i1d6y6ta] {
    color: #ff8f8f;
    font-style: italic;
}

.cr-sync-result[b-o9i1d6y6ta] {
    font-size: 0.78rem;
    color: #8fe388;
    margin-top: 0.15rem;
}

.cr-typing[b-o9i1d6y6ta] {
    display: inline-flex;
    gap: 5px;
    align-items: center;
}

.cr-typing span[b-o9i1d6y6ta] {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--text-muted);
    animation: cr-typing-bounce-b-o9i1d6y6ta 1.2s infinite ease-in-out;
}

.cr-typing span:nth-child(2)[b-o9i1d6y6ta] { animation-delay: 0.15s; }
.cr-typing span:nth-child(3)[b-o9i1d6y6ta] { animation-delay: 0.3s; }

@keyframes cr-typing-bounce-b-o9i1d6y6ta {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.45; }
    30% { transform: translateY(-4px); opacity: 1; }
}
/* /Pages/ChatRoom/ChatRoomPage.razor.rz.scp.css */
/* EXPERIMENTAL Chat Room feature — removal recipe in docs/ChatRoom-Feature.md. */

/* ── Shell: header / scrolling chat pane / composer ─────────────────────── */

.cr-room-shell[b-ofp3azs4b5] {
    display: flex;
    flex-direction: column;
    /* MainLayout's .content adds 1.5rem padding top AND bottom (3rem total) — subtract slightly
       more so the shell never pushes the page into an outer scrollbar. */
    height: calc(100dvh - 3.1rem);
    min-height: 420px;
    max-width: 980px;
    margin-inline: auto;
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    background: var(--bg-panel, #161618);
    overflow: hidden;
}

.cr-room-header[b-ofp3azs4b5] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.7rem 1rem;
    border-bottom: 1px solid var(--border-subtle);
    background: rgba(255, 255, 255, 0.02);
    flex-wrap: wrap;
}

.cr-back-btn[b-ofp3azs4b5] {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    border: 1px solid var(--border-subtle);
    color: var(--text-muted);
    text-decoration: none;
    font-size: 1.3rem;
    line-height: 1;
}

.cr-back-btn:hover[b-ofp3azs4b5] {
    color: var(--accent);
    border-color: rgba(255, 159, 28, 0.45);
}

.cr-room-title-block[b-ofp3azs4b5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.cr-room-title[b-ofp3azs4b5] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 800;
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cr-rename-input[b-ofp3azs4b5] {
    width: 240px;
    height: 34px;
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: var(--border-subtle);
}

.cr-experimental-chip[b-ofp3azs4b5] {
    flex: 0 0 auto;
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.18rem 0.5rem;
    border-radius: 999px;
    color: #ffc46b;
    background: rgba(255, 159, 28, 0.14);
    border: 1px solid rgba(255, 159, 28, 0.4);
}

.cr-icon-btn[b-ofp3azs4b5] {
    flex: 0 0 auto;
    border: 0;
    background: transparent;
    color: var(--text-muted);
    font-size: 0.95rem;
    padding: 0.15rem 0.35rem;
    border-radius: 6px;
    cursor: pointer;
    line-height: 1;
}

.cr-icon-btn:hover[b-ofp3azs4b5] {
    color: var(--accent);
    background: rgba(255, 255, 255, 0.06);
}

/* ── Reply-style picker ─────────────────────────────────────────────────── */

.cr-header-controls[b-ofp3azs4b5] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-left: auto;
    flex-wrap: wrap;
}

.cr-style-picker[b-ofp3azs4b5] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.cr-style-select[b-ofp3azs4b5] {
    max-width: 200px;
}

.cr-style-label[b-ofp3azs4b5] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
}

.cr-style-select[b-ofp3azs4b5] {
    width: auto;
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: var(--border-subtle);
    font-size: 0.82rem;
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

.cr-style-select:focus[b-ofp3azs4b5] {
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: rgba(255, 159, 28, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(255, 159, 28, 0.12);
}

/* ── Participant bar ────────────────────────────────────────────────────── */

.cr-participant-bar[b-ofp3azs4b5] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
}

.cr-participant[b-ofp3azs4b5] {
    position: relative;
}

.cr-participant-remove[b-ofp3azs4b5] {
    position: absolute;
    top: -6px;
    right: -6px;
    width: 18px;
    height: 18px;
    display: none;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    background: #2a2a2d;
    color: #ddd;
    font-size: 0.62rem;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}

.cr-participant:hover .cr-participant-remove[b-ofp3azs4b5] {
    display: inline-flex;
}

.cr-participant-remove:hover[b-ofp3azs4b5] {
    color: #fff;
    background: var(--danger, #c0392b);
}

.cr-add-participant[b-ofp3azs4b5] {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: 1px dashed rgba(255, 255, 255, 0.35);
    background: transparent;
    color: var(--text-muted);
    font-size: 1.2rem;
    line-height: 1;
    cursor: pointer;
}

.cr-add-participant:hover[b-ofp3azs4b5] {
    color: var(--accent);
    border-color: rgba(255, 159, 28, 0.6);
}

.cr-sync-btn[b-ofp3azs4b5] {
    flex: 0 0 auto;
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    background: transparent;
    color: var(--text-muted);
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.28rem 0.6rem;
    cursor: pointer;
    white-space: nowrap;
}

.cr-sync-btn:hover[b-ofp3azs4b5] {
    color: #ffd9a8;
    border-color: rgba(229, 130, 40, 0.5);
    background: rgba(229, 130, 40, 0.08);
}

/* ── Voice bar (Voice mode: per-character voice picker chips) ───────────── */

.cr-voice-bar[b-ofp3azs4b5] {
    flex-basis: 100%;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
    padding-top: 0.15rem;
}

.cr-voice-chip[b-ofp3azs4b5] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid var(--border-subtle);
    border-radius: 999px;
    background: transparent;
    color: var(--text-primary);
    font-size: 0.78rem;
    font-weight: 700;
    padding: 0.22rem 0.65rem;
    cursor: pointer;
}

.cr-voice-chip:hover[b-ofp3azs4b5] {
    border-color: rgba(255, 159, 28, 0.55);
}

.cr-voice-chip-voice[b-ofp3azs4b5] {
    color: var(--accent);
    font-weight: 600;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Chat pane ──────────────────────────────────────────────────────────── */

.cr-chat-pane[b-ofp3azs4b5] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 1rem 1.1rem 0.6rem;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    scrollbar-width: thin;
}

.cr-alert[b-ofp3azs4b5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin: 0.6rem 1rem 0;
}

.cr-day-separator[b-ofp3azs4b5] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    color: var(--text-muted);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0.4rem 0 0.1rem;
}

.cr-day-separator[b-ofp3azs4b5]::before,
.cr-day-separator[b-ofp3azs4b5]::after {
    content: "";
    flex: 1 1 auto;
    height: 1px;
    background: var(--border-subtle);
}

.cr-exchange[b-ofp3azs4b5] {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

/* User message: right-aligned accent bubble. */
.cr-user-row[b-ofp3azs4b5] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 0.5rem;
}

.cr-timestamp[b-ofp3azs4b5] {
    flex: 0 0 auto;
    font-size: 0.68rem;
    color: var(--text-muted);
    opacity: 0.8;
}

.cr-bubble[b-ofp3azs4b5] {
    max-width: min(72ch, 78%);
    padding: 0.55rem 0.8rem;
    border-radius: 14px;
    font-size: 0.95rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
    white-space: normal;
}

.cr-bubble-user[b-ofp3azs4b5] {
    background: linear-gradient(135deg, rgba(255, 122, 24, 0.24), rgba(255, 159, 28, 0.16));
    border: 1px solid rgba(255, 159, 28, 0.4);
    border-bottom-right-radius: 4px;
    color: var(--text-primary);
}

/* Character messages: avatar column + stacked bubbles. */
.cr-speaker-group[b-ofp3azs4b5] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
}

.cr-speaker-avatar-col[b-ofp3azs4b5] {
    flex: 0 0 auto;
    padding-top: 2px;
}

.cr-speaker-messages[b-ofp3azs4b5] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.28rem;
    min-width: 0;
}

.cr-speaker-name[b-ofp3azs4b5] {
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.02em;
}

/* Voice mode: icon row at the end of each bubble, aligned to its trailing edge. */
.cr-bubble-actions[b-ofp3azs4b5] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.35rem;
    opacity: 0.45;
    transition: opacity 0.12s ease;
}

.cr-bubble:hover .cr-bubble-actions[b-ofp3azs4b5] {
    opacity: 1;
}

.cr-tts-inspect[b-ofp3azs4b5] {
    font-size: 0.72rem;
    cursor: help;
    line-height: 1;
}

.cr-bubble-action-btn[b-ofp3azs4b5] {
    border: 0;
    background: transparent;
    color: inherit;
    font-size: 0.7rem;
    cursor: pointer;
    padding: 0 0.1rem;
    line-height: 1;
}

.cr-bubble-action-btn:hover[b-ofp3azs4b5] {
    color: var(--accent);
}

.cr-bubble-character[b-ofp3azs4b5] {
    background: var(--bg-card, #1d1d1f);
    border: 1px solid var(--border-subtle);
    border-top-left-radius: 4px;
}

/* Injected via MarkupString → needs ::deep to escape CSS isolation. */
.cr-bubble[b-ofp3azs4b5]  .cr-quote {
    color: #f3b250;
}

.cr-bubble[b-ofp3azs4b5]  .cr-emote {
    color: var(--text-muted);
    font-style: italic;
}

/* Typing indicator. */
.cr-avatar-typing[b-ofp3azs4b5] {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #1d1d1f;
    border: 2px solid rgba(255, 255, 255, 0.16);
    color: var(--text-muted);
}

.cr-bubble-typing[b-ofp3azs4b5] {
    padding: 0.7rem 0.9rem;
}

.cr-typing[b-ofp3azs4b5] {
    display: inline-flex;
    gap: 5px;
    align-items: center;
}

.cr-typing span[b-ofp3azs4b5] {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--text-muted);
    animation: cr-typing-bounce-b-ofp3azs4b5 1.2s infinite ease-in-out;
}

.cr-typing span:nth-child(2)[b-ofp3azs4b5] { animation-delay: 0.15s; }
.cr-typing span:nth-child(3)[b-ofp3azs4b5] { animation-delay: 0.3s; }

@keyframes cr-typing-bounce-b-ofp3azs4b5 {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.45; }
    30% { transform: translateY(-4px); opacity: 1; }
}

/* Error row with retry. */
.cr-error-row[b-ofp3azs4b5] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.cr-error-text[b-ofp3azs4b5] {
    color: #ff8f8f;
    font-size: 0.85rem;
}

/* Empty states. */
.cr-empty-state[b-ofp3azs4b5] {
    margin: auto;
    text-align: center;
    color: var(--text-muted);
    max-width: 420px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    padding: 2rem 1rem;
}

.cr-empty-icon[b-ofp3azs4b5] {
    font-size: 2.2rem;
}

/* ── Composer ───────────────────────────────────────────────────────────── */

.cr-composer[b-ofp3azs4b5] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    padding: 0.7rem 1rem 0.85rem;
    border-top: 1px solid var(--border-subtle);
    background: rgba(255, 255, 255, 0.015);
}

.cr-composer-input[b-ofp3azs4b5] {
    flex: 1 1 auto;
    resize: none;
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: var(--border-subtle);
}

.cr-composer-input:focus[b-ofp3azs4b5] {
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: rgba(255, 159, 28, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(255, 159, 28, 0.12);
}

.cr-send-btn[b-ofp3azs4b5] {
    flex: 0 0 auto;
    min-width: 76px;
}

/* ── Mobile ─────────────────────────────────────────────────────────────── */

@media (max-width: 760px) {
    .cr-room-shell[b-ofp3azs4b5] {
        /* Mobile: 56px sticky topbar + .content's 1rem padding top and bottom. */
        height: calc(100dvh - 56px - 2.1rem);
        border-radius: 10px;
    }

    .cr-room-title[b-ofp3azs4b5] {
        max-width: 180px;
    }

    .cr-bubble[b-ofp3azs4b5] {
        max-width: 88%;
    }

    .cr-participant-bar[b-ofp3azs4b5] {
        width: 100%;
        margin-left: 0;
    }
}
/* /Pages/ChatRoom/ChatRoomVoiceDialog.razor.rz.scp.css */
/* EXPERIMENTAL Chat Room feature — removal recipe in docs/ChatRoom-Feature.md. */

.cr-dialog-backdrop[b-i42vpdpi4r] {
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.cr-dialog[b-i42vpdpi4r] {
    width: min(600px, 100%);
    max-height: min(80vh, 680px);
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 1.1rem 1.2rem 1.2rem;
    border: 1px solid var(--border-subtle);
    border-radius: 14px;
    background: var(--bg-panel, #161618);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

.cr-dialog-header[b-i42vpdpi4r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
}

.cr-dialog-header h3[b-i42vpdpi4r] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 800;
}

.cr-dialog-hint[b-i42vpdpi4r] {
    color: var(--text-muted);
    font-size: 0.83rem;
    margin: 0;
}

.cr-icon-btn[b-i42vpdpi4r] {
    border: 0;
    background: transparent;
    color: var(--text-muted);
    font-size: 0.95rem;
    padding: 0.15rem 0.4rem;
    border-radius: 6px;
    cursor: pointer;
}

.cr-icon-btn:hover[b-i42vpdpi4r] {
    color: #fff;
    background: rgba(255, 255, 255, 0.07);
}

.cr-dialog-controls[b-i42vpdpi4r] {
    display: flex;
    gap: 0.5rem;
}

.cr-dialog-search[b-i42vpdpi4r] {
    flex: 1 1 auto;
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: var(--border-subtle);
}

.cr-dialog-search:focus[b-i42vpdpi4r] {
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: rgba(255, 159, 28, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(255, 159, 28, 0.12);
}

.cr-voice-lang[b-i42vpdpi4r] {
    flex: 0 0 auto;
    width: auto;
    background: var(--bg-card, #1d1d1f);
    color: var(--text-primary);
    border-color: var(--border-subtle);
}

/* ── Tag chips (mirrors Fish's voice browser) ───────────────────────────── */

.cr-voice-tags[b-i42vpdpi4r] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.cr-voice-tag[b-i42vpdpi4r] {
    border: 1px solid var(--border-subtle);
    border-radius: 999px;
    background: transparent;
    color: var(--text-muted);
    font-size: 0.76rem;
    font-weight: 600;
    padding: 0.22rem 0.7rem;
    cursor: pointer;
    transition: border-color 0.12s ease, color 0.12s ease, background 0.12s ease;
}

.cr-voice-tag:hover[b-i42vpdpi4r] {
    color: var(--text-primary);
    border-color: rgba(255, 255, 255, 0.35);
}

.cr-voice-tag.is-active[b-i42vpdpi4r] {
    color: #1a1a1c;
    background: var(--accent, #ff9f1c);
    border-color: var(--accent, #ff9f1c);
}

/* ── Voice rows ─────────────────────────────────────────────────────────── */

.cr-dialog-list[b-i42vpdpi4r] {
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    scrollbar-width: thin;
    padding-right: 0.2rem;
}

.cr-voice-row[b-i42vpdpi4r] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--border-subtle);
    border-radius: 10px;
    background: var(--bg-card, #1d1d1f);
}

.cr-voice-row.is-current[b-i42vpdpi4r] {
    border-color: rgba(255, 159, 28, 0.55);
    background: rgba(255, 159, 28, 0.06);
}

.cr-voice-play[b-i42vpdpi4r] {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid var(--border-subtle);
    background: transparent;
    color: var(--text-primary);
    font-size: 0.8rem;
    cursor: pointer;
}

.cr-voice-play:hover:not(:disabled)[b-i42vpdpi4r] {
    color: var(--accent);
    border-color: rgba(255, 159, 28, 0.55);
}

.cr-voice-play:disabled[b-i42vpdpi4r] {
    opacity: 0.35;
    cursor: default;
}

.cr-voice-row-info[b-i42vpdpi4r] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1 1 auto;
}

.cr-voice-row-name[b-i42vpdpi4r] {
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cr-voice-row-meta[b-i42vpdpi4r] {
    color: var(--accent);
    font-size: 0.74rem;
    font-weight: 700;
}

.cr-voice-row-tags[b-i42vpdpi4r] {
    color: var(--text-muted);
    font-size: 0.74rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cr-dialog-loading[b-i42vpdpi4r],
.cr-dialog-empty[b-i42vpdpi4r] {
    padding: 2rem 0.5rem;
    text-align: center;
    color: var(--text-muted);
}

.cr-typing[b-i42vpdpi4r] {
    display: inline-flex;
    gap: 5px;
    align-items: center;
}

.cr-typing span[b-i42vpdpi4r] {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--text-muted);
    animation: cr-typing-bounce-b-i42vpdpi4r 1.2s infinite ease-in-out;
}

.cr-typing span:nth-child(2)[b-i42vpdpi4r] { animation-delay: 0.15s; }
.cr-typing span:nth-child(3)[b-i42vpdpi4r] { animation-delay: 0.3s; }

@keyframes cr-typing-bounce-b-i42vpdpi4r {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.45; }
    30% { transform: translateY(-4px); opacity: 1; }
}
