:root {
    --ws-bg: #0b1016;
    --ws-panel: #101720;
    --ws-panel-soft: #141d27;
    --ws-panel-strong: #0f1720;
    --ws-body-bg:
        radial-gradient(circle at top left, rgba(106, 166, 255, 0.10), transparent 28%),
        radial-gradient(circle at top right, rgba(59, 209, 127, 0.05), transparent 22%),
        linear-gradient(180deg, #0b1016 0%, #091019 100%);
    --ws-panel-bg: linear-gradient(180deg, rgba(16, 23, 32, 0.95), rgba(13, 19, 28, 0.95));
    --ws-main-bg: linear-gradient(180deg, rgba(16, 23, 32, 0.90), rgba(12, 18, 27, 0.94));
    --ws-card-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.012));
    --ws-card-bg-strong: linear-gradient(180deg, rgba(18, 27, 39, 0.96), rgba(12, 18, 27, 0.96));
    --ws-input-bg: rgba(255, 255, 255, 0.03);
    --ws-input-bg-focus: rgba(255, 255, 255, 0.045);
    --ws-option-bg: #101720;
    --ws-option-checked-bg: #1a2533;
    --ws-row-bg: rgba(255, 255, 255, 0.025);
    --ws-row-bg-hover: rgba(106, 166, 255, 0.08);
    --ws-scroll-track: rgba(255, 255, 255, 0.035);
    --ws-scroll-thumb: rgba(106, 166, 255, 0.24);
    --ws-scroll-thumb-hover: rgba(106, 166, 255, 0.38);
    --ws-border: rgba(255, 255, 255, 0.08);
    --ws-border-strong: rgba(255, 255, 255, 0.12);
    --ws-text: #edf3fb;
    --ws-text-soft: #b8c3d1;
    --ws-text-muted: #8391a3;
    --ws-accent: #6aa6ff;
    --ws-success: #3bd17f;
    --ws-warning: #f0b44c;
    --ws-danger: #ff6c73;
    --ws-shadow: 0 18px 56px rgba(0, 0, 0, 0.32);
    --ws-radius-xl: 20px;
    --ws-radius-lg: 16px;
    --ws-radius-md: 12px;
}

body[data-theme="matrix"] {
    --ws-bg: #030806;
    --ws-panel: #07110c;
    --ws-panel-soft: #0b1c13;
    --ws-panel-strong: #030c08;
    --ws-body-bg:
        radial-gradient(circle at 10% 8%, rgba(39, 255, 126, 0.18), transparent 26%),
        radial-gradient(circle at 84% 12%, rgba(0, 255, 209, 0.10), transparent 24%),
        linear-gradient(180deg, #020805 0%, #06120c 58%, #030806 100%);
    --ws-panel-bg: linear-gradient(180deg, rgba(5, 18, 11, 0.96), rgba(3, 12, 8, 0.96));
    --ws-main-bg: linear-gradient(180deg, rgba(6, 20, 13, 0.94), rgba(2, 10, 7, 0.97));
    --ws-card-bg: linear-gradient(180deg, rgba(39, 255, 126, 0.055), rgba(0, 255, 209, 0.018));
    --ws-card-bg-strong: linear-gradient(180deg, rgba(7, 24, 15, 0.98), rgba(4, 14, 9, 0.98));
    --ws-input-bg: rgba(39, 255, 126, 0.045);
    --ws-input-bg-focus: rgba(39, 255, 126, 0.075);
    --ws-option-bg: #06140d;
    --ws-option-checked-bg: #0d2a1a;
    --ws-row-bg: rgba(39, 255, 126, 0.035);
    --ws-row-bg-hover: rgba(39, 255, 126, 0.11);
    --ws-scroll-track: rgba(39, 255, 126, 0.045);
    --ws-scroll-thumb: rgba(39, 255, 126, 0.30);
    --ws-scroll-thumb-hover: rgba(39, 255, 126, 0.48);
    --ws-border: rgba(39, 255, 126, 0.13);
    --ws-border-strong: rgba(39, 255, 126, 0.24);
    --ws-text: #ecfff4;
    --ws-text-soft: #a9eec6;
    --ws-text-muted: #65a97f;
    --ws-accent: #27ff7e;
    --ws-success: #27ff7e;
    --ws-warning: #ffd166;
    --ws-danger: #ff5d7a;
    --ws-shadow: 0 18px 60px rgba(0, 0, 0, 0.48), 0 0 28px rgba(39, 255, 126, 0.06);
}

body[data-theme="daylight"] {
    color-scheme: light;
    --ws-bg: #eef3f8;
    --ws-panel: #ffffff;
    --ws-panel-soft: #f6f8fb;
    --ws-panel-strong: #e8eef6;
    --ws-body-bg:
        radial-gradient(circle at 12% 8%, rgba(41, 98, 255, 0.10), transparent 26%),
        radial-gradient(circle at 86% 10%, rgba(18, 184, 134, 0.10), transparent 24%),
        linear-gradient(180deg, #f7f9fc 0%, #e8eef6 100%);
    --ws-panel-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 248, 251, 0.98));
    --ws-main-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(241, 245, 249, 0.98));
    --ws-card-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 248, 251, 0.94));
    --ws-card-bg-strong: linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(238, 243, 248, 0.98));
    --ws-input-bg: rgba(255, 255, 255, 0.92);
    --ws-input-bg-focus: #ffffff;
    --ws-option-bg: #ffffff;
    --ws-option-checked-bg: #dbeafe;
    --ws-row-bg: rgba(15, 23, 42, 0.035);
    --ws-row-bg-hover: rgba(37, 99, 235, 0.08);
    --ws-scroll-track: rgba(15, 23, 42, 0.07);
    --ws-scroll-thumb: rgba(37, 99, 235, 0.28);
    --ws-scroll-thumb-hover: rgba(37, 99, 235, 0.42);
    --ws-border: rgba(15, 23, 42, 0.11);
    --ws-border-strong: rgba(15, 23, 42, 0.18);
    --ws-text: #111827;
    --ws-text-soft: #334155;
    --ws-text-muted: #64748b;
    --ws-accent: #2563eb;
    --ws-success: #15803d;
    --ws-warning: #b45309;
    --ws-danger: #dc2626;
    --ws-shadow: 0 18px 44px rgba(15, 23, 42, 0.13);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    background: var(--ws-body-bg);
    color: var(--ws-text);
    font-family: 'Inter', sans-serif;
    overflow: hidden;
    transition: background 0.2s ease, color 0.2s ease;
}

body.is-resizing {
    cursor: col-resize;
    user-select: none;
}

.workspace-shell,
.workspace-shell * {
    scrollbar-color: var(--ws-scroll-thumb) var(--ws-scroll-track);
    scrollbar-width: thin;
}

.workspace-shell ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.workspace-shell ::-webkit-scrollbar-track {
    background: var(--ws-scroll-track);
    border-radius: 999px;
}

.workspace-shell ::-webkit-scrollbar-thumb {
    background: var(--ws-scroll-thumb);
    border: 2px solid transparent;
    border-radius: 999px;
    background-clip: padding-box;
}

.workspace-shell ::-webkit-scrollbar-thumb:hover {
    background: var(--ws-scroll-thumb-hover);
    background-clip: padding-box;
}

.workspace-shell ::-webkit-scrollbar-corner {
    background: var(--ws-panel-strong);
}

.workspace-shell {
    --left-panel-width: 300px;
    --right-panel-width: 360px;
    --resizer-width: 2px;
    --shell-gap: 4px;

    min-height: 100vh;
    display: grid;
    grid-template-columns:
        var(--left-panel-width)
        var(--resizer-width)
        minmax(0, 1fr)
        var(--resizer-width)
        var(--right-panel-width);
    gap: var(--shell-gap);
    padding: 8px;
    max-width: 100vw;
}

.workspace-shell.left-collapsed {
    grid-template-columns:
        0
        0
        minmax(0, 1fr)
        var(--resizer-width)
        var(--right-panel-width);
}

.workspace-shell.right-collapsed {
    grid-template-columns:
        var(--left-panel-width)
        var(--resizer-width)
        minmax(0, 1fr)
        0
        0;
}

.workspace-shell.left-collapsed.right-collapsed {
    grid-template-columns:
        0
        0
        minmax(0, 1fr)
        0
        0;
}

.workspace-panel,
.workspace-main {
    min-width: 0;
    height: calc(100vh - 16px);
    min-height: 0;
    border: 1px solid var(--ws-border);
    border-radius: var(--ws-radius-xl);
    box-shadow: var(--ws-shadow);
    overflow: hidden;
    backdrop-filter: blur(12px);
}

.workspace-panel {
    background: var(--ws-panel-bg);
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.workspace-main {
    background: var(--ws-main-bg);
    display: flex;
    flex-direction: column;
}

.workspace-panel.is-collapsed {
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
}

.workspace-resizer {
    width: var(--resizer-width);
    min-height: calc(100vh - 16px);
    border-radius: 999px;
    background: var(--ws-border);
    cursor: col-resize;
    transition: background 0.18s ease, opacity 0.18s ease;
}

.workspace-resizer:hover,
.workspace-resizer.is-active {
    background: rgba(106, 166, 255, 0.55);
}

.workspace-resizer.is-hidden {
    opacity: 0;
    pointer-events: none;
}

.ws-header {
    padding: 14px 16px;
    border-bottom: 1px solid var(--ws-border);
    background: var(--ws-row-bg);
}

body[data-theme="matrix"]::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(rgba(39, 255, 126, 0.035) 50%, transparent 50%),
        linear-gradient(90deg, rgba(39, 255, 126, 0.025), transparent 18%, transparent 82%, rgba(0, 255, 209, 0.018));
    background-size: 100% 4px, 160px 100%;
    opacity: 0.45;
    mix-blend-mode: screen;
}

.workspace-shell {
    position: relative;
    z-index: 1;
}

body[data-theme="matrix"] .workspace-panel,
body[data-theme="matrix"] .workspace-main,
body[data-theme="matrix"] .workspace-card {
    box-shadow: var(--ws-shadow), inset 0 0 0 1px rgba(39, 255, 126, 0.025);
}

body[data-theme="daylight"] .workspace-panel,
body[data-theme="daylight"] .workspace-main,
body[data-theme="daylight"] .workspace-card,
body[data-theme="daylight"] .modal-content.ws-modal {
    backdrop-filter: none;
}

body[data-theme="daylight"] .btn-close-white {
    filter: none;
}

.ws-footer-actions {
    display: grid;
    gap: 10px;
}

.ws-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--ws-text);
    min-width: 0;
}

.ws-brand-mark {
    width: 26px;
    height: 26px;
    border-radius: 9px;
    border: 1px solid rgba(59, 209, 127, 0.28);
    background: radial-gradient(circle at 74% 22%, rgba(59, 209, 127, 0.30), rgba(59, 209, 127, 0.07) 42%, rgba(8, 13, 19, 0.70) 100%);
    box-shadow: 0 0 18px rgba(59, 209, 127, 0.34), inset 0 0 14px rgba(59, 209, 127, 0.08);
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.ws-brand-mark::before {
    content: "";
    width: 17px;
    height: 17px;
    background: linear-gradient(135deg, #b7ffd7 0%, #3bd17f 48%, #20a95e 100%);
    -webkit-mask: url("img/app-indicator.svg") center / contain no-repeat;
    mask: url("img/app-indicator.svg") center / contain no-repeat;
    filter: drop-shadow(0 0 8px rgba(59, 209, 127, 0.72));
}

.ws-brand-title {
    font-weight: 800;
    letter-spacing: 0.04em;
    font-size: 0.90rem;
    line-height: 1.2;
}

.ws-user-card {
    padding: 16px;
    border-bottom: 1px solid var(--ws-border);
}

.ws-kicker {
    font-size: 0.70rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ws-text-muted);
    margin-bottom: 8px;
    font-family: 'JetBrains Mono', monospace;
}

.ws-kicker-no-margin {
    margin-bottom: 0;
}

.ws-user-name {
    font-size: 1.02rem;
    font-weight: 700;
    margin-bottom: 4px;
    line-height: 1.3;
    word-break: break-word;
}

.ws-user-role {
    color: var(--ws-text-soft);
    font-size: 0.88rem;
    margin-bottom: 14px;
    line-height: 1.5;
    word-break: break-word;
}

.ws-status-line {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--ws-text-soft);
    font-size: 0.84rem;
    line-height: 1.4;
}

.ws-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ws-success);
    box-shadow: 0 0 12px rgba(59, 209, 127, 0.55);
    flex: 0 0 auto;
}

.ws-panel-body {
    padding: 14px;
    overflow: auto;
    flex: 1 1 auto;
    min-width: 0;
}

.ws-section {
    margin-bottom: 18px;
}

.ws-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.ws-section-title {
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ws-text-muted);
    margin: 0;
    font-family: 'JetBrains Mono', monospace;
}

.ws-btn-ghost,
.ws-btn-primary,
.ws-btn-soft,
.ws-icon-btn {
    border-radius: 10px;
    font-size: 0.84rem;
    font-weight: 600;
    transition: 0.18s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    line-height: 1.3;
    min-width: 0;
    white-space: normal;
    text-align: center;
}

.ws-btn-ghost {
    padding: 8px 10px;
    border: 1px solid var(--ws-border-strong);
    background: var(--ws-row-bg);
    color: var(--ws-text);
}

.ws-btn-ghost:hover {
    border-color: rgba(106, 166, 255, 0.35);
    background: rgba(106, 166, 255, 0.08);
    color: var(--ws-text);
}

.ws-btn-primary {
    padding: 9px 14px;
    border: 1px solid rgba(106, 166, 255, 0.35);
    background: linear-gradient(180deg, rgba(106, 166, 255, 0.18), rgba(106, 166, 255, 0.10));
    color: var(--ws-text);
}

.ws-btn-primary:hover {
    background: linear-gradient(180deg, rgba(106, 166, 255, 0.24), rgba(106, 166, 255, 0.14));
    color: var(--ws-text);
}

.ws-btn-soft {
    padding: 8px 10px;
    border: 1px solid var(--ws-border);
    background: var(--ws-row-bg);
    color: var(--ws-text-soft);
}

.ws-btn-soft:hover {
    color: var(--ws-text);
    background: var(--ws-row-bg-hover);
}

body[data-theme="engineer"] .theme-switch[data-theme-val="engineer"],
body[data-theme="daylight"] .theme-switch[data-theme-val="daylight"],
body[data-theme="matrix"] .theme-switch[data-theme-val="matrix"] {
    color: var(--ws-text);
    border-color: color-mix(in srgb, var(--ws-accent) 48%, transparent);
    background: color-mix(in srgb, var(--ws-accent) 14%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ws-accent) 16%, transparent);
}

.ws-btn-full {
    width: 100%;
}

.ws-icon-btn {
    min-width: 28px;
    height: 28px;
    padding: 0 8px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    border-radius: 999px;
}

.ws-icon-btn:hover {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.32);
    background: rgba(106, 166, 255, 0.08);
}

.logout-form {
    margin: 0;
}

.workspace-commands-list {
    display: grid;
    gap: 0.65rem;
}

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

.project-folder {
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.015);
    overflow: hidden;
}

.project-folder summary {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 9px 10px;
    cursor: pointer;
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    font-weight: 800;
    list-style: none;
}

.project-folder summary.project-folder-summary-actions {
    grid-template-columns: 24px minmax(0, 1fr) auto auto auto auto;
}

.engineering-intake-modal {
    position: fixed;
    inset: 0;
    z-index: 1085;
}

.ai-msg-service-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 8px 0 2px;
    padding: 9px 10px;
    border: 1px solid rgba(106, 166, 255, .22);
    border-radius: 12px;
    background: rgba(18, 32, 50, .62);
}

.ai-msg-service-actions-hint {
    flex: 1 1 260px;
    color: var(--ws-text-muted);
    font-size: .82rem;
    line-height: 1.35;
}

.ai-msg-action-btn.ai-msg-service-action {
    border-color: rgba(106, 166, 255, .42);
    background: rgba(30, 84, 146, .25);
    color: var(--ws-text);
    font-weight: 800;
}

.ai-msg-action-btn.ai-msg-service-action:hover {
    background: rgba(40, 110, 190, .34);
}

.engineering-intake-modal[hidden] {
    display: none;
}

.engineering-intake-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(3, 8, 18, .72);
    backdrop-filter: blur(6px);
}

.engineering-intake-panel {
    position: relative;
    width: min(980px, calc(100vw - 42px));
    max-height: min(860px, calc(100vh - 42px));
    margin: 21px auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(90, 144, 210, .38);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(12, 23, 38, .98), rgba(7, 14, 25, .98));
    box-shadow: 0 24px 70px rgba(0, 0, 0, .42);
    color: var(--ws-text);
}

.engineering-intake-head,
.engineering-intake-foot {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid rgba(120, 160, 210, .18);
}

.engineering-intake-head h3 {
    margin: 4px 0 6px;
    font-size: 22px;
}

.engineering-intake-head p {
    margin: 0;
    color: var(--ws-text-muted);
    max-width: 760px;
}

.engineering-intake-body {
    overflow: auto;
    padding: 18px 20px;
}

.engineering-intake-note {
    padding: 14px 16px;
    margin-bottom: 16px;
    border: 1px solid rgba(63, 179, 140, .32);
    border-radius: 12px;
    background: rgba(32, 118, 96, .16);
    color: var(--ws-text-soft);
}

.engineering-intake-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.engineering-intake-row {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 14px;
    border: 1px solid rgba(120, 160, 210, .2);
    border-radius: 12px;
    background: rgba(8, 16, 29, .62);
}

.engineering-intake-row:nth-child(4),
.engineering-intake-row:nth-child(n+6) {
    grid-column: 1 / -1;
}

.engineering-intake-label {
    font-weight: 800;
    color: var(--ws-text);
}

.engineering-intake-row small {
    color: var(--ws-text-muted);
    line-height: 1.35;
}

.engineering-intake-input {
    width: 100%;
    min-height: 42px;
    border: 1px solid rgba(120, 160, 210, .28);
    border-radius: 10px;
    background: rgba(3, 10, 20, .86);
    color: var(--ws-text);
    padding: 10px 12px;
    outline: none;
}

textarea.engineering-intake-input {
    min-height: 92px;
    resize: vertical;
}

.engineering-intake-input:focus {
    border-color: rgba(96, 165, 250, .8);
    box-shadow: 0 0 0 3px rgba(96, 165, 250, .14);
}

.engineering-intake-foot {
    align-items: center;
    border-top: 1px solid rgba(120, 160, 210, .18);
    border-bottom: 0;
}

.engineering-intake-status {
    flex: 1;
    color: var(--ws-text-muted);
}

@media (max-width: 760px) {
    .engineering-intake-form {
        grid-template-columns: 1fr;
    }
}

.project-folder-add-btn,
.project-folder-delete-btn,
.project-folder-info-btn {
    width: 28px;
    height: 28px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 108, 115, 0.34);
    border-radius: 8px;
    background: rgba(255, 92, 92, 0.08);
    color: #ff8f95;
    cursor: pointer;
}

.project-folder-add-btn {
    border-color: rgba(82, 214, 139, 0.34);
    background: rgba(82, 214, 139, 0.08);
    color: #83e5aa;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1;
}

.project-folder-add-btn:hover {
    border-color: rgba(82, 214, 139, 0.55);
    background: rgba(82, 214, 139, 0.16);
    color: #d4ffe3;
}

.project-folder-info-btn {
    border-color: rgba(106, 166, 255, 0.26);
    background: rgba(106, 166, 255, 0.07);
    color: rgba(207, 224, 248, 0.86);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    font-weight: 850;
}

.project-folder-info-btn:hover,
.project-folder-info-btn.is-open {
    border-color: rgba(106, 166, 255, 0.48);
    background: rgba(106, 166, 255, 0.14);
    color: #edf6ff;
}

.project-folder-delete-btn svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.project-folder-delete-btn:hover {
    border-color: rgba(255, 108, 115, 0.55);
    background: rgba(255, 108, 115, 0.16);
    color: #ffd0d3;
}

.project-folder summary::-webkit-details-marker {
    display: none;
}

.project-folder summary b {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
}

.project-folder-icon {
    width: 24px;
    height: 24px;
    border: 1px solid rgba(106, 166, 255, 0.16);
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(106, 166, 255, 0.06);
    color: var(--ws-accent);
    font-size: 0.78rem;
}

.project-folder-body {
    display: grid;
    gap: 8px;
    padding: 0 8px 8px;
}

.project-folder-empty {
    border: 1px dashed var(--ws-border);
    border-radius: 12px;
    padding: 10px;
    color: var(--ws-text-muted);
    font-size: 0.76rem;
}

.project-folder summary.is-drop-target,
.project-folder-body.is-drop-target,
.ai-topic-folder summary.is-drop-target {
    border-color: rgba(59, 209, 127, 0.44);
    background: rgba(59, 209, 127, 0.10);
    box-shadow: inset 0 0 0 1px rgba(59, 209, 127, 0.16);
}

.project-folder-body.is-drop-target {
    border-radius: 12px;
    outline: 1px dashed rgba(59, 209, 127, 0.42);
    outline-offset: -4px;
}

.project-item {
    border: 1px solid var(--ws-border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.01));
    border-radius: 14px;
    padding: 11px 11px 10px;
    transition: 0.18s ease;
    min-width: 0;
    cursor: pointer;
}

.project-item[draggable="true"],
.ai-session-item[draggable="true"] {
    cursor: grab;
}

.project-item[draggable="true"]:active,
.ai-session-item[draggable="true"]:active {
    cursor: grabbing;
}

.project-item.is-dragging,
.ai-session-item.is-dragging,
.ws-tab.is-dragging,
.ws-collapsible.is-dragging {
    opacity: 0.48;
    border-color: rgba(106, 166, 255, 0.42);
    filter: saturate(1.15);
}

.project-item:hover {
    border-color: rgba(106, 166, 255, 0.28);
    background: linear-gradient(180deg, rgba(106, 166, 255, 0.06), rgba(255, 255, 255, 0.02));
}

.project-item.is-active {
    border-color: rgba(106, 166, 255, 0.55);
    background: linear-gradient(180deg, rgba(106, 166, 255, 0.14), rgba(59, 209, 127, 0.04));
    box-shadow: 0 0 0 1px rgba(106, 166, 255, 0.12), 0 14px 32px rgba(0, 0, 0, 0.18);
}

.ai-session-projects {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 6px;
    align-items: center;
    margin-top: 7px;
}

.ai-session-project-select {
    min-width: 0;
    width: 100%;
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 10px;
    background: rgba(5, 10, 18, 0.72);
    color: var(--ws-text);
    font-size: 0.72rem;
    padding: 5px 7px;
}

.ai-session-projects-toggle {
    white-space: nowrap;
}

.project-item-mwos {
    border-color: rgba(59, 209, 127, 0.14);
}

.project-top {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.project-title-wrap {
    min-width: 0;
    flex: 1 1 auto;
}

.project-surface-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.project-surface-link:hover {
    color: inherit;
}

.project-link {
    text-decoration: none;
    color: var(--ws-text);
    font-weight: 700;
    line-height: 1.35;
    display: block;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.project-link:hover {
    color: var(--ws-text);
}

.project-meta {
    display: grid;
    gap: 4px;
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    font-family: 'JetBrains Mono', monospace;
    overflow-wrap: anywhere;
}

.project-time-strip {
    display: grid;
    gap: 3px;
    margin-top: 7px;
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    font-family: 'JetBrains Mono', monospace;
    line-height: 1.35;
}

.project-time-strip span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-mwos-details {
    margin-top: 9px;
    border-top: 1px solid var(--ws-border);
    padding-top: 9px;
}

.project-mwos-details summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--ws-text-soft);
    cursor: pointer;
    font-size: 0.78rem;
    list-style: none;
}

.project-mwos-details summary::-webkit-details-marker {
    display: none;
}

.project-mwos-details summary b {
    min-width: 26px;
    padding: 2px 7px;
    border-radius: 999px;
    background: rgba(59, 209, 127, 0.12);
    color: var(--ws-success);
    text-align: center;
}

.project-mwos-grid {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 5px 8px;
    margin-top: 9px;
    font-size: 0.76rem;
}

.project-mwos-grid span {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.project-mwos-grid strong {
    color: var(--ws-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-mwos-modules {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 9px;
}

.project-mwos-modules span {
    max-width: 100%;
    padding: 3px 6px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    color: var(--ws-text-soft);
    background: rgba(255, 255, 255, 0.03);
    font-size: 0.70rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-mwos-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    margin-top: 10px;
}

.project-mwos-actions .ws-btn-soft,
.project-mwos-actions .ws-btn-primary {
    width: 100%;
    padding: 7px 8px;
    font-size: 0.76rem;
}

.project-props-time-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.project-props-time-grid div {
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    padding: 9px 10px;
    background: rgba(255, 255, 255, 0.025);
}

.project-props-time-grid span {
    display: block;
    margin-bottom: 4px;
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.project-props-time-grid strong {
    color: var(--ws-text-soft);
    font-size: 0.80rem;
    font-family: 'JetBrains Mono', monospace;
    overflow-wrap: anywhere;
}

.project-detail-content {
    white-space: pre-wrap;
    max-height: min(260px, 26vh);
    overflow-y: auto;
    overflow-x: hidden;
    overflow-wrap: anywhere;
    line-height: 1.55;
    scrollbar-width: thin;
    scrollbar-color: rgba(106, 166, 255, 0.32) rgba(255, 255, 255, 0.04);
}

.project-detail-content::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.project-detail-content::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.03);
    border-radius: 999px;
}

.project-detail-content::-webkit-scrollbar-thumb {
    background: rgba(106, 166, 255, 0.26);
    border: 2px solid transparent;
    border-radius: 999px;
    background-clip: padding-box;
}

.project-detail-content::-webkit-scrollbar-thumb:hover {
    background: rgba(106, 166, 255, 0.40);
    background-clip: padding-box;
}

.project-detail-content::-webkit-scrollbar-corner {
    background: transparent;
}

.iot-side-tree {
    display: grid;
    gap: 10px;
}

.iot-side-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 2px;
}

.iot-side-summary span {
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    padding: 8px;
    background: rgba(255, 255, 255, 0.025);
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    line-height: 1.25;
}

.iot-side-summary strong {
    display: block;
    color: var(--ws-text);
    font-size: 0.95rem;
}

.iot-side-folder summary.is-drop-target {
    border-color: rgba(59, 209, 127, 0.44);
    background: rgba(59, 209, 127, 0.10);
}

.iot-side-folder summary {
    grid-template-columns: minmax(0, 1fr) auto auto;
}

.iot-side-folder summary.iot-side-folder-summary-actions {
    grid-template-columns: minmax(0, 1fr) auto auto auto;
}

.iot-side-node {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.02);
    padding: 7px;
    cursor: grab;
}

.iot-side-node:hover {
    border-color: rgba(106, 166, 255, 0.28);
    background: rgba(106, 166, 255, 0.07);
}

.iot-side-node:active {
    cursor: grabbing;
}

.iot-side-open {
    min-width: 0;
    border: 0;
    background: transparent;
    color: inherit;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 0;
    text-align: left;
}

.iot-side-node-main {
    display: grid;
    min-width: 0;
}

.iot-side-node-main strong,
.iot-side-node-main em {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.iot-side-node-main strong {
    color: var(--ws-text);
    font-size: 0.78rem;
    font-style: normal;
}

.iot-side-node-main em {
    color: var(--ws-text-muted);
    font-size: 0.66rem;
    font-style: normal;
}

.iot-side-count {
    min-width: 22px;
    height: 22px;
    border-radius: 999px;
    background: rgba(106, 166, 255, 0.12);
    color: var(--ws-text-soft);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.66rem;
    font-family: 'JetBrains Mono', monospace;
}

.iot-side-node-actions {
    display: flex;
    align-items: center;
    gap: 4px;
}

.iot-side-node-actions .ai-mini-btn,
.iot-side-folder summary .ai-mini-btn {
    width: 24px;
    height: 24px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.project-dashboard-shell {
    display: grid;
    gap: 4px;
}

.project-dashboard-empty {
    min-height: calc(100vh - 220px);
}

.project-pick-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.project-pick-card {
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 12px;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.025);
}

.project-pick-card:hover {
    border-color: rgba(106, 166, 255, 0.35);
    background: rgba(106, 166, 255, 0.07);
}

.project-pick-card strong,
.project-pick-card span {
    display: block;
}

.project-pick-card strong {
    color: var(--ws-text);
    margin-bottom: 4px;
}

.project-pick-card span {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    font-family: 'JetBrains Mono', monospace;
}

.project-dashboard-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    background:
        radial-gradient(circle at 12% 20%, rgba(var(--project-tone), 0.18), transparent 30%),
        linear-gradient(135deg, rgba(var(--project-tone), 0.08), rgba(255, 255, 255, 0.015));
}

.project-hero-main,
.project-dashboard-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.project-hero-main {
    flex: 1 1 auto;
}

.project-dashboard-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
    max-width: 420px;
}

.project-open-toggle-btn.is-open {
    border-color: rgba(78, 222, 128, 0.38);
    background: linear-gradient(180deg, rgba(31, 157, 93, 0.22), rgba(18, 32, 45, 0.72));
    color: #d9ffe8;
}

.project-open-modal .modal-dialog {
    max-width: 980px;
}

.project-open-modal .modal-header,
.project-open-modal .modal-footer {
    border-color: var(--ws-border);
}

.project-open-modal .modal-header {
    align-items: flex-start;
    gap: 18px;
}

.project-open-modal .modal-title {
    margin: 0;
    color: var(--ws-text);
    font-size: 1.35rem;
    font-weight: 900;
}

.project-open-subtitle {
    max-width: 760px;
    margin: 6px 0 0;
    color: var(--ws-text-muted);
    font-size: 0.94rem;
    line-height: 1.55;
}

.project-open-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.08fr);
    gap: 12px;
    margin-bottom: 14px;
}

.project-open-passport {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 14px;
    padding: 16px;
    border: 1px solid rgba(101, 162, 255, 0.28);
    border-radius: 18px;
    background:
        radial-gradient(circle at 0% 0%, rgba(101, 162, 255, 0.18), transparent 34%),
        linear-gradient(135deg, rgba(24, 48, 75, 0.78), rgba(9, 19, 31, 0.82));
}

.project-open-passport-sigil {
    width: 72px;
    height: 72px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(101, 162, 255, 0.34);
    border-radius: 18px;
    background: rgba(101, 162, 255, 0.14);
    color: #d9e8ff;
    font-weight: 950;
    font-size: 1.25rem;
}

.project-open-passport-main h4 {
    margin: 0;
    color: var(--ws-text);
    font-size: 1.22rem;
    font-weight: 950;
    overflow-wrap: anywhere;
}

.project-sidebar-filters {
    display: grid;
    gap: 8px;
    margin: 0 0 10px;
    padding: 10px;
    border: 1px solid rgba(117, 169, 245, 0.18);
    border-radius: 12px;
    background: rgba(8, 16, 27, 0.38);
}

.project-sidebar-search,
.project-sidebar-filter-row select {
    width: 100%;
    min-height: 38px;
    border: 1px solid rgba(117, 169, 245, 0.24);
    border-radius: 11px;
    background: rgba(10, 20, 34, 0.92);
    color: #edf4ff;
    padding: 8px 11px;
    font-size: 13px;
    font-weight: 750;
    outline: none;
}

.project-sidebar-search::placeholder {
    color: rgba(188, 201, 219, 0.62);
}

.project-sidebar-filter-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.project-intake-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

.project-intake-tags span {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 8px;
    border: 1px solid rgba(69, 214, 160, 0.26);
    border-radius: 999px;
    background: rgba(30, 139, 105, 0.13);
    color: rgba(218, 247, 235, 0.92);
    font-size: 11px;
    font-weight: 850;
}

.project-folder.is-filter-empty > .project-folder-body::after {
    content: "Нет проектов по фильтру";
    display: block;
    padding: 12px;
    color: rgba(188, 201, 219, 0.7);
    font-size: 12px;
    font-weight: 750;
}

.project-open-passport-main p {
    margin: 5px 0 10px;
    color: var(--ws-text-muted);
    font-size: 0.92rem;
    line-height: 1.5;
}

.project-open-passport-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.project-open-passport-metrics span {
    display: inline-flex;
    gap: 7px;
    align-items: center;
    padding: 6px 9px;
    border: 1px solid rgba(101, 162, 255, 0.18);
    border-radius: 999px;
    background: rgba(6, 14, 24, 0.54);
    color: var(--ws-text-muted);
    font-size: 0.76rem;
}

.project-open-passport-metrics b {
    color: var(--ws-text-faint);
    font-weight: 900;
    text-transform: uppercase;
}

.project-open-passport-metrics em {
    color: var(--ws-text);
    font-style: normal;
    font-family: 'JetBrains Mono', monospace;
    font-weight: 800;
}

.project-open-readiness-card,
.project-open-license-text-card,
.project-open-discovery-card {
    margin-bottom: 14px;
    padding: 16px;
    border: 1px solid var(--ws-border);
    border-radius: 16px;
    background:
        radial-gradient(circle at 8% 0%, rgba(76, 180, 255, 0.12), transparent 32%),
        linear-gradient(135deg, rgba(13, 28, 42, 0.86), rgba(7, 15, 25, 0.74));
}

.project-open-readiness-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.project-open-readiness-card h4,
.project-open-license-text-card h4,
.project-open-discovery-card h4 {
    margin: 0;
    color: var(--ws-text);
    font-size: 1.05rem;
    font-weight: 900;
}

.project-open-readiness-card p,
.project-open-license-text-card p,
.project-open-discovery-card p {
    margin: 6px 0 0;
    color: var(--ws-text-muted);
    font-size: 0.9rem;
    line-height: 1.5;
}

.project-open-discovery-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 12px;
}

.project-open-discovery-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
    gap: 12px;
}

.project-open-discovery-grid label,
.project-open-discovery-card .project-open-textarea {
    display: grid;
    gap: 7px;
}

.project-open-discovery-grid span,
.project-open-discovery-card .project-open-textarea span {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.project-open-field-label,
.project-open-kicker-help,
.project-open-check span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.project-open-field-help {
    width: 19px;
    height: 19px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border: 1px solid rgba(137, 181, 255, 0.28);
    border-radius: 999px;
    background:
        radial-gradient(circle at 35% 20%, rgba(112, 178, 255, 0.22), transparent 58%),
        rgba(13, 28, 45, 0.92);
    color: var(--ws-text-soft);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, transform 0.16s ease;
}

.project-open-field-help:hover,
.project-open-field-help:focus-visible,
.project-open-field-help.is-open {
    border-color: rgba(121, 184, 255, 0.72);
    background:
        radial-gradient(circle at 35% 20%, rgba(112, 178, 255, 0.34), transparent 58%),
        rgba(20, 43, 68, 0.98);
    color: #ddecff;
    transform: translateY(-1px);
    outline: none;
}

.project-open-progress {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(101, 162, 255, 0.22);
    border-radius: 14px;
    background: rgba(10, 22, 35, 0.58);
}

.project-open-progress span {
    display: inline-flex;
    min-width: 58px;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(101, 162, 255, 0.16);
    color: #9fc4ff;
    font-weight: 950;
    font-family: 'JetBrains Mono', monospace;
}

.project-open-progress strong {
    color: var(--ws-text);
    font-size: 0.95rem;
}

.project-open-check-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.project-open-check-item {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    background: rgba(8, 17, 28, 0.50);
}

.project-open-check-item.is-done {
    border-color: rgba(78, 222, 128, 0.28);
    background: rgba(20, 76, 48, 0.20);
}

.project-open-check-item.is-todo.is-required {
    border-color: rgba(255, 108, 115, 0.28);
    background: rgba(75, 24, 31, 0.20);
}

.project-open-check-mark {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(101, 162, 255, 0.12);
    color: #9fc4ff;
    font-weight: 950;
}

.project-open-check-item.is-done .project-open-check-mark {
    background: rgba(78, 222, 128, 0.16);
    color: #74ffa8;
}

.project-open-check-item.is-todo.is-required .project-open-check-mark {
    background: rgba(255, 108, 115, 0.16);
    color: #ff9ba0;
}

.project-open-check-item strong {
    display: block;
    color: var(--ws-text);
    font-size: 0.9rem;
    font-weight: 900;
}

.project-open-check-item p {
    margin: 4px 0 7px;
    color: var(--ws-text-muted);
    font-size: 0.82rem;
    line-height: 1.42;
}

.project-open-check-item em {
    color: var(--ws-text-faint);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.project-open-panel {
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    background: rgba(8, 17, 28, 0.42);
}

.project-open-panel .form-select,
.project-open-panel .form-control,
.project-open-discovery-card .form-select,
.project-open-discovery-card .form-control,
.project-open-textarea .form-control,
.project-open-modal input[name="topic_tags"],
.project-open-modal input[name="rag_keywords"] {
    border: 1px solid var(--ws-border-strong);
    border-radius: 12px;
    background: rgba(6, 14, 24, 0.92) !important;
    color: var(--ws-text);
    box-shadow: none;
    color-scheme: dark;
}

.project-open-panel .form-select:focus,
.project-open-panel .form-control:focus,
.project-open-discovery-card .form-select:focus,
.project-open-discovery-card .form-control:focus,
.project-open-textarea .form-control:focus,
.project-open-modal input[name="topic_tags"]:focus,
.project-open-modal input[name="rag_keywords"]:focus {
    border-color: rgba(101, 162, 255, 0.62);
    background: rgba(8, 19, 32, 0.98) !important;
    box-shadow: 0 0 0 3px rgba(58, 127, 255, 0.14);
}

.project-open-modal input[name="topic_tags"]::placeholder,
.project-open-modal input[name="rag_keywords"]::placeholder {
    color: var(--ws-text-dim);
}

.project-open-published-notice {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.project-open-published-sigil {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(93, 255, 160, 0.34);
    border-radius: 16px;
    background:
        radial-gradient(circle at 35% 25%, rgba(109, 255, 164, 0.34), transparent 58%),
        rgba(22, 94, 63, 0.34);
    color: #7dffb0;
    font-size: 1.4rem;
    font-weight: 900;
}

.project-open-published-notice p {
    margin: 0 0 8px;
    color: var(--ws-text);
    line-height: 1.5;
}

.project-open-published-notice small {
    color: var(--ws-text-muted);
    line-height: 1.45;
}

.project-open-field-help-popover {
    position: fixed;
    z-index: 1095;
    width: min(360px, calc(100vw - 24px));
    padding: 12px;
    border: 1px solid rgba(126, 178, 255, 0.32);
    border-radius: 14px;
    background:
        linear-gradient(145deg, rgba(17, 34, 54, 0.98), rgba(7, 16, 27, 0.98)),
        rgba(7, 16, 27, 0.98);
    box-shadow:
        0 18px 48px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.project-open-field-help-popover[hidden] {
    display: none;
}

.project-open-field-help-popover::before {
    content: "";
    position: absolute;
    top: -6px;
    left: 18px;
    width: 11px;
    height: 11px;
    border-left: 1px solid rgba(126, 178, 255, 0.32);
    border-top: 1px solid rgba(126, 178, 255, 0.32);
    background: rgba(17, 34, 54, 0.98);
    transform: rotate(45deg);
}

.project-open-field-help-popover.is-above::before {
    top: auto;
    bottom: -6px;
    border: 0;
    border-right: 1px solid rgba(126, 178, 255, 0.32);
    border-bottom: 1px solid rgba(126, 178, 255, 0.32);
}

.project-open-field-help-popover-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 9px;
}

.project-open-field-help-popover-head strong {
    min-width: 0;
    color: var(--ws-text);
    font-size: 0.96rem;
    font-weight: 900;
}

.project-open-field-help-popover-head button {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border: 1px solid rgba(148, 168, 198, 0.22);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.04);
    color: var(--ws-text-muted);
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
}

.project-open-field-help-popover-head button:hover,
.project-open-field-help-popover-head button:focus-visible {
    border-color: rgba(126, 178, 255, 0.52);
    color: var(--ws-text);
    outline: none;
}

.project-open-field-help-modal {
    display: grid;
    gap: 14px;
}

.project-open-field-help-modal p {
    margin: 0;
    color: var(--ws-text);
    line-height: 1.55;
}

.project-open-field-help-modal section {
    padding: 12px;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    background: rgba(7, 16, 27, 0.72);
}

.project-open-field-help-modal span {
    display: block;
    margin-bottom: 8px;
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.project-open-field-help-modal pre {
    margin: 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    color: #d9e8ff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.86rem;
    line-height: 1.5;
}

.project-open-panel .form-select option {
    background: #101923;
    color: var(--ws-text);
}

.project-open-discovery-card .form-select option {
    background: #101923;
    color: var(--ws-text);
}

.project-open-check {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px;
    margin: 12px 0 0;
    color: var(--ws-text-muted);
    font-size: 0.88rem;
    line-height: 1.4;
}

.project-open-check span .project-open-field-help {
    margin-top: -1px;
}

.project-open-check input,
.project-open-segment input {
    accent-color: #65a2ff;
}

.project-open-segment {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.project-open-segment label {
    cursor: pointer;
}

.project-open-segment span {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    color: var(--ws-text-muted);
    background: rgba(10, 22, 35, 0.62);
    font-weight: 800;
}

.project-open-segment input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.project-open-segment input:checked + span {
    border-color: rgba(101, 162, 255, 0.62);
    color: var(--ws-text);
    background: linear-gradient(180deg, rgba(45, 103, 185, 0.34), rgba(17, 32, 50, 0.86));
}

.project-open-price-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 120px;
    gap: 10px;
    margin-top: 12px;
}

.project-open-price-row label,
.project-open-textarea {
    display: grid;
    gap: 7px;
}

.project-open-price-row span,
.project-open-textarea span {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.project-open-license-panel p {
    margin: 10px 0 0;
    color: var(--ws-text-muted);
    font-size: 0.86rem;
    line-height: 1.48;
}

.project-open-license-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
}

.project-open-license-text-card pre {
    max-height: 180px;
    margin: 12px 0 0;
    padding: 12px;
    overflow: auto;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    background: rgba(5, 12, 20, 0.78);
    color: var(--ws-text-muted);
    font-size: 0.84rem;
    line-height: 1.52;
    white-space: pre-wrap;
}

.project-open-textarea {
    margin-top: 12px;
}

.project-open-textarea textarea {
    min-height: 100px;
    resize: vertical;
}

.project-open-status {
    min-height: 24px;
    margin-top: 12px;
    color: var(--ws-text-muted);
    font-size: 0.9rem;
    font-weight: 700;
}

.project-open-status.is-ok {
    color: #6dffa4;
}

.project-open-status.is-warn {
    color: #ffd36a;
}

.project-open-status.is-error {
    color: #ff8f95;
}

.project-open-close-release {
    border-color: rgba(255, 108, 115, 0.32);
    color: #ffb4b8;
}

.project-rank-sigil {
    width: 64px;
    height: 64px;
    flex: 0 0 64px;
    border-color: rgba(var(--project-tone), 0.32);
    box-shadow: 0 0 28px rgba(var(--project-tone), 0.14), inset 0 0 22px rgba(var(--project-tone), 0.08);
}

.project-rank-sigil span {
    font-size: 1.15rem;
}

.project-dashboard-title {
    margin: 0 0 4px;
    color: var(--ws-text);
    font-size: 1.18rem;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.project-dashboard-subtitle {
    color: var(--ws-text-soft);
    line-height: 1.45;
    overflow-wrap: anywhere;
    font-size: 0.9rem;
}

.project-quick-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

.project-quick-metrics span {
    display: inline-flex;
    max-width: 100%;
    min-height: 26px;
    align-items: center;
    gap: 7px;
    border: 1px solid rgba(var(--project-tone), 0.22);
    border-radius: 999px;
    padding: 4px 9px;
    background: rgba(var(--project-tone), 0.055);
    color: var(--ws-text-soft);
    font-size: 0.76rem;
    overflow-wrap: anywhere;
}

.project-quick-metrics b {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.64rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.project-status-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.project-status-card {
    border: 1px solid rgba(var(--project-tone), 0.24);
    border-radius: 14px;
    padding: 11px 12px;
    background:
        radial-gradient(circle at 15% 20%, rgba(var(--project-tone), 0.16), transparent 35%),
        rgba(255, 255, 255, 0.02);
    min-width: 0;
}

.project-status-card span,
.project-status-card small {
    display: block;
    color: var(--ws-text-muted);
    font-size: 0.70rem;
    line-height: 1.35;
}

.project-status-card span {
    text-transform: uppercase;
    letter-spacing: 0.07em;
    font-family: 'JetBrains Mono', monospace;
}

.project-status-card strong {
    display: block;
    color: var(--ws-text);
    font-size: 1.08rem;
    margin: 6px 0 3px;
    overflow-wrap: anywhere;
}

.project-timeline-card {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 12px;
}

.project-time-node {
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.02);
}

.project-time-node span,
.project-time-node strong {
    display: block;
}

.project-time-node span {
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.project-time-node strong {
    color: var(--ws-text-soft);
    font-size: 0.82rem;
    overflow-wrap: anywhere;
}

.project-props-dialog {
    max-width: min(1180px, calc(100vw - 32px));
}

.project-props-dialog .modal-content {
    max-height: calc(100vh - 56px);
}

.project-props-dialog .modal-body {
    display: grid;
    grid-template-columns: minmax(260px, 0.82fr) minmax(360px, 1.18fr);
    gap: 14px 18px;
    max-height: calc(100vh - 178px);
    overflow: auto;
}

.project-props-dialog .modal-body > .muted,
.project-props-dialog .modal-body > #props-title,
.project-props-dialog .modal-body > #props-code,
.project-props-dialog .modal-body > .project-props-time-grid,
.project-props-dialog .modal-body > #props-desc {
    grid-column: 1;
}

.project-props-dialog .modal-body > .muted.mt-3,
.project-props-dialog .modal-body > #props-detail {
    grid-column: 2;
}

.project-props-dialog .modal-body > .muted.mt-3 {
    grid-row: 1;
    margin-top: 0 !important;
}

.project-props-dialog .modal-body > #props-detail {
    grid-row: 2 / span 7;
    max-height: none;
    min-height: 360px;
}

.project-ai-link-modal .form-select {
    background-color: var(--ws-input-bg);
    border-color: var(--ws-border-strong);
    color: var(--ws-text);
}

.project-ai-link-hint {
    margin-top: 10px;
    color: var(--ws-text-muted);
    font-size: 0.84rem;
    line-height: 1.5;
}

@media (max-width: 860px) {
    .project-props-dialog .modal-body {
        grid-template-columns: 1fr;
    }

    .project-props-dialog .modal-body > .muted,
    .project-props-dialog .modal-body > #props-title,
    .project-props-dialog .modal-body > #props-code,
    .project-props-dialog .modal-body > .project-props-time-grid,
    .project-props-dialog .modal-body > #props-desc,
    .project-props-dialog .modal-body > .muted.mt-3,
    .project-props-dialog .modal-body > #props-detail {
        grid-column: 1;
        grid-row: auto;
    }

    .project-props-dialog .modal-body > #props-detail {
        min-height: 220px;
    }
}

.project-git-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border-color: rgba(106, 166, 255, 0.20);
    background:
        radial-gradient(circle at 8% 0%, rgba(106, 166, 255, 0.13), transparent 36%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.012));
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}

.project-git-main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    min-width: 0;
    border: 1px solid rgba(106, 166, 255, 0.22);
    border-radius: 16px;
    padding: 12px;
    background:
        linear-gradient(135deg, rgba(106, 166, 255, 0.10), rgba(255, 255, 255, 0.025)),
        rgba(3, 8, 14, 0.34);
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease;
}

.project-git-main:hover {
    border-color: rgba(106, 166, 255, 0.42);
    background:
        linear-gradient(135deg, rgba(106, 166, 255, 0.14), rgba(255, 255, 255, 0.03)),
        rgba(3, 8, 14, 0.42);
}

.project-git-main:focus-visible {
    outline: 2px solid rgba(106, 166, 255, 0.44);
    outline-offset: 2px;
}

.project-git-main > div {
    min-width: 0;
}

.project-git-card.is-collapsed {
    gap: 0;
}

.project-git-card.is-collapsed > :not(.project-git-main) {
    display: none !important;
}

.project-git-card.is-collapsed .project-git-main p {
    display: none;
}

.project-git-main h3 {
    margin: 4px 0 5px;
    color: var(--ws-text);
    font-size: 1rem;
    font-weight: 900;
}

.project-git-main p,
.project-git-note {
    margin: 0;
    color: var(--ws-text-muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.project-git-main-tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.project-git-state {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    margin-top: 10px;
    border: 1px solid rgba(106, 166, 255, 0.22);
    border-radius: 999px;
    padding: 8px 12px;
    background: rgba(106, 166, 255, 0.08);
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.25;
    white-space: normal;
    overflow-wrap: anywhere;
}

.project-git-collapse-btn {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(106, 166, 255, 0.20);
    border-radius: 12px;
    padding: 0;
    background: rgba(106, 166, 255, 0.055);
    color: var(--ws-text-soft);
    cursor: pointer;
}

.project-git-collapse-btn:hover {
    border-color: rgba(106, 166, 255, 0.42);
    color: var(--ws-text);
}

.project-git-collapse-icon {
    width: 9px;
    height: 9px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform 0.18s ease;
}

.project-git-card.is-collapsed .project-git-collapse-icon {
    transform: rotate(-45deg) translateX(-1px);
}

.project-git-state.is-ok {
    border-color: rgba(59, 209, 127, 0.26);
    background: rgba(59, 209, 127, 0.08);
    color: var(--ws-success);
}

.project-git-state.is-warn {
    border-color: rgba(255, 201, 102, 0.26);
    background: rgba(255, 201, 102, 0.08);
    color: var(--ws-warning);
}

.project-git-state.is-error {
    border-color: rgba(255, 108, 115, 0.28);
    background: rgba(255, 108, 115, 0.08);
    color: var(--ws-danger);
}

.project-git-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    min-width: 0;
    max-width: 100%;
}

.project-git-meta span,
.project-git-meta a {
    border: 1px solid var(--ws-border);
    border-radius: 999px;
    padding: 5px 9px;
    background: rgba(255, 255, 255, 0.025);
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    text-decoration: none;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.project-git-meta a:hover {
    border-color: rgba(106, 166, 255, 0.34);
    color: var(--ws-text);
}

.project-git-clone-help {
    display: grid;
    gap: 10px;
    border: 1px solid rgba(106, 166, 255, 0.14);
    border-radius: 16px;
    padding: 12px;
    background: rgba(3, 8, 14, 0.38);
}

.project-git-clone-help[hidden] {
    display: none;
}

.project-git-clone-head strong {
    display: block;
    color: var(--ws-text);
    font-size: 0.9rem;
}

.project-git-clone-head span {
    display: block;
    margin-top: 3px;
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    line-height: 1.45;
}

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

.project-git-clone-card {
    display: grid;
    gap: 8px;
    min-width: 0;
    border: 1px solid rgba(219, 231, 255, 0.09);
    border-radius: 14px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.025);
}

.project-git-clone-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.project-git-clone-title span {
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    font-weight: 800;
}

.project-git-clone-card pre {
    margin: 0;
    overflow: auto;
    border: 1px solid rgba(106, 166, 255, 0.16);
    border-radius: 12px;
    padding: 10px;
    background: rgba(3, 8, 14, 0.72);
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.74rem;
    line-height: 1.55;
    white-space: pre;
}

.project-git-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
    max-width: 100%;
}

.project-git-command-grid {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.project-git-command-group {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.project-git-command-title {
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.project-git-danger-zone {
    border: 1px solid rgba(255, 108, 115, 0.18);
    border-radius: 14px;
    padding: 8px 10px;
    background: rgba(255, 108, 115, 0.045);
}

.project-git-danger-zone summary {
    color: var(--ws-warning);
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 800;
}

.project-git-danger-zone .project-git-actions {
    margin-top: 9px;
}

.project-git-danger-btn {
    border-color: rgba(255, 108, 115, 0.26) !important;
    color: var(--ws-danger) !important;
}

.project-git-commit-row {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    gap: 8px;
    align-items: center;
    min-width: 0;
    max-width: 100%;
}

.project-git-commit-row input {
    width: 100%;
    min-width: 0;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 10px 12px;
    background: rgba(7, 13, 22, 0.56);
    color: var(--ws-text);
    outline: none;
}

.project-git-commit-row input:focus {
    border-color: rgba(106, 166, 255, 0.55);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.12);
}

.project-git-result-box {
    display: grid;
    gap: 8px;
}

.project-git-result {
    border: 1px solid rgba(106, 166, 255, 0.20);
    border-radius: 14px;
    padding: 9px 11px;
    background: rgba(106, 166, 255, 0.07);
    color: var(--ws-text-soft);
    font-size: 0.82rem;
    max-width: 100%;
    max-height: 180px;
    overflow: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.project-git-copy {
    justify-self: end;
}

.project-git-result.is-ok {
    border-color: rgba(59, 209, 127, 0.24);
    background: rgba(59, 209, 127, 0.08);
    color: var(--ws-success);
}

.project-git-result.is-warn {
    border-color: rgba(255, 201, 102, 0.25);
    background: rgba(255, 201, 102, 0.08);
    color: var(--ws-warning);
}

.project-git-result.is-error {
    border-color: rgba(255, 108, 115, 0.25);
    background: rgba(255, 108, 115, 0.08);
    color: var(--ws-danger);
}

.project-git-diff {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    max-height: 360px;
    overflow: auto;
    margin: 0;
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 16px;
    padding: 12px;
    background: rgba(3, 8, 14, 0.72);
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    line-height: 1.5;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.project-git-open.is-disabled {
    opacity: 0.5;
    pointer-events: none;
}

.project-git-modal[hidden] {
    display: none;
}

.project-git-modal {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: grid;
    place-items: center;
    padding: 22px;
}

.project-git-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(2, 8, 16, 0.72);
    backdrop-filter: blur(8px);
}

.project-git-modal-panel {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    width: min(1120px, calc(100vw - 44px));
    max-height: min(820px, calc(100vh - 44px));
    border: 1px solid rgba(106, 166, 255, 0.24);
    border-radius: 24px;
    background:
        radial-gradient(circle at 0% 0%, rgba(106, 166, 255, 0.16), transparent 36%),
        linear-gradient(145deg, rgba(18, 27, 39, 0.98), rgba(8, 14, 23, 0.98));
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.55);
    overflow: hidden;
}

.project-git-modal-head,
.project-git-modal-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--ws-border);
}

.project-git-modal-foot {
    border-top: 1px solid var(--ws-border);
    border-bottom: 0;
}

.project-git-modal-head h3 {
    margin: 4px 0 0;
    color: var(--ws-text);
    font-size: 1.05rem;
}

.project-git-modal-close {
    width: 38px;
    height: 38px;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.04);
    color: var(--ws-text);
    font-size: 1.35rem;
    cursor: pointer;
}

.project-git-modal-body {
    min-height: 0;
    overflow: auto;
    padding: 16px 18px;
}

.project-git-file-list {
    display: grid;
    gap: 8px;
}

.project-git-file-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    border: 1px solid rgba(219, 231, 255, 0.10);
    border-radius: 14px;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.025);
}

.project-git-file-row span {
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    overflow-wrap: anywhere;
}

.project-git-file-row small,
.project-git-modal-empty {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
}

.project-git-modal-diff {
    box-sizing: border-box;
    width: 100%;
    min-height: 360px;
    margin: 0;
    border: 1px solid rgba(219, 231, 255, 0.10);
    border-radius: 18px;
    padding: 14px;
    background: rgba(2, 7, 13, 0.78);
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.75rem;
    line-height: 1.5;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.project-git-modal-form {
    display: grid;
    gap: 12px;
}

.project-git-modal-form p {
    margin: 0;
    color: var(--ws-text-soft);
    font-size: 0.84rem;
    line-height: 1.45;
}

.project-git-modal-message {
    flex: 1 1 260px;
    min-width: 0;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 10px 12px;
    background: rgba(7, 13, 22, 0.64);
    color: var(--ws-text);
    outline: none;
}

.project-build-settings-shell {
    position: relative;
    display: grid;
    gap: 14px;
}

.project-build-settings-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: start;
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 18px;
    padding: 14px;
    background: rgba(9, 17, 28, 0.72);
}

.project-build-settings-summary h4 {
    margin: 3px 0 6px;
    color: var(--ws-text);
    font-size: 1.04rem;
}

.project-build-settings-summary p {
    margin: 0;
    color: var(--ws-text-soft);
    font-size: 0.84rem;
    line-height: 1.45;
}

.project-build-settings-pill,
.project-build-settings-toolbar span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    border: 1px solid rgba(106, 166, 255, 0.22);
    border-radius: 999px;
    padding: 5px 10px;
    background: rgba(106, 166, 255, 0.10);
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    font-weight: 800;
    white-space: nowrap;
}

.project-build-settings-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.project-build-settings-toolbar span.is-warn {
    border-color: rgba(255, 207, 102, 0.34);
    background: rgba(255, 207, 102, 0.12);
    color: #ffe5a3;
}

.project-build-settings-list {
    display: grid;
    gap: 9px;
}

.project-build-setting-row {
    display: grid;
    gap: 9px;
    border: 1px solid rgba(219, 231, 255, 0.10);
    border-radius: 16px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.026);
}

.project-build-setting-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: start;
}

.project-build-setting-head strong {
    display: block;
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.86rem;
    overflow-wrap: anywhere;
}

.project-build-setting-head small {
    display: block;
    margin-top: 3px;
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    line-height: 1.35;
}

.project-build-setting-head em {
    color: var(--ws-text-muted);
    font-size: 0.7rem;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    white-space: nowrap;
}

.project-build-setting-input {
    box-sizing: border-box;
    width: 100%;
    min-height: 40px;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    padding: 9px 11px;
    background: var(--ws-input-bg);
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.86rem;
    outline: none;
}

.project-build-setting-input:focus {
    border-color: rgba(106, 166, 255, 0.58);
    background: var(--ws-input-bg-focus);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.10);
}

@media (max-width: 720px) {
    .project-build-settings-summary,
    .project-build-setting-head {
        grid-template-columns: 1fr;
    }

    .project-build-setting-head em {
        white-space: normal;
    }
}

.project-build-file-viewer {
    display: grid;
    grid-template-columns: minmax(220px, 0.34fr) minmax(0, 1fr);
    gap: 12px;
    min-height: min(620px, calc(100vh - 240px));
}

.project-build-file-list {
    display: grid;
    align-content: start;
    gap: 7px;
    min-width: 0;
    max-height: min(620px, calc(100vh - 240px));
    overflow: auto;
    padding-right: 4px;
}

.project-build-file-item {
    display: grid;
    gap: 3px;
    width: 100%;
    border: 1px solid rgba(106, 166, 255, 0.14);
    border-radius: 12px;
    padding: 8px 10px;
    background: rgba(255, 255, 255, 0.025);
    text-align: left;
    cursor: pointer;
}

.project-build-file-item:hover,
.project-build-file-item.is-active {
    border-color: rgba(106, 166, 255, 0.42);
    background: rgba(106, 166, 255, 0.10);
}

.project-build-file-item span {
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.76rem;
    overflow-wrap: anywhere;
}

.project-build-file-item small {
    color: var(--ws-text-muted);
    font-size: 0.68rem;
}

.project-build-file-content {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-width: 0;
    min-height: 0;
}

.project-build-file-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    border: 1px solid rgba(106, 166, 255, 0.14);
    border-bottom: 0;
    border-radius: 16px 16px 0 0;
    padding: 9px 12px;
    background: rgba(106, 166, 255, 0.055);
}

.project-build-file-head strong {
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.8rem;
    overflow-wrap: anywhere;
}

.project-build-file-head span {
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    white-space: nowrap;
}

.project-build-file-content pre,
.project-build-file-editor {
    box-sizing: border-box;
    width: 100%;
    min-height: 0;
    max-height: min(580px, calc(100vh - 286px));
    overflow: auto;
    margin: 0;
    border: 1px solid rgba(106, 166, 255, 0.14);
    border-radius: 0 0 16px 16px;
    padding: 14px;
    background: rgba(3, 6, 12, 0.78);
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.74rem;
    line-height: 1.55;
    white-space: pre;
}

.project-build-file-editor {
    min-height: min(580px, calc(100vh - 286px));
    resize: vertical;
    outline: none;
}

.project-build-file-editor:focus {
    border-color: rgba(106, 166, 255, 0.58);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.10);
}

.project-build-file-status {
    margin-top: 10px;
}

@media (max-width: 720px) {
    .project-git-main,
    .project-git-commit-row {
        grid-template-columns: 1fr;
        display: grid;
    }

    .project-git-main-tools {
        justify-content: flex-start;
    }

    .project-git-state {
        justify-self: start;
        max-width: 100%;
        white-space: normal;
    }

    .project-git-modal {
        padding: 10px;
    }

    .project-git-modal-panel {
        width: calc(100vw - 20px);
        max-height: calc(100vh - 20px);
        border-radius: 18px;
    }

    .project-git-modal-foot,
    .project-git-file-row {
        grid-template-columns: 1fr;
        display: grid;
    }

    .project-git-clone-grid {
        grid-template-columns: 1fr;
    }

    .project-build-artifact-row {
        grid-template-columns: 1fr;
        grid-template-areas:
            "date"
            "status"
            "artifact"
            "actions";
    }

    .project-build-actions {
        justify-content: flex-start;
    }

    .project-build-file-viewer {
        grid-template-columns: 1fr;
    }

    .project-build-file-list {
        max-height: 180px;
    }
}

.project-workbench-card {
    padding: 0;
    overflow: hidden;
}

.mwos-preflight-actions {
    display: grid;
    gap: 10px;
    margin: 10px 0;
    border: 1px solid rgba(255, 201, 102, 0.24);
    border-radius: 12px;
    padding: 12px;
    background: rgba(255, 201, 102, 0.08);
}

.mwos-preflight-actions-title {
    color: var(--ws-warning);
    font-size: 0.82rem;
    font-weight: 800;
}

.mwos-preflight-actions-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.mwos-preflight-actions-list span {
    border: 1px solid rgba(255, 201, 102, 0.22);
    border-radius: 999px;
    padding: 4px 8px;
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
}

.mwos-preflight-actions-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.project-subtabs {
    display: flex;
    gap: 6px;
    padding: 10px;
    border-bottom: 1px solid var(--ws-border);
    overflow-x: auto;
}

.project-subtab {
    border: 1px solid var(--ws-border);
    border-radius: 999px;
    padding: 7px 12px;
    color: var(--ws-text-soft);
    background: rgba(255, 255, 255, 0.025);
    font-size: 0.78rem;
    font-weight: 800;
    white-space: nowrap;
}

.project-subtab:hover,
.project-subtab.is-active {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.34);
    background: rgba(106, 166, 255, 0.08);
}

.project-panel {
    display: none;
    padding: 14px;
}

.project-panel.is-active {
    display: block;
}

.project-detail-layout,
.project-config-grid,
.project-build-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
    gap: 12px;
}

[data-project-panel-content="builds"] .project-build-layout {
    grid-template-columns: 1fr;
}

.project-detail-box {
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.02);
    min-width: 0;
}

.project-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.project-panel-head .profile-kicker-line {
    margin: 0;
}

.project-mini-action {
    min-height: 28px;
    border: 1px solid rgba(106, 166, 255, 0.20);
    border-radius: 999px;
    padding: 4px 10px;
    background: rgba(106, 166, 255, 0.055);
    color: var(--ws-text-soft);
    font-size: 0.72rem;
    font-weight: 800;
    cursor: pointer;
}

.project-mini-action:hover {
    border-color: rgba(106, 166, 255, 0.42);
    color: var(--ws-text);
}

.project-mini-action.is-danger {
    border-color: rgba(255, 107, 107, 0.24);
    background: rgba(255, 107, 107, 0.07);
    color: #f3b0b0;
}

.project-mini-action.is-danger:hover {
    border-color: rgba(255, 107, 107, 0.48);
    color: #ffd1d1;
}

.project-copy-source-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: pre;
}

.project-detail-main p {
    margin: 8px 0 0;
    color: var(--ws-text-soft);
    line-height: 1.6;
}

.project-overview-text {
    margin-top: 8px;
    max-height: 168px;
    overflow: auto;
    color: var(--ws-text-soft);
    line-height: 1.58;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
    min-width: 0;
    padding-right: 6px;
}

.project-scrollbox {
    scrollbar-color: var(--ws-scroll-thumb) var(--ws-scroll-track);
    scrollbar-width: thin;
}

.project-scrollbox::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.project-scrollbox::-webkit-scrollbar-track {
    background: var(--ws-scroll-track);
    border-radius: 999px;
}

.project-scrollbox::-webkit-scrollbar-thumb {
    background: var(--ws-scroll-thumb);
    border: 2px solid transparent;
    border-radius: 999px;
    background-clip: padding-box;
}

.project-scrollbox::-webkit-scrollbar-thumb:hover {
    background: var(--ws-scroll-thumb-hover);
    background-clip: padding-box;
}

.project-scrollbox::-webkit-scrollbar-corner {
    background: transparent;
}

.project-facts-list {
    display: grid;
    gap: 8px;
    margin: 10px 0 0;
}

.project-facts-list div {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 10px;
    align-items: baseline;
}

.project-facts-list dt {
    color: var(--ws-text-muted);
    font-size: 0.70rem;
    font-family: 'JetBrains Mono', monospace;
    text-transform: uppercase;
}

.project-facts-list dd {
    margin: 0;
    color: var(--ws-text);
    overflow-wrap: anywhere;
}

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

.project-module-card {
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.02);
    min-width: 0;
}

.project-module-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 9px;
}

.project-module-head strong {
    color: var(--ws-text);
    overflow-wrap: anywhere;
}

.project-module-head span,
.project-module-empty {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
}

.project-param-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.project-param-grid span {
    border: 1px solid rgba(106, 166, 255, 0.16);
    border-radius: 999px;
    padding: 4px 7px;
    color: var(--ws-text-soft);
    background: rgba(106, 166, 255, 0.045);
    font-size: 0.72rem;
    overflow-wrap: anywhere;
}

.project-param-grid b {
    color: var(--ws-accent);
    margin-right: 5px;
}

.project-code-block {
    min-height: 320px;
    max-height: 520px;
    overflow: auto;
    margin: 8px 0 0;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 12px;
    background: rgba(3, 6, 12, 0.62);
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.76rem;
    line-height: 1.6;
    white-space: pre-wrap;
}

.project-build-list {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

.project-build-row {
    display: grid;
    grid-template-columns: minmax(140px, 0.75fr) 86px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    padding: 9px;
    background: rgba(255, 255, 255, 0.02);
}

.project-build-artifact-row {
    grid-template-columns: minmax(126px, 0.24fr) minmax(0, 1fr);
    grid-template-areas:
        "date artifact"
        "status actions";
    gap: 8px 14px;
    align-items: start;
    padding: 12px;
}

.project-build-row span,
.project-build-row strong,
.project-build-row a {
    overflow-wrap: anywhere;
    font-size: 0.76rem;
}

.project-build-row span {
    grid-area: date;
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    line-height: 1.45;
}

.project-build-row strong {
    grid-area: status;
    width: fit-content;
    border: 1px solid rgba(59, 209, 127, 0.24);
    border-radius: 999px;
    padding: 4px 8px;
    background: rgba(59, 209, 127, 0.08);
    color: var(--ws-success);
    font-size: 0.72rem;
}

.project-build-row a {
    color: var(--ws-accent);
    text-decoration: none;
}

.project-build-artifact-name {
    grid-area: artifact;
    display: grid;
    gap: 5px;
    min-width: 0;
    align-self: center;
}

.project-build-artifact-name b {
    color: var(--ws-text);
    font-size: 0.92rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
    word-break: normal;
}

.project-build-artifact-name small {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    overflow-wrap: anywhere;
}

.project-build-actions {
    grid-area: actions;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

.project-build-action {
    min-height: 32px;
    min-width: 92px;
    justify-content: center;
    white-space: nowrap;
}

.project-build-action:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.project-flash-card ol {
    margin: 10px 0 0;
    padding-left: 20px;
    color: var(--ws-text-soft);
    line-height: 1.55;
}

.schematics-shell .project-status-card strong,
.schematic-edge-target strong {
    overflow-wrap: anywhere;
}

.schematics-hero-card {
    position: relative;
    overflow: hidden;
}

.schematics-hero-card::after {
    content: "";
    position: absolute;
    inset: auto -12% -40% 46%;
    height: 180px;
    background: radial-gradient(circle, rgba(61, 162, 109, 0.20) 0%, rgba(61, 162, 109, 0) 70%);
    pointer-events: none;
}

.schematic-rank-sigil {
    background: linear-gradient(145deg, rgba(61, 162, 109, 0.22), rgba(106, 166, 255, 0.16));
    border-color: rgba(61, 162, 109, 0.34);
}

.schematics-project-panel {
    display: grid;
    gap: 14px;
}

.schematic-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 10px;
}

.schematic-section-head .profile-kicker-line {
    margin: 0;
}

.schematic-section-head p {
    margin: 5px 0 0;
    color: var(--ws-text-muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.schematic-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.schematic-preview-box {
    padding: 14px;
}

.schematic-preview-frame {
    min-height: clamp(520px, 62vh, 780px);
    max-height: none;
    overflow: auto;
    border: 1px solid var(--ws-border);
    border-radius: 18px;
    background: rgba(3, 6, 12, 0.42);
    padding: 12px;
    cursor: zoom-in;
}

.schematic-preview-frame svg {
    display: block;
    width: 100%;
    min-width: 980px;
    height: auto;
}

.schematic-preview-frame .mwos-schematic-node {
    cursor: pointer;
    transition: opacity 0.18s ease, filter 0.18s ease;
}

.schematic-preview-frame .mwos-schematic-node:hover,
.schematic-preview-frame .mwos-schematic-node.is-active {
    filter: drop-shadow(0 0 14px rgba(84, 183, 126, 0.22));
}

.schematic-preview-frame .mwos-schematic-node.is-active rect:first-child {
    stroke: rgba(84, 183, 126, 0.96);
    stroke-width: 2.2;
}

.schematic-modal-preview {
    min-height: 460px;
    max-height: 640px;
    overflow: auto;
    border: 1px solid var(--ws-border);
    border-radius: 18px;
    background: rgba(3, 6, 12, 0.42);
    padding: 12px;
}

.schematic-modal-preview svg {
    display: block;
    width: 100%;
    min-width: 980px;
    height: auto;
}

.schematic-lightbox[hidden] {
    display: none;
}

.schematic-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10080;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    background: rgba(2, 7, 14, 0.92);
    backdrop-filter: blur(10px);
}

.schematic-lightbox-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 18px;
    border-bottom: 1px solid rgba(219, 231, 255, 0.12);
    background: rgba(9, 15, 25, 0.94);
}

.schematic-lightbox-title {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.schematic-lightbox-title span {
    color: var(--ws-text-muted);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.schematic-lightbox-title strong {
    color: var(--ws-text);
    font-size: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.schematic-lightbox-tools {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.schematic-lightbox-close {
    width: 38px;
    height: 38px;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--ws-text);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
}

.schematic-lightbox-body {
    min-height: 0;
    overflow: auto;
    padding: 18px;
    scrollbar-color: var(--ws-scroll-thumb) var(--ws-scroll-track);
    scrollbar-width: thin;
}

.schematic-lightbox-canvas {
    min-width: max-content;
}

.schematic-lightbox-canvas svg {
    display: block;
    width: auto;
    min-width: min(1280px, calc(100vw - 36px));
    height: auto;
    border: 1px solid rgba(219, 231, 255, 0.10);
    border-radius: 18px;
    background: rgba(3, 6, 12, 0.56);
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42);
    transition: width 0.16s ease, filter 0.16s ease;
}

.schematic-lightbox.is-bw .schematic-lightbox-canvas svg {
    filter: grayscale(1) contrast(1.22);
}

.schematic-lightbox-tools .is-active {
    border-color: rgba(219, 231, 255, 0.30);
    background: rgba(219, 231, 255, 0.10);
    color: var(--ws-text);
}

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

.schematic-node-card {
    min-height: 124px;
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.schematic-node-card:hover,
.schematic-node-card.is-active {
    border-color: rgba(84, 183, 126, 0.32);
    box-shadow: 0 16px 40px rgba(4, 10, 18, 0.28);
    transform: translateY(-1px);
}

.schematic-node-subtitle {
    margin-top: 10px;
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    line-height: 1.5;
}

.schematic-edge-row {
    grid-template-columns: minmax(90px, 0.55fr) 60px minmax(0, 1fr) auto;
}

.schematic-edge-row strong {
    text-align: center;
}

.schematic-edge-target {
    display: grid;
    gap: 2px;
}

.schematic-edge-target small {
    color: var(--ws-text-muted);
    overflow-wrap: anywhere;
}

.schematic-revision-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.schematic-revision-open {
    min-width: 88px;
    justify-content: center;
}

.schematic-revision-current {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 88px;
    padding: 7px 12px;
    border-radius: 999px;
    border: 1px solid rgba(61, 162, 109, 0.30);
    background: rgba(61, 162, 109, 0.12);
    color: var(--ws-success);
    font-size: 0.74rem;
    font-weight: 700;
}

.schematic-node-detail-card {
    margin-top: 16px;
}

.schematic-node-details {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.schematic-node-details span {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid rgba(219, 231, 255, 0.09);
    background: rgba(255, 255, 255, 0.04);
    color: var(--ws-text-soft);
    font-size: 0.76rem;
}

.schematic-node-relations {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 18px;
}

.schematic-connection-list {
    display: grid;
    gap: 10px;
}

.schematic-connection-item {
    display: grid;
    gap: 3px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid rgba(219, 231, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
}

.schematic-connection-item strong {
    color: var(--ws-text);
    font-size: 0.9rem;
}

.schematic-connection-item small {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    overflow-wrap: anywhere;
}

.schematic-bottom-stack,
.schematic-source-stack {
    display: grid;
    gap: 12px;
}

.schematic-source-box {
    padding: 14px;
}

.schematic-code-block {
    min-height: 240px;
    max-height: min(58vh, 620px);
    margin-top: 0;
    white-space: pre;
    overflow: auto;
}

@media (max-width: 900px) {
    .schematic-section-head,
    .schematic-lightbox-head {
        align-items: stretch;
        flex-direction: column;
    }

    .schematic-toolbar,
    .schematic-lightbox-tools {
        justify-content: flex-start;
    }

    .schematic-preview-frame {
        min-height: 420px;
    }
}

.project-pick-code {
    display: block;
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    margin-top: 4px;
}

.project-tone-green { --project-tone: 59, 209, 127; }
.project-tone-blue { --project-tone: 106, 166, 255; }
.project-tone-amber { --project-tone: 255, 190, 92; }
.project-tone-rose { --project-tone: 255, 120, 160; }

.messenger-shell {
    --messenger-left-width: 300px;
    --messenger-right-width: 280px;
    display: grid;
    grid-template-columns: minmax(250px, 0.32fr) minmax(0, 1fr) minmax(240px, 0.28fr);
    grid-template-rows: auto minmax(0, 1fr);
    gap: 4px;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.messenger-community,
.messenger-private,
.messenger-support {
    grid-template-columns: var(--messenger-left-width) 2px minmax(0, 1fr) 2px var(--messenger-right-width);
    align-items: stretch;
}

.messenger-shell[data-external-right-panel="1"] {
    grid-template-columns: var(--messenger-left-width) 2px minmax(0, 1fr);
}

.messenger-toolbar {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-height: 0;
    padding: 6px 10px;
}

.messenger-toolbar.workspace-card {
    padding: 6px 10px;
    min-height: 40px;
}

.messenger-toolbar-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.messenger-panel-toggle {
    border: 1px solid var(--ws-border);
    border-radius: 999px;
    color: var(--ws-text-soft);
    background: rgba(255, 255, 255, 0.025);
    padding: 6px 10px;
    font-size: 0.74rem;
    font-weight: 800;
}

.messenger-panel-toggle-icon {
    width: 28px;
    min-width: 28px;
    height: 26px;
    padding: 0;
    font-size: 0.82rem;
    line-height: 1;
}

.messenger-panel-toggle:hover,
.messenger-panel-toggle.is-active {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.34);
    background: rgba(106, 166, 255, 0.08);
}

.messenger-resizer {
    width: 2px;
    min-width: 2px;
    border-radius: 999px;
    cursor: col-resize;
    background: rgba(255, 255, 255, 0.08);
    transition: background 0.15s ease, opacity 0.15s ease;
}

.messenger-resizer:hover,
.messenger-resizer.is-active {
    background: rgba(106, 166, 255, 0.55);
}

.messenger-community.is-left-hidden,
.messenger-private.is-left-hidden,
.messenger-support.is-left-hidden {
    grid-template-columns: 0 0 minmax(0, 1fr) 2px var(--messenger-right-width);
}

.messenger-shell[data-external-right-panel="1"].is-left-hidden {
    grid-template-columns: 0 0 minmax(0, 1fr);
}

.messenger-community.is-right-hidden,
.messenger-private.is-right-hidden,
.messenger-support.is-right-hidden {
    grid-template-columns: var(--messenger-left-width) 2px minmax(0, 1fr) 0 0;
}

.messenger-shell[data-external-right-panel="1"].is-right-hidden {
    grid-template-columns: var(--messenger-left-width) 2px minmax(0, 1fr);
}

.messenger-community.is-left-hidden.is-right-hidden,
.messenger-private.is-left-hidden.is-right-hidden,
.messenger-support.is-left-hidden.is-right-hidden {
    grid-template-columns: 0 0 minmax(0, 1fr) 0 0;
}

.messenger-shell[data-external-right-panel="1"].is-left-hidden.is-right-hidden {
    grid-template-columns: 0 0 minmax(0, 1fr);
}

.messenger-community.is-left-hidden .messenger-sidebar,
.messenger-community.is-left-hidden .messenger-resizer-left,
.messenger-community.is-right-hidden .messenger-info,
.messenger-community.is-right-hidden .messenger-resizer-right,
.messenger-private.is-left-hidden .messenger-sidebar,
.messenger-private.is-left-hidden .messenger-resizer-left,
.messenger-private.is-right-hidden .messenger-info,
.messenger-private.is-right-hidden .messenger-resizer-right,
.messenger-support.is-left-hidden .messenger-sidebar,
.messenger-support.is-left-hidden .messenger-resizer-left,
.messenger-support.is-right-hidden .messenger-info,
.messenger-support.is-right-hidden .messenger-resizer-right {
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    padding: 0;
    border-width: 0;
}

.messenger-sidebar,
.messenger-main,
.messenger-info {
    min-height: 0;
    overflow: hidden;
}

.messenger-right-panel {
    display: grid;
    align-content: start;
    gap: 10px;
}

.peer-profile-tabs {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.peer-profile-tab {
    border: 1px solid var(--ws-border);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    padding: 7px 12px;
    font-size: 0.74rem;
    font-weight: 800;
}

.peer-profile-tab.is-active {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.30);
    background: rgba(106, 166, 255, 0.10);
}

.peer-profile-panel {
    display: none;
    gap: 10px;
}

.peer-profile-panel.is-active {
    display: grid;
}

.peer-profile-wallets {
    display: grid;
    gap: 10px;
}

.peer-profile-wallet-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 13px;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.025);
}

.peer-profile-wallet-row span {
    color: var(--ws-text-soft);
}

.peer-profile-wallet-row strong {
    color: var(--ws-text);
    font-size: 0.95rem;
    font-weight: 900;
}

.messenger-sidebar,
.messenger-info {
    display: grid;
    align-content: start;
    gap: 10px;
}

.messenger-sidebar {
    grid-template-rows: auto auto auto minmax(0, 1fr);
}

.messenger-info {
    overflow: auto;
}

.messenger-side-head,
.messenger-chat-head,
.messenger-profile-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.messenger-side-actions,
.messenger-info-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.messenger-side-actions {
    justify-content: flex-end;
}

.messenger-info-actions {
    border-top: 1px solid var(--ws-border);
    padding-top: 10px;
}

.messenger-side-head h2,
.messenger-info h3,
.messenger-right-panel h3 {
    margin: 0;
    color: var(--ws-text);
    font-size: 0.94rem;
    font-weight: 900;
}

.messenger-icon-btn,
.messenger-send {
    border: 1px solid rgba(106, 166, 255, 0.28);
    color: var(--ws-text);
    background: rgba(106, 166, 255, 0.10);
    border-radius: 14px;
    font-weight: 900;
}

.messenger-icon-btn {
    width: 38px;
    height: 38px;
}

.messenger-search {
    width: 100%;
    border: 1px solid var(--ws-border);
    border-radius: 999px;
    background: var(--ws-input-bg);
    color: var(--ws-text);
    padding: 10px 13px;
    outline: none;
}

.messenger-search:focus {
    border-color: rgba(106, 166, 255, 0.38);
}

.messenger-filter-shell {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) 30px;
    gap: 6px;
    align-items: center;
}

.messenger-filter-viewport {
    overflow: hidden;
    min-width: 0;
}

.messenger-filter-row {
    display: flex;
    gap: 6px;
    min-width: max-content;
}

.messenger-filter-arrow {
    width: 30px;
    height: 30px;
    border: 1px solid var(--ws-border);
    border-radius: 11px;
    color: var(--ws-text-soft);
    background: var(--ws-row-bg);
    font-size: 1.08rem;
    line-height: 1;
}

.messenger-filter-arrow:hover {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.34);
    background: rgba(106, 166, 255, 0.08);
}

.messenger-filter {
    border: 1px solid var(--ws-border);
    border-radius: 999px;
    color: var(--ws-text-soft);
    background: var(--ws-row-bg);
    padding: 6px 9px;
    font-size: 0.74rem;
    white-space: nowrap;
}

.messenger-select {
    width: 100%;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    background: var(--ws-input-bg);
    color: var(--ws-text);
    padding: 9px 11px;
    outline: none;
    color-scheme: dark;
}

.messenger-select option {
    background: var(--ws-option-bg);
    color: var(--ws-text);
}

.messenger-filter.is-active,
.messenger-filter:hover {
    color: var(--ws-text);
    border-color: rgba(59, 209, 127, 0.28);
    background: rgba(59, 209, 127, 0.07);
}

.messenger-dialog-list {
    display: grid;
    gap: 7px;
    align-content: start;
    grid-auto-rows: max-content;
    min-height: 0;
    max-height: none;
    overflow: auto;
    padding-right: 2px;
}

.messenger-dialog {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    border: 1px solid var(--ws-border);
    border-radius: 16px;
    padding: 9px;
    background: var(--ws-row-bg);
    text-align: left;
}

.messenger-dialog:hover,
.messenger-dialog.is-active {
    border-color: rgba(106, 166, 255, 0.36);
    background:
        radial-gradient(circle at 10% 20%, rgba(106, 166, 255, 0.12), transparent 36%),
        rgba(106, 166, 255, 0.05);
}

.messenger-dialog-avatar,
.messenger-peer-avatar,
.messenger-profile-avatar {
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: var(--ws-text);
    background:
        radial-gradient(circle at 35% 30%, rgba(255, 255, 255, 0.18), transparent 34%),
        linear-gradient(135deg, rgba(106, 166, 255, 0.72), rgba(59, 209, 127, 0.42));
    font-weight: 900;
    font-family: 'JetBrains Mono', monospace;
}

.messenger-dialog-avatar {
    width: 42px;
    height: 42px;
    font-size: 0.78rem;
}

.messenger-peer-avatar {
    width: 48px;
    height: 48px;
}

.messenger-peer-avatar-topic {
    border-radius: 16px;
}

.messenger-profile-avatar {
    width: 54px;
    height: 54px;
    flex: 0 0 auto;
}

.messenger-dialog-main,
.messenger-dialog-side,
.messenger-peer-main {
    min-width: 0;
}

.messenger-dialog-main strong,
.messenger-dialog-main em,
.messenger-dialog-side small,
.messenger-peer-title,
.messenger-peer-sub {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.messenger-dialog-main strong,
.messenger-peer-title {
    color: var(--ws-text);
    font-weight: 900;
}

.messenger-dialog-main em,
.messenger-dialog-side small,
.messenger-peer-sub,
.messenger-info p,
.messenger-info-note {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    font-style: normal;
    line-height: 1.45;
}

.messenger-dialog-side {
    display: grid;
    justify-items: end;
    gap: 5px;
}

.messenger-dialog-side b {
    min-width: 22px;
    height: 22px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(59, 209, 127, 0.22);
    color: var(--ws-success);
    font-size: 0.70rem;
}

.messenger-main {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    padding: 0;
    overflow: hidden;
}

.messenger-private-body {
    min-height: 0;
    overflow: hidden;
    display: grid;
}

.private-people-directory {
    min-height: 0;
    overflow: auto;
    padding: 16px;
    display: grid;
    align-content: start;
    gap: 12px;
    background:
        linear-gradient(180deg, rgba(9, 14, 23, 0.62), rgba(5, 8, 14, 0.74)),
        radial-gradient(circle at 82% 12%, rgba(106, 166, 255, 0.10), transparent 34%);
}

.private-directory-hero {
    border: 1px solid rgba(106, 166, 255, 0.16);
    border-radius: 18px;
    padding: 14px;
    background:
        radial-gradient(circle at 8% 18%, rgba(106, 166, 255, 0.14), transparent 38%),
        rgba(255, 255, 255, 0.025);
}

.private-directory-hero h3 {
    margin: 0 0 5px;
    color: var(--ws-text);
    font-weight: 900;
}

.private-directory-hero p {
    margin: 0;
    color: var(--ws-text-muted);
    font-size: 0.82rem;
}

.private-directory-filters {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) repeat(3, minmax(130px, 0.7fr)) minmax(160px, 0.8fr);
    gap: 8px;
}

.private-people-results {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 10px;
    align-items: start;
}

.private-person-card {
    border: 1px solid var(--ws-border);
    border-radius: 18px;
    padding: 12px;
    display: grid;
    gap: 10px;
    background:
        radial-gradient(circle at 12% 18%, rgba(59, 209, 127, 0.10), transparent 38%),
        rgba(255, 255, 255, 0.024);
    text-align: left;
}

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

.private-person-main {
    min-width: 0;
}

.private-person-main strong,
.private-person-main span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.private-person-main strong {
    color: var(--ws-text);
    font-weight: 900;
}

.private-person-main span,
.private-person-about {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    line-height: 1.45;
}

.private-person-xp,
.messenger-xp-token {
    border: 1px solid rgba(59, 209, 127, 0.24);
    border-radius: 999px;
    padding: 4px 8px;
    color: var(--ws-success);
    background: rgba(59, 209, 127, 0.07);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    white-space: nowrap;
}

.private-person-tags,
.messenger-personal-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.private-person-tags span,
.messenger-personal-tags span {
    border: 1px solid rgba(106, 166, 255, 0.20);
    border-radius: 999px;
    padding: 4px 7px;
    color: var(--ws-text-soft);
    background: rgba(106, 166, 255, 0.055);
    font-size: 0.70rem;
}

.private-person-card .ws-btn-soft {
    justify-self: start;
}

.messenger-chat-head {
    border-bottom: 1px solid var(--ws-border);
    padding: 12px 14px;
    background:
        radial-gradient(circle at 15% 20%, rgba(106, 166, 255, 0.12), transparent 34%),
        rgba(255, 255, 255, 0.018);
}

.messenger-head-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.messenger-message-area {
    overflow: auto;
    padding: 16px;
    background:
        linear-gradient(180deg, rgba(9, 14, 23, 0.60), rgba(5, 8, 14, 0.72)),
        radial-gradient(circle at 80% 10%, rgba(59, 209, 127, 0.08), transparent 34%);
}

.messenger-empty-state {
    min-height: 100%;
    display: grid;
    place-content: center;
    text-align: center;
    gap: 6px;
    color: var(--ws-text-muted);
}

.messenger-empty-state strong {
    color: var(--ws-text);
    font-size: 1.05rem;
}

.messenger-message {
    display: flex;
    margin-bottom: 9px;
}

.messenger-message.is-own {
    justify-content: flex-end;
}

.messenger-message.is-peer {
    justify-content: flex-start;
}

.messenger-bubble {
    max-width: min(72%, 680px);
    border: 1px solid var(--ws-border);
    border-radius: 16px;
    padding: 8px 10px;
    background: rgba(255, 255, 255, 0.045);
    color: var(--ws-text-soft);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
}

.messenger-message.is-own .messenger-bubble {
    border-color: rgba(59, 209, 127, 0.23);
    background: linear-gradient(135deg, rgba(59, 209, 127, 0.16), rgba(106, 166, 255, 0.08));
}

.messenger-message-author {
    color: var(--ws-accent);
    font-weight: 800;
    font-size: 0.76rem;
    margin-bottom: 3px;
}

.messenger-message-text {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    line-height: 1.5;
}

.messenger-message-meta {
    margin-top: 4px;
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.66rem;
    text-align: right;
}

.messenger-report-link {
    margin-top: 5px;
    border: 0;
    background: transparent;
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    padding: 0;
}

.messenger-report-link:hover {
    color: var(--ws-danger);
}

.messenger-composer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    padding: 12px;
    border-top: 1px solid var(--ws-border);
}

.messenger-input {
    min-height: 44px;
    max-height: 120px;
    resize: vertical;
    border: 1px solid var(--ws-border);
    border-radius: 16px;
    background: var(--ws-input-bg);
    color: var(--ws-text);
    padding: 10px 12px;
    outline: none;
    line-height: 1.45;
}

.messenger-input:focus {
    border-color: rgba(106, 166, 255, 0.38);
}

.messenger-input:disabled,
.messenger-send:disabled {
    opacity: 0.48;
    cursor: not-allowed;
}

.messenger-send {
    width: 46px;
    height: 44px;
}

.messenger-info-grid {
    display: grid;
    gap: 8px;
}

.messenger-info-grid div,
.messenger-progress-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    padding: 8px 10px;
    background: rgba(255, 255, 255, 0.02);
}

.messenger-info-grid span,
.messenger-progress-row span {
    color: var(--ws-text-muted);
    font-size: 0.72rem;
}

.messenger-info-grid strong,
.messenger-progress-row strong {
    color: var(--ws-text);
    overflow-wrap: anywhere;
}

.messenger-badge-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.messenger-badge-list span {
    border: 1px solid rgba(255, 190, 92, 0.24);
    border-radius: 999px;
    color: var(--ws-warning);
    background: rgba(255, 190, 92, 0.06);
    padding: 4px 8px;
    font-size: 0.72rem;
}

.messenger-progress-list {
    display: grid;
    gap: 7px;
}

.messenger-personal-card {
    border: 1px solid rgba(106, 166, 255, 0.16);
    border-radius: 14px;
    padding: 10px;
    display: grid;
    gap: 8px;
    background: rgba(106, 166, 255, 0.045);
}

.messenger-personal-card h4 {
    margin: 0;
    color: var(--ws-text);
    font-size: 0.9rem;
}

.messenger-personal-card p {
    margin: 0;
}

.messenger-team-panel,
.messenger-team-list,
.messenger-team-add,
.messenger-team-candidates {
    display: grid;
    gap: 8px;
}

.messenger-team-member {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    padding: 8px;
    background: rgba(255, 255, 255, 0.02);
}

.messenger-team-member strong,
.messenger-team-candidate span {
    color: var(--ws-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.messenger-team-member em,
.messenger-team-candidate em {
    color: var(--ws-text-muted);
    font-size: 0.70rem;
    font-style: normal;
}

.messenger-team-candidate {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 11px;
    padding: 8px 9px;
    background: rgba(106, 166, 255, 0.05);
    text-align: left;
}

.messenger-team-candidate:hover {
    border-color: rgba(59, 209, 127, 0.28);
    background: rgba(59, 209, 127, 0.07);
}

.messenger-info-note {
    border-top: 1px solid var(--ws-border);
    padding-top: 10px;
}

.ws-modal .form-control option,
.ws-modal .form-control optgroup,
.ws-modal .form-select option,
.ws-modal .form-select optgroup {
    background-color: var(--ws-option-bg);
    color: var(--ws-text);
}

.ws-modal .form-control option:checked,
.ws-modal .form-select option:checked {
    background-color: var(--ws-option-checked-bg);
    color: var(--ws-text);
}

#new-team-project {
    color-scheme: dark;
}

@media (max-width: 760px) {
    .project-props-time-grid {
        grid-template-columns: 1fr;
    }

    .project-dashboard-hero,
    .project-hero-main,
    .project-dashboard-actions {
        display: grid;
        justify-content: stretch;
    }

    .project-pick-grid,
    .project-status-grid,
    .project-timeline-card,
    .project-detail-layout,
    .project-config-grid,
    .project-build-layout,
    .project-module-grid {
        grid-template-columns: 1fr;
    }

    .project-build-row {
        grid-template-columns: 1fr;
    }

    .project-open-grid,
    .project-open-check-grid,
    .project-open-discovery-grid,
    .project-open-price-row {
        grid-template-columns: 1fr;
    }

    .project-open-passport {
        grid-template-columns: 1fr;
    }

    .project-open-readiness-card,
    .project-open-discovery-head,
    .project-open-license-head {
        display: grid;
    }

    .project-open-modal .modal-dialog {
        margin: 10px;
    }

    .messenger-shell {
        grid-template-columns: 1fr;
    }

    .messenger-community,
    .messenger-private,
    .messenger-support,
    .messenger-community.is-left-hidden,
    .messenger-private.is-left-hidden,
    .messenger-support.is-left-hidden,
    .messenger-community.is-right-hidden,
    .messenger-private.is-right-hidden,
    .messenger-support.is-right-hidden,
    .messenger-community.is-left-hidden.is-right-hidden,
    .messenger-private.is-left-hidden.is-right-hidden,
    .messenger-support.is-left-hidden.is-right-hidden {
        grid-template-columns: 1fr;
    }

    .messenger-toolbar {
        display: grid;
    }

    .messenger-resizer {
        display: none;
    }

    .messenger-dialog-list {
        max-height: 320px;
    }

    .messenger-bubble {
        max-width: 92%;
    }
}

.project-actions {
    display: flex;
    gap: 8px;
    flex: 0 0 auto;
}

.project-actions-bottom {
    margin-top: 10px;
    width: 100%;
}

.project-actions-bottom .ws-btn-soft,
.project-actions-bottom .btn-schematic,
.project-actions-bottom .btn-props {
    flex: 1 1 0;
    justify-content: center;
    min-width: 0;
    text-align: center;
}

.project-icon-action {
    width: 38px;
    min-width: 38px;
    height: 34px;
    flex: 0 0 38px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
}

.project-icon-action svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.85;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.project-icon-action.tone-schematic {
    color: #75d0ff;
    border-color: rgba(117, 208, 255, 0.34);
    background: rgba(117, 208, 255, 0.08);
}

.project-icon-action.tone-ai {
    color: #a78bfa;
    border-color: rgba(167, 139, 250, 0.34);
    background: rgba(167, 139, 250, 0.08);
}

.project-icon-action.tone-link {
    color: #52d68b;
    border-color: rgba(82, 214, 139, 0.34);
    background: rgba(82, 214, 139, 0.08);
}

.project-icon-action.tone-move {
    color: #7dd3fc;
    border-color: rgba(125, 211, 252, 0.34);
    background: rgba(125, 211, 252, 0.08);
}

.project-icon-action.tone-props {
    color: #f5c56f;
    border-color: rgba(245, 197, 111, 0.34);
    background: rgba(245, 197, 111, 0.08);
}

.project-icon-action.tone-delete {
    color: #ff8a8a;
    border-color: rgba(255, 138, 138, 0.34);
    background: rgba(255, 92, 92, 0.08);
}

.project-icon-action:hover {
    transform: translateY(-1px);
    filter: brightness(1.12);
}

.project-empty {
    border: 1px dashed var(--ws-border-strong);
    border-radius: 14px;
    padding: 14px;
    color: var(--ws-text-muted);
    font-size: 0.84rem;
    background: rgba(255, 255, 255, 0.015);
    line-height: 1.5;
}

.workspace-topbar {
    padding: 10px 14px;
    border-bottom: 1px solid var(--ws-border);
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    background: rgba(255, 255, 255, 0.02);
}

.workspace-topbar-left,
.workspace-topbar-right {
    display: flex;
    gap: 8px;
    align-items: center;
}

.workspace-topbar-center {
    min-width: 0;
    overflow: hidden;
}

.ws-tabs-shell {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    min-width: 0;
}

.ws-tabs-scroll {
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.ws-tabs-scroll::-webkit-scrollbar {
    display: none;
}

.ws-tabs {
    display: flex;
    gap: 8px;
    flex-wrap: nowrap;
    min-width: max-content;
}

.ws-tab {
    padding: 8px 12px;
    border: 1px solid var(--ws-border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.02);
    color: var(--ws-text-soft);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.84rem;
    line-height: 1.25;
    white-space: nowrap;
}

.ws-tab:hover {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.28);
}

.ws-tab.is-active {
    color: var(--ws-text);
    background: rgba(106, 166, 255, 0.12);
    border-color: rgba(106, 166, 255, 0.35);
}

.ws-tab-arrow,
.ws-tab-manage {
    flex: 0 0 auto;
    border: 1px solid var(--ws-border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    font-weight: 700;
    min-height: 36px;
}

.ws-tab-arrow {
    width: 34px;
    padding: 0;
    font-size: 1.1rem;
}

.ws-tab-alert {
    position: relative;
    flex: 0 0 auto;
    width: 34px;
    min-height: 36px;
    border: 1px solid var(--ws-border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    display: inline-flex;
    flex: 0 0 34px;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 800;
    line-height: 1;
    transition: 0.18s ease;
}

.ws-tab-alert.is-hidden {
    display: none;
}

.ws-tab-alert:hover {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.35);
    background: rgba(106, 166, 255, 0.08);
}

.ws-tab-alert b {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(106, 166, 255, 0.95);
    color: #07111d;
    font-size: 0.62rem;
    font-family: 'JetBrains Mono', monospace;
    box-shadow: 0 0 0 2px rgba(11, 16, 22, 0.95);
}

.ws-tab-alert-mail {
    color: rgba(126, 224, 178, 0.9);
    border-color: rgba(39, 166, 117, 0.26);
}

.ws-tab-alert-mail b {
    background: rgba(126, 224, 178, 0.96);
}

.ws-tab-alert-support {
    color: rgba(255, 122, 122, 0.95);
    border-color: rgba(255, 82, 82, 0.36);
    background: rgba(255, 82, 82, 0.07);
}

.ws-tab-alert-support b {
    background: rgba(255, 82, 82, 0.98);
    color: #fff;
}

.ws-tab-manage {
    padding: 0 12px;
    font-size: 0.82rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    white-space: nowrap;
}

.ws-tab-manage-icon {
    font-size: 0.92rem;
    line-height: 1;
}

.ws-tab-arrow:hover,
.ws-tab-manage:hover {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.35);
}

.ide-tabs-manager {
    display: grid;
    gap: 8px;
}

.ide-tabs-modal-body {
    max-height: min(70vh, 620px);
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(106, 166, 255, 0.32) rgba(255, 255, 255, 0.04);
}

.ide-tabs-modal-body::-webkit-scrollbar {
    width: 8px;
}

.ide-tabs-modal-body::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.04);
}

.ide-tabs-modal-body::-webkit-scrollbar-thumb {
    background: rgba(106, 166, 255, 0.28);
    border-radius: 999px;
}

.ide-manager-section {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.ide-manager-section:first-of-type {
    margin-top: 0;
}

.ide-manager-section-title {
    color: var(--ws-text-soft);
    font-size: 0.72rem;
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.10em;
    text-transform: uppercase;
}

.ide-tab-manager-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.025);
}

.ide-sidebar-manager-row {
    align-items: center;
}

.ide-tab-manager-row:hover {
    border-color: rgba(106, 166, 255, 0.24);
    background: rgba(106, 166, 255, 0.045);
}

.ide-tab-manager-row[draggable="true"] {
    cursor: grab;
}

.ide-tab-manager-row[draggable="true"]:active {
    cursor: grabbing;
}

.ide-tab-manager-row.is-dragging {
    opacity: 0.48;
    border-color: rgba(106, 166, 255, 0.36);
    background: rgba(106, 166, 255, 0.08);
}

.ws-tab[draggable="true"],
.ws-drag-handle {
    cursor: grab;
}

.ws-tab[draggable="true"]:active,
.ws-drag-handle:active {
    cursor: grabbing;
}

.ws-collapsible-head[draggable="true"] {
    user-select: none;
}

.ide-tab-manager-check,
.ide-tab-manager-main-check {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: var(--ws-text);
    font-weight: 600;
    min-width: 0;
}

.ide-tab-manager-main-check {
    flex: 1 1 auto;
    font-size: 0.84rem;
}

.ide-tab-manager-main-check span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ide-tab-manager-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}

.ide-tab-manager-actions .ws-btn-soft {
    padding: 5px 9px;
}

.ide-tab-icon-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin: 0;
    border: 1px solid rgba(130, 160, 196, 0.14);
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.025);
    color: rgba(185, 210, 245, 0.52);
    cursor: pointer;
    font-size: 0.72rem;
    line-height: 1;
    transition: 0.18s ease;
}

.ide-tab-icon-check input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.ide-tab-icon-check:has(input:checked) {
    color: rgba(126, 224, 178, 0.9);
    border-color: rgba(39, 166, 117, 0.32);
    background: rgba(39, 166, 117, 0.08);
}

.ide-tab-icon-check:hover {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.28);
}

.ws-content {
    padding: 12px 14px 14px;
    overflow: auto;
    flex: 1 1 auto;
    min-width: 0;
}

.ws-content.is-chat-tab-active {
    overflow: hidden;
}

.tab-pane {
    display: none;
}

.tab-pane.is-active {
    display: block;
}

.tab-pane#tab-community.is-active,
.tab-pane#tab-private.is-active,
.tab-pane#tab-support.is-active {
    height: 100%;
    overflow: hidden;
}

.workspace-grid {
    display: grid;
    gap: 12px;
}

.workspace-card {
    border: 1px solid var(--ws-border);
    background: var(--ws-card-bg);
    border-radius: 16px;
    padding: 14px;
    min-width: 0;
}

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

.workspace-card-title {
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0 0 4px 0;
    line-height: 1.35;
}

.workspace-card-subtitle {
    margin: 0;
    color: var(--ws-text-soft);
    font-size: 0.84rem;
    line-height: 1.55;
}

.composer-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.72fr);
    gap: 12px;
}

.prompt-textarea {
    width: 100%;
    min-height: 220px;
    border-radius: 14px;
    border: 1px solid var(--ws-border);
    background: var(--ws-input-bg);
    color: var(--ws-text);
    padding: 14px;
    resize: vertical;
    outline: none;
    box-shadow: none;
    line-height: 1.55;
    font-size: 0.92rem;
}

.prompt-textarea:focus {
    border-color: rgba(106, 166, 255, 0.35);
}

.build-log {
    min-height: 220px;
    max-height: 360px;
    overflow: auto;
    border-radius: 14px;
    border: 1px solid var(--ws-border);
    background: rgba(4, 7, 12, 0.55);
    padding: 12px 14px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.76rem;
    line-height: 1.65;
    color: var(--ws-text-soft);
    overflow-wrap: anywhere;
}

.build-log .log-line {
    margin-bottom: 4px;
}

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

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

.summary-card {
    border: 1px solid var(--ws-border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.015));
    border-radius: 14px;
    padding: 12px;
    min-width: 0;
}

.summary-label {
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: 'JetBrains Mono', monospace;
    margin-bottom: 6px;
    line-height: 1.4;
}

.summary-value {
    font-size: 1.08rem;
    font-weight: 800;
    color: var(--ws-text);
    margin-bottom: 3px;
    overflow-wrap: anywhere;
}

.summary-note {
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    line-height: 1.45;
}

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

.node-card {
    border: 1px solid var(--ws-border);
    border-radius: 16px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.015);
    min-width: 0;
}

.node-head {
    padding: 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.node-head-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.node-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex: 1 1 auto;
}

.node-name {
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.node-sub {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    font-family: 'JetBrains Mono', monospace;
    overflow-wrap: anywhere;
}

.node-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex: 0 0 auto;
}

.node-dot.online {
    background: var(--ws-success);
    box-shadow: 0 0 14px rgba(59, 209, 127, 0.45);
}

.node-dot.warning {
    background: var(--ws-warning);
    box-shadow: 0 0 14px rgba(240, 180, 76, 0.35);
}

.node-dot.offline {
    background: var(--ws-danger);
    box-shadow: 0 0 14px rgba(255, 108, 115, 0.30);
}

.node-body {
    border-top: 1px solid var(--ws-border);
    padding: 12px 14px 14px;
    min-width: 0;
    overflow-x: auto;
}

.node-uptime {
    margin-top: 10px;
}

.sensor-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 560px;
}

.sensor-table th,
.sensor-table td {
    padding: 9px 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    text-align: left;
    font-size: 0.82rem;
    overflow-wrap: anywhere;
}

.sensor-table th {
    color: var(--ws-text-muted);
    font-size: 0.70rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-family: 'JetBrains Mono', monospace;
}

.channel-layout {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 12px;
    min-height: 560px;
}

.channel-list {
    border: 1px solid var(--ws-border);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.02);
    overflow: auto;
    padding: 8px;
    min-width: 0;
}

.channel-item {
    padding: 10px 11px;
    border: 1px solid transparent;
    border-radius: 12px;
    cursor: pointer;
    transition: 0.18s ease;
    margin-bottom: 8px;
    background: rgba(255, 255, 255, 0.01);
}

.channel-item:hover,
.channel-item.is-active {
    border-color: rgba(106, 166, 255, 0.28);
    background: rgba(106, 166, 255, 0.08);
}

.channel-item-title {
    font-weight: 700;
    margin-bottom: 4px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.channel-item-sub {
    color: var(--ws-text-muted);
    font-size: 0.80rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.channel-view {
    border: 1px solid var(--ws-border);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.02);
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.channel-view-head {
    padding: 14px;
    border-bottom: 1px solid var(--ws-border);
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 12px;
    flex-wrap: wrap;
}

.channel-head-title,
.channel-head-subtitle {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.channel-head-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.channel-view-body {
    flex: 1 1 auto;
    overflow: auto;
    padding: 14px;
    min-width: 0;
}

.message-row {
    margin-bottom: 12px;
}

.message-author {
    font-weight: 700;
    color: var(--ws-text);
    margin-right: 8px;
}

.message-time {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    font-family: 'JetBrains Mono', monospace;
    margin-right: 8px;
}

.message-role {
    color: var(--ws-accent);
    font-size: 0.76rem;
}

.message-text {
    margin-top: 4px;
    color: var(--ws-text-soft);
    line-height: 1.65;
    word-break: break-word;
}

.channel-composer {
    padding: 14px;
    border-top: 1px solid var(--ws-border);
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
}

.channel-input {
    border-radius: 12px;
    border: 1px solid var(--ws-border);
    background: var(--ws-input-bg);
    color: var(--ws-text);
    padding: 11px 12px;
    outline: none;
    min-width: 0;
}

.channel-input:focus {
    border-color: rgba(106, 166, 255, 0.35);
}

.side-filter {
    width: 100%;
    border-radius: 12px;
    border: 1px solid var(--ws-border);
    background: var(--ws-input-bg);
    color: var(--ws-text);
    padding: 10px 12px;
    outline: none;
    margin-bottom: 12px;
    color-scheme: dark;
}

.side-filter:focus {
    background: var(--ws-input-bg-focus);
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.35);
}

.side-filter option,
.side-filter optgroup {
    background-color: var(--ws-option-bg);
    color: var(--ws-text);
}

.side-filter option:checked {
    background-color: var(--ws-option-checked-bg);
    color: var(--ws-text);
}

.module-group {
    margin-bottom: 16px;
}

.module-group-title {
    margin: 0 0 8px 0;
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: 'JetBrains Mono', monospace;
}

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

.module-item {
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.015);
    transition: 0.18s ease;
    cursor: pointer;
    min-width: 0;
}

.module-item:hover {
    border-color: rgba(106, 166, 255, 0.28);
    background: rgba(106, 166, 255, 0.07);
}

.module-top {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    align-items: start;
}

.module-name {
    font-weight: 600;
    line-height: 1.4;
    font-size: 0.84rem;
    overflow-wrap: anywhere;
}

.module-badge {
    border-radius: 999px;
    font-size: 0.64rem;
    padding: 4px 7px;
    border: 1px solid var(--ws-border-strong);
    color: var(--ws-text-soft);
    white-space: nowrap;
    font-family: 'JetBrains Mono', monospace;
}

.module-badge.certified {
    color: var(--ws-success);
    border-color: rgba(59, 209, 127, 0.28);
    background: rgba(59, 209, 127, 0.08);
}

.module-badge.custom {
    color: #8fd7ff;
    border-color: rgba(106, 166, 255, 0.30);
    background: rgba(106, 166, 255, 0.10);
}

.library-compact-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 10px;
}

.library-compact-stats span {
    border: 1px solid var(--ws-border);
    border-radius: 9px;
    padding: 6px 7px;
    background: rgba(255, 255, 255, 0.012);
    color: var(--ws-text-muted);
    font-size: 0.66rem;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.library-compact-stats strong {
    color: var(--ws-text);
    font-size: 0.82rem;
    margin-right: 4px;
}

.component-library-filters {
    display: grid;
    gap: 7px;
    margin-bottom: 10px;
}

.component-library-filter-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
}

.component-library-groups {
    display: grid;
    gap: 8px;
}

.component-library-group {
    margin: 0;
}

.component-library-custom-group {
    border-color: rgba(106, 166, 255, 0.18);
    background: linear-gradient(135deg, rgba(106, 166, 255, 0.055), rgba(59, 209, 127, 0.025));
}

.component-folder-head-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    align-items: center;
}

.component-folder-head-actions .ai-mini-btn {
    width: 24px;
    height: 24px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.component-group-count {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    margin-left: 5px;
}

.component-explorer-card {
    margin-top: 14px;
}

.component-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(180px, 240px) minmax(140px, 190px);
    gap: 10px;
    margin: 12px 0;
}

.component-select {
    width: 100%;
}

.component-browser {
    display: grid;
    grid-template-columns: minmax(280px, 0.95fr) minmax(300px, 1.05fr);
    gap: 12px;
    align-items: start;
}

.component-list,
.component-list-group {
    display: grid;
    gap: 6px;
}

.component-list {
    max-height: 620px;
    overflow: auto;
    padding-right: 4px;
}

.component-card {
    border: 1px solid var(--ws-border);
    border-radius: 11px;
    padding: 8px;
    background: rgba(255, 255, 255, 0.018);
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease;
}

.component-card:hover,
.component-card.is-active {
    border-color: rgba(106, 166, 255, 0.38);
    background: rgba(106, 166, 255, 0.08);
}

.component-library-item-custom {
    border-color: rgba(106, 166, 255, 0.18);
    background: linear-gradient(135deg, rgba(106, 166, 255, 0.055), rgba(255, 255, 255, 0.012));
}

.component-card-top,
.component-actions,
.component-detail-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.component-card-top {
    justify-content: space-between;
    margin-bottom: 4px;
}

.component-card-actions {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: auto;
}

.component-card-actions .ai-mini-btn {
    width: 22px;
    height: 22px;
    padding: 0;
    font-size: 0.68rem;
}

.component-id,
.component-category {
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    font-family: 'JetBrains Mono', monospace;
}

.component-name {
    color: var(--ws-text);
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.35;
}

.component-path,
.component-detail-path {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    line-height: 1.45;
    word-break: break-word;
    margin-top: 6px;
}

.component-actions {
    margin-top: 10px;
}

.component-workspace-card {
    min-height: calc(100vh - 150px);
}

.component-workspace-header {
    align-items: start;
}

.component-workspace-hint {
    max-width: 760px;
    font-size: 0.78rem;
    opacity: 0.72;
}

.component-detail {
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.014);
    padding: 14px;
    min-height: 260px;
}

.component-detail-main {
    min-height: calc(100vh - 250px);
}

.component-detail-empty {
    color: var(--ws-text-muted);
    font-size: 0.82rem;
    line-height: 1.55;
}

.component-headline {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: start;
}

.component-detail-kicker {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    margin-bottom: 4px;
}

.component-detail-title {
    color: var(--ws-text);
    font-size: 1.22rem;
    margin: 0 0 12px 0;
}

.component-subtabs {
    display: flex;
    gap: 8px;
    margin: 4px 0 12px;
    border-bottom: 1px solid var(--ws-border);
}

.component-subtab {
    border: 1px solid transparent;
    border-bottom: 0;
    border-radius: 10px 10px 0 0;
    background: transparent;
    color: var(--ws-text-muted);
    padding: 8px 12px;
    font-size: 0.82rem;
    font-weight: 700;
}

.component-subtab:hover,
.component-subtab.is-active {
    color: var(--ws-text);
    background: rgba(106, 166, 255, 0.10);
    border-color: rgba(106, 166, 255, 0.25);
}

.component-panel {
    display: none;
}

.component-panel.is-active {
    display: block;
}

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

.component-detail-grid > div {
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 12px;
    padding: 10px;
    background: rgba(106, 166, 255, 0.045);
}

.component-detail-grid span {
    display: block;
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    margin-bottom: 3px;
}

.component-detail-grid strong {
    display: block;
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    word-break: break-word;
}

.component-info-card {
    margin-top: 12px;
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 12px;
    padding: 12px;
    background: rgba(106, 166, 255, 0.045);
}

.component-info-card span {
    display: block;
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    margin-bottom: 5px;
}

.component-info-card strong {
    display: block;
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    word-break: break-word;
}

.component-passport-placeholder {
    color: var(--ws-text-soft);
    line-height: 1.55;
}

.component-passport-placeholder p {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    margin: 6px 0 0;
}

.component-source-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.component-source-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.component-source-title {
    color: var(--ws-text);
    font-weight: 800;
    font-size: 0.9rem;
}

.component-source-view {
    max-height: calc(100vh - 300px);
    min-height: calc(100vh - 360px);
    overflow: auto;
    margin: 0;
    padding: 16px;
    border: 1px solid rgba(106, 166, 255, 0.22);
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.28);
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.76rem;
    line-height: 1.45;
    white-space: pre;
}

.component-workspace-card {
    background:
        radial-gradient(circle at 8% 8%, rgba(59, 209, 127, 0.10), transparent 32%),
        radial-gradient(circle at 92% 12%, rgba(106, 166, 255, 0.11), transparent 30%),
        rgba(255, 255, 255, 0.014);
}

.component-detail-main {
    background:
        linear-gradient(135deg, rgba(16, 28, 42, 0.88), rgba(8, 13, 20, 0.96)),
        radial-gradient(circle at 18% 18%, rgba(59, 209, 127, 0.13), transparent 34%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035), 0 18px 40px rgba(0, 0, 0, 0.18);
}

.component-hero-shell {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: stretch;
    border: 1px solid rgba(106, 166, 255, 0.20);
    border-radius: 16px;
    padding: 14px;
    margin-bottom: 12px;
    background:
        radial-gradient(circle at 12% 22%, rgba(59, 209, 127, 0.16), transparent 34%),
        linear-gradient(135deg, rgba(106, 166, 255, 0.10), rgba(255, 255, 255, 0.018));
}

.component-hero-main {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.component-hero-icon {
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 18px;
    border: 1px solid rgba(59, 209, 127, 0.38);
    background: linear-gradient(135deg, rgba(59, 209, 127, 0.28), rgba(106, 166, 255, 0.18));
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.45rem;
    font-weight: 800;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
}

.component-hero-path {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    line-height: 1.4;
    word-break: break-word;
}

.component-hero-badges {
    display: grid;
    gap: 8px;
    align-content: center;
    min-width: 130px;
}

.component-hero-badges span {
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 999px;
    padding: 7px 10px;
    background: rgba(255, 255, 255, 0.035);
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    text-align: center;
}

.component-detail-grid > .component-metric-blue {
    background: linear-gradient(135deg, rgba(106, 166, 255, 0.12), rgba(106, 166, 255, 0.03));
}

.component-detail-grid > .component-metric-green {
    background: linear-gradient(135deg, rgba(59, 209, 127, 0.12), rgba(59, 209, 127, 0.03));
}

.component-detail-grid > .component-metric-violet {
    background: linear-gradient(135deg, rgba(156, 120, 255, 0.13), rgba(156, 120, 255, 0.03));
}

.component-detail-grid > .component-metric-amber {
    background: linear-gradient(135deg, rgba(255, 194, 102, 0.12), rgba(255, 194, 102, 0.03));
}

.component-info-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(240px, 0.9fr);
    gap: 12px;
    margin-top: 12px;
}

.component-info-layout .component-info-card {
    margin-top: 0;
}

.component-asset-card {
    background:
        radial-gradient(circle at 90% 14%, rgba(106, 166, 255, 0.12), transparent 34%),
        rgba(255, 255, 255, 0.025);
}

.component-media-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-bottom: 12px;
}

.component-media-status {
    margin: 4px 0 0;
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    line-height: 1.45;
}

.component-media-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 12px;
}

.component-photo-card,
.component-file-card,
.component-empty-note {
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.026);
}

.component-photo-card,
.component-file-card {
    color: var(--ws-text);
    text-decoration: none;
    transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.component-photo-card:hover,
.component-file-card:hover {
    transform: translateY(-1px);
    border-color: rgba(59, 209, 127, 0.34);
    background: rgba(59, 209, 127, 0.055);
}

.component-photo-card {
    padding: 10px;
    display: grid;
    gap: 8px;
}

.component-photo-frame {
    display: block;
    overflow: hidden;
    border-radius: 11px;
    background: rgba(0, 0, 0, 0.22);
    aspect-ratio: 16 / 10;
}

.component-photo-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.component-photo-card b,
.component-file-card b {
    display: block;
    color: var(--ws-text);
    font-size: 0.82rem;
    line-height: 1.35;
    word-break: break-word;
}

.component-photo-card small,
.component-file-card small {
    display: block;
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    margin-top: 2px;
}

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

.component-doc-list {
    margin-top: 12px;
}

.component-doc-title {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin: 4px 0 2px;
}

.component-file-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
}

.component-file-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: rgba(106, 166, 255, 0.12);
    color: #9fc3ff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    font-weight: 800;
}

.component-empty-note {
    padding: 14px;
    color: var(--ws-text-muted);
    font-size: 0.8rem;
    line-height: 1.5;
}

.component-empty-note b {
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
}

@media (max-width: 991.98px) {
    .component-toolbar,
    .component-browser,
    .component-info-layout {
        grid-template-columns: 1fr;
    }

    .component-hero-shell {
        flex-direction: column;
    }

    .component-hero-badges {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .component-source-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .component-source-actions {
        justify-content: flex-start;
    }
}

.profile-command-area {
    padding-right: 6px;
}

.profile-command-grid {
    display: grid;
    gap: 12px;
}

.profile-hero-card {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 16px;
    background:
        radial-gradient(circle at 12% 20%, rgba(59, 209, 127, 0.16), transparent 34%),
        linear-gradient(135deg, rgba(106, 166, 255, 0.10), rgba(255, 255, 255, 0.015));
}

.profile-hero-main,
.profile-track-head,
.profile-wallet-card,
.profile-achievement-token {
    display: flex;
    align-items: center;
    gap: 12px;
}

.profile-rank-sigil {
    position: relative;
    width: 62px;
    height: 62px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(59, 209, 127, 0.38);
    border-radius: 18px;
    background: rgba(59, 209, 127, 0.08);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04), 0 12px 28px rgba(0, 0, 0, 0.18);
    transform: rotate(45deg);
    flex: 0 0 auto;
}

.profile-rank-sigil span {
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-weight: 800;
    font-size: 1.25rem;
    transform: rotate(-45deg);
}

.profile-rank-sigil-sm {
    width: 42px;
    height: 42px;
    border-radius: 13px;
}

.profile-rank-sigil-sm span {
    font-size: 0.9rem;
}

.profile-kicker-line,
.profile-hero-label,
.profile-track-total {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.profile-hero-title {
    color: var(--ws-text);
    font-size: 1.35rem;
    font-weight: 800;
    margin: 3px 0;
}

.profile-hero-subtitle,
.profile-hero-note {
    color: var(--ws-text-soft);
    line-height: 1.45;
}

.profile-hero-side {
    max-width: 360px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    padding: 12px;
    background: rgba(0, 0, 0, 0.12);
}

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

.profile-wallet-card,
.profile-track-card,
.profile-achievement-token,
.profile-economy-item,
.profile-quest-row {
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.018);
}

.profile-wallet-card {
    padding: 10px 12px;
}

.profile-wallet-mark {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.045);
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.74rem;
    font-weight: 800;
}

.profile-wallet-label,
.profile-track-title-block p,
.profile-goal-row label span,
.profile-achievement-token span,
.profile-economy-item span {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    line-height: 1.4;
}

.profile-wallet-value {
    color: var(--ws-text);
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.15;
}

.profile-compact-head {
    margin-bottom: 10px;
}

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

.profile-achievement-token {
    padding: 10px;
}

.profile-achievement-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    font-weight: 800;
    background: rgba(255, 255, 255, 0.045);
}

.profile-achievement-token strong,
.profile-economy-item strong {
    display: block;
    color: var(--ws-text);
    font-weight: 800;
}

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

.profile-track-card {
    padding: 12px;
}

.profile-track-title-block {
    min-width: 0;
    flex: 1 1 auto;
}

.profile-track-title-block h3 {
    color: var(--ws-text);
    font-size: 0.96rem;
    font-weight: 800;
    margin: 0 0 2px;
}

.profile-track-title-block p {
    margin: 0;
}

.profile-level-pill {
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 999px;
    padding: 5px 8px;
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    white-space: nowrap;
}

.profile-track-progress {
    margin-top: 12px;
}

.profile-track-progress-meta {
    display: flex;
    justify-content: space-between;
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    margin-bottom: 6px;
}

.profile-progress-bar {
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.055);
}

.profile-progress-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(59, 209, 127, 0.95), rgba(106, 166, 255, 0.95));
}

.profile-goal-row {
    display: grid;
    grid-template-columns: minmax(170px, 0.85fr) minmax(0, 1.15fr);
    gap: 10px;
    margin-top: 12px;
}

.profile-goal-row .side-filter {
    margin: 5px 0 0;
    padding: 8px 10px;
    border-radius: 10px;
    font-size: 0.78rem;
}

.profile-goal-panel {
    border: 1px solid rgba(106, 166, 255, 0.16);
    border-radius: 12px;
    padding: 9px;
    background: rgba(106, 166, 255, 0.04);
}

.profile-goal-panel strong,
.profile-goal-panel span,
.profile-goal-panel em {
    display: block;
}

.profile-goal-panel strong {
    color: var(--ws-text);
    font-size: 0.82rem;
}

.profile-goal-panel span {
    color: var(--ws-text-soft);
    font-size: 0.76rem;
    line-height: 1.4;
    margin-top: 4px;
}

.profile-goal-panel em {
    color: var(--ws-accent);
    font-style: normal;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    margin-top: 6px;
}

.profile-track-total {
    margin-top: 10px;
}

.profile-economy-item {
    padding: 12px;
}

.profile-quests-card {
    border-color: rgba(106, 166, 255, 0.18);
}

.profile-quest-limit {
    min-width: 46px;
    border: 1px solid rgba(106, 166, 255, 0.22);
    border-radius: 10px;
    padding: 6px 8px;
    color: var(--ws-text);
    background: rgba(106, 166, 255, 0.06);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    font-weight: 800;
    text-align: center;
}

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

.profile-quests-card {
    container-type: inline-size;
}

.profile-quest-head-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
}

.profile-quest-collapse-btn {
    width: 32px;
    height: 32px;
    font-size: 0.95rem;
}

.profile-quest-panel {
    display: grid;
    gap: 10px;
}

.profile-quests-card.is-collapsed .profile-quest-panel {
    display: none;
}

.profile-quest-toolbar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(130, 160, 196, 0.13);
    border-radius: 12px;
    background:
        radial-gradient(circle at 0% 0%, rgba(106, 166, 255, 0.055), transparent 42%),
        rgba(6, 12, 19, 0.34);
    padding: 8px;
    min-width: 0;
}

.profile-quest-toolbar .form-select,
.profile-quest-toolbar .messenger-search {
    min-height: 38px;
    min-width: 0;
    border: 1px solid rgba(130, 160, 196, 0.20);
    border-radius: 12px;
    background-color: rgba(10, 17, 25, 0.96);
    color: var(--ws-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
    color-scheme: dark;
    font-size: 0.8rem;
}

.profile-quest-toolbar .messenger-search {
    grid-column: 1 / -1;
    min-height: 46px;
}

.profile-quest-toolbar .form-select {
    width: 100%;
    padding: 8px 34px 8px 12px;
    outline: none;
}

.profile-quest-toolbar .form-select:focus,
.profile-quest-toolbar .messenger-search:focus {
    border-color: rgba(106, 166, 255, 0.42);
    background-color: rgba(12, 20, 30, 0.98);
    box-shadow:
        0 0 0 2px rgba(106, 166, 255, 0.09),
        inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.profile-quest-toolbar .form-select option,
.profile-quest-toolbar .form-select optgroup {
    background-color: var(--ws-option-bg);
    color: var(--ws-text);
}

.profile-quest-toolbar .form-select option:checked {
    background-color: var(--ws-option-checked-bg);
    color: var(--ws-text);
}

.profile-empty-quests {
    border: 1px dashed rgba(130, 160, 196, 0.18);
    border-radius: 12px;
    color: var(--ws-text-muted);
    padding: 12px;
    font-size: 0.84rem;
}

.profile-quest-row {
    position: relative;
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr) minmax(112px, 142px) minmax(132px, auto);
    gap: 12px;
    align-items: center;
    min-height: 112px;
    border: 1px solid rgba(130, 160, 196, 0.16);
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(var(--profile-tone, 99, 215, 154), 0.055), rgba(255, 255, 255, 0.014)),
        rgba(13, 21, 31, 0.86);
    padding: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
    transition: border-color 0.16s ease, background 0.16s ease, transform 0.16s ease;
    cursor: pointer;
}

.profile-quest-row.is-filtered-out {
    display: none;
}

.profile-quest-row:hover {
    border-color: rgba(var(--profile-tone, 99, 215, 154), 0.34);
    background: rgba(17, 28, 40, 0.92);
    transform: translateY(-1px);
}

.profile-quest-status-completed {
    --profile-tone: 106, 166, 255;
    border-color: rgba(106, 166, 255, 0.34);
    background:
        linear-gradient(135deg, rgba(106, 166, 255, 0.095), rgba(255, 255, 255, 0.014)),
        rgba(13, 21, 31, 0.88);
}

.profile-quest-status-completed::before {
    content: "";
    position: absolute;
    inset: 8px auto 8px 8px;
    width: 3px;
    border-radius: 99px;
    background: linear-gradient(180deg, rgba(106, 166, 255, 0.92), rgba(85, 220, 240, 0.45));
    box-shadow: 0 0 18px rgba(106, 166, 255, 0.28);
}

.profile-quest-status-completed .profile-quest-tags span:nth-child(2) {
    color: #cfe1ff;
    border-color: rgba(106, 166, 255, 0.36);
    background: rgba(106, 166, 255, 0.12);
}

.profile-quest-rank {
    display: grid;
    place-items: center;
    gap: 5px;
    width: 58px;
    min-height: 78px;
    border: 1px solid rgba(130, 160, 196, 0.20);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.035);
}

.profile-quest-rank span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    color: var(--ws-text);
    background: rgba(114, 168, 255, 0.14);
    border: 1px solid rgba(114, 168, 255, 0.34);
    font-family: 'JetBrains Mono', monospace;
    font-size: 1rem;
    font-weight: 900;
}

.profile-quest-rank small {
    color: var(--ws-text-muted);
    font-size: 0.66rem;
    font-weight: 800;
    text-align: center;
}

.profile-quest-body {
    min-width: 0;
}

.profile-quest-body h3 {
    margin: 7px 0 5px;
    color: var(--ws-text);
    font-size: 0.98rem;
    line-height: 1.24;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.profile-quest-body p {
    margin: 0;
    color: var(--ws-text-soft);
    font-size: 0.82rem;
    line-height: 1.42;
}

.profile-quest-tags,
.profile-quest-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.profile-quest-meta {
    margin-top: 8px;
}

.profile-quest-tags span,
.profile-quest-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    border: 1px solid rgba(130, 160, 196, 0.16);
    border-radius: 7px;
    color: var(--ws-text-muted);
    background: rgba(255, 255, 255, 0.035);
    padding: 3px 7px;
    font-size: 0.68rem;
    font-weight: 800;
}

.profile-quest-reward {
    display: grid;
    justify-items: center;
    gap: 4px;
    min-height: 84px;
    border: 1px solid rgba(130, 160, 196, 0.16);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.035);
    padding: 10px;
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    white-space: nowrap;
}

.profile-quest-reward strong {
    color: var(--ws-text);
    font-size: 0.9rem;
    font-weight: 900;
}

.profile-quest-actions {
    display: grid;
    gap: 7px;
    justify-items: stretch;
}

.profile-quest-actions .ws-btn-primary,
.profile-quest-actions .ws-btn-soft {
    width: 100%;
    min-height: 32px;
}

.profile-quest-cancel {
    min-height: 28px;
    font-family: inherit;
}

@container (max-width: 680px) {
    .profile-quest-toolbar {
        grid-template-columns: 1fr;
    }

    .profile-quest-row {
        grid-template-columns: 62px minmax(0, 1fr);
    }

    .profile-quest-reward,
    .profile-quest-actions,
    .profile-quest-details {
        grid-column: 1 / -1;
    }

    .profile-quest-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.profile-tone-green { --profile-tone: 59, 209, 127; }
.profile-tone-blue { --profile-tone: 106, 166, 255; }
.profile-tone-amber { --profile-tone: 255, 190, 92; }
.profile-tone-violet { --profile-tone: 164, 124, 255; }
.profile-tone-cyan { --profile-tone: 85, 220, 240; }
.profile-tone-rose { --profile-tone: 255, 120, 160; }

.profile-tone-green,
.profile-tone-blue,
.profile-tone-amber,
.profile-tone-violet,
.profile-tone-cyan,
.profile-tone-rose {
    border-color: rgba(var(--profile-tone), 0.24);
    box-shadow: inset 0 0 0 1px rgba(var(--profile-tone), 0.04);
}

.profile-tone-green .profile-wallet-mark,
.profile-tone-blue .profile-wallet-mark,
.profile-tone-amber .profile-wallet-mark,
.profile-tone-cyan .profile-wallet-mark,
.profile-tone-violet .profile-wallet-mark,
.profile-tone-rose .profile-wallet-mark,
.profile-tone-green .profile-quest-row .profile-wallet-mark,
.profile-tone-violet .profile-achievement-icon,
.profile-tone-blue .profile-achievement-icon,
.profile-tone-amber .profile-achievement-icon,
.profile-tone-green .profile-achievement-icon {
    background: rgba(var(--profile-tone), 0.12);
    border: 1px solid rgba(var(--profile-tone), 0.22);
}

@media (max-width: 1199.98px) {
    .profile-track-grid,
    .profile-achievement-grid,
    .profile-economy-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .profile-hero-card,
    .profile-goal-row {
        grid-template-columns: 1fr;
        display: grid;
    }

    .profile-wallet-strip {
        grid-template-columns: 1fr;
    }

    .profile-quest-row {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .profile-quest-reward {
        grid-column: 1 / -1;
        justify-items: start;
    }
}

.iot-monitor-shell {
    display: grid;
    gap: 12px;
}

.iot-monitor-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    background:
        radial-gradient(circle at 12% 20%, rgba(106, 166, 255, 0.13), transparent 34%),
        linear-gradient(135deg, rgba(59, 209, 127, 0.08), rgba(255, 255, 255, 0.014));
}

.iot-status-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.iot-status-card {
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.018);
}

.iot-status-card span,
.iot-status-card small {
    display: block;
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    line-height: 1.35;
}

.iot-status-card strong {
    display: block;
    color: var(--ws-text);
    font-size: 1.2rem;
    line-height: 1.2;
    margin: 3px 0;
}

.iot-status-online { border-color: rgba(59, 209, 127, 0.24); }
.iot-status-warning { border-color: rgba(255, 190, 92, 0.24); }
.iot-status-offline { border-color: rgba(255, 120, 160, 0.22); }
.iot-status-sensors { border-color: rgba(106, 166, 255, 0.22); }

.iot-monitor-layout {
    display: grid;
    grid-template-columns: minmax(240px, 0.34fr) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.iot-panel-title {
    color: var(--ws-text);
    font-weight: 800;
    margin-bottom: 10px;
}

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

.iot-device-card {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    border: 1px solid var(--ws-border);
    border-radius: 13px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.014);
    color: inherit;
    text-align: left;
}

.iot-device-card:hover,
.iot-device-card.is-active {
    border-color: rgba(106, 166, 255, 0.35);
    background: rgba(106, 166, 255, 0.07);
}

.iot-device-main {
    min-width: 0;
}

.iot-device-main strong,
.iot-device-main em {
    display: block;
}

.iot-device-main strong {
    color: var(--ws-text);
    font-size: 0.86rem;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
}

.iot-device-main em,
.iot-node-meta,
.iot-chart-caption {
    color: var(--ws-text-muted);
    font-style: normal;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
}

.iot-device-count {
    min-width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.045);
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.74rem;
    font-weight: 800;
}

.iot-device-workspace {
    min-height: calc(100vh - 245px);
}

.iot-device-head,
.iot-sensor-detail-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 12px;
}

.iot-node-title,
.iot-sensor-title {
    color: var(--ws-text);
    font-size: 1.12rem;
    font-weight: 800;
    margin: 2px 0 5px;
}

.iot-health-ring {
    width: 82px;
    height: 82px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(59, 209, 127, 0.28);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(59, 209, 127, 0.13), rgba(255, 255, 255, 0.012));
    flex: 0 0 auto;
}

.iot-health-ring strong,
.iot-health-ring span {
    display: block;
    text-align: center;
}

.iot-health-ring strong {
    color: var(--ws-text);
    font-size: 1.15rem;
    line-height: 1;
}

.iot-health-ring span {
    color: var(--ws-text-muted);
    font-size: 0.62rem;
    margin-top: -16px;
}

.iot-sensor-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}

.iot-sensor-tile {
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.014);
    text-align: left;
    color: inherit;
}

.iot-sensor-tile:hover,
.iot-sensor-tile.is-active {
    border-color: rgba(59, 209, 127, 0.34);
    background: rgba(59, 209, 127, 0.065);
}

.iot-sensor-tile span,
.iot-sensor-tile small {
    display: block;
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    line-height: 1.35;
}

.iot-sensor-tile strong {
    display: block;
    color: var(--ws-text);
    font-size: 1rem;
    line-height: 1.25;
    margin: 5px 0;
}

.iot-sensor-tile em {
    color: var(--ws-text-muted);
    font-style: normal;
    font-size: 0.72rem;
}

.iot-sensor-detail {
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 14px;
    padding: 12px;
    background: rgba(106, 166, 255, 0.035);
}

.iot-sensor-current {
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.78rem;
}

.iot-sensor-state {
    border: 1px solid rgba(59, 209, 127, 0.22);
    border-radius: 999px;
    padding: 6px 10px;
    color: var(--ws-success);
    background: rgba(59, 209, 127, 0.08);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    white-space: nowrap;
}

.iot-chart-frame {
    height: 260px;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    overflow: hidden;
    background:
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        rgba(0, 0, 0, 0.16);
    background-size: 100% 25%, 12.5% 100%, auto;
}

.iot-chart-frame svg {
    width: 100%;
    height: 100%;
}

.iot-chart-line {
    fill: none;
    stroke: rgba(59, 209, 127, 0.95);
    stroke-width: 3;
    vector-effect: non-scaling-stroke;
}

.iot-chart-area {
    fill: rgba(59, 209, 127, 0.10);
}

.iot-chart-point {
    fill: rgba(106, 166, 255, 0.95);
}

.iot-chart-caption {
    margin-top: 8px;
}

@media (max-width: 1199.98px) {
    .iot-sensor-grid,
    .iot-status-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .iot-monitor-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .iot-monitor-hero,
    .iot-device-head,
    .iot-sensor-detail-head {
        display: grid;
    }

    .iot-sensor-grid,
    .iot-status-strip {
        grid-template-columns: 1fr;
    }
}

.settings-modal-dialog {
    max-width: min(1120px, calc(100vw - 28px));
}

.settings-modal-body {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
    min-height: 520px;
}

.settings-nav {
    display: grid;
    gap: 8px;
    padding: 8px;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.018);
    position: sticky;
    top: 0;
}

.settings-nav-btn {
    width: 100%;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: var(--ws-text-muted);
    padding: 10px 12px;
    text-align: left;
    font-size: 0.86rem;
    font-weight: 800;
    transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.settings-nav-btn:hover,
.settings-nav-btn.is-active {
    border-color: rgba(106, 166, 255, 0.34);
    background: rgba(106, 166, 255, 0.11);
    color: var(--ws-text);
}

.settings-panels {
    min-width: 0;
}

.settings-panel {
    display: none;
    position: relative;
}

.settings-panel.is-active {
    display: grid;
    gap: 16px;
}

.settings-ui-info-trigger {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 5;
    min-width: 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    backdrop-filter: blur(10px);
}

.settings-ui-info-trigger span {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1;
}

.settings-ui-info-trigger:hover,
.settings-ui-info-trigger:focus-visible,
.settings-ui-info-trigger.is-open {
    outline: none;
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.32);
    background: rgba(106, 166, 255, 0.08);
}

.settings-subblock {
    display: grid;
    gap: 10px;
    padding-top: 4px;
}

.settings-theme-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.settings-label-line {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.settings-label-standalone {
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    font-weight: 800;
}

.settings-info-badge {
    width: 18px;
    height: 18px;
    padding: 0;
    border: 1px solid rgba(106, 166, 255, 0.36);
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(106, 166, 255, 0.10);
    color: #8fc3ff;
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    user-select: none;
}

.settings-info-badge:hover {
    border-color: rgba(106, 166, 255, 0.62);
    background: rgba(106, 166, 255, 0.18);
}

.settings-info-badge.is-open,
.settings-info-badge:focus-visible {
    border-color: rgba(120, 190, 255, 0.78);
    background: rgba(83, 159, 255, 0.22);
    color: #eaf4ff;
    outline: none;
    box-shadow: 0 0 0 3px rgba(83, 159, 255, 0.14);
}

.settings-info-popover {
    position: fixed;
    z-index: 1305;
    max-width: calc(100vw - 24px);
    padding: 12px 14px;
    border: 1px solid rgba(112, 145, 190, 0.36);
    border-radius: 12px;
    background:
        linear-gradient(145deg, rgba(16, 28, 45, 0.98), rgba(7, 15, 26, 0.98)),
        rgba(11, 20, 33, 0.98);
    color: #e9f2ff;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(82, 140, 225, 0.08) inset;
    font-size: 0.84rem;
    font-weight: 650;
    line-height: 1.45;
    pointer-events: auto;
}

.settings-info-popover[hidden] {
    display: none;
}

.settings-legal-profile-form {
    gap: 14px;
}

.settings-legal-notice {
    display: grid;
    gap: 6px;
    border: 1px solid rgba(243, 199, 109, 0.22);
    border-radius: 14px;
    background:
        radial-gradient(circle at 0% 0%, rgba(243, 199, 109, 0.12), transparent 34%),
        rgba(243, 199, 109, 0.055);
    padding: 12px 14px;
}

.settings-legal-notice strong {
    color: #ffe1a4;
    font-size: 0.88rem;
    font-weight: 900;
}

.settings-legal-notice span {
    color: var(--ws-text-soft);
    font-size: 0.84rem;
    line-height: 1.45;
}

.settings-legal-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
}

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

.settings-info-popover::before {
    content: "";
    position: absolute;
    top: -6px;
    left: 50%;
    width: 10px;
    height: 10px;
    border-left: 1px solid rgba(112, 145, 190, 0.36);
    border-top: 1px solid rgba(112, 145, 190, 0.36);
    background: rgba(16, 28, 45, 0.98);
    transform: translateX(-50%) rotate(45deg);
}

.settings-info-popover.is-above::before {
    top: auto;
    bottom: -6px;
    border: 0;
    border-right: 1px solid rgba(112, 145, 190, 0.36);
    border-bottom: 1px solid rgba(112, 145, 190, 0.36);
}

.mono {
    font-family: 'JetBrains Mono', monospace;
}

.muted {
    color: var(--ws-text-muted);
}

.hidden {
    display: none !important;
}

.modal-content.ws-modal {
    background: var(--ws-card-bg-strong);
    border: 1px solid var(--ws-border-strong);
    border-radius: 18px;
    color: var(--ws-text);
    box-shadow: var(--ws-shadow);
}

.mvp-notice-modal {
    max-width: 620px;
}

.mvp-notice-text {
    margin: 0;
    color: var(--ws-text);
    font-size: 1.16rem;
    font-weight: 650;
    line-height: 1.65;
}

.project-delete-confirm-modal .modal-body {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.project-delete-confirm-icon {
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 108, 115, 0.34);
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, rgba(255, 108, 115, 0.20), rgba(255, 108, 115, 0.08));
    color: #ff8f95;
    font-weight: 900;
    font-size: 1.1rem;
}

.project-delete-confirm-text {
    color: var(--ws-text);
    font-size: 0.98rem;
    font-weight: 800;
    line-height: 1.45;
}

.project-delete-confirm-error {
    margin-top: 10px;
    padding: 9px 11px;
    border: 1px solid rgba(255, 108, 115, 0.30);
    border-radius: 10px;
    background: rgba(255, 108, 115, 0.08);
    color: #ffb0b4;
    font-size: 0.82rem;
}

.settings-personalization {
    margin-top: 18px;
    border-top: 1px solid var(--ws-border);
    padding-top: 16px;
    display: grid;
    gap: 12px;
}

.settings-personalization-flat {
    margin-top: 0;
    border-top: 0;
    padding-top: 0;
}

.settings-section-title h6 {
    margin: 4px 0;
    color: var(--ws-text);
    font-weight: 900;
}

.settings-section-title p {
    margin: 0;
    color: var(--ws-text-muted);
    font-size: 0.82rem;
}

.settings-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(180px, 0.4fr);
    gap: 10px;
}

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

.settings-ai-mode-row {
    display: grid;
    grid-template-columns: minmax(220px, 340px);
    gap: 10px;
}

.settings-ai-pair-grid {
    display: grid;
    grid-template-columns: minmax(180px, 260px) minmax(220px, 320px);
    gap: 10px;
    align-items: end;
}

.settings-form-grid label,
.settings-ai-mode-row label,
.settings-ai-pair-grid label,
.settings-wide-field {
    display: grid;
    gap: 6px;
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    font-weight: 700;
}

.settings-ai-url-field input {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.88rem;
}

.settings-ai-current {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    border: 1px solid rgba(99, 231, 151, 0.25);
    border-radius: 14px;
    padding: 13px 15px;
    background:
        radial-gradient(circle at 0% 0%, rgba(99, 231, 151, 0.16), transparent 38%),
        linear-gradient(135deg, rgba(106, 166, 255, 0.10), rgba(59, 209, 127, 0.06)),
        rgba(8, 16, 25, 0.74);
}

.settings-ai-current span,
.settings-ai-current em {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.35;
}

.settings-ai-current strong {
    display: block;
    margin-top: 4px;
    color: var(--ws-text);
    font-size: 1.08rem;
    font-weight: 900;
    line-height: 1.2;
}

.settings-ai-current em {
    justify-self: end;
    max-width: 360px;
    text-align: right;
    font-style: normal;
}

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

.settings-ai-choice-card {
    min-height: 132px;
}

.settings-ai-token-fields {
    display: grid;
    gap: 12px;
    border: 1px solid rgba(106, 166, 255, 0.14);
    border-radius: 14px;
    padding: 13px;
    background:
        radial-gradient(circle at 100% 0%, rgba(106, 166, 255, 0.12), transparent 40%),
        rgba(8, 16, 25, 0.42);
}

.settings-section-title-compact {
    margin: 0;
    padding: 0;
}

.settings-section-title-compact p {
    margin: 4px 0 0;
}

.settings-ai-browser-note {
    border: 1px solid rgba(106, 166, 255, 0.14);
    border-radius: 12px;
    padding: 10px 12px;
    background: rgba(106, 166, 255, 0.06);
}

#ai-provider-settings-form[data-current-mode]:not([data-current-mode="user_token"]) .settings-ai-token-fields {
    display: none;
}

#ai-provider-settings-form[data-current-mode]:not([data-current-mode="browser_worker"]) .settings-ai-browser-note {
    display: none;
}

#ai-provider-settings-form .form-control,
#ai-provider-quick-form .form-control {
    min-height: 44px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018)),
        var(--ws-input-bg) !important;
    border: 1px solid var(--ws-border) !important;
    color: var(--ws-text) !important;
    caret-color: #8fc3ff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

#ai-provider-settings-form .form-control::placeholder,
#ai-provider-quick-form .form-control::placeholder {
    color: var(--ws-text-muted);
    opacity: 0.82;
}

#ai-provider-settings-form .form-control:focus,
#ai-provider-quick-form .form-control:focus {
    background:
        linear-gradient(180deg, rgba(106, 166, 255, 0.075), rgba(255, 255, 255, 0.025)),
        var(--ws-input-bg-focus) !important;
    border-color: rgba(106, 166, 255, 0.58) !important;
    color: var(--ws-text) !important;
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

#ai-provider-settings-form .form-control:-webkit-autofill,
#ai-provider-settings-form .form-control:-webkit-autofill:hover,
#ai-provider-settings-form .form-control:-webkit-autofill:focus,
#ai-provider-quick-form .form-control:-webkit-autofill,
#ai-provider-quick-form .form-control:-webkit-autofill:hover,
#ai-provider-quick-form .form-control:-webkit-autofill:focus {
    border-color: rgba(106, 166, 255, 0.42) !important;
    -webkit-text-fill-color: var(--ws-text) !important;
    caret-color: #8fc3ff;
    box-shadow: 0 0 0 1000px #0c1624 inset, 0 0 0 3px rgba(106, 166, 255, 0.08) !important;
    transition: background-color 9999s ease-in-out 0s;
}

.settings-browser-ai-session {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--ws-border);
}

.settings-browser-ai-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.qwen-browser-session-command {
    display: grid;
    gap: 7px;
}

.qwen-browser-session-downloads {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.qwen-browser-session-downloads a {
    text-decoration: none;
}

.qwen-browser-session-list {
    display: grid;
    gap: 8px;
}

.qwen-browser-session-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    background: rgba(8, 16, 25, 0.56);
    padding: 10px 12px;
}

.qwen-browser-session-item strong,
.qwen-browser-session-item span,
.qwen-browser-session-item b {
    display: block;
}

.qwen-browser-session-item strong {
    color: var(--ws-text);
    font-size: 0.92rem;
    font-weight: 850;
}

.qwen-browser-session-item span {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
}

.qwen-browser-session-item b {
    color: #8fc3ff;
    font-size: 0.78rem;
    text-align: right;
}

.qwen-browser-session-item .qwen-browser-use-worker {
    grid-column: 1 / -1;
    justify-self: start;
}

.qwen-browser-session-error {
    grid-column: 1 / -1;
    color: #ffb0b6;
    font-size: 0.76rem;
}

#qwen-browser-session-status.is-error {
    color: #ffb0b6;
}

.settings-select-wrap {
    position: relative;
    display: block;
}

.settings-select-wrap .settings-select {
    width: 100%;
}

.settings-select-wrap.is-customized .settings-select {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
}

.settings-custom-select {
    position: relative;
}

.settings-custom-select-btn {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018));
    color: var(--ws-text);
    padding: 10px 42px 10px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    font-size: 0.96rem;
    font-weight: 750;
    line-height: 1.25;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.settings-custom-select-btn::after {
    content: "⌄";
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-54%);
    color: #8fc3ff;
    font-size: 1.26rem;
    font-weight: 900;
    line-height: 1;
    text-shadow: 0 0 10px rgba(106, 166, 255, 0.34);
}

.settings-custom-select.is-open .settings-custom-select-btn,
.settings-custom-select-btn:focus {
    border-color: rgba(106, 166, 255, 0.60);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.045);
    outline: none;
}

.settings-custom-select-list {
    position: absolute;
    z-index: 50;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    display: none;
    padding: 6px;
    border: 1px solid rgba(106, 166, 255, 0.30);
    border-radius: 13px;
    background: #0c141e;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.45);
}

.settings-custom-select.is-open .settings-custom-select-list {
    display: grid;
    gap: 4px;
}

.settings-custom-option {
    width: 100%;
    border: 1px solid transparent;
    border-radius: 9px;
    background: transparent;
    color: var(--ws-text-soft);
    padding: 9px 11px;
    text-align: left;
    font-size: 0.92rem;
    font-weight: 720;
    line-height: 1.25;
}

.settings-custom-option:hover,
.settings-custom-option.is-selected {
    border-color: rgba(106, 166, 255, 0.38);
    background: rgba(106, 166, 255, 0.13);
    color: var(--ws-text);
}

.settings-token-wrap {
    position: relative;
    display: block;
}

.settings-token-wrap .form-control {
    padding-right: 86px;
}

.settings-token-toggle,
.settings-token-clear {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    border: 1px solid rgba(106, 166, 255, 0.30);
    border-radius: 10px;
    background: rgba(106, 166, 255, 0.08);
    color: #9dcaff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1;
}

.settings-token-toggle {
    right: 44px;
}

.settings-token-clear {
    right: 8px;
    border-color: rgba(255, 108, 115, 0.34);
    background: rgba(255, 108, 115, 0.08);
    color: #ffabb0;
    font-size: 1.15rem;
}

.settings-token-toggle:hover,
.settings-token-toggle.is-active {
    border-color: rgba(106, 166, 255, 0.58);
    background: rgba(106, 166, 255, 0.16);
    color: var(--ws-text);
}

.settings-token-clear:hover {
    border-color: rgba(255, 108, 115, 0.58);
    background: rgba(255, 108, 115, 0.16);
    color: #ffd0d3;
}

.settings-checkbox-line {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--ws-text-soft);
    font-size: 0.82rem;
    font-weight: 700;
}

.settings-checkbox-line input {
    width: 16px;
    height: 16px;
    accent-color: var(--ws-accent);
}

.settings-save-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    border-top: 1px solid var(--ws-border);
    padding-top: 12px;
}

.settings-save-row .messenger-info-note {
    flex: 1 1 260px;
    min-width: 0;
}

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

@media (max-width: 991.98px) {
    .settings-modal-body {
        grid-template-columns: 180px minmax(0, 1fr);
    }

    .settings-ai-mode-row,
    .settings-ai-pair-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .settings-ai-choice-grid {
        grid-template-columns: 1fr;
    }

    .settings-ai-current {
        grid-template-columns: 1fr;
    }

    .settings-ai-current em {
        justify-self: start;
        max-width: none;
        text-align: left;
    }

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

.ws-modal .modal-header,
.ws-modal .modal-footer {
    border-color: var(--ws-border);
}

.ws-modal .form-control,
.ws-modal .form-select {
    background: var(--ws-input-bg);
    border: 1px solid var(--ws-border);
    color: var(--ws-text);
    border-radius: 12px;
}

.ws-modal .form-select,
.ws-modal .settings-select {
    min-height: 44px;
    background-color: var(--ws-input-bg);
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 10l5 5 5-5' stroke='%238ea0b8' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 18px 18px;
    color: var(--ws-text);
    border-color: var(--ws-border);
    box-shadow: none;
    appearance: none;
    -webkit-appearance: none;
    padding-right: 38px;
}

.ws-modal .form-select:focus,
.ws-modal .settings-select:focus {
    border-color: rgba(106, 166, 255, 0.58);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.12);
}

.ws-modal .form-select option,
.ws-modal .settings-select option {
    background: #111923;
    color: #eef5ff;
}

.ws-modal textarea.form-control {
    overflow: auto;
    overflow-wrap: anywhere;
    word-break: break-word;
    scrollbar-color: var(--ws-scroll-thumb) var(--ws-scroll-track);
    scrollbar-width: thin;
}

.ws-modal textarea.form-control::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.ws-modal textarea.form-control::-webkit-scrollbar-track {
    background: var(--ws-scroll-track);
    border-radius: 999px;
}

.ws-modal textarea.form-control::-webkit-scrollbar-thumb {
    background: var(--ws-scroll-thumb);
    border: 2px solid transparent;
    border-radius: 999px;
    background-clip: padding-box;
}

.ws-modal textarea.form-control::-webkit-scrollbar-thumb:hover {
    background: var(--ws-scroll-thumb-hover);
    background-clip: padding-box;
}

.ws-modal textarea.form-control::-webkit-scrollbar-corner {
    background: var(--ws-input-bg);
}

/* Dark dropdown options for modal selects */
.ws-modal select,
.ws-modal .form-select {
    background-color: var(--ws-option-bg);
    color: var(--ws-text);
    color-scheme: dark;
}

body[data-theme="daylight"] .messenger-select {
    color-scheme: light;
}

body[data-theme="daylight"] .ws-modal select,
body[data-theme="daylight"] .ws-modal .form-select {
    color-scheme: light;
}

.ws-modal select option,
.ws-modal .form-select option {
    background-color: var(--ws-option-bg);
    color: var(--ws-text);
}

.ws-modal select optgroup,
.ws-modal .form-select optgroup {
    background-color: var(--ws-option-bg);
    color: var(--ws-text-soft);
}

.ws-modal select option:checked,
.ws-modal .form-select option:checked {
    background-color: var(--ws-option-checked-bg);
    color: var(--ws-text);
}

.ws-modal .form-control:focus,
.ws-modal .form-select:focus {
    background: var(--ws-input-bg-focus);
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.35);
    box-shadow: none;
}

.mwos-modal .modal-body {
    display: grid;
    gap: 14px;
}

.mwos-confirm-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.mwos-confirm-summary div {
    min-width: 0;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.03);
}

.mwos-confirm-summary span {
    display: block;
    margin-bottom: 4px;
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.mwos-confirm-summary strong {
    display: block;
    color: var(--ws-text);
    font-size: 0.88rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mwos-confirm-actions {
    display: grid;
    gap: 8px;
    max-height: 260px;
    overflow: auto;
    padding-right: 4px;
}

.mwos-confirm-mode {
    display: grid;
    gap: 8px;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.025);
}

.mwos-confirm-mode-title {
    color: var(--ws-text-muted);
    font-size: 0.70rem;
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.mwos-confirm-mode-option {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 9px;
    align-items: start;
    margin: 0;
    padding: 9px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.02);
    cursor: pointer;
}

.mwos-confirm-mode-option input {
    margin-top: 3px;
}

.mwos-confirm-mode-option strong,
.mwos-confirm-mode-option small {
    display: block;
}

.mwos-confirm-mode-option strong {
    color: var(--ws-text);
    font-size: 0.86rem;
}

.mwos-confirm-mode-option small {
    color: var(--ws-text-muted);
    line-height: 1.45;
}

.mwos-confirm-mode-option.is-disabled {
    opacity: 0.48;
    cursor: not-allowed;
}

.mwos-action-row {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 9px;
    background: rgba(255, 255, 255, 0.025);
}

.mwos-action-index {
    display: inline-flex;
    width: 28px;
    height: 28px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(106, 166, 255, 0.12);
    color: var(--ws-accent);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.74rem;
}

.mwos-action-row strong {
    display: block;
    color: var(--ws-text);
    font-size: 0.86rem;
}

.mwos-action-row p {
    margin: 3px 0 0;
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.74rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.mwos-raw-block {
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 10px;
    background: rgba(0, 0, 0, 0.16);
}

.mwos-raw-block summary {
    cursor: pointer;
    color: var(--ws-text-soft);
    font-size: 0.82rem;
}

.mwos-raw-block pre,
.mwos-build-log {
    margin: 10px 0 0;
    border-radius: 12px;
    background: rgba(2, 6, 12, 0.72);
    color: var(--ws-text-soft);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.76rem;
    line-height: 1.55;
}

.mwos-raw-block pre {
    max-height: 220px;
    overflow: auto;
    padding: 12px;
    white-space: pre-wrap;
}

.mwos-build-status {
    min-height: 22px;
    color: var(--ws-text-soft);
    font-size: 0.88rem;
}

.mwos-build-dialog {
    max-width: min(1280px, calc(100vw - 32px));
}

.mwos-build-dialog .modal-content {
    max-height: calc(100vh - 72px);
}

.mwos-build-dialog .modal-body {
    display: grid;
    grid-template-rows: auto minmax(240px, 1fr) auto auto auto;
    max-height: calc(100vh - 190px);
    overflow: hidden;
}

.mwos-build-toolbar {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin: 8px 0 0;
}

.mwos-build-copy-btn,
.mwos-build-stop-btn {
    min-height: 34px;
    padding: 7px 14px;
    font-weight: 700;
}

.mwos-build-stop-btn {
    border-color: rgba(255, 103, 103, 0.45);
    color: var(--ws-danger);
}

.mwos-build-status.is-ok {
    color: var(--ws-success);
}

.mwos-build-status.is-warn {
    color: var(--ws-warning);
}

.mwos-build-status.is-error {
    color: var(--ws-danger);
}

.mwos-build-log {
    min-height: 240px;
    max-height: min(460px, calc(100vh - 360px));
    overflow: auto;
    padding: 12px;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.mwos-log-line {
    padding: 3px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.mwos-log-ok {
    color: var(--ws-success);
}

.mwos-log-warn,
.mwos-log-warning {
    color: var(--ws-warning);
}

.mwos-log-error {
    color: var(--ws-danger);
}

.mwos-build-download {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-start;
}

.mwos-build-instructions {
    border: 1px solid rgba(59, 209, 127, 0.16);
    border-radius: 14px;
    padding: 12px;
    background: rgba(59, 209, 127, 0.05);
}

.mwos-build-instructions-title {
    margin-bottom: 8px;
    color: var(--ws-text);
    font-weight: 700;
}

.mwos-build-instructions ol {
    margin: 0;
    padding-left: 20px;
    color: var(--ws-text-soft);
    line-height: 1.55;
}

.mwos-build-prep-actions {
    display: grid;
    gap: 9px;
}

.mwos-paid-build-btn {
    gap: 8px;
}

.mwos-paid-build-icon {
    display: inline-grid;
    place-items: center;
    min-width: 24px;
    height: 24px;
    border-radius: 999px;
    background: rgba(99, 215, 154, 0.18);
    color: #8ff0bc;
    border: 1px solid rgba(99, 215, 154, 0.36);
    font-size: 0.72rem;
    font-weight: 900;
    font-family: 'JetBrains Mono', monospace;
}

.mwos-build-billing-card {
    display: grid;
    gap: 12px;
    margin: 14px 0;
}

.mwos-build-queue-current {
    margin-bottom: 0;
}

.mwos-build-queue-card .ai-queue-priority-options {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.mwos-build-queue-card.is-highlighted {
    border-color: rgba(255, 207, 102, 0.55);
    box-shadow: 0 0 0 3px rgba(255, 207, 102, 0.12);
}

.mwos-build-prep-ready {
    border: 1px solid rgba(61, 162, 109, 0.22);
    border-radius: 14px;
    padding: 10px 12px;
    background: rgba(61, 162, 109, 0.075);
    color: var(--ws-text-soft);
    font-size: 0.86rem;
}

.mwos-build-prep-action {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    padding: 10px;
    background: rgba(106, 166, 255, 0.045);
}

.mwos-build-prep-action input {
    margin-top: 3px;
}

.mwos-build-prep-action strong,
.mwos-build-prep-action small {
    display: block;
}

.mwos-build-prep-action strong {
    color: var(--ws-text);
    font-size: 0.9rem;
}

.mwos-build-prep-action small {
    color: var(--ws-text-muted);
    line-height: 1.45;
}

@media (max-width: 760px) {
    .mwos-confirm-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1599px) {
    .workspace-shell {
        --left-panel-width: 280px;
        --right-panel-width: 320px;
    }
}

@media (max-width: 1399px) {
    .private-directory-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .composer-grid {
        grid-template-columns: 1fr;
    }

    .channel-layout {
        grid-template-columns: 220px minmax(0, 1fr);
    }

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

@media (max-width: 1199px) {
    .workspace-shell,
    .workspace-shell.left-collapsed,
    .workspace-shell.right-collapsed,
    .workspace-shell.left-collapsed.right-collapsed {
        grid-template-columns: 1fr;
    }

    .workspace-panel,
    .workspace-main {
        min-height: auto;
    }

    .workspace-resizer {
        display: none;
    }

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

    .workspace-topbar {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .private-directory-filters,
    .private-people-results,
    .settings-form-grid {
        grid-template-columns: 1fr;
    }

    .settings-modal-body,
    .settings-ai-mode-row,
    .settings-ai-pair-grid,
    .settings-ai-choice-grid,
    .settings-legal-grid,
    .settings-action-grid {
        grid-template-columns: 1fr;
    }

    .settings-nav {
        position: static;
    }

    .workspace-shell {
        padding: 10px;
        gap: 10px;
    }

    .ws-content {
        padding-left: 12px;
        padding-right: 12px;
    }

    .fleet-stats {
        grid-template-columns: 1fr;
    }

    .channel-composer {
        grid-template-columns: 1fr;
    }

    .settings-theme-list {
        flex-direction: column;
    }
}

.ws-profile-card-btn {
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
    box-shadow: none;
    appearance: none;
    -webkit-appearance: none;
}

.ws-profile-card-btn:focus,
.ws-profile-card-btn:active,
.ws-profile-card-btn:hover {
    background: transparent;
    color: inherit;
    outline: none;
    box-shadow: none;
}

.ws-profile-main-status {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.ws-profile-main-label {
    color: var(--ws-text-muted);
    font-size: 0.70rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: 'JetBrains Mono', monospace;
    margin-bottom: 6px;
}

.ws-profile-main-title {
    color: var(--ws-text);
    font-size: 0.98rem;
    font-weight: 700;
    line-height: 1.35;
    margin-bottom: 4px;
    word-break: break-word;
}

.ws-profile-main-track {
    color: var(--ws-text-soft);
    font-size: 0.82rem;
    line-height: 1.45;
    word-break: break-word;
}

.ws-profile-microline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.66rem;
    line-height: 1.15;
}

.ws-profile-status-chip,
.ws-profile-wallet-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 20px;
    border-radius: 999px;
    border: 1px solid rgba(130, 160, 196, 0.18);
    background: rgba(255, 255, 255, 0.035);
    color: var(--ws-text-muted);
    padding: 3px 6px;
}

.ws-profile-status-chip {
    border-color: rgba(106, 166, 255, 0.22);
    color: rgba(185, 210, 245, 0.88);
}

.ws-profile-wallet-chip strong {
    color: var(--ws-text);
    font-weight: 700;
}

.ws-profile-wallet-chip.wallet-fx span { color: #63d79a; }
.ws-profile-wallet-chip.wallet-sd span { color: #72a8ff; }
.ws-profile-wallet-chip.wallet-gw span { color: #f3c76d; }

.ws-profile-microline-head {
    flex: 1 1 auto;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 3px;
    margin: 0;
    overflow: hidden;
}

.ws-profile-microline-head .ws-profile-status-chip,
.ws-profile-microline-head .ws-profile-wallet-chip {
    min-height: 18px;
    padding: 2px 4px;
    gap: 3px;
    font-size: 0.58rem;
    letter-spacing: 0.01em;
}

.ws-profile-microline-head .ws-profile-wallet-chip strong {
    max-width: 36px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ws-profile-folder-head {
    align-items: flex-start;
}

.ws-profile-folder-title {
    display: grid;
    gap: 7px;
    min-width: 0;
    flex: 1 1 auto;
}

.ws-profile-folder-name {
    color: var(--ws-text);
    font-size: 0.98rem;
    font-weight: 900;
    line-height: 1.1;
}

.ws-profile-folder-resources {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    overflow: hidden;
}

.ws-profile-folder-resource {
    display: inline-grid;
    grid-template-columns: 22px minmax(0, auto);
    align-items: center;
    gap: 4px;
    min-width: 0;
    min-height: 24px;
    border: 1px solid rgba(130, 160, 196, 0.16);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.035);
    padding: 2px 5px 2px 2px;
    font-family: 'JetBrains Mono', monospace;
}

.ws-profile-folder-gem {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 20px;
    border-radius: 7px;
    font-size: 0.52rem;
    font-weight: 900;
    letter-spacing: 0;
}

.ws-profile-folder-resource strong {
    color: var(--ws-text);
    font-size: 0.66rem;
    font-weight: 900;
    max-width: 46px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ws-profile-folder-resource.wallet-fx .ws-profile-folder-gem {
    color: #c9ffdd;
    background: radial-gradient(circle at 30% 25%, rgba(99, 215, 154, 0.42), rgba(24, 91, 58, 0.28));
}

.ws-profile-folder-resource.wallet-sd .ws-profile-folder-gem {
    color: #dce9ff;
    background: radial-gradient(circle at 30% 25%, rgba(114, 168, 255, 0.42), rgba(30, 68, 129, 0.28));
}

.ws-profile-folder-resource.wallet-gw .ws-profile-folder-gem {
    color: #ffe8a7;
    background: radial-gradient(circle at 30% 25%, rgba(243, 199, 109, 0.52), rgba(125, 84, 20, 0.30));
}

.ws-sidebar-microline {
    min-width: 0;
    opacity: 0.88;
}

.ws-sidebar-chip {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    min-height: 18px;
    border-radius: 999px;
    border: 1px solid rgba(130, 160, 196, 0.16);
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-muted);
    padding: 2px 5px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.58rem;
    line-height: 1;
    white-space: nowrap;
}

.ws-sidebar-chip span {
    color: rgba(185, 210, 245, 0.78);
}

.ws-sidebar-chip strong {
    color: var(--ws-text);
    font-weight: 800;
    max-width: 34px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ws-sidebar-chip.tone-green span { color: #63d79a; }
.ws-sidebar-chip.tone-blue span { color: #72a8ff; }
.ws-sidebar-chip.tone-amber span { color: #f3c76d; }
.ws-sidebar-chip.tone-violet span { color: #b69cff; }

.ws-profile-wallets {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    display: grid;
    gap: 8px;
}

.ws-profile-wallet-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    color: var(--ws-text-soft);
    font-size: 0.84rem;
    line-height: 1.4;
}

.ws-profile-wallet-row strong {
    color: var(--ws-text);
    font-weight: 700;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.ws-profile-badges-wrap {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.ws-profile-badges-label {
    color: var(--ws-text-muted);
    font-size: 0.70rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: 'JetBrains Mono', monospace;
    margin-bottom: 8px;
}

.ws-profile-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ws-profile-badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid rgba(106, 166, 255, 0.22);
    background: rgba(106, 166, 255, 0.08);
    color: var(--ws-text);
    font-size: 0.75rem;
    line-height: 1.2;
}

.ws-user-card {
    transition: border-color 0.18s ease, background 0.18s ease;
}

.ws-user-card:hover {
    background: rgba(255, 255, 255, 0.02);
}

.profile-scroll-area {
    height: calc(100vh - 170px);
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px;
}

.profile-scroll-area::-webkit-scrollbar {
    width: 10px;
}

.profile-scroll-area::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.03);
    border-radius: 999px;
}

.profile-scroll-area::-webkit-scrollbar-thumb {
    background: rgba(106, 166, 255, 0.28);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.profile-scroll-area::-webkit-scrollbar-thumb:hover {
    background: rgba(106, 166, 255, 0.42);
    background-clip: padding-box;
}

.ws-panel-scroll {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 14px;
}

.ws-panel-zone {
    display: grid;
    gap: 0;
    min-height: 28px;
}

.ws-panel-zone-top {
    flex: 0 0 auto;
}

.ws-panel-zone-bottom {
    flex: 0 0 auto;
    margin-top: auto;
    padding-top: 10px;
}

.ws-panel-zone:empty {
    border: 1px dashed rgba(106, 166, 255, 0.14);
    border-radius: 14px;
    min-height: 34px;
}

.ws-panel-zone:empty::before {
    content: "";
}

.ws-panel-scroll::-webkit-scrollbar {
    width: 10px;
}

.ws-panel-scroll::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.03);
    border-radius: 999px;
}

.ws-panel-scroll::-webkit-scrollbar-thumb {
    background: rgba(106, 166, 255, 0.24);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.ws-panel-scroll::-webkit-scrollbar-thumb:hover {
    background: rgba(106, 166, 255, 0.36);
    background-clip: padding-box;
}

.ws-collapsible {
    margin-bottom: 14px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.015);
    overflow: hidden;
}

.ws-collapsible-inner {
    margin-top: 12px;
    margin-bottom: 0;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.01);
}

.ws-collapsible-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    background: rgba(255, 255, 255, 0.02);
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.ws-collapsible-head:hover {
    border-color: rgba(106, 166, 255, 0.20);
    background: linear-gradient(135deg, rgba(106, 166, 255, 0.09), rgba(59, 209, 127, 0.035));
    box-shadow: inset 0 0 0 1px rgba(106, 166, 255, 0.05);
}

.ws-collapsible-head-inner {
    padding: 9px 10px;
}

.ws-collapsible-title {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: 'JetBrains Mono', monospace;
    margin: 0;
    min-width: 0;
}

.ws-collapsible-title-inner {
    font-size: 0.70rem;
}

.ws-collapsible-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ws-collapsible-body {
    padding: 12px;
}

.ws-collapsible.is-collapsed > .ws-collapsible-body {
    display: none;
}

.ws-collapsible.is-collapsed > .ws-collapsible-head {
    border-bottom: 0;
}

.ws-collapse-toggle {
    width: 28px;
    height: 28px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex: 0 0 auto;
    transition: 0.18s ease;
}

.ws-collapse-toggle:hover {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.28);
    background: rgba(106, 166, 255, 0.08);
}

.ws-sidebar-info-toggle {
    color: rgba(207, 224, 248, 0.86);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    font-weight: 850;
}

.ws-sidebar-info-toggle:hover,
.ws-sidebar-info-toggle.is-open {
    color: #edf6ff;
    border-color: rgba(106, 166, 255, 0.44);
    background: rgba(106, 166, 255, 0.12);
}

.ws-project-add-toggle {
    color: var(--ws-success);
    font-size: 1rem;
    font-weight: 900;
}

.ws-project-add-toggle:hover {
    border-color: rgba(59, 209, 127, 0.34);
    background: rgba(59, 209, 127, 0.10);
    color: var(--ws-text);
}

.ws-project-add-toggle span {
    line-height: 1;
    transform: translateY(-1px);
}

.ws-project-folder-add-toggle svg {
    width: 17px;
    height: 17px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.ws-project-folder-add-toggle {
    color: var(--ws-text-soft);
}

.ws-project-folder-add-toggle:hover {
    border-color: rgba(106, 166, 255, 0.30);
    background: rgba(106, 166, 255, 0.09);
    color: var(--ws-text);
}

.ws-collapse-icon {
    font-size: 0.86rem;
    line-height: 1;
}

.ws-collapsible.is-collapsed .ws-collapse-icon {
    transform: rotate(-90deg);
    display: inline-block;
}

.ws-btn-ghost-sm {
    padding: 6px 9px;
    font-size: 0.74rem;
}

.ws-panel-body {
    padding: 0;
    overflow: visible;
}

.ws-user-card-profile {
    padding: 12px;
    border-bottom: 0;
}

.ws-profile-summary {
    display: block;
    width: 100%;
    padding: 4px 2px 10px;
    cursor: pointer;
    border-radius: 12px;
    transition: background 0.18s ease;
}

.ws-profile-summary:hover {
    background: rgba(255, 255, 255, 0.02);
}

#left-panel .ws-panel-scroll,
#right-panel .ws-panel-scroll {
    height: 100%;
}

#left-panel,
#right-panel {
    min-height: 0;
}

#left-panel .ws-panel-scroll {
    padding-bottom: 18px;
}

.workspace-panel {
    background: linear-gradient(180deg, rgba(16, 23, 32, 0.95), rgba(13, 19, 28, 0.95));
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.workspace-main {
    background: linear-gradient(180deg, rgba(16, 23, 32, 0.90), rgba(12, 18, 27, 0.94));
    display: flex;
    flex-direction: column;
    min-height: 0;
}

#left-panel,
#right-panel,
.workspace-main,
.ws-content {
    min-height: 0;
}

#left-panel .ws-footer-actions {
    flex: 0 0 auto;
    margin-top: 0;
    position: relative;
    z-index: 5;
    background: linear-gradient(180deg, rgba(16, 23, 32, 0.92), rgba(13, 19, 28, 0.98));
}

#left-panel .ws-panel-scroll {
    padding-bottom: 14px;
}

/* ===== AI session sidebar + simplified center chat ===== */

#tab-ai {
    min-height: 0;
}

.tab-pane#tab-ai.is-active {
    display: block;
    height: calc(100vh - 104px);
    overflow: hidden;
}

.ai-chat-card {
    position: relative;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-top: 0;
    background:
        radial-gradient(circle at 10% 0%, rgba(106, 166, 255, 0.12), transparent 32%),
        radial-gradient(circle at 92% 8%, rgba(59, 209, 127, 0.08), transparent 30%),
        linear-gradient(180deg, rgba(15, 23, 32, 0.96), rgba(9, 15, 23, 0.98));
}

.ai-build-corner-menu-trigger {
    position: absolute;
    top: 16px;
    right: 22px;
    z-index: 10020;
    min-width: 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    cursor: pointer;
    box-shadow: none;
    backdrop-filter: blur(10px);
    overflow: hidden;
}

.ai-provider-quick-open {
    position: absolute;
    top: 16px;
    right: 58px;
    z-index: 10020;
    min-width: 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    cursor: pointer;
    box-shadow: none;
    backdrop-filter: blur(10px);
}

.ai-provider-quick-open span {
    font-size: 0.86rem;
    line-height: 1;
    transform: translateY(-0.5px);
}

.ai-provider-quick-open:hover,
.ai-provider-quick-open:focus-visible {
    outline: none;
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.32);
    background: rgba(106, 166, 255, 0.08);
}

.ai-provider-current-chip {
    position: absolute;
    top: 13px;
    right: 94px;
    z-index: 10019;
    max-width: min(340px, calc(100% - 128px));
    min-height: 34px;
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 999px;
    display: grid;
    grid-template-columns: auto minmax(0, auto) auto;
    gap: 7px;
    align-items: center;
    padding: 5px 10px;
    background:
        linear-gradient(135deg, rgba(106, 166, 255, 0.12), rgba(59, 209, 127, 0.06)),
        rgba(8, 16, 25, 0.70);
    color: var(--ws-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(12px);
    cursor: pointer;
}

.ai-provider-current-chip span,
.ai-provider-current-chip em {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.64rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.ai-provider-current-chip strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--ws-text);
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1;
}

.ai-provider-current-chip:hover,
.ai-provider-current-chip:focus-visible {
    outline: none;
    border-color: rgba(106, 166, 255, 0.42);
    background:
        linear-gradient(135deg, rgba(106, 166, 255, 0.18), rgba(59, 209, 127, 0.09)),
        rgba(8, 16, 25, 0.82);
}

.ai-provider-quick-modal {
    overflow: hidden;
    position: relative;
}

.ai-provider-quick-info-trigger {
    top: 16px;
    right: 54px;
}

.ai-provider-quick-modal .modal-header {
    align-items: start;
    padding-right: 86px;
}

.ai-provider-quick-subtitle {
    margin: 6px 0 0;
    max-width: 720px;
    color: var(--ws-text-muted);
    font-size: 0.88rem;
    line-height: 1.45;
}

.ai-provider-quick-current {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    margin-bottom: 14px;
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 14px;
    padding: 11px 13px;
    background:
        radial-gradient(circle at 0% 0%, rgba(106, 166, 255, 0.16), transparent 36%),
        rgba(8, 16, 25, 0.58);
}

.ai-provider-quick-current span,
.ai-provider-quick-current em {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1;
}

.ai-provider-quick-current strong {
    min-width: 0;
    color: var(--ws-text);
    font-size: 1rem;
    font-weight: 900;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ai-provider-quick-form {
    gap: 12px;
}

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

.ai-provider-choice-card {
    min-height: 142px;
    position: relative;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    border: 1px solid rgba(106, 166, 255, 0.16);
    border-radius: 14px;
    padding: 12px;
    background:
        radial-gradient(circle at 0% 0%, rgba(106, 166, 255, 0.10), transparent 42%),
        rgba(8, 16, 25, 0.62);
    color: var(--ws-text);
    text-align: left;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, transform .16s ease;
}

.ai-provider-choice-card:hover,
.ai-provider-choice-card:focus-visible {
    outline: none;
    border-color: rgba(106, 166, 255, 0.38);
    background:
        radial-gradient(circle at 0% 0%, rgba(106, 166, 255, 0.16), transparent 42%),
        rgba(10, 20, 34, 0.78);
}

.ai-provider-choice-card.is-selected {
    border-color: rgba(99, 231, 151, 0.48);
    background:
        radial-gradient(circle at 0% 0%, rgba(99, 231, 151, 0.16), transparent 38%),
        linear-gradient(135deg, rgba(106, 166, 255, 0.12), rgba(59, 209, 127, 0.08)),
        rgba(8, 16, 25, 0.76);
    box-shadow: inset 0 0 0 1px rgba(99, 231, 151, 0.10), 0 14px 34px rgba(0, 0, 0, 0.18);
}

.ai-provider-choice-check {
    width: 28px;
    height: 28px;
    border: 1px solid rgba(106, 166, 255, 0.28);
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(106, 166, 255, 0.08);
    color: transparent;
    font-size: 0.82rem;
    font-weight: 900;
}

.ai-provider-choice-card.is-selected .ai-provider-choice-check {
    border-color: rgba(99, 231, 151, 0.62);
    background: rgba(99, 231, 151, 0.18);
    color: #8dffbd;
}

.ai-provider-choice-copy {
    min-width: 0;
    display: grid;
    gap: 7px;
}

.ai-provider-choice-copy strong {
    color: var(--ws-text);
    font-size: 0.92rem;
    font-weight: 900;
    line-height: 1.2;
}

.ai-provider-choice-copy em {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 650;
    line-height: 1.35;
}

.ai-provider-choice-card b {
    display: none;
    position: absolute;
    right: 10px;
    bottom: 9px;
    color: #8dffbd;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.64rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.ai-provider-choice-card.is-selected b {
    display: block;
}

.ai-provider-quick-form[data-current-mode]:not([data-current-mode="user_token"]) .ai-provider-token-fields {
    display: none;
}

.ai-provider-quick-form[data-current-mode="user_token"] .ai-provider-quick-browser-note {
    display: none;
}

.ai-provider-quick-form[data-current-mode="site_free"] .ai-provider-quick-browser-note {
    display: none;
}

.ai-provider-quick-browser-note {
    border: 1px solid rgba(106, 166, 255, 0.14);
    border-radius: 12px;
    padding: 10px 12px;
    background: rgba(106, 166, 255, 0.06);
}

.ai-provider-applied-text {
    margin: 0;
    color: var(--ws-text);
    font-size: 1rem;
    font-weight: 750;
    line-height: 1.5;
}

@media (max-width: 760px) {
    .ai-provider-current-chip {
        grid-template-columns: minmax(0, 1fr) auto;
        right: 94px;
        max-width: calc(100% - 132px);
    }

    .ai-provider-current-chip span {
        display: none;
    }

    .ai-provider-choice-grid {
        grid-template-columns: 1fr;
    }
}

.ide-ui-window-info-trigger {
    position: absolute;
    top: 16px;
    right: 22px;
    z-index: 10020;
    min-width: 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    cursor: pointer;
    box-shadow: none;
    backdrop-filter: blur(10px);
}

.ide-ui-window-info-trigger span {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1;
    transform: translateY(-0.5px);
}

.ide-ui-window-info-trigger:hover,
.ide-ui-window-info-trigger:focus-visible,
.ide-ui-window-info-trigger.is-open {
    outline: none;
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.32);
    background: rgba(106, 166, 255, 0.08);
}

#tab-community > .ide-ui-window-info-trigger,
#tab-private > .ide-ui-window-info-trigger,
#tab-support > .ide-ui-window-info-trigger {
    top: 58px;
    right: 18px;
}

.ai-build-corner-menu-trigger::before {
    content: none;
}

.ai-build-corner-menu-trigger::after {
    content: none;
}

.ai-build-corner-menu-trigger span {
    position: relative;
    z-index: 1;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1;
    font-style: normal;
    transform: translateY(-0.5px);
    text-shadow: none;
}

.ai-build-corner-menu-trigger:hover,
.ai-build-corner-menu-trigger:focus-visible,
.ai-build-corner-menu-trigger.is-open {
    outline: none;
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.32);
    background: rgba(106, 166, 255, 0.08);
    box-shadow: none;
}

.ai-build-corner-menu {
    position: absolute;
    top: 46px;
    right: 12px;
    z-index: 10021;
    display: none;
    width: min(310px, calc(100% - 26px));
    padding: 8px;
    border: 1px solid rgba(106, 166, 255, 0.25);
    border-radius: 12px;
    background:
        radial-gradient(circle at 100% 0%, rgba(106, 166, 255, 0.18), transparent 38%),
        radial-gradient(circle at 0% 100%, rgba(59, 209, 127, 0.10), transparent 42%),
        linear-gradient(180deg, rgba(13, 22, 35, 0.98), rgba(5, 10, 18, 0.98));
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.58), 0 0 38px rgba(106, 166, 255, 0.08);
    backdrop-filter: blur(14px);
}

.ai-build-corner-menu.is-open {
    display: grid;
    gap: 5px;
}

.ai-build-corner-menu-head {
    display: grid;
    gap: 3px;
    padding: 7px 8px 8px;
    border-bottom: 1px solid rgba(106, 166, 255, 0.14);
    margin-bottom: 2px;
}

.ai-build-corner-menu-head span {
    color: rgba(144, 181, 228, 0.82);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.12em;
}

.ai-build-corner-menu-head strong {
    color: var(--ws-text);
    font-size: 0.86rem;
    line-height: 1.2;
}

.ai-build-corner-menu-head small {
    color: rgba(129, 205, 244, 0.84);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.66rem;
    font-weight: 750;
    line-height: 1.2;
}

.ai-build-corner-menu button {
    min-height: 46px;
    display: grid;
    gap: 2px;
    border: 0;
    border-radius: 8px;
    padding: 8px 9px;
    background: transparent;
    color: rgba(230, 237, 249, 0.94);
    text-align: left;
    cursor: pointer;
}

.ai-build-corner-menu button strong {
    color: rgba(236, 244, 255, 0.96);
    font-size: 0.80rem;
    font-weight: 800;
    line-height: 1.2;
}

.ai-build-corner-menu button em {
    color: rgba(147, 165, 190, 0.88);
    font-size: 0.68rem;
    font-style: normal;
    font-weight: 650;
    line-height: 1.25;
}

.ai-build-corner-menu button:hover,
.ai-build-corner-menu button:focus-visible {
    outline: none;
    background: linear-gradient(135deg, rgba(106, 166, 255, 0.14), rgba(59, 209, 127, 0.06));
    color: #ffffff;
}

.ai-build-corner-menu button:hover em,
.ai-build-corner-menu button:focus-visible em {
    color: rgba(204, 220, 242, 0.94);
}

.ai-build-corner-menu-status {
    min-height: 20px;
    padding: 4px 8px 2px;
    color: rgba(111, 224, 153, 0.95);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    font-weight: 800;
}

.ai-build-corner-menu-status.is-error {
    color: rgba(255, 136, 136, 0.95);
}

.ai-chat-card.ai-build-corner-highlight {
    box-shadow: inset 0 0 0 2px rgba(255, 209, 102, 0.92), 0 0 34px rgba(255, 209, 102, 0.22);
}

.ai-chat-statusbar {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 7px;
    padding: 8px 14px 6px;
    margin: 0 -14px;
    border-bottom: 1px solid var(--ws-border);
    background:
        linear-gradient(135deg, rgba(106, 166, 255, 0.09), rgba(59, 209, 127, 0.04)),
        rgba(255, 255, 255, 0.025);
}

.ai-status-main,
.ai-stream-preview {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 16px;
    background:
        radial-gradient(circle at 12% 0%, rgba(106, 166, 255, 0.16), transparent 42%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018));
}

.ai-status-main {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-height: 50px;
    padding: 8px 10px;
}

.ai-status-orb {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background:
        radial-gradient(circle at 35% 30%, rgba(59, 209, 127, 0.34), transparent 42%),
        linear-gradient(145deg, rgba(59, 209, 127, 0.15), rgba(106, 166, 255, 0.12));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 12px 26px rgba(0, 0, 0, 0.24);
}

.ai-status-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.ai-chat-session-summary {
    min-width: 0;
    margin-bottom: 2px;
}

.ai-chat-session-title {
    color: var(--ws-text);
    display: block;
    font-size: 0.92rem;
    line-height: 1.2;
    font-weight: 700;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ai-chat-session-meta {
    display: none;
}

.ai-chat-status-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex-wrap: nowrap;
}

.ai-chat-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ws-success);
    box-shadow: 0 0 16px rgba(59, 209, 127, 0.65);
}

.ai-chat-status-label {
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: 'JetBrains Mono', monospace;
}

.ai-chat-live-status {
    color: var(--ws-text);
    font-size: 0.90rem;
    line-height: 1.25;
    white-space: nowrap;
}

.ai-chat-status-hint {
    color: var(--ws-text-muted);
    font-size: 0.70rem;
    line-height: 1.2;
    display: flex;
    gap: 10px;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
}

.ai-chat-status-hint span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ai-stream-preview {
    min-height: 50px;
    padding: 8px 10px;
    display: grid;
    align-content: start;
    gap: 4px;
}

.ai-stream-preview::before,
.ai-status-main::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.05), transparent);
    transform: translateX(-70%);
    opacity: 0.55;
}

.ai-status-main::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 0;
    height: 2px;
    border-radius: 999px;
    opacity: 0;
    background: linear-gradient(90deg, transparent, rgba(106, 166, 255, 0.95), rgba(59, 209, 127, 0.95), transparent);
    background-size: 230% 100%;
    transition: opacity 0.18s ease;
}

.ai-stream-preview.is-active::before {
    animation: aiStatusSweep 2.4s linear infinite;
}

.ai-chat-card.is-ai-streaming .ai-status-main::before {
    animation: aiStatusSweep 2.1s linear infinite;
}

.ai-chat-card.is-ai-streaming .ai-status-main::after {
    opacity: 1;
    animation: aiStatusProgressFlow 1.25s linear infinite;
}

.ai-chat-card.is-ai-streaming .ai-status-orb {
    animation: aiStatusOrbPulse 1.08s ease-in-out infinite;
}

.ai-chat-card.is-ai-streaming .ai-chat-status-dot {
    background: #3bd17f;
    animation: aiStatusDotPulse 1.08s ease-in-out infinite;
}

.ai-chat-card.is-ai-streaming .ai-chat-live-status,
body.is-ai-streaming #ai-side-live-status {
    color: #dfffea;
    text-shadow: 0 0 16px rgba(59, 209, 127, 0.22);
}

@keyframes aiStatusSweep {
    to { transform: translateX(70%); }
}

@keyframes aiStatusProgressFlow {
    from { background-position: 120% 0; }
    to { background-position: -120% 0; }
}

@keyframes aiStatusOrbPulse {
    0%, 100% {
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 12px 26px rgba(0, 0, 0, 0.24);
        transform: scale(1);
    }
    50% {
        box-shadow: inset 0 0 0 1px rgba(59, 209, 127, 0.26), 0 0 28px rgba(59, 209, 127, 0.18);
        transform: scale(1.035);
    }
}

@keyframes aiStatusDotPulse {
    0%, 100% {
        transform: scale(0.82);
        box-shadow: 0 0 0 0 rgba(59, 209, 127, 0.38), 0 0 16px rgba(59, 209, 127, 0.65);
    }
    50% {
        transform: scale(1);
        box-shadow: 0 0 0 8px rgba(59, 209, 127, 0), 0 0 20px rgba(59, 209, 127, 0.78);
    }
}

.ai-stream-preview-head {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--ws-text-muted);
    font-size: 0.66rem;
    font-family: 'JetBrains Mono', monospace;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.ai-stream-preview-icon {
    color: var(--ws-accent);
    text-shadow: 0 0 14px rgba(106, 166, 255, 0.5);
}

.ai-stream-preview-text {
    position: relative;
    z-index: 1;
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    line-height: 1.32;
    min-height: 8em;
    max-height: 100%;
    overflow: auto;
    white-space: pre-line;
}

.ai-stream-preview.is-active .ai-stream-preview-text {
    color: var(--ws-text);
}

.ai-rag-panel {
    margin-top: 12px;
    padding: 12px;
    border: 1px solid rgba(106, 166, 255, 0.28);
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(41, 92, 160, 0.16), rgba(39, 166, 117, 0.08));
    color: var(--ws-text);
}

.ai-rag-panel.hidden {
    display: none;
}

.ai-rag-panel-head {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.72rem;
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ai-rag-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #6aa6ff;
    box-shadow: 0 0 16px rgba(106, 166, 255, 0.75);
}

.ai-rag-panel-text {
    margin-top: 8px;
    color: var(--ws-text-soft);
    font-size: 0.86rem;
    line-height: 1.35;
}

.ai-rag-panel-docs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}

.ai-rag-panel-docs span {
    border: 1px solid rgba(106, 166, 255, 0.22);
    border-radius: 999px;
    padding: 4px 8px;
    background: rgba(255, 255, 255, 0.04);
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
}

.ai-billing-notice {
    position: fixed;
    left: 50%;
    top: 18%;
    z-index: 2500;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: min(420px, calc(100vw - 32px));
    max-width: min(560px, calc(100vw - 32px));
    padding: 14px 16px;
    border: 1px solid rgba(59, 209, 127, 0.34);
    border-radius: 18px;
    background:
        radial-gradient(circle at 12% 0%, rgba(59, 209, 127, 0.22), transparent 44%),
        linear-gradient(135deg, rgba(17, 28, 38, 0.98), rgba(11, 18, 27, 0.98));
    color: var(--ws-text);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.48), 0 0 34px rgba(59, 209, 127, 0.12);
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -12px) scale(0.98);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.ai-billing-notice.is-visible {
    opacity: 1;
    transform: translate(-50%, 0) scale(1);
}

.ai-billing-notice-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 13px;
    background: rgba(59, 209, 127, 0.18);
    color: var(--ws-success);
    font-weight: 900;
    box-shadow: inset 0 0 0 1px rgba(59, 209, 127, 0.24);
}

.ai-billing-notice-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.ai-billing-notice-copy strong {
    font-size: 0.92rem;
    line-height: 1.25;
}

.ai-billing-notice-copy span {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.76rem;
}

.wallet-live-notice {
    position: fixed;
    top: 74px;
    left: 18px;
    z-index: 2700;
    display: flex;
    align-items: center;
    gap: 11px;
    width: min(360px, calc(100vw - 36px));
    padding: 12px 14px;
    border: 1px solid rgba(106, 166, 255, 0.30);
    border-radius: 16px;
    background:
        radial-gradient(circle at 8% 0%, rgba(59, 209, 127, 0.18), transparent 46%),
        linear-gradient(135deg, rgba(17, 28, 43, 0.98), rgba(7, 13, 22, 0.98));
    color: var(--ws-text);
    box-shadow: 0 20px 58px rgba(0, 0, 0, 0.46), 0 0 30px rgba(106, 166, 255, 0.10);
    opacity: 0;
    pointer-events: none;
    transform: translate(-10px, -8px) scale(0.98);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.wallet-live-notice.is-visible {
    opacity: 1;
    transform: translate(0, 0) scale(1);
}

.wallet-live-notice-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border: 1px solid rgba(59, 209, 127, 0.28);
    border-radius: 12px;
    background: rgba(59, 209, 127, 0.14);
    color: #80f0ad;
    font-size: 1.1rem;
    font-weight: 950;
}

.wallet-live-notice-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.wallet-live-notice-copy strong {
    color: var(--ws-text);
    font-size: 0.92rem;
    line-height: 1.2;
}

.wallet-live-notice-copy span {
    color: #d6e5ff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    font-weight: 800;
}

.wallet-live-notice-copy small {
    color: var(--ws-text-muted);
    font-size: 0.74rem;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.balance-center {
    padding-right: 6px;
}

.balance-hero {
    background:
        radial-gradient(circle at 14% 12%, rgba(106, 166, 255, 0.16), transparent 34%),
        linear-gradient(135deg, rgba(70, 168, 137, 0.10), rgba(255, 255, 255, 0.015));
}

.balance-hero-side {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.balance-hero-total {
    display: grid;
    gap: 3px;
}

.balance-hero-total span,
.balance-ledger-status {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.balance-hero-total strong {
    color: var(--ws-text);
    font-size: 1.35rem;
    font-weight: 900;
}

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

.balance-wallet-card {
    align-items: flex-start;
    justify-content: flex-start;
    min-width: 0;
}

.balance-wallet-copy {
    min-width: 0;
}

.balance-wallet-copy small {
    display: block;
    max-width: 100%;
    margin-top: 4px;
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.balance-wallet-flow {
    display: grid;
    gap: 4px;
    margin-left: auto;
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    text-align: right;
    white-space: nowrap;
}

.balance-wallet-flow b {
    color: var(--ws-text);
}

.balance-toolbar {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) minmax(180px, 1fr) minmax(180px, 1fr) auto;
    gap: 10px;
    align-items: center;
}

.balance-toolbar .form-select {
    min-height: 42px;
    border: 1px solid rgba(120, 150, 190, 0.22);
    border-radius: 12px;
    background-color: rgba(7, 13, 22, 0.92);
    color: var(--ws-text);
    font-weight: 800;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.balance-toolbar .form-select:focus {
    border-color: rgba(106, 166, 255, 0.48);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.13);
}

.balance-toolbar .form-select option,
.balance-toolbar .form-select optgroup {
    background: #0b111b;
    color: #e8f0ff;
}

.balance-toolbar .form-select option:checked {
    background: #162a45;
    color: #ffffff;
}

.balance-ledger-card {
    display: grid;
    gap: 10px;
}

.balance-ledger-list {
    display: grid;
    gap: 8px;
    min-height: 0;
}

.balance-ledger-row {
    display: grid;
    grid-template-columns: 142px minmax(0, 1fr) minmax(112px, auto);
    gap: 12px;
    align-items: start;
    border: 1px solid rgba(120, 150, 190, 0.15);
    border-radius: 14px;
    background: rgba(7, 13, 22, 0.54);
    padding: 10px 12px;
}

.balance-ledger-row.is-income {
    border-left: 3px solid rgba(59, 209, 127, 0.72);
}

.balance-ledger-row.is-expense {
    border-left: 3px solid rgba(255, 129, 129, 0.62);
}

.balance-ledger-date {
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.74rem;
    line-height: 1.35;
}

.balance-ledger-main {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.balance-ledger-title {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.balance-ledger-title strong {
    color: var(--ws-text);
    font-size: 0.95rem;
    overflow-wrap: anywhere;
}

.balance-ledger-title span {
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.035);
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    padding: 3px 8px;
}

.balance-ledger-main p {
    margin: 0;
    color: var(--ws-text-muted);
    font-size: 0.84rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.balance-ledger-amount {
    display: grid;
    gap: 3px;
    justify-items: end;
    text-align: right;
    white-space: nowrap;
}

.balance-ledger-amount strong {
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 1rem;
    font-weight: 900;
}

.balance-ledger-row.is-income .balance-ledger-amount strong {
    color: #7ee6aa;
}

.balance-ledger-row.is-expense .balance-ledger-amount strong {
    color: #ffb0b0;
}

.balance-ledger-amount span {
    color: var(--ws-text-muted);
    font-size: 0.74rem;
}

.balance-ledger-details {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
}

.balance-ledger-details summary {
    width: fit-content;
    cursor: pointer;
    color: rgba(185, 210, 245, 0.86);
}

.balance-ledger-details div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, auto));
    gap: 5px 10px;
    width: fit-content;
    max-width: 100%;
    margin-top: 7px;
    border: 1px solid rgba(120, 150, 190, 0.12);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.025);
    padding: 8px;
}

.balance-ledger-details span {
    color: var(--ws-text-muted);
}

.balance-ledger-details b {
    min-width: 0;
    color: var(--ws-text-soft);
    font-weight: 700;
    overflow-wrap: anywhere;
}

.balance-load-more-wrap {
    display: flex;
    justify-content: center;
    padding-top: 4px;
}

[data-balance-open] {
    cursor: pointer;
}

[data-balance-open]:hover {
    color: #d7e7ff;
}

@media (max-width: 980px) {
    .balance-wallet-strip,
    .balance-toolbar {
        grid-template-columns: 1fr;
    }

    .balance-ledger-row {
        grid-template-columns: 1fr;
    }

    .balance-ledger-amount {
        justify-items: start;
        text-align: left;
    }
}

.ai-chat-messages {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    overflow: auto;
    padding: 10px 8px 6px;
    display: grid;
    align-content: start;
    gap: 12px;
    --ai-msg-side-gap: clamp(36px, 7vw, 120px);
}

.ai-msg {
    display: grid;
    gap: 6px;
    max-width: calc(100% - var(--ai-msg-side-gap));
    min-width: 0;
}

.ai-msg-user {
    justify-self: end;
}

.ai-msg-assistant {
    justify-self: start;
}

.ai-msg-user .ai-msg-meta {
    justify-content: flex-end;
}

.ai-msg-assistant .ai-msg-meta {
    justify-content: flex-start;
}

.ai-msg-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--ws-text-muted);
    font-size: 0.72rem;
    font-family: 'JetBrains Mono', monospace;
}

.ai-msg-badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 999px;
    border: 1px solid var(--ws-border);
    background: rgba(255, 255, 255, 0.03);
    line-height: 1;
}

.ai-msg-badge-user {
    border-color: rgba(106, 166, 255, 0.26);
    background: rgba(106, 166, 255, 0.10);
    color: var(--ws-text);
}

.ai-msg-badge-assistant {
    border-color: rgba(59, 209, 127, 0.22);
    background: rgba(59, 209, 127, 0.08);
    color: var(--ws-text);
}

.ai-msg-bubble {
    border: 1px solid var(--ws-border);
    border-radius: 16px;
    padding: 12px 14px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.02));
    color: var(--ws-text);
    line-height: 1.65;
    white-space: pre-wrap;
    word-break: break-word;
    min-width: 56px;
    min-height: 60px;
    max-width: 100%;
    overflow-x: auto;
}

.ai-msg-user .ai-msg-bubble {
    background:
        radial-gradient(circle at 12% 0%, rgba(106, 166, 255, 0.14), transparent 50%),
        linear-gradient(180deg, rgba(106, 166, 255, 0.14), rgba(106, 166, 255, 0.08));
    border-color: rgba(106, 166, 255, 0.22);
}

.ai-msg-assistant .ai-msg-bubble {
    background:
        radial-gradient(circle at 100% 0%, rgba(59, 209, 127, 0.10), transparent 42%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018));
}

.ai-browser-worker-bubble {
    width: min(760px, 100%);
}

.ai-browser-worker-recovery-modal .modal-dialog {
    max-width: min(760px, calc(100vw - 28px));
}

.ai-browser-worker-recovery-modal .modal-body {
    display: grid;
    gap: 12px;
}

.ai-browser-worker-recovery-modal .modal-title {
    color: var(--ws-text);
    font-weight: 850;
}

.ai-browser-worker-recovery-text {
    margin: 0;
    color: var(--ws-muted);
    font-size: 1rem;
    line-height: 1.6;
}

.ai-browser-worker-notice {
    display: grid;
    gap: 10px;
}

.ai-browser-worker-kicker {
    color: var(--ws-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.ai-browser-worker-notice h4 {
    margin: 0;
    color: var(--ws-text);
    font-size: 1.05rem;
    line-height: 1.3;
}

.ai-browser-worker-notice p {
    margin: 0;
    color: var(--ws-muted);
}

.ai-browser-worker-status {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ai-browser-worker-status span,
.ai-browser-worker-note {
    border: 1px solid rgba(106, 166, 255, 0.18);
    border-radius: 10px;
    background: rgba(8, 18, 32, 0.62);
    padding: 7px 9px;
    color: var(--ws-text);
}

.ai-browser-worker-note {
    color: var(--ws-muted);
}

.ai-browser-worker-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.ai-msg-bubble.is-streaming::after {
    content: "▋";
    display: inline-block;
    margin-left: 4px;
    color: var(--ws-accent);
    animation: aiBlink 0.9s infinite;
}

@keyframes aiBlink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0.15; }
}

.ai-chat-composer {
    flex: 0 0 auto;
    border-top: 1px solid var(--ws-border);
    padding-top: 6px;
    display: grid;
    gap: 6px;
    background: transparent;
}

.ai-chat-input-wrap {
    position: relative;
    min-width: 0;
}

.ai-chat-input {
    min-height: 104px;
    max-height: 168px;
    resize: vertical;
    padding-right: 48px;
}

.ai-starter-menu-trigger {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 4;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border-color: rgba(106, 166, 255, 0.32);
    background:
        radial-gradient(circle at 35% 20%, rgba(255, 255, 255, 0.14), transparent 52%),
        rgba(18, 29, 42, 0.92);
    color: var(--ws-text);
    font-weight: 800;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
}

.ai-starter-menu-trigger:hover,
.ai-starter-menu-trigger.is-open {
    border-color: rgba(106, 166, 255, 0.72);
    color: #ffffff;
    background:
        radial-gradient(circle at 35% 20%, rgba(106, 166, 255, 0.28), transparent 58%),
        rgba(20, 42, 67, 0.98);
}

.ai-starter-menu {
    position: absolute;
    right: 8px;
    bottom: calc(100% + 8px);
    z-index: 25;
    width: min(440px, calc(100vw - 44px));
    max-height: min(460px, 62vh);
    overflow: auto;
    border: 1px solid rgba(106, 166, 255, 0.24);
    border-radius: 14px;
    background:
        linear-gradient(180deg, rgba(15, 26, 39, 0.98), rgba(8, 15, 24, 0.98));
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(255, 255, 255, 0.03) inset;
    padding: 10px;
}

.ai-starter-menu[hidden] {
    display: none;
}

.ai-starter-menu-head {
    display: grid;
    gap: 3px;
    padding: 6px 8px 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 8px;
}

.ai-starter-menu-head strong {
    color: var(--ws-text);
    font-size: 0.88rem;
}

.ai-starter-menu-head span {
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    line-height: 1.45;
}

.ai-starter-menu-list {
    display: grid;
    gap: 6px;
}

.ai-starter-menu-list button {
    width: 100%;
    text-align: left;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.035);
    color: var(--ws-text);
    padding: 9px 10px;
    line-height: 1.35;
    font-weight: 700;
}

.ai-starter-menu-list button:hover {
    border-color: rgba(106, 166, 255, 0.34);
    background: rgba(106, 166, 255, 0.11);
    color: #ffffff;
}

#ai-stream-preview-sidebar-section .ws-collapsible-body {
    padding-top: 10px;
}

.ai-stream-preview-sidebar {
    min-height: 0;
}

.ai-stream-preview-sidebar .ai-stream-preview-text {
    min-height: 220px;
    max-height: 360px;
}

.ai-chat-composer-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.ai-chat-composer-hint {
    min-height: 0;
    font-size: 0;
    line-height: 0;
}

.ai-chat-actions {
    margin-top: 0;
    align-items: center;
    flex: 1 1 auto;
    width: 100%;
    margin-left: 0;
    justify-content: flex-end;
}

.ai-queue-btn {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-right: auto;
    padding: 6px 12px;
    border: 1px solid rgba(106, 166, 255, 0.22);
    border-radius: 999px;
    background:
        linear-gradient(180deg, rgba(106, 166, 255, 0.12), rgba(255, 255, 255, 0.025));
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: 0.18s ease;
}

.ai-queue-btn:hover,
.ai-queue-btn.is-active {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.48);
    background: rgba(106, 166, 255, 0.16);
    transform: translateY(-1px);
}

.ai-queue-btn.is-cache {
    border-color: rgba(61, 162, 109, 0.42);
    background: rgba(61, 162, 109, 0.14);
}

.ai-queue-btn.is-done {
    border-color: rgba(219, 231, 255, 0.18);
}

.ai-queue-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ws-accent);
    box-shadow: 0 0 12px rgba(106, 166, 255, 0.55);
}

.ai-queue-btn.is-active .ai-queue-dot {
    animation: wsPulse 1.1s ease-in-out infinite;
}

@keyframes wsPulse {
    0%, 100% {
        opacity: 0.62;
        transform: scale(0.92);
    }
    50% {
        opacity: 1;
        transform: scale(1.18);
    }
}

.ai-queue-current {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
}

.ai-queue-current > div,
.ai-queue-priority-card {
    border: 1px solid var(--ws-border);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.035);
    padding: 14px;
}

.ai-queue-current span,
.ai-queue-priority-card p,
.ai-queue-modal-note {
    color: var(--ws-text-muted);
}

.ai-queue-current span {
    display: block;
    font-size: 0.70rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: 'JetBrains Mono', monospace;
    margin-bottom: 6px;
}

.ai-queue-current strong {
    color: var(--ws-text);
}

.ai-queue-priority-title {
    color: var(--ws-text);
    font-weight: 800;
    margin-bottom: 6px;
}

.ai-queue-priority-options {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin: 12px 0;
}

.ai-queue-tier-card {
    position: relative;
    min-height: 104px;
    border: 1px solid var(--ws-border);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.035);
    color: var(--ws-text-soft);
    padding: 12px;
    text-align: left;
    display: grid;
    gap: 5px;
    cursor: pointer;
    transition: 0.18s ease;
}

.ai-queue-tier-card:hover,
.ai-queue-tier-card.is-selected {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.50);
    background: rgba(106, 166, 255, 0.12);
    box-shadow: 0 12px 30px rgba(15, 30, 58, 0.24);
}

.ai-queue-tier-card.is-confirmed {
    border-color: rgba(61, 162, 109, 0.62);
    box-shadow: 0 0 0 1px rgba(61, 162, 109, 0.18), 0 12px 30px rgba(15, 30, 58, 0.24);
}

.ai-queue-tier-card.is-confirmed::before {
    content: "✓";
    position: absolute;
    top: 8px;
    right: 10px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(61, 162, 109, 0.20);
    color: var(--ws-text);
    font-size: 0.78rem;
    font-weight: 900;
}

.ai-queue-tier-card.is-disabled {
    opacity: 0.42;
    cursor: not-allowed;
    filter: grayscale(0.55);
}

.ai-queue-tier-card.is-disabled::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: rgba(2, 7, 14, 0.36);
    pointer-events: none;
}

.ai-queue-boost-btn {
    position: absolute;
    right: 12px;
    top: 38px;
    width: 34px;
    height: 42px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(106, 166, 255, 0.34);
    background: rgba(106, 166, 255, 0.12);
    color: var(--ws-text);
    font-size: 1.45rem;
    font-style: normal;
    line-height: 1;
    cursor: pointer;
    z-index: 2;
}

.ai-queue-boost-btn:hover {
    background: rgba(106, 166, 255, 0.22);
    transform: translateY(-1px);
}

.ai-queue-tier-card span {
    font-weight: 800;
}

.ai-queue-tier-card strong {
    font-size: 1.2rem;
    color: var(--ws-text);
}

.ai-queue-tier-card em {
    color: var(--ws-text-muted);
    font-style: normal;
    font-size: 0.78rem;
}

.ai-queue-tier-lines {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin: 10px 0 12px;
}

.ai-queue-tier-lines span {
    border: 1px solid var(--ws-border);
    border-radius: 999px;
    padding: 6px 10px;
    color: var(--ws-text-muted);
    background: rgba(255, 255, 255, 0.025);
    font-size: 0.78rem;
}

.ai-queue-confirm-box {
    display: grid;
    gap: 8px;
    border: 1px solid var(--ws-border);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.035);
    padding: 16px;
    margin-bottom: 12px;
}

.ai-queue-confirm-box strong {
    color: var(--ws-text);
    font-size: 1.12rem;
}

.ai-queue-confirm-box span {
    color: var(--ws-text-soft);
}

.ai-queue-modal-note {
    border-top: 1px solid var(--ws-border);
    padding-top: 10px;
    font-size: 0.86rem;
}

.ai-queue-modal-note.is-highlighted {
    color: var(--ws-text);
}

.ai-chat-nav {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px;
    border: 1px solid var(--ws-border);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.025);
}

.ai-nav-btn {
    width: 30px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 50%;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.02));
    color: var(--ws-text-soft);
    font-size: 0.82rem;
    line-height: 1;
    cursor: pointer;
    transition: 0.18s ease;
}

.ai-nav-btn:hover {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.32);
    background: rgba(106, 166, 255, 0.10);
    transform: translateY(-1px);
}

.ai-side-pills {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.ai-chat-pill {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid var(--ws-border);
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    font-size: 0.72rem;
    line-height: 1.2;
    font-family: 'JetBrains Mono', monospace;
}

.ai-chat-pill-accent {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.26);
    background: rgba(106, 166, 255, 0.10);
}

.ai-side-status-card {
    margin-bottom: 12px;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.02);
}

.ai-side-live-status {
    color: var(--ws-text);
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.45;
}

.ai-side-events {
    margin-top: 12px;
    display: grid;
    gap: 8px;
    max-height: 240px;
    overflow: auto;
}

.ai-side-events-empty {
    margin: 0;
    font-size: 0.82rem;
}

.ai-event {
    border: 1px solid var(--ws-border);
    background: rgba(255, 255, 255, 0.02);
    border-radius: 12px;
    padding: 10px 11px;
}

.ai-event-status {
    border-color: rgba(106, 166, 255, 0.18);
}

.ai-event-final {
    border-color: rgba(59, 209, 127, 0.20);
}

.ai-event-error {
    border-color: rgba(255, 108, 115, 0.24);
}

.ai-event-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-bottom: 6px;
}

.ai-event-label,
.ai-event-time {
    font-size: 0.70rem;
    letter-spacing: 0.06em;
    font-family: 'JetBrains Mono', monospace;
}

.ai-event-label {
    text-transform: uppercase;
    color: var(--ws-text-muted);
}

.ai-event-time {
    color: var(--ws-text-muted);
}

.ai-event-text {
    color: var(--ws-text-soft);
    line-height: 1.55;
    font-size: 0.84rem;
    word-break: break-word;
}

.ai-chat-messages::-webkit-scrollbar,
.ai-side-events::-webkit-scrollbar {
    width: 10px;
}

.ai-chat-messages::-webkit-scrollbar-track,
.ai-side-events::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.03);
    border-radius: 999px;
}

.ai-chat-messages::-webkit-scrollbar-thumb,
.ai-side-events::-webkit-scrollbar-thumb {
    background: rgba(106, 166, 255, 0.24);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.ai-chat-messages::-webkit-scrollbar-thumb:hover,
.ai-side-events::-webkit-scrollbar-thumb:hover {
    background: rgba(106, 166, 255, 0.36);
    background-clip: padding-box;
}

@media (max-width: 1199px) {
    .tab-pane#tab-ai.is-active {
        height: calc(100vh - 132px);
    }

    .ai-queue-priority-options {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .tab-pane#tab-ai.is-active {
        height: calc(100vh - 124px);
    }

    .ai-chat-composer-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .ai-queue-priority-options,
    .ai-queue-tier-lines {
        grid-template-columns: 1fr;
    }
}


.ws-btn-danger {
    padding: 9px 14px;
    border: 1px solid rgba(255, 108, 115, 0.35);
    background: linear-gradient(180deg, rgba(255, 108, 115, 0.18), rgba(255, 108, 115, 0.10));
    color: var(--ws-text);
    border-radius: 10px;
    font-size: 0.84rem;
    font-weight: 600;
}

.ws-btn-danger:hover {
    background: linear-gradient(180deg, rgba(255, 108, 115, 0.24), rgba(255, 108, 115, 0.14));
}

.ws-btn-danger:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.ai-msg-meta {
    justify-content: space-between;
}

.ai-msg-meta-left {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.ai-msg-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 2px;
}

.ai-msg-actions-user {
    justify-content: flex-end;
}

.ai-msg-actions-assistant {
    justify-content: flex-start;
}

.ai-msg-action-btn {
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: var(--ws-text-soft);
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 0.72rem;
    font-family: 'JetBrains Mono', monospace;
    cursor: pointer;
}

.ai-msg-action-btn:hover {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.28);
    background: rgba(106, 166, 255, 0.08);
}

.ai-md-body {
    display: block;
}

.ai-md-body > :first-child {
    margin-top: 0;
}

.ai-md-body > :last-child {
    margin-bottom: 0;
}

.ai-md-body p,
.ai-md-body ul,
.ai-md-body ol,
.ai-md-body blockquote,
.ai-md-body pre,
.ai-md-body table {
    margin: 0 0 0.95rem 0;
}

.ai-md-body ul,
.ai-md-body ol {
    padding-left: 1.45rem;
}

.ai-md-body li + li {
    margin-top: 0.25rem;
}

.ai-md-body pre {
    overflow: auto;
    border: 1px solid var(--ws-border);
    border-radius: 12px;
    background: rgba(4, 7, 12, 0.55);
    padding: 12px 14px;
}

.ai-code-block {
    margin: 0 0 0.65rem 0;
    overflow: hidden;
    border: 1px solid rgba(106, 166, 255, 0.16);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(8, 13, 20, 0.88), rgba(5, 9, 15, 0.92));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.ai-code-block-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 34px;
    padding: 7px 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    background: rgba(106, 166, 255, 0.06);
}

.ai-code-block-lang {
    color: var(--ws-accent);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ai-code-block-tools {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    margin-left: auto;
}

.ai-code-block-icon {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border: 1px solid rgba(106, 166, 255, 0.22);
    border-radius: 8px;
    background: rgba(106, 166, 255, 0.08);
    color: var(--ws-text-soft);
    padding: 0;
    cursor: pointer;
    transition: 0.16s ease;
}

.ai-code-block-icon svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}

.ai-code-block-icon:hover {
    border-color: rgba(106, 166, 255, 0.42);
    background: rgba(106, 166, 255, 0.14);
    color: var(--ws-text);
}

.ai-md-body .ai-code-block pre {
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 10px 0 12px;
    max-width: 100%;
    color: #e7f0ff;
    white-space: pre;
}

.ai-md-body .ai-code-block code {
    display: block;
    min-width: max-content;
    font-size: 0.82rem;
    line-height: 1.55;
    color: inherit;
}

.ai-code-line {
    display: grid;
    grid-template-columns: 3.1rem minmax(max-content, 1fr);
    min-height: 1.55em;
}

.ai-code-line-no {
    user-select: none;
    text-align: right;
    padding: 0 0.75rem 0 0.4rem;
    color: rgba(154, 181, 218, 0.52);
    border-right: 1px solid rgba(106, 166, 255, 0.13);
    background: rgba(106, 166, 255, 0.035);
}

.ai-code-line-text {
    padding: 0 1rem;
    white-space: pre;
}

.ai-md-body code {
    font-family: 'JetBrains Mono', monospace;
}

.ai-md-body :not(pre) > code {
    padding: 0.15rem 0.35rem;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.08);
}

.ai-md-body table {
    width: 100%;
    border-collapse: collapse;
    min-width: 420px;
}

.ai-md-body th,
.ai-md-body td {
    border: 1px solid rgba(255, 255, 255, 0.08);
    padding: 8px 10px;
    text-align: left;
    vertical-align: top;
}

.ai-md-body th {
    background: rgba(255, 255, 255, 0.05);
}

.ai-md-body blockquote {
    margin-left: 0;
    padding: 0.75rem 1rem;
    border-left: 3px solid rgba(106, 166, 255, 0.45);
    background: rgba(106, 166, 255, 0.06);
    border-radius: 0 10px 10px 0;
}

.ai-md-body hr {
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    margin: 1rem 0;
}

.ai-md-body .katex-display {
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0.35rem 0;
}


/* ===== Qwen render fixes ===== */
.ai-msg-bubble.ai-msg-bubble-rendered {
    white-space: normal;
}

.ai-msg-bubble.ai-msg-bubble-rendered .ai-md-body {
    white-space: normal;
}

.ai-open-project-clone-modal[hidden] {
    display: none;
}

.ai-open-project-clone-modal {
    position: fixed;
    inset: 0;
    z-index: 12000;
    display: grid;
    place-items: center;
    padding: 24px;
}

.ai-open-project-clone-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(2, 8, 16, 0.72);
    backdrop-filter: blur(8px);
}

.ai-open-project-clone-panel {
    position: relative;
    width: min(690px, calc(100vw - 32px));
    max-width: calc(100vw - 32px);
    max-height: min(760px, calc(100vh - 32px));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(98, 158, 255, 0.28);
    border-radius: 18px;
    background:
        radial-gradient(circle at top right, rgba(64, 184, 148, 0.17), transparent 38%),
        linear-gradient(180deg, rgba(17, 28, 43, 0.98), rgba(6, 13, 23, 0.98));
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.52);
    color: var(--ws-text);
}

.ai-open-project-payment-confirm[hidden] {
    display: none;
}

.ai-open-project-payment-confirm {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: grid;
    place-items: center;
    padding: 20px;
}

.ai-open-project-payment-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(3, 10, 18, 0.58);
    backdrop-filter: blur(5px);
}

.ai-open-project-payment-card {
    position: relative;
    z-index: 1;
    width: min(520px, calc(100vw - 56px));
    border: 1px solid rgba(244, 199, 96, 0.32);
    border-radius: 18px;
    background:
        radial-gradient(circle at top right, rgba(244, 199, 96, 0.14), transparent 42%),
        linear-gradient(145deg, rgba(19, 30, 45, 0.98), rgba(7, 12, 20, 0.98));
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.48);
    padding: 18px;
}

.ai-open-project-payment-card h4 {
    margin: 4px 0 8px;
    color: var(--ws-text);
    font-size: 1.18rem;
}

.ai-open-project-payment-card p {
    margin: 0 0 14px;
    color: var(--ws-text-muted);
    line-height: 1.5;
}

.ai-open-project-payment-summary {
    display: grid;
    gap: 8px;
    margin-bottom: 16px;
}

.ai-open-project-payment-summary div {
    border: 1px solid rgba(120, 150, 190, 0.15);
    border-radius: 12px;
    background: rgba(8, 15, 24, 0.68);
    padding: 10px 11px;
}

.ai-open-project-payment-summary span {
    display: block;
    margin-bottom: 4px;
    color: var(--ws-text-muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ai-open-project-payment-summary strong {
    display: block;
    color: var(--ws-text);
    overflow-wrap: anywhere;
}

.ai-open-project-payment-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.ai-open-project-clone-head,
.ai-open-project-clone-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.14);
}

.ai-open-project-clone-head h3 {
    margin: 4px 0 0;
    font-size: 1.1rem;
}

.ai-open-project-clone-body {
    display: grid;
    gap: 10px;
    padding: 12px 16px 14px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-color: rgba(106, 166, 255, 0.48) rgba(5, 14, 25, 0.72);
    scrollbar-width: thin;
}

.ai-open-project-clone-body::-webkit-scrollbar {
    width: 11px;
    height: 11px;
}

.ai-open-project-clone-body::-webkit-scrollbar-track {
    border-left: 1px solid rgba(120, 150, 190, 0.12);
    background: rgba(5, 14, 25, 0.72);
}

.ai-open-project-clone-body::-webkit-scrollbar-thumb {
    border: 3px solid rgba(5, 14, 25, 0.72);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(106, 166, 255, 0.72), rgba(70, 168, 137, 0.58));
}

.ai-open-project-clone-body::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, rgba(143, 186, 255, 0.9), rgba(93, 214, 174, 0.78));
}

.ai-open-project-clone-detail {
    gap: 11px;
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
}

.ai-open-project-clone-detail *,
.ai-open-project-payment-card * {
    min-width: 0;
    box-sizing: border-box;
}

.ai-open-project-clone-detail .open-library-detail-compact-head,
.ai-open-project-clone-detail .open-library-detail-badges,
.ai-open-project-clone-detail .open-library-tags,
.ai-open-project-clone-detail .open-library-lineage-grid {
    max-width: 100%;
}

.ai-open-project-clone-detail .open-library-detail-compact-head {
    align-items: flex-start;
    flex-wrap: wrap;
}

.ai-open-project-clone-detail .open-library-detail-badges {
    min-width: 0;
    flex: 1 1 260px;
}

.ai-open-project-clone-detail .open-library-price {
    flex: 0 1 auto;
    max-width: 100%;
    overflow-wrap: anywhere;
}

.ai-open-project-clone-detail .open-library-detail-badges span {
    font-size: 0.82rem;
    padding: 7px 11px;
}

.ai-open-project-clone-detail .open-library-price {
    font-size: 1rem;
    padding: 9px 13px;
}

.ai-open-project-clone-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
}

.ai-open-project-clone-title-row h4 {
    margin: 3px 0 0;
    min-width: 0;
    color: var(--ws-text);
    font-size: clamp(1.55rem, 2vw, 2.15rem);
    line-height: 1.16;
    overflow-wrap: anywhere;
}

.ai-open-project-clone-ai-badge {
    flex: 0 0 auto;
    border: 1px solid rgba(106, 166, 255, 0.28);
    border-radius: 999px;
    background: rgba(37, 73, 118, 0.24);
    color: #cfe1ff;
    font-size: 12px;
    font-weight: 900;
    padding: 6px 10px;
}

.ai-open-project-clone-payment-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    border: 1px solid rgba(70, 168, 137, 0.24);
    border-radius: 16px;
    background: rgba(70, 168, 137, 0.08);
    padding: 14px 16px;
}

.ai-open-project-clone-payment-line.is-paid {
    border-color: rgba(244, 199, 96, 0.38);
    background:
        radial-gradient(circle at left center, rgba(244, 199, 96, 0.14), transparent 36%),
        rgba(244, 199, 96, 0.075);
}

.ai-open-project-clone-payment-line span {
    display: block;
    margin-bottom: 4px;
    color: var(--ws-text-muted);
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ai-open-project-clone-payment-line strong {
    display: block;
    color: var(--ws-text);
    font-size: clamp(1.2rem, 1.8vw, 1.7rem);
    font-weight: 950;
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.ai-open-project-clone-payment-line.is-paid strong {
    color: #ffd977;
}

.ai-open-project-clone-payment-line p {
    max-width: 560px;
    margin: 0;
    color: var(--ws-text-muted);
    font-size: 0.98rem;
    line-height: 1.45;
}

.ai-open-project-clone-license-warning {
    border: 1px solid rgba(244, 199, 96, 0.3);
    border-radius: 14px;
    background: rgba(244, 199, 96, 0.075);
    color: #ffe4a3;
    font-size: 0.98rem;
    font-weight: 750;
    line-height: 1.5;
    padding: 12px 14px;
}

.ai-open-project-clone-detail .open-library-detail-section p {
    white-space: pre-wrap;
    font-size: 1rem;
    line-height: 1.58;
    overflow-wrap: anywhere;
}

.ai-open-project-clone-detail .open-library-detail-section h4,
.ai-open-project-clone-detail .open-library-lineage-card h4,
.ai-open-project-clone-detail .open-library-comments h4 {
    font-size: 1rem;
}

.ai-open-project-clone-detail .open-library-detail-grid {
    display: grid;
    gap: 9px;
    grid-template-columns: 1fr;
}

.ai-open-project-clone-detail .open-library-detail-grid div {
    min-height: 38px;
    padding: 8px 12px;
    max-width: 100%;
}

.ai-open-project-clone-detail .open-library-detail-grid span {
    font-size: 0.78rem;
}

.ai-open-project-clone-detail .open-library-detail-grid strong {
    font-size: 1rem;
    overflow-wrap: anywhere;
}

.ai-open-project-clone-detail .open-library-tags span {
    font-size: 0.84rem;
    padding: 6px 10px;
}

.ai-open-project-clone-detail .open-library-tags {
    margin-top: -2px;
    overflow-wrap: anywhere;
}

.ai-open-project-clone-detail .open-library-lineage-grid {
    grid-template-columns: 1fr;
}

.ai-open-project-clone-detail .open-library-lineage-grid > div,
.ai-open-project-clone-detail .open-library-lineage-card,
.ai-open-project-clone-detail .open-library-detail-section,
.ai-open-project-clone-detail .open-library-comment,
.ai-open-project-clone-license-warning {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.ai-open-project-clone-project {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.ai-open-project-clone-project h4 {
    margin: 4px 0 0;
    font-size: 1.35rem;
}

.ai-open-project-clone-price {
    flex: 0 0 auto;
    border: 1px solid rgba(244, 199, 96, 0.44);
    border-radius: 999px;
    padding: 8px 12px;
    color: #ffd977;
    background: rgba(244, 199, 96, 0.08);
    font-weight: 800;
}

.ai-open-project-clone-reason {
    margin: 0;
    color: var(--ws-text-muted);
    line-height: 1.5;
}

.ai-open-project-clone-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.ai-open-project-clone-grid div,
.ai-open-project-clone-summary,
.ai-open-project-clone-note {
    border: 1px solid rgba(120, 154, 190, 0.18);
    border-radius: 14px;
    background: rgba(5, 14, 25, 0.56);
    padding: 12px;
}

.ai-open-project-clone-grid span {
    display: block;
    margin-bottom: 4px;
    color: var(--ws-text-muted);
    font-size: 0.78rem;
}

.ai-open-project-clone-grid strong {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: 1rem;
}

.ai-open-project-clone-summary,
.ai-open-project-clone-note {
    margin-top: 12px;
    color: var(--ws-text-muted);
    line-height: 1.5;
}

.ai-open-project-clone-note {
    border-color: rgba(75, 139, 245, 0.28);
    color: var(--ws-text);
}

.ai-open-project-clone-foot {
    border-top: 1px solid rgba(148, 163, 184, 0.14);
    border-bottom: 0;
}

.ai-open-project-clone-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ai-open-project-clone-status {
    min-height: 1.4em;
    color: var(--ws-text-muted);
    font-size: 0.9rem;
}

.ai-open-project-clone-status[data-tone="success"] {
    color: #6ee7a8;
}

.ai-open-project-clone-status[data-tone="warn"] {
    color: #ffd977;
}

.ai-open-project-clone-status[data-tone="error"] {
    color: #ff8f8f;
}

body[data-theme="daylight"] .ai-open-project-clone-backdrop {
    background: rgba(15, 23, 42, 0.36);
}

body[data-theme="daylight"] .ai-open-project-clone-panel {
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.98), rgba(226, 232, 240, 0.98));
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.24);
}

body[data-theme="daylight"] .ai-open-project-payment-backdrop {
    background: rgba(15, 23, 42, 0.28);
}

body[data-theme="daylight"] .ai-open-project-payment-card {
    background:
        radial-gradient(circle at top right, rgba(245, 158, 11, 0.13), transparent 42%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(226, 232, 240, 0.98));
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
}

body[data-theme="daylight"] .ai-open-project-payment-summary div {
    background: rgba(255, 255, 255, 0.72);
}

body[data-theme="daylight"] .ai-open-project-clone-body {
    scrollbar-color: rgba(37, 99, 235, 0.58) rgba(226, 232, 240, 0.88);
}

body[data-theme="daylight"] .ai-open-project-clone-body::-webkit-scrollbar-track {
    border-left-color: rgba(15, 23, 42, 0.08);
    background: rgba(226, 232, 240, 0.88);
}

body[data-theme="daylight"] .ai-open-project-clone-body::-webkit-scrollbar-thumb {
    border-color: rgba(226, 232, 240, 0.88);
    background: linear-gradient(180deg, rgba(37, 99, 235, 0.68), rgba(20, 184, 166, 0.58));
}

body[data-theme="daylight"] .ai-open-project-clone-grid div,
body[data-theme="daylight"] .ai-open-project-clone-summary,
body[data-theme="daylight"] .ai-open-project-clone-note {
    background: rgba(255, 255, 255, 0.72);
}

@media (max-width: 720px) {
    .ai-open-project-clone-modal {
        padding: 12px;
    }

    .ai-open-project-clone-grid {
        grid-template-columns: 1fr;
    }

    .ai-open-project-clone-project,
    .ai-open-project-clone-foot,
    .ai-open-project-clone-payment-line {
        align-items: stretch;
        flex-direction: column;
    }

    .ai-open-project-clone-actions {
        justify-content: flex-end;
    }
}

.ai-md-body p,
.ai-md-body ul,
.ai-md-body ol,
.ai-md-body blockquote,
.ai-md-body pre,
.ai-md-body table {
    margin: 0 0 0.5rem 0;
}

.ai-rendered-html .qwen-markdown,
.ai-rendered-html .custom-qwen-markdown,
.ai-rendered-html .qwen-markdown-loose {
    display: block;
}

.ai-rendered-html .qwen-markdown-paragraph {
    margin: 0 0 0.45rem 0;
}

.ai-rendered-html .qwen-markdown-paragraph:last-child {
    margin-bottom: 0;
}

.ai-rendered-html table {
    width: 100%;
    border-collapse: collapse;
    min-width: 420px;
}

.ai-rendered-html th,
.ai-rendered-html td {
    border: 1px solid rgba(255, 255, 255, 0.08);
    padding: 8px 10px;
    text-align: left;
    vertical-align: top;
}

.ai-rendered-html th {
    background: rgba(255, 255, 255, 0.05);
}


/* ===== AI sessions storage / topics ===== */
.ws-btn-danger {
    padding: 9px 14px;
    border: 1px solid rgba(255, 108, 115, 0.30);
    background: linear-gradient(180deg, rgba(255, 108, 115, 0.16), rgba(255, 108, 115, 0.08));
    color: var(--ws-text);
    border-radius: 10px;
    font-size: 0.84rem;
    font-weight: 600;
    transition: 0.18s ease;
}
.ws-btn-danger:hover:not(:disabled) { background: linear-gradient(180deg, rgba(255, 108, 115, 0.22), rgba(255, 108, 115, 0.12)); color: var(--ws-text); }
.ws-btn-danger:disabled { opacity: 0.55; cursor: not-allowed; }
.ai-side-current-session { margin-top: 6px; line-height: 1.45; font-size: 0.80rem; }
.ai-side-toolbar { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.ai-session-tree { display: grid; gap: 10px; min-height: 120px; max-height: 620px; overflow: auto; }
.ai-topic-folder { margin-bottom: 0; }
.project-folder summary.project-folder-summary-actions.ai-topic-folder-summary {
    grid-template-columns: 24px minmax(0, 1fr) auto 28px 28px 28px 28px;
    gap: 7px;
    user-select: none;
}
.ai-topic-folder-body { padding-top: 0; }
.ai-topic-title {
    min-width: 0;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--ws-text);
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ai-topic-actions, .ai-session-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.ai-mini-btn { padding: 5px 8px; border: 1px solid rgba(255,255,255,0.08); border-radius: 999px; background: rgba(255,255,255,0.03); color: var(--ws-text-soft); font-size: 0.68rem; font-family: 'JetBrains Mono', monospace; cursor: pointer; }
.ai-mini-btn:hover { color: var(--ws-text); border-color: rgba(106,166,255,0.30); background: rgba(106,166,255,0.08); }
.ai-mini-btn-danger { border-color: rgba(255,108,115,0.20); color: #ff8f95; }
.ai-mini-btn-danger:hover { border-color: rgba(255,108,115,0.36); background: rgba(255,108,115,0.10); color: #ffd0d3; }
.ai-topic-folder-summary .ai-mini-btn {
    width: 28px;
    height: 28px;
    min-width: 28px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    line-height: 1;
}
.ai-topic-folder.is-dragging {
    opacity: 0.68;
}
.ai-topic-folder-summary[draggable="true"] {
    cursor: grab;
}
.ai-topic-folder-summary[draggable="true"]:active {
    cursor: grabbing;
}
.ai-topic-folder-summary.is-sort-target {
    border-color: rgba(106,166,255,0.38);
    background: rgba(106,166,255,0.10);
    box-shadow: inset 0 2px 0 rgba(106,166,255,0.70);
}
.ai-topic-folder-summary.is-sort-target.is-sort-after {
    box-shadow: inset 0 -2px 0 rgba(106,166,255,0.70);
}
.ai-session-list { display: grid; gap: 8px; padding: 0; }
.ai-session-item { border: 1px solid rgba(255,255,255,0.06); border-radius: 12px; padding: 10px; background: rgba(255,255,255,0.015); transition: 0.18s ease; display: grid; gap: 8px; }
.ai-session-item:hover, .ai-session-item.is-active { border-color: rgba(106,166,255,0.30); background: rgba(106,166,255,0.08); }
.ai-session-main { cursor: pointer; display: grid; gap: 5px; }
.ai-session-title { font-size: 0.86rem; font-weight: 800; color: var(--ws-text); line-height: 1.35; overflow-wrap: anywhere; }
.ai-session-meta, .ai-session-preview { color: var(--ws-text-muted); font-size: 0.72rem; line-height: 1.45; overflow-wrap: anywhere; }
.ai-session-preview { color: var(--ws-text-soft); font-size: 0.76rem; }
.ai-chat-sessionbar { flex: 0 0 auto; border-bottom: 1px solid var(--ws-border); padding: 10px 0 12px; margin-bottom: 4px; }
.ai-chat-session-title-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ai-chat-session-kicker { color: var(--ws-text-muted); font-size: 0.70rem; text-transform: uppercase; letter-spacing: 0.08em; font-family: 'JetBrains Mono', monospace; }
.ai-chat-session-title { color: var(--ws-text); font-size: 0.90rem; line-height: 1.35; }
.ai-chat-session-meta { display: none; }
@media (max-width: 767px) { .ai-side-toolbar { grid-template-columns: 1fr; } }

@media (max-width: 767.98px) {
    .ai-chat-messages {
        --ai-msg-side-gap: 14px;
        padding-inline: 4px;
    }
}

/* ===== Runtime IDE Themes ===== */
body[data-theme] .workspace-panel,
body[data-theme] .workspace-main,
body[data-theme] .workspace-card,
body[data-theme] .modal-content.ws-modal {
    transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

body[data-theme] .ws-tab,
body[data-theme] .ws-tab-arrow,
body[data-theme] .ws-tab-manage,
body[data-theme] .messenger-filter,
body[data-theme] .messenger-filter-arrow,
body[data-theme] .ws-collapse-toggle,
body[data-theme] .ai-nav-btn,
body[data-theme] .ai-chat-pill,
body[data-theme] .ai-mini-btn {
    background: var(--ws-row-bg);
    border-color: var(--ws-border);
    color: var(--ws-text-soft);
}

body[data-theme] .ws-project-add-toggle {
    color: var(--ws-success);
}

body[data-theme] .ai-mini-btn-danger {
    border-color: rgba(255,108,115,0.22);
    color: #ff8f95;
}

body[data-theme] .ai-mini-btn-danger:hover {
    border-color: rgba(255,108,115,0.38);
    background: rgba(255,108,115,0.10);
    color: #ffd0d3;
}

body[data-theme] .ws-project-add-toggle:hover {
    border-color: rgba(59, 209, 127, 0.34);
    background: rgba(59, 209, 127, 0.10);
    color: var(--ws-text);
}

body[data-theme] .ws-project-folder-add-toggle:hover {
    border-color: color-mix(in srgb, var(--ws-accent) 38%, transparent);
    background: color-mix(in srgb, var(--ws-accent) 10%, transparent);
    color: var(--ws-text);
}

body[data-theme] .ws-tab:hover,
body[data-theme] .ws-tab.is-active,
body[data-theme] .ws-tab-arrow:hover,
body[data-theme] .ws-tab-manage:hover,
body[data-theme] .messenger-filter:hover,
body[data-theme] .messenger-filter.is-active,
body[data-theme] .ai-nav-btn:hover,
body[data-theme] .ai-chat-pill-accent {
    background: var(--ws-row-bg-hover);
    border-color: color-mix(in srgb, var(--ws-accent) 42%, transparent);
    color: var(--ws-text);
}

body[data-theme] .project-item,
body[data-theme] .project-folder,
body[data-theme] .project-pick-card,
body[data-theme] .project-detail-box,
body[data-theme] .project-module-card,
body[data-theme] .messenger-dialog,
body[data-theme] .private-person-card,
body[data-theme] .component-card,
body[data-theme] .component-info-card,
body[data-theme] .component-photo-card,
body[data-theme] .component-file-card,
body[data-theme] .component-empty-note,
body[data-theme] .ai-event,
body[data-theme] .ai-topic-folder,
body[data-theme] .ai-session-item,
body[data-theme] .ai-side-status-card {
    background: var(--ws-row-bg);
    border-color: var(--ws-border);
}

body[data-theme] .project-item:hover,
body[data-theme] .messenger-dialog:hover,
body[data-theme] .messenger-dialog.is-active,
body[data-theme] .private-person-card:hover,
body[data-theme] .component-card:hover,
body[data-theme] .component-card.is-active,
body[data-theme] .ai-session-item:hover,
body[data-theme] .ai-session-item.is-active {
    background: var(--ws-row-bg-hover);
    border-color: color-mix(in srgb, var(--ws-accent) 38%, transparent);
}

body[data-theme] .prompt-textarea,
body[data-theme] .messenger-search,
body[data-theme] .messenger-select,
body[data-theme] .messenger-input,
body[data-theme] .channel-input,
body[data-theme] .side-filter,
body[data-theme] .ws-modal .form-control,
body[data-theme] .ws-modal .form-select {
    background: var(--ws-input-bg);
    border-color: var(--ws-border);
    color: var(--ws-text);
}

body[data-theme] .prompt-textarea:focus,
body[data-theme] .messenger-input:focus,
body[data-theme] .channel-input:focus,
body[data-theme] .side-filter:focus,
body[data-theme] .ws-modal .form-control:focus,
body[data-theme] .ws-modal .form-select:focus {
    background: var(--ws-input-bg-focus);
    border-color: color-mix(in srgb, var(--ws-accent) 42%, transparent);
}

body[data-theme] .messenger-message-area,
body[data-theme] .ai-chat-messages,
body[data-theme] .component-detail-main,
body[data-theme] .component-source-view,
body[data-theme] .project-config-pre,
body[data-theme] .mwos-raw-block pre {
    background:
        radial-gradient(circle at 82% 10%, color-mix(in srgb, var(--ws-accent) 8%, transparent), transparent 34%),
        color-mix(in srgb, var(--ws-panel-strong) 88%, transparent);
}

body[data-theme] .ai-chat-card {
    background:
        radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--ws-accent) 10%, transparent), transparent 32%),
        radial-gradient(circle at 92% 8%, color-mix(in srgb, var(--ws-success) 8%, transparent), transparent 30%),
        var(--ws-card-bg-strong);
}

body[data-theme] .ai-chat-statusbar,
body[data-theme] .ai-status-main,
body[data-theme] .ai-stream-preview,
body[data-theme] .component-hero-shell,
body[data-theme] .profile-hero-card,
body[data-theme] .iot-monitor-hero,
body[data-theme] .project-dashboard-hero {
    background:
        radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--ws-accent) 14%, transparent), transparent 36%),
        linear-gradient(135deg, color-mix(in srgb, var(--ws-accent) 8%, transparent), color-mix(in srgb, var(--ws-success) 5%, transparent)),
        var(--ws-row-bg);
    border-color: var(--ws-border);
}

body[data-theme] .ai-msg-bubble,
body[data-theme] .messenger-bubble {
    background: var(--ws-card-bg);
    border-color: var(--ws-border);
    color: var(--ws-text);
}

body[data-theme] .ai-msg-user .ai-msg-bubble,
body[data-theme] .messenger-message.is-own .messenger-bubble {
    background:
        radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--ws-accent) 14%, transparent), transparent 50%),
        color-mix(in srgb, var(--ws-accent) 10%, var(--ws-row-bg));
    border-color: color-mix(in srgb, var(--ws-accent) 24%, transparent);
}

body[data-theme] .ai-msg-assistant .ai-msg-bubble {
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--ws-success) 10%, transparent), transparent 42%),
        var(--ws-card-bg);
}

body[data-theme="daylight"] .component-source-view,
body[data-theme="daylight"] .project-config-pre,
body[data-theme="daylight"] .mwos-raw-block pre {
    color: #1f2937;
}

body[data-theme="matrix"] .profile-kicker-line,
body[data-theme="matrix"] .component-detail-kicker,
body[data-theme="matrix"] .ai-chat-status-label,
body[data-theme="matrix"] .ai-chat-session-kicker {
    color: var(--ws-accent);
    text-shadow: 0 0 12px rgba(39, 255, 126, 0.36);
}

/* ===== Office light theme hard overrides ===== */
body[data-theme="daylight"] {
    background:
        radial-gradient(circle at 12% 8%, rgba(56, 189, 248, 0.18), transparent 26%),
        radial-gradient(circle at 86% 10%, rgba(129, 140, 248, 0.16), transparent 24%),
        linear-gradient(180deg, #fbfdff 0%, #eef5ff 48%, #e6eef8 100%);
}

body[data-theme="daylight"] .workspace-panel,
body[data-theme="daylight"] .workspace-main,
body[data-theme="daylight"] .workspace-card,
body[data-theme="daylight"] .messenger-main,
body[data-theme="daylight"] .messenger-side,
body[data-theme="daylight"] .messenger-info,
body[data-theme="daylight"] .component-detail,
body[data-theme="daylight"] .modal-content.ws-modal {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(248, 251, 255, 0.86)),
        radial-gradient(circle at 10% 0%, rgba(56, 189, 248, 0.08), transparent 32%);
    border-color: rgba(90, 117, 153, 0.18);
    box-shadow: 0 22px 52px rgba(68, 92, 124, 0.14);
}

body[data-theme="daylight"] .workspace-main {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(244, 249, 255, 0.92)),
        radial-gradient(circle at 92% 8%, rgba(34, 197, 94, 0.08), transparent 30%);
}

body[data-theme="daylight"] .ws-header,
body[data-theme="daylight"] .ws-tabs-shell,
body[data-theme="daylight"] .messenger-chat-head,
body[data-theme="daylight"] .ai-chat-sessionbar,
body[data-theme="daylight"] .ai-chat-composer,
body[data-theme="daylight"] .messenger-composer {
    background: rgba(255, 255, 255, 0.64);
    border-color: rgba(90, 117, 153, 0.16);
}

body[data-theme="daylight"] .workspace-card,
body[data-theme="daylight"] .project-item,
body[data-theme="daylight"] .project-folder,
body[data-theme="daylight"] .project-pick-card,
body[data-theme="daylight"] .project-detail-box,
body[data-theme="daylight"] .project-module-card,
body[data-theme="daylight"] .project-build-row,
body[data-theme="daylight"] .profile-track-card,
body[data-theme="daylight"] .profile-wallet-card,
body[data-theme="daylight"] .profile-achievement-token,
body[data-theme="daylight"] .iot-device-card,
body[data-theme="daylight"] .iot-sensor-card,
body[data-theme="daylight"] .iot-sensor-detail-card,
body[data-theme="daylight"] .messenger-dialog,
body[data-theme="daylight"] .private-person-card,
body[data-theme="daylight"] .component-card,
body[data-theme="daylight"] .component-info-card,
body[data-theme="daylight"] .component-photo-card,
body[data-theme="daylight"] .component-file-card,
body[data-theme="daylight"] .component-empty-note,
body[data-theme="daylight"] .ai-event,
body[data-theme="daylight"] .ai-topic-folder,
body[data-theme="daylight"] .ai-session-item,
body[data-theme="daylight"] .ai-side-status-card,
body[data-theme="daylight"] .mwos-confirm-mode-option,
body[data-theme="daylight"] .mwos-confirm-summary-card,
body[data-theme="daylight"] .mwos-confirm-module-row {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(244, 249, 255, 0.76));
    border-color: rgba(90, 117, 153, 0.16);
    color: var(--ws-text);
}

body[data-theme="daylight"] .project-item:hover,
body[data-theme="daylight"] .messenger-dialog:hover,
body[data-theme="daylight"] .messenger-dialog.is-active,
body[data-theme="daylight"] .private-person-card:hover,
body[data-theme="daylight"] .component-card:hover,
body[data-theme="daylight"] .component-card.is-active,
body[data-theme="daylight"] .ai-session-item:hover,
body[data-theme="daylight"] .ai-session-item.is-active,
body[data-theme="daylight"] .mwos-confirm-mode-option.is-active {
    background:
        radial-gradient(circle at 10% 14%, rgba(37, 99, 235, 0.11), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(232, 241, 255, 0.86));
    border-color: rgba(37, 99, 235, 0.28);
}

body[data-theme="daylight"] .profile-hero-card,
body[data-theme="daylight"] .project-dashboard-hero,
body[data-theme="daylight"] .iot-monitor-hero,
body[data-theme="daylight"] .component-hero-shell,
body[data-theme="daylight"] .ai-chat-statusbar,
body[data-theme="daylight"] .ai-status-main,
body[data-theme="daylight"] .ai-stream-preview,
body[data-theme="daylight"] .private-directory-hero {
    background:
        radial-gradient(circle at 12% 18%, rgba(37, 99, 235, 0.13), transparent 35%),
        radial-gradient(circle at 92% 10%, rgba(20, 184, 166, 0.12), transparent 34%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(232, 241, 255, 0.84));
    border-color: rgba(37, 99, 235, 0.18);
}

body[data-theme="daylight"] .messenger-message-area,
body[data-theme="daylight"] .private-people-directory,
body[data-theme="daylight"] .ai-chat-messages,
body[data-theme="daylight"] .component-detail-main {
    background:
        radial-gradient(circle at 78% 12%, rgba(37, 99, 235, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(248, 251, 255, 0.92), rgba(239, 246, 255, 0.92));
}

body[data-theme="daylight"] .ai-chat-card {
    background:
        radial-gradient(circle at 10% 0%, rgba(37, 99, 235, 0.10), transparent 32%),
        radial-gradient(circle at 92% 8%, rgba(20, 184, 166, 0.10), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(242, 247, 255, 0.92));
}

body[data-theme="daylight"] .prompt-textarea,
body[data-theme="daylight"] .messenger-search,
body[data-theme="daylight"] .messenger-select,
body[data-theme="daylight"] .messenger-input,
body[data-theme="daylight"] .channel-input,
body[data-theme="daylight"] .side-filter,
body[data-theme="daylight"] .ws-modal .form-control,
body[data-theme="daylight"] .ws-modal .form-select {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(90, 117, 153, 0.20);
    color: #111827;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

body[data-theme="daylight"] .prompt-textarea:focus,
body[data-theme="daylight"] .messenger-input:focus,
body[data-theme="daylight"] .channel-input:focus,
body[data-theme="daylight"] .side-filter:focus,
body[data-theme="daylight"] .ws-modal .form-control:focus,
body[data-theme="daylight"] .ws-modal .form-select:focus {
    background: #ffffff;
    border-color: rgba(37, 99, 235, 0.42);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10);
}

body[data-theme="daylight"] #ai-provider-settings-form .form-control {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(244, 249, 255, 0.90)) !important;
    border-color: rgba(90, 117, 153, 0.22) !important;
    color: #111827 !important;
    caret-color: #2563eb;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.64);
}

body[data-theme="daylight"] #ai-provider-settings-form .form-control:focus {
    background: #ffffff !important;
    border-color: rgba(37, 99, 235, 0.44) !important;
    color: #111827 !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10);
}

body[data-theme="daylight"] #ai-provider-settings-form .form-control:-webkit-autofill,
body[data-theme="daylight"] #ai-provider-settings-form .form-control:-webkit-autofill:hover,
body[data-theme="daylight"] #ai-provider-settings-form .form-control:-webkit-autofill:focus {
    -webkit-text-fill-color: #111827 !important;
    caret-color: #2563eb;
    box-shadow: 0 0 0 1000px #ffffff inset, 0 0 0 3px rgba(37, 99, 235, 0.08) !important;
}

body[data-theme="daylight"] .ws-tab,
body[data-theme="daylight"] .ws-tab-arrow,
body[data-theme="daylight"] .ws-tab-manage,
body[data-theme="daylight"] .ws-btn-soft,
body[data-theme="daylight"] .ws-btn-ghost,
body[data-theme="daylight"] .messenger-filter,
body[data-theme="daylight"] .messenger-filter-arrow,
body[data-theme="daylight"] .ws-collapse-toggle,
body[data-theme="daylight"] .ai-nav-btn,
body[data-theme="daylight"] .ai-chat-pill,
body[data-theme="daylight"] .ai-mini-btn {
    background: rgba(255, 255, 255, 0.74);
    border-color: rgba(90, 117, 153, 0.18);
    color: #334155;
}

body[data-theme="daylight"] .ws-project-add-toggle {
    color: #15803d;
}

body[data-theme="daylight"] .ai-mini-btn-danger {
    border-color: rgba(220, 38, 38, 0.24);
    color: #dc2626;
}

body[data-theme="daylight"] .ai-mini-btn-danger:hover {
    border-color: rgba(220, 38, 38, 0.36);
    background: rgba(239, 68, 68, 0.10);
    color: #991b1b;
}

body[data-theme="daylight"] .ws-project-add-toggle:hover {
    border-color: rgba(22, 163, 74, 0.32);
    background: rgba(22, 163, 74, 0.10);
    color: #14532d;
}

body[data-theme="daylight"] .ws-project-folder-add-toggle:hover {
    border-color: rgba(37, 99, 235, 0.28);
    background: rgba(37, 99, 235, 0.08);
    color: #1d4ed8;
}

body[data-theme="daylight"] .ws-tab:hover,
body[data-theme="daylight"] .ws-tab.is-active,
body[data-theme="daylight"] .ws-tab-arrow:hover,
body[data-theme="daylight"] .ws-tab-manage:hover,
body[data-theme="daylight"] .ws-btn-soft:hover,
body[data-theme="daylight"] .messenger-filter:hover,
body[data-theme="daylight"] .messenger-filter.is-active,
body[data-theme="daylight"] .ai-nav-btn:hover,
body[data-theme="daylight"] .ai-chat-pill-accent {
    background: rgba(219, 234, 254, 0.88);
    border-color: rgba(37, 99, 235, 0.30);
    color: #0f172a;
}

body[data-theme="daylight"] .ws-btn-primary {
    background: linear-gradient(180deg, rgba(37, 99, 235, 0.92), rgba(29, 78, 216, 0.92));
    border-color: rgba(29, 78, 216, 0.72);
    color: #ffffff;
}

body[data-theme="daylight"] .ws-btn-danger {
    background: linear-gradient(180deg, rgba(239, 68, 68, 0.92), rgba(220, 38, 38, 0.90));
    border-color: rgba(220, 38, 38, 0.55);
    color: #ffffff;
}

body[data-theme="daylight"] .ai-msg-bubble,
body[data-theme="daylight"] .messenger-bubble {
    background: rgba(255, 255, 255, 0.88);
    border-color: rgba(90, 117, 153, 0.18);
    color: #111827;
    box-shadow: 0 10px 26px rgba(68, 92, 124, 0.10);
}

body[data-theme="daylight"] .ai-msg-user .ai-msg-bubble,
body[data-theme="daylight"] .messenger-message.is-own .messenger-bubble {
    background:
        radial-gradient(circle at 12% 0%, rgba(37, 99, 235, 0.14), transparent 50%),
        linear-gradient(180deg, rgba(219, 234, 254, 0.94), rgba(191, 219, 254, 0.78));
    border-color: rgba(37, 99, 235, 0.24);
}

body[data-theme="daylight"] .ai-msg-assistant .ai-msg-bubble,
body[data-theme="daylight"] .messenger-message.is-peer .messenger-bubble {
    background:
        radial-gradient(circle at 100% 0%, rgba(20, 184, 166, 0.11), transparent 42%),
        rgba(255, 255, 255, 0.90);
}

body[data-theme="daylight"] .project-code-block,
body[data-theme="daylight"] .build-log,
body[data-theme="daylight"] .component-source-view,
body[data-theme="daylight"] .project-config-pre,
body[data-theme="daylight"] .mwos-raw-block pre,
body[data-theme="daylight"] .ai-md-body pre,
body[data-theme="daylight"] .ai-md-body code,
body[data-theme="daylight"] .hljs {
    background: rgba(248, 250, 252, 0.92) !important;
    border-color: rgba(90, 117, 153, 0.18);
    color: #1f2937 !important;
}

body[data-theme="daylight"] .iot-chart-frame {
    background:
        linear-gradient(rgba(37, 99, 235, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(37, 99, 235, 0.08) 1px, transparent 1px),
        rgba(255, 255, 255, 0.72);
    background-size: 100% 25%, 12.5% 100%, auto;
}

body[data-theme="daylight"] .profile-kicker-line,
body[data-theme="daylight"] .component-detail-kicker,
body[data-theme="daylight"] .ai-chat-status-label,
body[data-theme="daylight"] .ai-chat-session-kicker,
body[data-theme="daylight"] .ws-collapsible-title,
body[data-theme="daylight"] .component-doc-title {
    color: #64748b;
    text-shadow: none;
}

body[data-theme="daylight"] .ws-brand-orb,
body[data-theme="daylight"] .component-hero-icon,
body[data-theme="daylight"] .profile-rank-sigil,
body[data-theme="daylight"] .ai-status-orb,
body[data-theme="daylight"] .messenger-dialog-avatar,
body[data-theme="daylight"] .messenger-peer-avatar,
body[data-theme="daylight"] .messenger-profile-avatar {
    box-shadow: 0 12px 28px rgba(37, 99, 235, 0.16);
}


/* News center */
.news-center {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
    gap: 10px;
    min-height: calc(100vh - 116px);
}

.news-toolbar {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px;
}

.news-toolbar h2,
.news-side-head h2 {
    margin: 0;
    font-size: 26px;
    line-height: 1.1;
    letter-spacing: -0.03em;
}

.news-toolbar p,
.news-editor-head p {
    margin: 8px 0 0;
    max-width: 760px;
    color: var(--ws-text-muted);
}

.news-toolbar-actions,
.news-form-actions,
.news-detail-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.news-sidebar,
.news-main {
    min-height: 0;
    overflow: hidden;
}

.news-sidebar {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
}

.news-main {
    display: flex;
    flex-direction: column;
    padding: 16px;
}

.news-side-head {
    display: grid;
    gap: 10px;
}

.news-search-wrap {
    margin: 0;
}

.news-filter-row {
    flex-wrap: wrap;
    gap: 8px;
}

.news-folder-tree {
    display: grid;
    align-content: start;
    gap: 8px;
    min-height: 0;
    overflow: visible;
    padding-right: 4px;
}

/* Open project library */
.open-library-center {
    display: grid;
    grid-template-rows: auto auto auto minmax(0, 1fr);
    gap: 10px;
    min-height: calc(100vh - 116px);
}

.open-library-hero,
.open-library-panel {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
}

.open-library-hero {
    background:
        radial-gradient(circle at 8% 20%, rgba(70, 168, 137, 0.18), transparent 34%),
        linear-gradient(135deg, rgba(18, 31, 37, 0.98), rgba(11, 17, 27, 0.98));
}

.open-library-hero-main h2 {
    margin: 0;
    font-size: 28px;
    line-height: 1.1;
}

.open-library-hero-main p {
    margin: 8px 0 0;
    max-width: 820px;
    color: var(--ws-text-muted);
}

.open-library-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(86px, 1fr));
    gap: 8px;
    align-content: center;
    min-width: 190px;
}

.open-library-stats div {
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 12px;
    background: rgba(13, 22, 34, 0.72);
    padding: 10px 12px;
}

.open-library-stats strong {
    display: block;
    color: var(--ws-text);
    font-size: 18px;
}

.open-library-stats span {
    color: var(--ws-text-muted);
    font-size: 12px;
}

.open-library-panel {
    flex-direction: column;
    padding: 14px 16px;
}

.open-library-filters {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) repeat(4, minmax(130px, 1fr));
    gap: 10px;
}

.open-library-filters label {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.open-library-filters span {
    color: var(--ws-text-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.open-library-filters input,
.open-library-filters select {
    width: 100%;
    min-height: 38px;
    border: 1px solid rgba(120, 150, 190, 0.18);
    border-radius: 12px;
    background: rgba(10, 16, 24, 0.88);
    color: var(--ws-text);
    padding: 8px 12px;
    outline: none;
}

.open-library-filters input:focus,
.open-library-filters select:focus {
    border-color: rgba(106, 166, 255, 0.62);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.12);
}

.open-library-filters select option {
    background: #111a26;
    color: #e8edf7;
}

.open-library-actions,
.open-library-card-actions,
.open-library-detail-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.open-library-main {
    min-height: 0;
    display: block;
}

.open-library-list,
.open-library-detail {
    min-height: 0;
    overflow: auto;
    padding: 14px;
}

.open-library-list {
    display: grid;
    align-content: start;
    gap: 12px;
}

.open-library-card {
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 14px;
    background:
        linear-gradient(145deg, rgba(21, 31, 45, 0.96), rgba(9, 15, 23, 0.96));
    padding: 12px 14px;
    display: grid;
    gap: 8px;
    cursor: pointer;
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.open-library-card:hover,
.open-library-card.is-selected {
    border-color: rgba(106, 166, 255, 0.56);
    box-shadow: 0 16px 40px rgba(0, 0, 0, .24);
    transform: translateY(-1px);
}

.open-library-row-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
}

.open-library-row-text {
    min-width: 0;
}

.open-library-row-text h3 {
    overflow-wrap: anywhere;
}

.open-library-row-side {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.open-library-card-head,
.open-library-detail-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.open-library-card-kicker {
    color: var(--ws-text-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.open-library-card h3,
.open-library-detail h3 {
    margin: 4px 0 0;
    font-size: 19px;
    line-height: 1.25;
}

.open-library-card p,
.open-library-detail-section p,
.open-library-detail-empty p {
    margin: 0;
    color: var(--ws-text-muted);
    line-height: 1.5;
}

.open-library-row-text p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.open-library-price {
    flex: 0 0 auto;
    border: 1px solid rgba(245, 203, 92, 0.22);
    border-radius: 999px;
    background: rgba(245, 203, 92, 0.08);
    color: #f4d37d;
    font-size: 13px;
    font-weight: 900;
    padding: 6px 10px;
    white-space: nowrap;
}

.open-library-tags {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.open-library-tags span {
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 999px;
    background: rgba(20, 31, 45, 0.78);
    color: var(--ws-text-muted);
    font-size: 12px;
    padding: 5px 9px;
}

.open-library-votes {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.open-library-vote {
    min-height: 30px;
    border: 1px solid rgba(120, 150, 190, 0.18);
    border-radius: 999px;
    background: rgba(14, 22, 32, 0.86);
    color: var(--ws-text-muted);
    font-size: 12px;
    font-weight: 800;
    padding: 5px 9px;
    transition: border-color .16s ease, color .16s ease, background .16s ease;
}

.open-library-vote:hover,
.open-library-vote.is-active {
    border-color: rgba(106, 166, 255, 0.56);
    background: rgba(37, 73, 118, 0.42);
    color: #dfeaff;
}

.open-library-vote[data-open-library-vote="-1"].is-active {
    border-color: rgba(255, 107, 107, 0.46);
    background: rgba(111, 40, 50, 0.35);
    color: #ffd1d1;
}

.open-library-votes.is-detail {
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0;
}

.open-library-rating {
    color: var(--ws-text-muted);
    font-size: 12px;
    font-weight: 800;
}

.open-library-card-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    color: var(--ws-text-muted);
    font-size: 12px;
}

.open-library-card-meta span + span::before {
    content: "";
    display: inline-block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(120, 150, 190, .5);
    margin-right: 10px;
    vertical-align: middle;
}

.open-library-moderation-badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    margin-left: 6px;
    border: 1px solid rgba(120, 150, 190, 0.18);
    border-radius: 999px;
    background: rgba(20, 31, 45, 0.72);
    color: var(--ws-text-muted);
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
    padding: 4px 8px;
    vertical-align: middle;
}

.open-library-moderation-badge.is-review {
    border-color: rgba(245, 203, 92, 0.35);
    background: rgba(245, 203, 92, 0.09);
    color: #f4d37d;
}

.open-library-moderation-badge.is-hidden,
.open-library-moderation-badge.is-rejected {
    border-color: rgba(255, 107, 107, 0.34);
    background: rgba(111, 40, 50, 0.22);
    color: #ffd1d1;
}

.open-library-moderation-actions {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    border: 1px solid rgba(245, 203, 92, 0.18);
    border-radius: 12px;
    background: rgba(245, 203, 92, 0.055);
    padding: 8px 9px;
}

.open-library-moderation-actions span {
    color: var(--ws-text-muted);
    font-size: 12px;
    font-weight: 900;
    margin-right: auto;
}

.open-library-detail {
    display: grid;
    align-content: start;
    gap: 14px;
}

.open-library-detail-compact-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: -2px;
}

.open-library-detail-badges {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.open-library-detail-badges span {
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 999px;
    background: rgba(20, 31, 45, 0.66);
    color: var(--ws-text-muted);
    font-size: 12px;
    font-weight: 800;
    padding: 5px 9px;
}

.open-library-modal .modal-body {
    display: grid;
    gap: 10px;
    padding: 12px 16px 14px;
}

.open-library-modal .modal-title {
    margin: 2px 0 0;
    color: var(--ws-text);
    font-weight: 900;
}

.open-library-modal .modal-header {
    padding: 10px 16px;
    align-items: center;
}

.open-library-modal .profile-kicker-line {
    margin-bottom: 2px;
    font-size: 10px;
}

.open-library-modal .modal-title {
    font-size: 18px;
    line-height: 1.2;
}

.open-library-modal-dialog {
    max-width: min(920px, calc(100vw - 34px));
}

.open-library-action-modal[hidden] {
    display: none;
}

.open-library-action-modal {
    position: fixed;
    inset: 0;
    z-index: 1095;
    display: grid;
    place-items: center;
    padding: 22px;
}

.open-library-action-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(1, 6, 12, 0.72);
    backdrop-filter: blur(8px);
}

.open-library-action-panel {
    position: relative;
    z-index: 1;
    width: min(560px, calc(100vw - 32px));
    max-height: calc(100vh - 44px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    border: 1px solid rgba(120, 150, 190, 0.22);
    border-radius: 18px;
    background:
        linear-gradient(145deg, rgba(19, 30, 45, 0.98), rgba(7, 12, 20, 0.98));
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.52);
    overflow: hidden;
}

.open-library-action-head,
.open-library-action-foot {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-color: rgba(120, 150, 190, 0.14);
}

.open-library-action-head {
    justify-content: space-between;
    border-bottom: 1px solid rgba(120, 150, 190, 0.14);
}

.open-library-action-titlebox {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.open-library-action-info {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(106, 166, 255, 0.24);
    border-radius: 12px;
    background: radial-gradient(circle at 35% 30%, rgba(106, 166, 255, 0.24), rgba(16, 29, 45, 0.82));
    color: #cfe1ff;
    font-size: 16px;
    font-weight: 900;
    font-family: ui-serif, Georgia, serif;
}

.open-library-action-foot {
    justify-content: flex-end;
    border-top: 1px solid rgba(120, 150, 190, 0.14);
}

.open-library-action-head h3 {
    margin: 3px 0 0;
    color: var(--ws-text);
    font-size: 20px;
    line-height: 1.2;
}

.open-library-action-close {
    width: 34px;
    height: 34px;
    border: 1px solid rgba(120, 150, 190, 0.18);
    border-radius: 12px;
    background: rgba(15, 24, 36, 0.84);
    color: var(--ws-text-muted);
    font-size: 22px;
    line-height: 1;
}

.open-library-action-close:hover {
    border-color: rgba(106, 166, 255, 0.45);
    color: var(--ws-text);
}

.open-library-action-body {
    display: grid;
    gap: 12px;
    min-height: 0;
    overflow: auto;
    padding: 16px;
}

.open-library-action-body > p {
    margin: 0;
    color: var(--ws-text-muted);
    line-height: 1.5;
}

.open-library-action-field {
    display: grid;
    gap: 7px;
}

.open-library-action-field span {
    color: var(--ws-text-muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.open-library-action-field textarea {
    min-height: 132px;
    border: 1px solid rgba(120, 150, 190, 0.18);
    border-radius: 14px;
    background: rgba(8, 14, 22, 0.92);
    color: var(--ws-text);
    padding: 11px 12px;
    resize: vertical;
    outline: none;
}

.open-library-action-field textarea:focus {
    border-color: rgba(106, 166, 255, 0.62);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.12);
}

.open-library-action-error {
    border: 1px solid rgba(255, 107, 107, 0.28);
    border-radius: 12px;
    background: rgba(111, 40, 50, 0.18);
    color: #ffd1d1;
    font-size: 13px;
    font-weight: 800;
    padding: 9px 10px;
}

.open-library-comments {
    border-top: 1px solid rgba(120, 150, 190, 0.14);
    padding-top: 10px;
    display: grid;
    gap: 8px;
}

.open-library-comments h4 {
    margin: 0;
    font-size: 14px;
    color: var(--ws-text);
}

.open-library-comments-list {
    display: grid;
    gap: 8px;
}

.open-library-comment {
    border: 1px solid rgba(120, 150, 190, 0.14);
    border-radius: 12px;
    background: rgba(12, 18, 27, 0.62);
    padding: 8px 10px;
}

.open-library-comment b {
    color: var(--ws-text);
    font-size: 13px;
}

.open-library-comment span {
    margin-left: 8px;
    color: var(--ws-text-muted);
    font-size: 12px;
}

.open-library-comment p {
    margin: 5px 0 0;
    color: var(--ws-text-muted);
    line-height: 1.45;
    white-space: pre-wrap;
}

.open-library-comment-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: start;
}

.open-library-comment-form textarea {
    min-height: 42px;
    border: 1px solid rgba(120, 150, 190, 0.18);
    border-radius: 12px;
    background: rgba(10, 16, 24, 0.88);
    color: var(--ws-text);
    padding: 9px 11px;
    resize: vertical;
    outline: none;
}

.open-library-comment-form textarea:focus {
    border-color: rgba(106, 166, 255, 0.62);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.12);
}

.open-library-detail-empty {
    display: grid;
    gap: 8px;
    min-height: 220px;
    align-content: center;
}

.open-library-detail-grid {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
}

.open-library-detail-grid div {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 30px;
    border: 1px solid rgba(120, 150, 190, 0.15);
    border-radius: 999px;
    background: rgba(13, 22, 34, 0.58);
    padding: 5px 9px;
}

.open-library-detail-grid span {
    color: var(--ws-text-muted);
    font-size: 11px;
    font-weight: 800;
}

.open-library-detail-grid strong {
    color: var(--ws-text);
    font-size: 13px;
    line-height: 1.1;
}

.open-library-detail-section {
    border-top: 1px solid rgba(120, 150, 190, 0.14);
    padding-top: 12px;
}

.open-library-detail-section h4 {
    margin: 0 0 6px;
    color: var(--ws-text);
    font-size: 13px;
}

.open-library-lineage {
    border: 1px solid rgba(70, 168, 137, 0.24);
    border-radius: 14px;
    background: rgba(70, 168, 137, 0.08);
    color: var(--ws-text-muted);
    padding: 11px 12px;
    line-height: 1.45;
}

.open-library-lineage-card {
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 12px;
    background: rgba(10, 18, 29, 0.72);
    padding: 12px;
}

.open-library-lineage-card h4 {
    margin: 0 0 10px;
    color: var(--ws-text);
    font-size: 13px;
}

.open-library-lineage-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.open-library-lineage-grid > div {
    min-width: 0;
    border: 1px solid rgba(120, 150, 190, 0.12);
    border-radius: 10px;
    background: rgba(15, 27, 42, 0.62);
    padding: 10px;
}

.open-library-lineage-grid span,
.open-library-repo-missing {
    display: block;
    color: var(--ws-text-muted);
    font-size: 11px;
    font-weight: 800;
}

.open-library-lineage-grid strong {
    display: block;
    margin: 4px 0 8px;
    overflow-wrap: anywhere;
    color: var(--ws-text);
    font-size: 12px;
    line-height: 1.35;
}

.open-library-lineage-grid a {
    color: #8fbaff;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.open-library-lineage-grid a:hover {
    color: #cfe1ff;
}

.open-library-compare {
    display: grid;
    gap: 10px;
    border: 1px solid rgba(100, 170, 255, 0.18);
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(16, 33, 55, 0.78), rgba(11, 23, 37, 0.86));
    padding: 12px;
}

.open-library-compare header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.open-library-compare h4 {
    margin: 0 0 4px;
    color: var(--ws-text);
    font-size: 13px;
}

.open-library-compare header p {
    margin: 0;
    color: var(--ws-text-muted);
    font-size: 12px;
    line-height: 1.35;
}

.open-library-compare-status {
    display: grid;
    gap: 3px;
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 10px;
    background: rgba(8, 16, 27, 0.58);
    padding: 10px;
}

.open-library-compare-status strong {
    color: #8fbaff;
    font-size: 13px;
}

.open-library-compare-status.is-identical strong {
    color: #47d18c;
}

.open-library-compare-status.is-structure_changed strong,
.open-library-compare-status.is-parameters_changed strong {
    color: #ffd66e;
}

.open-library-compare-status span {
    color: var(--ws-text-muted);
    font-size: 12px;
    line-height: 1.4;
}

.open-library-compare-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.open-library-compare-grid > div,
.open-library-compare-list {
    min-width: 0;
    border: 1px solid rgba(120, 150, 190, 0.13);
    border-radius: 10px;
    background: rgba(13, 25, 40, 0.66);
    padding: 9px;
}

.open-library-compare-grid span,
.open-library-compare-list > span {
    display: block;
    color: var(--ws-text-muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.open-library-compare-grid strong {
    display: block;
    margin: 4px 0;
    overflow-wrap: anywhere;
    color: var(--ws-text);
    font-size: 13px;
}

.open-library-compare-grid small {
    display: block;
    overflow-wrap: anywhere;
    color: var(--ws-text-muted);
    font-size: 11px;
}

.open-library-compare-modules {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.open-library-compare-list div {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 7px;
}

.open-library-compare-list b {
    border: 1px solid rgba(143, 186, 255, 0.18);
    border-radius: 999px;
    background: rgba(63, 120, 210, 0.13);
    color: #cfe1ff;
    padding: 4px 7px;
    font-size: 11px;
}

.open-library-compare-list em {
    display: block;
    margin-top: 7px;
    color: var(--ws-text-muted);
    font-size: 12px;
    font-style: normal;
}

.open-library-derivatives {
    border-top: 1px solid rgba(120, 150, 190, 0.14);
    padding-top: 12px;
}

.open-library-derivatives h4 {
    margin: 0 0 4px;
    color: var(--ws-text);
    font-size: 13px;
}

.open-library-derivatives > p {
    margin: 0 0 10px;
    color: var(--ws-text-muted);
    font-size: 12px;
    line-height: 1.4;
}

.open-library-derivatives-list {
    display: grid;
    gap: 8px;
}

.open-library-derivative-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    border: 1px solid rgba(120, 150, 190, 0.14);
    border-radius: 10px;
    background: rgba(12, 22, 36, 0.68);
    padding: 9px 10px;
}

.open-library-derivative-row strong,
.open-library-derivative-row span {
    display: block;
    min-width: 0;
}

.open-library-derivative-row strong {
    overflow: hidden;
    color: var(--ws-text);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.open-library-derivative-row span {
    overflow: hidden;
    color: var(--ws-text-muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.open-library-derivative-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.open-library-derivative-meta span {
    font-size: 11px;
    font-weight: 800;
}

.open-library-versions,
.project-open-versions {
    border-top: 1px solid rgba(120, 150, 190, 0.14);
    padding-top: 12px;
}

.open-library-versions h4,
.project-open-versions h4 {
    margin: 0 0 10px;
    color: var(--ws-text);
    font-size: 13px;
}

.open-library-versions-list,
.project-open-version-list {
    display: grid;
    gap: 7px;
}

.open-library-version-row,
.project-open-version-row {
    display: grid;
    grid-template-columns: minmax(52px, auto) minmax(110px, auto) repeat(3, minmax(0, auto)) minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    border: 1px solid rgba(120, 150, 190, 0.14);
    border-radius: 10px;
    background: rgba(12, 22, 36, 0.68);
    padding: 8px 10px;
    color: var(--ws-text-muted);
    font-size: 12px;
}

.open-library-version-row strong,
.project-open-version-row strong {
    color: var(--ws-text);
}

.open-library-version-row code,
.project-open-version-row code {
    overflow: hidden;
    color: #8fbaff;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.open-library-status {
    border: 1px solid rgba(120, 150, 190, 0.18);
    border-radius: 12px;
    background: rgba(13, 22, 34, 0.88);
    color: var(--ws-text-muted);
    padding: 10px 12px;
}

.open-library-status.is-success {
    border-color: rgba(70, 168, 137, 0.34);
    color: #8df0c4;
}

.open-library-status.is-error {
    border-color: rgba(255, 107, 107, 0.34);
    color: #ff9e9e;
}

.open-library-status.is-warn {
    border-color: rgba(245, 203, 92, 0.34);
    color: #f4d37d;
}

body[data-theme="daylight"] .open-library-filters input,
body[data-theme="daylight"] .open-library-filters select,
body[data-theme="daylight"] .open-library-card,
body[data-theme="daylight"] .open-library-stats div,
body[data-theme="daylight"] .open-library-detail-grid div,
body[data-theme="daylight"] .open-library-vote,
body[data-theme="daylight"] .open-library-detail-badges span,
body[data-theme="daylight"] .open-library-comment,
body[data-theme="daylight"] .open-library-comment-form textarea,
body[data-theme="daylight"] .open-library-compare,
body[data-theme="daylight"] .open-library-compare-grid > div,
body[data-theme="daylight"] .open-library-compare-list,
body[data-theme="daylight"] .open-library-status {
    background: rgba(255, 255, 255, 0.9);
}

@media (max-width: 1180px) {
    .open-library-filters {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .open-library-search {
        grid-column: 1 / -1;
    }

    .open-library-row-main {
        grid-template-columns: 1fr;
    }

    .open-library-row-side,
    .open-library-card-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    .open-library-hero {
        flex-direction: column;
    }

    .open-library-filters {
        grid-template-columns: 1fr;
    }

    .open-library-card-head,
    .open-library-detail-head {
        flex-direction: column;
    }
}

.news-folder {
    width: 100%;
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(20, 29, 42, 0.92), rgba(13, 20, 30, 0.92));
    color: var(--ws-text);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    text-align: left;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.news-folder:hover,
.news-folder.is-active {
    border-color: rgba(106, 166, 255, 0.6);
    background: linear-gradient(135deg, rgba(30, 50, 76, 0.96), rgba(16, 38, 57, 0.96));
    transform: translateY(-1px);
}

.news-folder.is-child {
    margin-left: 18px;
    width: calc(100% - 18px);
}

.news-folder-mark {
    width: 32px;
    height: 32px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: #dce9ff;
    background: radial-gradient(circle at 35% 25%, rgba(106,166,255,.9), rgba(33,132,103,.88));
    font-weight: 800;
}

.news-list {
    min-height: 0;
    overflow: auto;
    display: grid;
    align-content: start;
    grid-template-columns: 1fr;
    gap: 12px;
    padding-right: 4px;
}

.news-card {
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 20px;
    background:
        radial-gradient(circle at top left, rgba(106, 166, 255, 0.16), transparent 34%),
        linear-gradient(145deg, rgba(21, 31, 45, 0.96), rgba(10, 16, 24, 0.96));
    padding: 16px;
    color: var(--ws-text);
    text-align: left;
    display: grid;
    gap: 12px;
    min-height: 0;
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.news-card:hover {
    border-color: rgba(106, 166, 255, 0.52);
    transform: translateY(-2px);
    box-shadow: 0 18px 50px rgba(0,0,0,.28);
}

.news-card-cover,
.news-detail-cover {
    display: block;
    width: 100%;
    border-radius: 16px;
    object-fit: cover;
    border: 1px solid rgba(120, 150, 190, 0.16);
}

.news-card-cover {
    aspect-ratio: 16 / 7;
    max-height: 240px;
}

.news-detail-cover {
    max-height: 420px;
}

.news-card-kicker,
.news-meta,
.news-status-pill {
    color: var(--ws-text-muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .12em;
}

.news-card h3,
.news-detail h2 {
    margin: 0;
    font-size: clamp(22px, 2vw, 34px);
    line-height: 1.05;
    letter-spacing: -0.045em;
}

.news-card p,
.news-detail-summary,
.news-detail-content {
    color: var(--ws-text-muted);
    line-height: 1.55;
}

.news-card p {
    margin: 0;
}

.project-info-spec,
.project-info-spec-box {
    color: var(--ws-text-muted);
    font-size: 0.86rem;
    line-height: 1.45;
}

.project-info-spec-box {
    border: 1px solid rgba(84, 150, 255, 0.18);
    border-radius: 8px;
    background: rgba(10, 18, 30, 0.46);
    padding: 0.75rem 0.9rem;
    margin: 0.85rem 0;
}

.project-info-public-meta {
    display: grid;
    gap: 0.45rem;
    color: var(--ws-text-muted);
    font-size: 0.82rem;
    letter-spacing: 0;
    text-transform: none;
}

.project-info-public-meta-line,
.project-info-public-keywords,
.project-info-action-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.42rem 0.72rem;
}

.project-info-public-keywords span {
    color: var(--ws-text-soft);
}

.project-info-public-keywords b {
    color: var(--ws-accent);
    font-weight: 800;
}

.project-info-action-bar {
    padding-top: 0.35rem;
    border-top: 1px solid var(--ws-border);
}

.project-info-action {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.28rem;
    min-width: 2rem;
    min-height: 2rem;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--ws-text-soft);
    padding: 0.16rem 0.22rem;
    font-size: 0.92rem;
    font-weight: 800;
    line-height: 1.2;
    cursor: pointer;
    transition: color .18s ease, background .18s ease, transform .18s ease;
}

.project-info-action:hover,
.project-info-action.is-active {
    color: var(--ws-accent);
    background: rgba(106, 166, 255, 0.09);
    transform: translateY(-1px);
}

.project-info-action-icon {
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.1;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.project-info-comments {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--ws-border);
    display: grid;
    gap: 0.85rem;
}

.project-info-comments h3 {
    margin: 0;
    font-size: 1rem;
}

.project-info-comment-list {
    display: grid;
    gap: 0.6rem;
}

.project-info-comment {
    border: 1px solid var(--ws-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.025);
    padding: 0.7rem 0.85rem;
}

.project-info-comment b,
.project-info-comment span {
    display: inline-flex;
    margin-right: 0.55rem;
    color: var(--ws-text-soft);
    font-size: 0.78rem;
}

.project-info-comment p {
    margin: 0.45rem 0 0;
    color: var(--ws-text);
    line-height: 1.5;
}

.project-info-comment-form {
    display: grid;
    gap: 0.7rem;
}

.project-info-comment-form textarea {
    width: 100%;
    border: 1px solid var(--ws-border-strong);
    border-radius: 14px;
    background: var(--ws-input-bg);
    color: var(--ws-text);
    padding: 0.75rem 0.85rem;
    resize: vertical;
}

.news-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: auto;
}

.news-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    border: 1px solid rgba(120,150,190,.18);
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(255,255,255,.035);
}

.news-status-pill::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #6aa6ff;
}

.news-status-pending::before { background: #f4b942; }
.news-status-rejected::before { background: #ff6b7a; }
.news-status-published::before { background: #38d996; }

.news-editor,
.news-detail {
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(20, 30, 44, 0.98), rgba(10, 16, 24, 0.98));
    padding: 18px;
    min-height: 0;
    overflow: auto;
}

.news-editor {
    margin-bottom: 12px;
}

.news-editor-head,
.news-detail-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
}

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

.news-form label {
    display: grid;
    gap: 7px;
    color: var(--ws-text-muted);
    font-weight: 700;
}

.news-form input,
.news-form textarea,
.news-form select {
    width: 100%;
    border: 1px solid rgba(120, 150, 190, 0.18);
    border-radius: 14px;
    background: rgba(10, 16, 24, 0.72);
    color: var(--ws-text);
    padding: 12px 14px;
    outline: none;
}

.news-form textarea {
    resize: vertical;
}

.news-media-fields {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.news-form input:focus,
.news-form textarea:focus,
.news-form select:focus {
    border-color: rgba(106, 166, 255, .7);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, .12);
}

.news-form-status {
    min-height: 20px;
    color: var(--ws-text-muted);
}

.news-form-status.is-error {
    color: #ff8d9a;
}

.news-detail {
    display: grid;
    align-content: start;
    gap: 16px;
    margin-bottom: 12px;
}

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

.news-detail-summary {
    font-size: 18px;
}

.news-detail-content {
    white-space: pre-wrap;
    font-size: 16px;
}

.news-detail-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}

.news-detail-gallery figure {
    margin: 0;
    display: grid;
    gap: 6px;
}

.news-detail-gallery img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 14px;
    border: 1px solid rgba(120, 150, 190, 0.16);
}

.news-detail-gallery figcaption {
    color: var(--ws-text-muted);
    font-size: 12px;
}

@media (max-width: 960px) {
    .news-center {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .news-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .news-sidebar,
    .news-main {
        min-height: 320px;
    }
}


.news-topics-sidebar {
    display: grid;
    gap: 10px;
    min-height: 220px;
    min-width: 0;
}

.news-topic-hint {
    color: var(--ws-text-muted);
    font-size: 12px;
    line-height: 1.4;
    border-top: 1px solid rgba(120, 150, 190, .12);
    padding-top: 10px;
}

.news-paid-filter,
.news-checkline {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--ws-text-muted);
    font-weight: 700;
}

.news-folder {
    padding-left: calc(12px + (var(--news-depth, 0) * 14px));
}

.news-folder-toggle {
    width: 16px;
    color: var(--ws-text-muted);
    display: inline-flex;
    justify-content: center;
}

.news-folder.is-drop-target {
    border-color: rgba(56, 217, 150, .78);
    box-shadow: inset 0 0 0 1px rgba(56, 217, 150, .32), 0 0 0 3px rgba(56, 217, 150, .1);
}

.news-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px;
}

.project-info-filters {
    align-items: end;
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid rgba(120, 150, 190, 0.14);
    border-radius: 18px;
    background:
        radial-gradient(circle at top left, rgba(106, 166, 255, 0.08), transparent 42%),
        rgba(255, 255, 255, 0.025);
}

.project-info-filters label {
    position: relative;
    display: grid;
    gap: 7px;
    min-width: 0;
    color: var(--ws-text-soft);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.project-info-filters input,
.project-info-filters select {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--ws-border-strong);
    border-radius: 14px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018)),
        var(--ws-input-bg);
    color: var(--ws-text);
    padding: 10px 13px;
    outline: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.project-info-filters select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 38px;
    cursor: pointer;
}

.project-info-filters label:has(select)::after {
    content: "";
    position: absolute;
    right: 14px;
    bottom: 17px;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--ws-accent);
    border-bottom: 2px solid var(--ws-accent);
    transform: rotate(45deg);
    pointer-events: none;
    opacity: 0.9;
}

.project-info-filters input:focus,
.project-info-filters select:focus {
    border-color: rgba(106, 166, 255, 0.68);
    background:
        linear-gradient(180deg, rgba(106, 166, 255, 0.08), rgba(255, 255, 255, 0.02)),
        var(--ws-input-bg-focus);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.project-info-filters input::placeholder {
    color: var(--ws-text-muted);
}

.project-info-filters select option {
    background: var(--ws-option-bg);
    color: var(--ws-text);
}

.project-info-filters select option:checked {
    background: var(--ws-option-checked-bg);
}

.news-paybox {
    display: flex;
    align-items: end;
    gap: 14px;
    flex-wrap: wrap;
    border: 1px solid rgba(120, 150, 190, 0.14);
    border-radius: 16px;
    padding: 12px;
    background: rgba(255,255,255,.025);
}

.news-price-field {
    max-width: 180px;
}

.news-card-badges,
.news-card-actions,
.news-rating-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.news-card-actions {
    justify-content: flex-end;
}

.news-status-pill.news-paid::before {
    background: #d2a04f;
}

.news-rating-row .ws-btn-soft.is-active {
    border-color: rgba(106, 166, 255, .72);
    color: #eaf2ff;
    background: rgba(106, 166, 255, .14);
}

.news-rating-score {
    color: var(--ws-text-muted);
    font-weight: 800;
}

.news-comments {
    border-top: 1px solid rgba(120, 150, 190, 0.14);
    padding-top: 16px;
    display: grid;
    gap: 12px;
}

.news-comments h3 {
    margin: 0;
    font-size: 18px;
}

.news-comments-list {
    display: grid;
    gap: 10px;
}

.news-comment {
    border: 1px solid rgba(120, 150, 190, 0.14);
    border-radius: 14px;
    padding: 12px;
    background: rgba(255,255,255,.025);
}

.news-comment b {
    color: var(--ws-text);
}

.news-comment span {
    margin-left: 8px;
    color: var(--ws-text-muted);
    font-size: 12px;
}

.news-comment p {
    margin: 8px 0 0;
    color: var(--ws-text-muted);
    white-space: pre-wrap;
}

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

.news-comment-form textarea {
    border: 1px solid rgba(120, 150, 190, 0.18);
    border-radius: 14px;
    background: rgba(10, 16, 24, 0.72);
    color: var(--ws-text);
    padding: 12px 14px;
    resize: vertical;
}


.news-topic-folder summary.is-active {
    border-color: rgba(106, 166, 255, 0.62);
    background: linear-gradient(135deg, rgba(30, 50, 76, 0.96), rgba(16, 38, 57, 0.96));
}

.news-folder-tree {
    display: grid;
    align-content: start;
    overflow: visible;
    padding-right: 4px;
}

.news-folder-tree > .project-folder {
    margin-bottom: 8px;
}

.news-folder-tree > .project-folder:last-child {
    margin-bottom: 0;
}

.project-folder summary.project-folder-summary-actions.news-topic-summary {
    grid-template-columns: 26px 26px minmax(0, 1fr) auto;
    gap: 7px;
    align-items: center;
    min-width: 0;
}

.project-folder summary.project-folder-summary-actions.news-topic-summary.has-moderation {
    grid-template-columns: 26px 26px minmax(0, 1fr) auto auto;
}

.news-topic-summary .project-folder-icon {
    width: 26px;
    height: 26px;
    border-radius: 9px;
    flex: 0 0 auto;
}

.news-topic-toggle {
    width: 26px;
    height: 26px;
    border: 1px solid rgba(120, 150, 190, 0.14);
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.025);
    color: var(--ws-text-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
}

.news-topic-toggle:hover {
    border-color: rgba(106, 166, 255, 0.34);
    color: var(--ws-text);
    background: rgba(106, 166, 255, 0.08);
}

.news-topic-toggle:disabled,
.news-topic-toggle.is-disabled {
    opacity: 0.32;
    cursor: default;
}

.news-topic-toggle span {
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 6px solid currentColor;
    transition: transform 0.15s ease;
}

.news-topic-toggle[aria-expanded="true"] span {
    transform: rotate(90deg);
}

.news-topic-main {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.news-topic-main .project-folder-title {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.25;
}

.news-topic-count {
    justify-self: end;
    min-width: 22px;
    text-align: right;
}

.news-topic-moderation-actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.news-topic-folder-body {
    display: grid;
    gap: 8px;
    padding-left: 12px;
    margin-left: 13px;
    border-left: 1px solid rgba(120, 150, 190, 0.10);
}

.news-topic-folder .news-topic-folder {
    margin-left: 0;
}

.news-topic-pending {
    color: #f4b942;
    font-size: 11px;
    letter-spacing: .08em;
    text-transform: uppercase;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ws-profile-wallets-game {
    gap: 10px;
}

.ws-profile-wallet-resource {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto 28px;
    align-items: center;
    min-height: 58px;
    padding: 9px;
    border: 1px solid rgba(130, 160, 196, 0.14);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.025);
    cursor: pointer;
    transition: border-color 0.16s ease, background 0.16s ease;
}

.ws-profile-wallet-resource:hover {
    border-color: rgba(106, 166, 255, 0.34);
    background: rgba(106, 166, 255, 0.055);
}

.ws-profile-wallet-icon,
.economy-modal-icon {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    font-weight: 900;
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: inset 0 0 18px rgba(255, 255, 255, 0.04);
}

.wallet-fx .ws-profile-wallet-icon,
.economy-modal-icon.wallet-fx {
    color: #bfffd8;
    border-color: rgba(99, 215, 154, 0.36);
    background: radial-gradient(circle at 30% 25%, rgba(99, 215, 154, 0.32), rgba(99, 215, 154, 0.08));
}

.wallet-sd .ws-profile-wallet-icon,
.economy-modal-icon.wallet-sd {
    color: #d5e5ff;
    border-color: rgba(114, 168, 255, 0.38);
    background: radial-gradient(circle at 30% 25%, rgba(114, 168, 255, 0.34), rgba(114, 168, 255, 0.08));
}

.wallet-gw .ws-profile-wallet-icon,
.economy-modal-icon.wallet-gw {
    color: #ffe6a6;
    border-color: rgba(243, 199, 109, 0.44);
    background: radial-gradient(circle at 30% 25%, rgba(243, 199, 109, 0.42), rgba(243, 199, 109, 0.10));
}

.ws-profile-wallet-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.ws-profile-wallet-title {
    color: var(--ws-text);
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ws-profile-wallet-copy small {
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    line-height: 1.25;
}

.ws-profile-wallet-plus {
    width: 28px;
    height: 28px;
    border-radius: 9px;
    border: 1px solid rgba(106, 166, 255, 0.30);
    background: rgba(106, 166, 255, 0.08);
    color: var(--ws-text);
    font-weight: 900;
    cursor: pointer;
}

.ws-profile-wallet-plus:hover {
    border-color: rgba(106, 166, 255, 0.55);
    background: rgba(106, 166, 255, 0.16);
}

.economy-modal .modal-body {
    display: grid;
    gap: 14px;
}

.economy-center {
    min-height: 100%;
}

.economy-board {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.economy-main {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.economy-toolbar .form-select,
.economy-toolbar .messenger-search {
    min-height: 38px;
}

.economy-center .form-control,
.economy-center .form-select,
.economy-center .messenger-search,
.economy-confirm-action-modal .form-control,
.economy-confirm-action-modal .form-select {
    border: 1px solid rgba(130, 160, 196, 0.20);
    border-radius: 8px;
    background-color: rgba(10, 17, 25, 0.96);
    color: var(--ws-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.economy-center .form-control,
.economy-center .form-select {
    min-height: 40px;
    padding: 8px 12px;
}

.economy-center .messenger-search {
    color: var(--ws-text);
}

.economy-center .form-control::placeholder,
.economy-center .messenger-search::placeholder {
    color: var(--ws-text-muted);
}

.economy-center .form-control:focus,
.economy-center .form-select:focus,
.economy-center .messenger-search:focus,
.economy-confirm-action-modal .form-control:focus,
.economy-confirm-action-modal .form-select:focus {
    border-color: rgba(106, 166, 255, 0.58);
    background-color: rgba(12, 22, 33, 0.98);
    color: var(--ws-text);
    box-shadow: 0 0 0 3px rgba(106, 166, 255, 0.14);
    outline: none;
}

.economy-center .form-select,
.economy-confirm-action-modal .form-select {
    background-image:
        linear-gradient(45deg, transparent 50%, rgba(221, 231, 245, 0.78) 50%),
        linear-gradient(135deg, rgba(221, 231, 245, 0.78) 50%, transparent 50%);
    background-position:
        calc(100% - 18px) 50%,
        calc(100% - 13px) 50%;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
    padding-right: 34px;
}

.economy-center .form-control option,
.economy-center .form-control optgroup,
.economy-center .form-select option,
.economy-center .form-select optgroup,
.economy-confirm-action-modal .form-control option,
.economy-confirm-action-modal .form-select option {
    background-color: #101a26;
    color: #e8eef7;
}

.economy-center textarea.form-control {
    min-height: 116px;
}

.economy-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 16px;
    align-items: start;
}

.economy-task-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
    min-width: 0;
}

.economy-task-main-card {
    min-height: 210px;
    display: grid;
    align-content: start;
}

.economy-task-main-card .news-card-head {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.economy-card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 8px;
    color: var(--ws-text-muted);
    font-size: 0.78rem;
}

.economy-card-meta strong {
    color: #f3c76d;
    font-family: 'JetBrains Mono', monospace;
    white-space: nowrap;
}

.economy-seed-note {
    border-color: rgba(99, 215, 154, 0.24) !important;
    color: #a8efc5 !important;
}

.economy-task-editor {
    position: sticky;
    top: 12px;
    border: 1px solid rgba(130, 160, 196, 0.16);
    border-radius: 8px;
    background: rgba(11, 18, 27, 0.92);
    padding: 14px;
}

.economy-task-editor form {
    display: grid;
    gap: 10px;
}

.economy-task-editor textarea {
    resize: vertical;
}

.economy-task-editor .settings-save-row {
    margin-top: 2px;
}

.economy-hero {
    border-color: rgba(124, 206, 167, 0.18);
    min-height: 144px;
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 9% 18%, rgba(99, 215, 154, 0.14), transparent 34%),
        radial-gradient(circle at 90% 10%, rgba(243, 199, 109, 0.16), transparent 32%),
        linear-gradient(135deg, rgba(22, 39, 35, 0.94), rgba(12, 19, 28, 0.94));
}

.economy-hero::after {
    content: "";
    position: absolute;
    right: 22px;
    bottom: -42px;
    width: 190px;
    height: 190px;
    border: 1px solid rgba(243, 199, 109, 0.12);
    border-radius: 44px;
    transform: rotate(45deg);
    pointer-events: none;
}

.economy-hero-sigil {
    border-color: rgba(243, 199, 109, 0.36);
    background: rgba(243, 199, 109, 0.08);
}

.economy-hero-sigil span {
    font-size: 1rem;
}

.economy-hero-side {
    display: grid;
    gap: 10px;
    position: relative;
    z-index: 1;
    max-width: 440px;
}

.economy-hero-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(86px, 1fr));
    gap: 8px;
    min-width: 310px;
}

.economy-hero-stats span {
    display: grid;
    gap: 3px;
    min-height: 62px;
    border: 1px solid rgba(var(--profile-tone), 0.22);
    border-radius: 12px;
    background:
        radial-gradient(circle at 100% 0%, rgba(var(--profile-tone), 0.13), transparent 46%),
        rgba(255, 255, 255, 0.035);
    padding: 10px;
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.economy-hero-stats b {
    color: var(--ws-text);
    font-size: 1.05rem;
    letter-spacing: 0;
}

.economy-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.economy-toolbar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
    gap: 8px;
    align-items: center;
    border-color: rgba(106, 166, 255, 0.15);
    border-radius: 14px;
    background:
        radial-gradient(circle at 0% 0%, rgba(106, 166, 255, 0.06), transparent 38%),
        rgba(8, 14, 21, 0.70);
    padding: 10px;
    min-width: 0;
}

.economy-toolbar .messenger-search {
    grid-column: 1 / -1;
    min-height: 46px;
}

.economy-layout {
    position: relative;
    grid-template-columns: 1fr;
    gap: 0;
    min-width: 0;
    border: 1px solid rgba(130, 160, 196, 0.16);
    border-radius: 14px;
    background:
        linear-gradient(180deg, rgba(15, 24, 33, 0.92), rgba(9, 14, 22, 0.92)),
        radial-gradient(circle at 8% 0%, rgba(124, 206, 167, 0.10), transparent 28%),
        radial-gradient(circle at 96% 100%, rgba(243, 199, 109, 0.08), transparent 34%);
    padding: 14px;
    overflow: hidden;
}

.economy-board-rail {
    display: none;
}

.economy-task-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
}

.economy-quest-card {
    position: relative;
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr) minmax(118px, 150px) minmax(150px, auto);
    gap: 12px;
    align-items: center;
    min-height: 118px;
    border: 1px solid rgba(130, 160, 196, 0.16);
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(99, 215, 154, 0.045), rgba(255, 255, 255, 0.014)),
        rgba(13, 21, 31, 0.86);
    padding: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
    transition: border-color 0.16s ease, background 0.16s ease, transform 0.16s ease;
}

.economy-quest-card:hover {
    border-color: rgba(124, 206, 167, 0.36);
    background: rgba(17, 28, 40, 0.92);
    transform: translateY(-1px);
}

.economy-quest-card.is-in-work,
.profile-quest-row.profile-quest-status-assigned,
.profile-quest-row.profile-quest-status-completed {
    border-color: rgba(96, 165, 250, 0.34);
    background:
        linear-gradient(135deg, rgba(96, 165, 250, 0.075), rgba(99, 215, 154, 0.035)),
        rgba(13, 21, 31, 0.90);
}

.economy-quest-rank {
    display: grid;
    place-items: center;
    gap: 5px;
    width: 62px;
    min-height: 82px;
    border: 1px solid rgba(130, 160, 196, 0.20);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.035);
}

.economy-quest-rank span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    color: var(--ws-text);
    background: rgba(114, 168, 255, 0.14);
    border: 1px solid rgba(114, 168, 255, 0.34);
    font-family: 'JetBrains Mono', monospace;
    font-size: 1rem;
    font-weight: 900;
}

.economy-quest-rank small,
.economy-quest-action-note {
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    text-align: center;
}

.economy-rank-hard .economy-quest-rank span {
    color: #ffe1a4;
    background: rgba(243, 199, 109, 0.16);
    border-color: rgba(243, 199, 109, 0.38);
}

.economy-rank-expert .economy-quest-rank span {
    color: #ffd0dc;
    background: rgba(239, 91, 122, 0.15);
    border-color: rgba(239, 91, 122, 0.38);
}

.economy-quest-body {
    min-width: 0;
}

.economy-quest-tags,
.economy-quest-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.economy-quest-tags span,
.economy-quest-meta span,
.economy-seed-note {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    border: 1px solid rgba(130, 160, 196, 0.15);
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.035);
    color: var(--ws-text-muted);
    padding: 3px 7px;
    font-size: 0.68rem;
    font-weight: 800;
}

.economy-quest-card h3 {
    margin: 8px 0 5px;
    color: var(--ws-text);
    font-size: 1rem;
    line-height: 1.25;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.economy-quest-card p {
    margin: 0;
    color: var(--ws-text-soft);
    font-size: 0.84rem;
    line-height: 1.45;
}

.economy-quest-meta {
    margin-top: 9px;
}

.economy-quest-workline {
    margin-top: 8px;
    color: #b9d7ff;
    font-size: 0.76rem;
    line-height: 1.35;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.economy-quest-reward {
    display: grid;
    justify-items: center;
    gap: 4px;
    min-height: 86px;
    border: 1px solid rgba(130, 160, 196, 0.16);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.035);
    padding: 10px;
}

.economy-reward-token {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    font-weight: 900;
}

.economy-currency-flux .economy-reward-token {
    color: #c9ffdd;
    border: 1px solid rgba(99, 215, 154, 0.36);
    background: radial-gradient(circle at 30% 25%, rgba(99, 215, 154, 0.42), rgba(24, 91, 58, 0.28));
}

.economy-currency-solder .economy-reward-token {
    color: #dce9ff;
    border: 1px solid rgba(114, 168, 255, 0.38);
    background: radial-gradient(circle at 30% 25%, rgba(114, 168, 255, 0.42), rgba(30, 68, 129, 0.28));
}

.economy-currency-gold_wire .economy-reward-token {
    color: #ffe8a7;
    border: 1px solid rgba(243, 199, 109, 0.44);
    background: radial-gradient(circle at 30% 25%, rgba(243, 199, 109, 0.52), rgba(125, 84, 20, 0.30));
}

.economy-quest-reward strong {
    color: var(--ws-text);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.92rem;
    font-weight: 900;
    white-space: nowrap;
}

.economy-quest-reward small {
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    text-align: center;
}

.economy-seed-note {
    border-color: rgba(99, 215, 154, 0.24) !important;
    color: #a8efc5 !important;
}

.economy-quest-actions {
    display: grid;
    gap: 7px;
    justify-items: stretch;
}

.economy-quest-actions .ws-btn-primary,
.economy-quest-actions .ws-btn-soft {
    width: 100%;
    min-height: 34px;
}

.economy-quest-details {
    display: none;
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    border-top: 1px solid rgba(130, 160, 196, 0.14);
    margin-top: 2px;
    padding-top: 12px;
}

.economy-quest-card.is-expanded,
.profile-quest-row.is-expanded {
    border-color: rgba(124, 206, 167, 0.38);
    background:
        radial-gradient(circle at 0% 0%, rgba(99, 215, 154, 0.08), transparent 34%),
        rgba(14, 24, 35, 0.94);
}

.economy-quest-card.is-expanded .economy-quest-details,
.profile-quest-row.is-expanded .economy-quest-details {
    display: grid;
}

.economy-quest-details > div {
    min-width: 0;
    border: 1px solid rgba(130, 160, 196, 0.14);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.026);
    padding: 10px;
}

.economy-quest-details strong {
    display: block;
    color: var(--ws-text);
    font-size: 0.78rem;
    font-weight: 900;
    margin-bottom: 6px;
}

.economy-quest-details p,
.economy-quest-details a {
    margin: 0;
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.economy-quest-details .economy-quest-next-step {
    margin-top: 8px;
    border: 1px solid rgba(99, 215, 154, 0.22);
    border-radius: 10px;
    background: rgba(99, 215, 154, 0.07);
    color: #b9f3cf;
    padding: 8px 10px;
    font-weight: 800;
}

.economy-quest-details a {
    color: #8ab8ff;
    text-decoration: none;
}

.economy-quest-log {
    grid-column: 1 / -1;
}

.economy-quest-log ol {
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.economy-quest-log li {
    display: grid;
    grid-template-columns: minmax(96px, auto) minmax(0, 1fr) auto;
    gap: 8px;
    align-items: start;
    border: 1px solid rgba(130, 160, 196, 0.11);
    border-radius: 9px;
    background: rgba(6, 12, 19, 0.28);
    padding: 7px;
}

.economy-quest-log li span,
.economy-quest-log li em {
    color: var(--ws-text-muted);
    font-size: 0.68rem;
    font-style: normal;
}

.economy-quest-log li b {
    color: var(--ws-text);
    font-size: 0.74rem;
}

.economy-quest-log li p {
    grid-column: 1 / -1;
}

.economy-quest-collapse {
    grid-column: 1 / -1;
    justify-self: end;
    min-width: 124px;
}

.economy-task-editor {
    position: static;
    margin-bottom: 12px;
    background: rgba(9, 16, 24, 0.90);
    padding: 16px;
}

.economy-task-editor form {
    grid-template-columns: repeat(4, minmax(140px, 1fr));
}

.economy-task-editor .economy-field-wide {
    grid-column: 1 / -1;
}

.economy-real-payment-box {
    border: 1px solid rgba(243, 199, 109, 0.20);
    border-radius: 14px;
    background:
        radial-gradient(circle at 0% 0%, rgba(243, 199, 109, 0.10), transparent 34%),
        rgba(255, 255, 255, 0.026);
    padding: 12px;
}

.economy-real-payment-toggle {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin: 0;
    cursor: pointer;
}

.economy-real-payment-toggle input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: #f3c76d;
}

.economy-real-payment-toggle span {
    display: grid;
    gap: 3px;
}

.economy-real-payment-toggle b {
    color: var(--ws-text);
    font-size: 0.9rem;
}

.economy-real-payment-toggle small {
    color: var(--ws-text-muted);
    line-height: 1.35;
}

.economy-real-payment-fields {
    display: none;
    grid-template-columns: repeat(3, minmax(150px, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.economy-real-payment-box.is-enabled .economy-real-payment-fields {
    display: grid;
}

.economy-real-payment-chip {
    border-color: rgba(243, 199, 109, 0.24) !important;
    color: #ffe1a4 !important;
    background: rgba(243, 199, 109, 0.08) !important;
}

.economy-payout-profile-modal .modal-dialog {
    max-width: min(920px, calc(100vw - 28px));
}

.economy-payout-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(180px, 1fr));
    gap: 10px;
}

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

.economy-payout-notice {
    display: grid;
    gap: 5px;
    border: 1px solid rgba(243, 199, 109, 0.22);
    border-radius: 12px;
    background: rgba(243, 199, 109, 0.07);
    padding: 10px 12px;
    margin-bottom: 12px;
}

.economy-payout-notice strong {
    color: #ffe1a4;
    font-size: 0.86rem;
}

.economy-payout-notice span {
    color: var(--ws-text-soft);
    font-size: 0.8rem;
    line-height: 1.4;
}

.economy-error {
    border: 1px solid rgba(239, 91, 122, 0.28);
    border-radius: 8px;
    background: rgba(239, 91, 122, 0.08);
    color: #ffd0dc;
    padding: 10px 12px;
    margin-bottom: 10px;
    font-size: 0.85rem;
}

.economy-modal-summary {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.economy-modal-icon {
    width: 42px;
    height: 42px;
}

.economy-modal-currency {
    color: var(--ws-text);
    font-weight: 900;
}

.economy-modal-desc {
    color: var(--ws-text-muted);
    font-size: 0.84rem;
}

.economy-tabs {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.economy-tab {
    border: 1px solid rgba(130, 160, 196, 0.18);
    background: rgba(255, 255, 255, 0.035);
    color: var(--ws-text-soft);
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 0.78rem;
    font-weight: 800;
}

.economy-tab.is-active {
    color: var(--ws-text);
    border-color: rgba(106, 166, 255, 0.42);
    background: rgba(106, 166, 255, 0.12);
}

.economy-panel {
    display: none;
}

.economy-panel.is-active {
    display: block;
}

.economy-filter-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
    margin-bottom: 10px;
}

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

.economy-card,
.economy-empty {
    border: 1px solid rgba(130, 160, 196, 0.14);
    border-radius: 10px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.025);
}

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

.economy-modal-quest .ws-btn-primary {
    min-width: 128px;
    min-height: 34px;
}

.economy-modal-quest-actions {
    display: grid;
    gap: 5px;
    justify-items: stretch;
}

.economy-modal-quest-actions .economy-quest-action-note {
    text-align: center;
}

.economy-quest-actions .ws-btn-primary:disabled,
.economy-modal-quest-actions .ws-btn-primary:disabled {
    opacity: 0.52;
    cursor: not-allowed;
    filter: saturate(0.72);
}

.economy-confirm-action-modal .modal-content {
    border: 1px solid rgba(130, 160, 196, 0.22);
    border-radius: 12px;
    background: rgba(9, 16, 24, 0.98);
    color: var(--ws-text);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.48);
}

.economy-confirm-action-modal .modal-header,
.economy-confirm-action-modal .modal-footer {
    border-color: rgba(130, 160, 196, 0.14);
}

.economy-confirm-body {
    display: grid;
    gap: 12px;
    color: var(--ws-text-soft);
    font-size: 0.92rem;
    line-height: 1.45;
}

.economy-confirm-body p {
    margin: 0;
}

.economy-confirm-task {
    display: grid;
    gap: 5px;
    border: 1px solid rgba(106, 166, 255, 0.20);
    border-radius: 8px;
    background: rgba(106, 166, 255, 0.07);
    padding: 10px;
}

.economy-confirm-task strong {
    color: var(--ws-text);
    font-size: 0.94rem;
}

.economy-confirm-task span {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
}

.economy-confirm-field {
    display: grid;
    gap: 6px;
    border: 1px solid rgba(130, 160, 196, 0.14);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.025);
    padding: 10px;
}

.economy-confirm-field > span {
    color: var(--ws-text);
    font-size: 0.82rem;
    font-weight: 800;
}

.economy-confirm-field small {
    color: var(--ws-text-muted);
    font-size: 0.74rem;
    line-height: 1.35;
}

.economy-confirm-check {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px;
    align-items: flex-start;
    border: 1px solid rgba(83, 220, 151, 0.22);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(83, 220, 151, 0.08), rgba(96, 165, 250, 0.055));
    color: var(--ws-text);
    font-size: 0.82rem;
    line-height: 1.45;
    padding: 11px 12px;
}

.economy-confirm-check input {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: #53dc97;
}

.economy-confirm-check span {
    min-width: 0;
}

.economy-confirm-action-modal input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    filter: invert(1) opacity(0.72);
}

.economy-task-taken-modal .modal-content {
    border-color: rgba(83, 220, 151, 0.28);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.52), 0 0 44px rgba(83, 220, 151, 0.08);
}

.economy-task-taken-modal .profile-kicker-line {
    color: rgba(109, 246, 176, 0.86);
}

.economy-card-title {
    color: var(--ws-text);
    font-weight: 850;
    font-size: 0.86rem;
}

.economy-card-text {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    line-height: 1.35;
    margin-top: 3px;
}

.economy-card-meta {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 8px;
    color: var(--ws-text-muted);
    font-size: 0.72rem;
}

.economy-card-meta span,
.economy-card-meta strong {
    border: 1px solid rgba(130, 160, 196, 0.14);
    border-radius: 999px;
    padding: 3px 7px;
}

.economy-card-meta strong {
    color: #f3c76d;
}

.economy-empty {
    color: var(--ws-text-muted);
    font-size: 0.8rem;
}

.news-topic-create-form {
    display: grid;
    gap: 8px;
    border: 1px solid rgba(120, 150, 190, 0.14);
    border-radius: 16px;
    padding: 10px;
    background: rgba(255,255,255,.025);
}

.news-payment-modal .news-payment-balance {
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 14px;
    padding: 12px;
    color: var(--ws-text);
    background: rgba(106, 166, 255, 0.08);
}

.news-delete-target {
    margin-top: 10px;
    border: 1px solid rgba(120, 150, 190, 0.16);
    border-radius: 10px;
    padding: 9px 11px;
    color: var(--ws-text);
    background: rgba(255, 255, 255, 0.035);
    font-size: 0.86rem;
    overflow-wrap: anywhere;
}

.ws-btn-danger {
    border-color: rgba(255, 107, 122, .45) !important;
    background: linear-gradient(135deg, rgba(255, 107, 122, .24), rgba(130, 35, 52, .36)) !important;
    color: #ffecef !important;
}


.news-filter-controls {
    display: grid;
    gap: 9px;
    min-width: 0;
}

.news-filter-controls label {
    display: grid;
    gap: 5px;
    color: var(--ws-text-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    min-width: 0;
}

.news-filter-controls label span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.news-select,
.news-topic-create-form select,
.news-topic-create-form textarea {
    background: rgba(10, 16, 24, 0.92) !important;
    color: var(--ws-text) !important;
    border-color: rgba(120, 150, 190, .18) !important;
}

.news-select option,
.news-topic-create-form select option,
.news-form select option {
    background: #111b28;
    color: #e8eef8;
}

.news-topic-desc {
    display: block;
    min-width: 0;
    color: var(--ws-text-muted);
    font-size: 11px;
    font-style: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.news-card {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
}

.news-card h3,
.news-card p,
.news-card-cover,
.news-card-badges,
.news-meta {
    grid-column: 1 / -1;
}

.news-card > .ws-btn-soft,
.news-card-actions {
    grid-column: 2;
    justify-self: end;
}
/* AI agent */
.agent-pet-command-area {
    height: 100%;
    min-height: 0;
}

.agent-pet-command-grid {
    gap: 12px;
}

.agent-pet-hero-card {
    position: relative;
    overflow: hidden;
    border-color: rgba(85, 220, 240, 0.18);
    background:
        radial-gradient(circle at 10% 18%, rgba(85, 220, 240, 0.14), transparent 34%),
        radial-gradient(circle at 86% 10%, rgba(106, 166, 255, 0.14), transparent 30%),
        linear-gradient(135deg, rgba(59, 209, 127, 0.07), rgba(255, 255, 255, 0.014));
}

.agent-pet-hero-card::after {
    content: "";
    position: absolute;
    inset: auto 18px -34px auto;
    width: 180px;
    height: 180px;
    border: 1px solid rgba(85, 220, 240, 0.12);
    border-radius: 44px;
    transform: rotate(45deg);
    opacity: 0.55;
    pointer-events: none;
}

.agent-pet-sigil {
    border-color: rgba(85, 220, 240, 0.34);
    background: rgba(85, 220, 240, 0.08);
}

.agent-pet-hero-side {
    display: grid;
    gap: 12px;
    align-content: center;
    position: relative;
    z-index: 1;
}

.agent-pet-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.agent-pet-stat-strip .profile-wallet-card {
    min-height: 76px;
    background:
        radial-gradient(circle at 100% 0%, rgba(var(--profile-tone), 0.11), transparent 42%),
        rgba(255, 255, 255, 0.018);
}

.agent-pet-section-card,
.agent-pet-token-card,
.agent-pet-form-card,
.agent-pet-fold {
    border-color: rgba(106, 166, 255, 0.16);
    background:
        radial-gradient(circle at 0% 0%, rgba(106, 166, 255, 0.06), transparent 36%),
        rgba(8, 15, 26, 0.62);
}

.agent-pet-form-card {
    display: grid;
    gap: 12px;
}

.agent-pet-form-card p,
.agent-pet-form-card label span,
.agent-pet-relay-grid label span {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    line-height: 1.4;
}

.agent-pet-form-card label {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.agent-pet-form-card input {
    min-height: 42px;
    border: 1px solid rgba(106, 166, 255, 0.20);
    border-radius: 12px;
    background: rgba(5, 10, 18, 0.74);
    color: var(--ws-text);
    padding: 9px 11px;
}

.agent-pet-form-card input:focus,
.agent-pet-token-field:focus,
.agent-pet-relay-grid textarea:focus {
    outline: none;
    border-color: rgba(106, 166, 255, 0.46);
    box-shadow: 0 0 0 0.18rem rgba(106, 166, 255, 0.10);
}

.agent-pet-form-card .market-category-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.agent-pet-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 12px;
}

.agent-pet-agent-row,
.agent-pet-request-row {
    display: grid;
    gap: 0.7rem;
    padding: 0.9rem;
    border: 1px solid rgba(120, 150, 190, 0.20);
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(85, 220, 240, 0.055), rgba(255, 255, 255, 0.016)),
        rgba(9, 17, 28, 0.54);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
}

.agent-pet-agent-main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
    min-width: 0;
}

.agent-pet-agent-main h3 {
    margin: 0.12rem 0;
    color: var(--ws-text);
    font-size: 1.02rem;
    font-weight: 850;
    line-height: 1.25;
}

.agent-pet-muted {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.agent-pet-request-summary {
    margin-top: 0.28rem;
    color: var(--ws-text);
    font-size: 0.9rem;
    line-height: 1.42;
    overflow-wrap: anywhere;
}

.agent-pet-request-result {
    margin-top: 0.42rem;
    padding: 0.45rem 0.58rem;
    border: 1px solid rgba(255, 190, 92, 0.20);
    border-radius: 10px;
    background: rgba(255, 190, 92, 0.08);
    color: var(--ws-text);
    font-size: 0.84rem;
    overflow-wrap: anywhere;
}

.agent-pet-token-field {
    width: 100%;
    min-height: 4.4rem;
    border: 1px solid rgba(106, 166, 255, 0.22);
    border-radius: 12px;
    background: rgba(5, 10, 18, 0.74);
    color: var(--ws-text);
    padding: 10px 12px;
    resize: vertical;
    font-family: var(--ws-mono, "JetBrains Mono", "Consolas", monospace);
    font-size: 0.92rem;
    line-height: 1.45;
    white-space: pre;
    overflow: auto;
    word-break: normal;
}

.agent-pet-relay-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1rem;
}

.agent-pet-relay-grid label {
    min-width: 0;
}

.agent-pet-relay-grid textarea {
    width: 100%;
    min-height: 15rem;
    border: 1px solid rgba(106, 166, 255, 0.20);
    border-radius: 12px;
    background: rgba(5, 10, 18, 0.74);
    color: var(--ws-text);
    padding: 10px 12px;
    resize: vertical;
    font-family: var(--ws-mono, "JetBrains Mono", "Consolas", monospace);
    font-size: 0.84rem;
    line-height: 1.45;
    white-space: pre;
    overflow: auto;
}

.agent-pet-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.45rem;
}

.agent-pet-fold {
    padding: 0.85rem;
}

.agent-pet-fold summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    cursor: pointer;
    color: var(--ws-text);
    font-weight: 700;
}

.agent-pet-fold summary small {
    color: var(--ws-text-muted);
    font-weight: 500;
}

.agent-pet-fold > p {
    margin: 0.7rem 0;
    color: var(--ws-text-muted);
}

.agent-pet-audit-list {
    display: grid;
    gap: 0.35rem;
    margin-top: 0.7rem;
}

.agent-pet-audit-row {
    display: grid;
    grid-template-columns: 9.5rem minmax(0, 1fr) minmax(0, 14rem);
    gap: 0.7rem;
    align-items: center;
    padding: 0.42rem 0.55rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(120, 150, 190, 0.12);
    background: rgba(255, 255, 255, 0.025);
    color: var(--ws-text-muted);
    font-size: 0.78rem;
}

.agent-pet-audit-row span {
    color: var(--ws-text);
    overflow-wrap: anywhere;
}

.agent-pet-audit-row small,
.agent-pet-audit-row time {
    color: var(--ws-text-muted);
}

.agent-pet-payload {
    max-height: 220px;
    overflow: auto;
    padding: 0.75rem;
    border: 1px solid var(--ws-border);
    border-radius: 0.75rem;
    background: rgba(5, 10, 18, 0.76);
    color: var(--ws-text-muted);
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 0.82rem;
}

.agent-pet-request-details summary {
    cursor: pointer;
    color: var(--ws-text-muted);
    font-size: 0.82rem;
}

@media (max-width: 1180px) {
    .agent-pet-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 980px) {
    .agent-pet-form-card .market-category-form-grid,
    .agent-pet-relay-grid,
    .agent-pet-audit-row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .agent-pet-hero-actions {
        justify-content: flex-start;
    }
}
/* Admin workspace */
.admin-workspace-card .form-control,
.admin-workspace-card .form-select,
.admin-ai-workspace-card .form-control,
.admin-ai-workspace-card .form-select {
    min-height: 44px;
    border: 1px solid rgba(116, 151, 190, 0.24);
    border-radius: 14px;
    background: rgba(13, 22, 32, 0.88);
    color: var(--ws-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.admin-workspace-card .form-control:focus,
.admin-workspace-card .form-select:focus,
.admin-ai-workspace-card .form-control:focus,
.admin-ai-workspace-card .form-select:focus {
    border-color: rgba(92, 150, 226, 0.7);
    box-shadow: 0 0 0 3px rgba(60, 132, 217, 0.18);
    outline: none;
}

.admin-workspace-card .form-select option,
.admin-ai-workspace-card .form-select option {
    background: #101720;
    color: #e8eef7;
}

.admin-user-panel,
.admin-action-card {
    border: 1px solid rgba(116, 151, 190, 0.16);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(18, 30, 43, 0.94), rgba(10, 17, 25, 0.94));
    padding: 18px;
}

.admin-ai-header {
    align-items: flex-start;
}

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

.admin-ai-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 14px 0;
}

.admin-ai-summary-card {
    border: 1px solid rgba(116, 151, 190, 0.16);
    border-radius: 16px;
    padding: 12px;
    background:
        radial-gradient(circle at 0% 0%, rgba(93, 168, 255, 0.11), transparent 38%),
        rgba(10, 18, 27, 0.72);
}

.admin-ai-summary-card span {
    display: block;
    color: var(--ws-text-muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.admin-ai-summary-card strong {
    display: block;
    margin-top: 5px;
    color: var(--ws-text);
    font-size: 1.35rem;
    font-weight: 900;
}

.admin-ai-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, 210px) minmax(150px, 210px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}

.admin-ai-group {
    border: 1px solid rgba(116, 151, 190, 0.16);
    border-radius: 18px;
    margin-top: 14px;
    background:
        radial-gradient(circle at 100% 0%, rgba(93, 168, 255, 0.06), transparent 36%),
        rgba(8, 15, 23, 0.42);
    overflow: hidden;
}

.admin-ai-group-summary {
    position: relative;
    display: grid;
    min-width: 0;
    padding: 14px 18px 14px 30px;
    cursor: pointer;
    list-style: none;
}

.admin-ai-group-summary::-webkit-details-marker {
    display: none;
}

.admin-ai-group-summary::before {
    content: "›";
    position: absolute;
    left: 14px;
    top: 50%;
    color: var(--ws-text-muted);
    font-weight: 900;
    transform: translateY(-50%);
    transition: transform 0.16s ease;
}

.admin-ai-group[open] > .admin-ai-group-summary::before {
    transform: translateY(-50%) rotate(90deg);
}

.admin-ai-group-summary span {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.admin-ai-group-summary b {
    color: var(--ws-text);
    font-size: 1rem;
    font-weight: 900;
}

.admin-ai-group-summary em {
    color: var(--ws-text-muted);
    font-size: 0.84rem;
    font-style: normal;
    overflow-wrap: anywhere;
}

.admin-ai-group > .admin-ai-toolbar,
.admin-ai-group > .admin-ai-group-actions,
.admin-ai-group > .messenger-info-note,
.admin-ai-group > .admin-ai-list,
.admin-ai-group > .admin-ai-user-list,
.admin-ai-group > .admin-ai-public-metrics,
.admin-ai-group > .admin-ai-command-box {
    margin-left: 14px;
    margin-right: 14px;
}

.admin-ai-group-actions {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 12px;
}

.admin-ai-group > .admin-ai-list,
.admin-ai-group > .admin-ai-user-list,
.admin-ai-group > .admin-ai-public-metrics {
    margin-bottom: 14px;
}

.admin-ai-public-grid {
    margin-bottom: 10px;
}

.admin-ai-public-pages {
    color: var(--ws-text-muted);
    font-size: 0.84rem;
    overflow-wrap: anywhere;
}

.admin-ai-create-panel {
    margin: 0 14px 12px;
    border: 1px solid rgba(116, 151, 190, 0.13);
    border-radius: 14px;
    background: rgba(8, 15, 23, 0.42);
    overflow: hidden;
}

.admin-ai-create-panel > summary {
    cursor: pointer;
    padding: 11px 13px;
    color: var(--ws-text);
    font-weight: 900;
}

.admin-ai-create-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    min-width: 0;
    border-top: 1px solid rgba(116, 151, 190, 0.12);
    padding: 12px;
}

.admin-ai-create-modal .modal-body {
    display: grid;
    gap: 12px;
}

.admin-ai-create-modal .admin-ai-create-form {
    border: 1px solid rgba(116, 151, 190, 0.14);
    border-radius: 16px;
    background: rgba(8, 15, 23, 0.34);
}

.admin-ai-create-form label,
.admin-ai-create-form .form-control,
.admin-ai-create-form .form-select {
    min-width: 0;
    width: 100%;
}

.admin-ai-create-actions {
    grid-column: 1 / -1;
    display: grid;
    gap: 10px;
}

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

.admin-ai-card,
.admin-ai-user-panel,
.admin-ai-user-card {
    border: 1px solid rgba(116, 151, 190, 0.16);
    border-radius: 18px;
    padding: 0;
    background:
        radial-gradient(circle at 100% 0%, rgba(93, 168, 255, 0.08), transparent 36%),
        linear-gradient(145deg, rgba(18, 30, 43, 0.94), rgba(8, 14, 21, 0.94));
    min-width: 0;
    overflow: hidden;
}

.admin-ai-user-panel {
    margin-top: 14px;
    padding: 14px;
}

.admin-ai-section-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.admin-ai-section-head h3 {
    margin: 3px 0 4px;
    color: var(--ws-text);
    font-size: 1.05rem;
    font-weight: 900;
}

.admin-ai-section-head p {
    margin: 0;
    color: var(--ws-text-muted);
}

.admin-ai-user-list {
    display: grid;
    gap: 10px;
}

.admin-ai-user-card {
    padding: 12px;
    background:
        radial-gradient(circle at 0% 0%, rgba(55, 214, 136, 0.08), transparent 38%),
        rgba(8, 15, 23, 0.54);
}

.admin-ai-card-details {
    min-width: 0;
}

.admin-ai-card-summary {
    position: relative;
    display: grid;
    grid-template-columns: minmax(150px, 1fr) minmax(120px, 0.9fr) auto;
    gap: 10px;
    align-items: center;
    min-width: 0;
    padding: 12px 14px 12px 22px;
    cursor: pointer;
    list-style: none;
}

.admin-ai-card-summary::-webkit-details-marker {
    display: none;
}

.admin-ai-card-summary::before {
    content: "›";
    position: absolute;
    transform: translateX(-8px);
    color: var(--ws-text-muted);
    font-weight: 900;
    transition: transform 0.16s ease;
}

.admin-ai-card-details[open] > .admin-ai-card-summary::before {
    transform: translateX(-8px) rotate(90deg);
}

.admin-ai-summary-main,
.admin-ai-summary-tags {
    min-width: 0;
}

.admin-ai-summary-main b,
.admin-ai-summary-main em {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-ai-summary-main b {
    color: var(--ws-text);
    font-weight: 900;
}

.admin-ai-summary-main em {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    font-style: normal;
}

.admin-ai-summary-tags {
    display: flex;
    gap: 6px;
    flex-wrap: nowrap;
    overflow: hidden;
}

.admin-ai-summary-tags span {
    min-width: 0;
    max-width: 180px;
    border: 1px solid rgba(116, 151, 190, 0.16);
    border-radius: 999px;
    padding: 4px 8px;
    color: var(--ws-text-muted);
    background: rgba(8, 15, 23, 0.48);
    font-size: 0.72rem;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-ai-card-body {
    min-width: 0;
    border-top: 1px solid rgba(116, 151, 190, 0.12);
    padding: 12px 14px 14px;
    overflow: hidden;
}

.admin-ai-card-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
}

.admin-ai-card h3,
.admin-ai-user-card h3 {
    margin: 3px 0 4px;
    color: var(--ws-text);
    font-size: 1.05rem;
    font-weight: 900;
}

.admin-ai-card p,
.admin-ai-user-card p {
    margin: 0;
    color: var(--ws-text-muted);
    font-size: 0.86rem;
    overflow-wrap: anywhere;
}

.admin-ai-user-url {
    margin: 8px 0 0;
    color: var(--ws-text-muted);
    font-size: 0.78rem;
    overflow-wrap: anywhere;
}

.admin-ai-state {
    max-width: 220px;
    border: 1px solid rgba(116, 151, 190, 0.2);
    border-radius: 999px;
    padding: 6px 10px;
    color: var(--ws-text-muted);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-ai-state.is-ready {
    border-color: rgba(55, 214, 136, 0.48);
    color: #83efb5;
    background: rgba(55, 214, 136, 0.08);
}

.admin-ai-state.is-busy,
.admin-ai-state.is-warn {
    border-color: rgba(244, 190, 92, 0.5);
    color: #ffd98b;
    background: rgba(244, 190, 92, 0.08);
}

.admin-ai-state.is-error {
    border-color: rgba(255, 107, 107, 0.5);
    color: #ffadad;
    background: rgba(255, 107, 107, 0.08);
}

.admin-ai-metrics {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin: 12px 0;
}

.admin-ai-user-metrics {
    grid-template-columns: 90px 90px 90px minmax(0, 1fr);
}

.admin-ai-metrics span {
    border: 1px solid rgba(116, 151, 190, 0.13);
    border-radius: 13px;
    padding: 9px;
    background: rgba(8, 15, 23, 0.58);
}

.admin-ai-metrics b,
.admin-ai-metrics em {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-ai-metrics b {
    color: var(--ws-text);
    font-size: 0.95rem;
}

.admin-ai-metrics em {
    color: var(--ws-text-muted);
    font-size: 0.7rem;
    font-style: normal;
    text-transform: uppercase;
}

.admin-ai-error {
    margin: 10px 0;
    border: 1px solid rgba(255, 107, 107, 0.24);
    border-radius: 13px;
    padding: 10px;
    background: rgba(255, 107, 107, 0.07);
    color: #ffc3c3;
    overflow-wrap: anywhere;
}

.admin-ai-instance-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    align-items: end;
    min-width: 0;
}

.admin-ai-instance-form label {
    min-width: 0;
}

.admin-ai-instance-form .form-control,
.admin-ai-instance-form .form-select {
    width: 100%;
    min-width: 0;
}

.admin-ai-instance-form label:nth-of-type(5),
.admin-ai-instance-form label:nth-of-type(6),
.admin-ai-instance-form label:nth-of-type(7) {
    grid-column: span 1;
}

.admin-ai-check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    color: var(--ws-text-muted);
    font-size: 0.82rem;
    align-self: end;
    justify-content: flex-start;
}

.admin-ai-check input {
    width: 16px;
    height: 16px;
    accent-color: #5da8ff;
}

.admin-ai-command-box {
    margin-top: 10px;
    border: 1px solid rgba(116, 151, 190, 0.13);
    border-radius: 13px;
    background: rgba(8, 15, 23, 0.5);
}

.admin-ai-command-box summary {
    cursor: pointer;
    padding: 9px 11px;
    color: var(--ws-text-muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.admin-ai-command-box pre {
    margin: 0;
    border-top: 1px solid rgba(116, 151, 190, 0.12);
    padding: 10px 11px;
    color: #b9c7d8;
    font-size: 0.78rem;
    white-space: pre-wrap;
    overflow: auto;
}

.admin-ai-service-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.admin-ai-download-note {
    margin-bottom: 8px;
    color: var(--ws-text-muted);
    font-size: 0.84rem;
}

.admin-ai-downloads {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.admin-user-controls {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    align-items: end;
}

.admin-user-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 14px 0;
}

.admin-user-counter {
    margin-left: auto;
    color: var(--ws-text-muted);
    font-size: 0.9rem;
}

.admin-users-browser {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    max-height: 360px;
    overflow: auto;
    padding-right: 4px;
}

.admin-user-card {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    width: 100%;
    border: 1px solid rgba(116, 151, 190, 0.16);
    border-radius: 16px;
    background: rgba(14, 24, 35, 0.78);
    color: var(--ws-text);
    padding: 11px;
    text-align: left;
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.admin-user-card:hover,
.admin-user-card.is-active {
    border-color: rgba(96, 165, 250, 0.65);
    background: rgba(24, 42, 62, 0.9);
}

.admin-user-card.is-selected {
    border-color: rgba(39, 166, 117, 0.72);
    box-shadow: 0 0 0 1px rgba(39, 166, 117, 0.18);
}

.admin-user-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid rgba(116, 151, 190, 0.32);
    border-radius: 9px;
    color: #7ee0b2;
    font-weight: 800;
}

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

.admin-user-main strong,
.admin-user-main small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-user-main small {
    color: var(--ws-text-muted);
    margin-top: 3px;
}

.admin-user-role-badge {
    border: 1px solid rgba(116, 151, 190, 0.2);
    border-radius: 999px;
    color: var(--ws-text-muted);
    padding: 5px 8px;
    font-size: 0.78rem;
}

.admin-rule-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}

.admin-economy-rules-card {
    margin-top: 14px;
}

.admin-service-card {
    margin-top: 14px;
}

.admin-service-command {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    border: 1px solid rgba(116, 151, 190, 0.16);
    border-radius: 16px;
    background: rgba(9, 17, 26, 0.72);
    padding: 14px;
}

.admin-service-main {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.admin-service-main strong {
    color: var(--ws-text);
    font-size: 1rem;
}

.admin-service-main span {
    color: var(--ws-text-muted);
    font-size: 0.88rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

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

.admin-service-output {
    display: block;
    min-height: 0;
    max-height: 260px;
    overflow: auto;
    margin: 12px 0 0;
    padding: 12px;
    border: 1px solid rgba(116, 151, 190, 0.16);
    border-radius: 14px;
    background: rgba(5, 10, 16, 0.72);
    color: #b9c7d8;
    font-size: 0.82rem;
    white-space: pre-wrap;
}

.admin-rules-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    gap: 12px;
    align-items: center;
    cursor: pointer;
    list-style: none;
}

.admin-rules-summary::-webkit-details-marker {
    display: none;
}

.admin-rules-summary .settings-section-title {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.admin-rules-summary-title {
    color: var(--ws-text);
    font-size: 1.02rem;
    font-weight: 800;
}

.admin-rules-summary-hint {
    color: var(--ws-text-muted);
    font-size: 0.88rem;
    line-height: 1.35;
}

.admin-rules-summary-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(116, 151, 190, 0.22);
    border-radius: 12px;
    background: rgba(15, 25, 37, 0.82);
    color: var(--ws-text);
    font-weight: 800;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.admin-economy-rules-card[open] .admin-rules-summary-icon {
    transform: rotate(180deg);
    border-color: rgba(96, 165, 250, 0.55);
    background: rgba(28, 52, 78, 0.88);
}

.admin-rules-body {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(116, 151, 190, 0.14);
}

.admin-rules-list {
    display: grid;
    gap: 10px;
    max-height: 560px;
    overflow: auto;
    padding-right: 4px;
}

.admin-rule-row {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(9rem, 0.45fr) minmax(12rem, 0.7fr) auto;
    gap: 12px;
    align-items: center;
    border: 1px solid rgba(116, 151, 190, 0.16);
    border-radius: 16px;
    background: rgba(9, 17, 26, 0.72);
    padding: 12px;
}

.admin-rule-main {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.admin-rule-main strong,
.admin-rule-main small,
.admin-rule-main span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.admin-rule-main strong {
    color: var(--ws-text);
    font-size: 0.98rem;
}

.admin-rule-main small,
.admin-rule-main span {
    color: var(--ws-text-muted);
    font-size: 0.82rem;
    line-height: 1.35;
}

.admin-rule-amount {
    display: grid;
    gap: 5px;
    color: var(--ws-text-muted);
    font-size: 0.78rem;
}

.admin-rule-flags {
    display: grid;
    gap: 6px;
}

.admin-rule-check {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--ws-text-muted);
    font-size: 0.82rem;
}

.admin-rule-check input {
    width: 15px;
    height: 15px;
    accent-color: #5da8ff;
}

.admin-rule-actions {
    display: grid;
    justify-items: end;
    gap: 7px;
}

.admin-rule-actions small {
    color: var(--ws-text-muted);
    font-size: 0.78rem;
}

.admin-actions-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    margin-top: 14px;
}

#admin-confirm-action-text {
    white-space: pre-line;
}

.admin-users-empty {
    grid-column: 1 / -1;
    border: 1px dashed rgba(116, 151, 190, 0.2);
    border-radius: 16px;
    color: var(--ws-text-muted);
    padding: 18px;
    text-align: center;
}

body[data-theme="daylight"] .admin-user-panel,
body[data-theme="daylight"] .admin-action-card,
body[data-theme="daylight"] .admin-user-card,
body[data-theme="daylight"] .admin-rule-row,
body[data-theme="daylight"] .admin-service-command,
body[data-theme="daylight"] .admin-workspace-card .form-control,
body[data-theme="daylight"] .admin-workspace-card .form-select,
body[data-theme="daylight"] .admin-ai-group,
body[data-theme="daylight"] .admin-ai-card,
body[data-theme="daylight"] .admin-ai-user-panel,
body[data-theme="daylight"] .admin-ai-user-card,
body[data-theme="daylight"] .admin-ai-summary-card,
body[data-theme="daylight"] .admin-ai-workspace-card .form-control,
body[data-theme="daylight"] .admin-ai-workspace-card .form-select {
    background: rgba(255, 255, 255, 0.84);
    border-color: rgba(87, 107, 137, 0.2);
}

@media (max-width: 980px) {
    .admin-user-controls,
    .admin-actions-grid,
    .admin-ai-toolbar,
    .admin-ai-card-summary,
    .admin-ai-card-head,
    .admin-ai-instance-form,
    .admin-ai-create-form,
    .admin-rule-toolbar,
    .admin-service-command,
    .admin-rule-row {
        grid-template-columns: 1fr;
    }

    .admin-ai-summary-grid,
    .admin-ai-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-rule-actions,
    .admin-service-actions {
        justify-items: stretch;
        justify-content: stretch;
    }
}

@media (max-width: 640px) {
    .admin-ai-summary-grid,
    .admin-ai-metrics {
        grid-template-columns: 1fr;
    }

    .admin-ai-summary-tags {
        flex-wrap: wrap;
    }

    .admin-ai-state {
        max-width: 100%;
        justify-self: start;
    }
}

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

    .economy-hero {
        display: grid;
    }

    .economy-hero-stats,
    .economy-toolbar {
        grid-template-columns: 1fr;
        min-width: 0;
    }

    .economy-quest-card {
        grid-template-columns: 62px minmax(0, 1fr);
        align-items: start;
    }

    .economy-quest-reward,
    .economy-quest-actions {
        grid-column: 1 / -1;
    }

    .economy-quest-reward {
        grid-template-columns: auto minmax(0, 1fr) auto;
        justify-items: start;
        align-items: center;
        min-height: 0;
    }

    .economy-task-editor form {
        grid-template-columns: 1fr;
    }

    .economy-real-payment-fields,
    .economy-payout-grid {
        grid-template-columns: 1fr;
    }

    .economy-task-editor {
        position: static;
    }
}

@media (max-width: 520px) {
    .ws-profile-folder-resources {
        flex-wrap: wrap;
    }

    .ws-profile-folder-resource strong {
        max-width: 34px;
    }

    .economy-task-grid {
        grid-template-columns: 1fr;
    }

    .economy-modal-quest {
        grid-template-columns: 1fr;
    }

    .economy-modal-quest .ws-btn-primary {
        width: 100%;
    }
}

.ide-ui-ref-host {
    position: relative;
}

.ide-ui-ref-trigger {
    width: 22px;
    height: 22px;
    min-width: 22px;
    border: 1px solid rgba(120, 154, 205, 0.25);
    border-radius: 6px;
    background: rgba(10, 18, 30, 0.52);
    color: rgba(218, 229, 246, 0.72);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font: 700 15px/1 "Inter", sans-serif;
    padding: 0;
    margin-left: 6px;
    cursor: pointer;
    opacity: 0.38;
    transition: opacity 0.16s ease, border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
}

.ide-ui-ref-host:hover > .ide-ui-ref-trigger,
.ide-ui-ref-trigger:focus-visible,
.ide-ui-ref-trigger:hover {
    opacity: 1;
    color: #e8f1ff;
    border-color: rgba(130, 173, 245, 0.62);
    background: rgba(27, 47, 77, 0.88);
}

.ws-tab .ide-ui-ref-trigger {
    width: 18px;
    height: 18px;
    min-width: 18px;
    margin-left: 5px;
    border-radius: 5px;
    font-size: 12px;
    opacity: 0.42;
}

.ws-tab:hover .ide-ui-ref-trigger,
.ws-tab:focus-visible .ide-ui-ref-trigger,
.ws-tab .ide-ui-ref-trigger:focus-visible {
    opacity: 0.9;
}

.modal-header > .ide-ui-ref-trigger {
    margin-left: auto;
    margin-right: 10px;
}

.project-panel.ide-ui-ref-host > .ide-ui-ref-trigger {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
}

.ide-ui-ref-menu {
    position: fixed;
    z-index: 4000;
    display: none;
    width: min(310px, calc(100vw - 26px));
    padding: 8px;
    border: 1px solid rgba(106, 166, 255, 0.25);
    border-radius: 12px;
    background:
        radial-gradient(circle at 100% 0%, rgba(106, 166, 255, 0.18), transparent 38%),
        radial-gradient(circle at 0% 100%, rgba(59, 209, 127, 0.10), transparent 42%),
        linear-gradient(180deg, rgba(13, 22, 35, 0.98), rgba(5, 10, 18, 0.98));
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.58), 0 0 38px rgba(106, 166, 255, 0.08);
    backdrop-filter: blur(14px);
}

.ide-ui-ref-menu.is-open {
    display: grid;
    gap: 5px;
}

.ide-ui-ref-menu-head {
    display: grid;
    gap: 3px;
    padding: 7px 8px 8px;
    border-bottom: 1px solid rgba(106, 166, 255, 0.14);
    margin-bottom: 2px;
}

.ide-ui-ref-menu-head span {
    color: rgba(144, 181, 228, 0.82);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.12em;
}

.ide-ui-ref-menu-head strong {
    color: var(--ws-text);
    font-size: 0.86rem;
    line-height: 1.2;
}

.ide-ui-ref-menu-head small {
    color: rgba(129, 205, 244, 0.84);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.66rem;
    font-weight: 750;
    line-height: 1.2;
}

.ide-ui-ref-menu button {
    min-height: 46px;
    display: grid;
    gap: 2px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: rgba(230, 237, 249, 0.94);
    text-align: left;
    padding: 8px 9px;
    cursor: pointer;
}

.ide-ui-ref-menu button strong {
    color: rgba(236, 244, 255, 0.96);
    font-size: 0.80rem;
    font-weight: 800;
    line-height: 1.2;
}

.ide-ui-ref-menu button em {
    color: rgba(147, 165, 190, 0.88);
    font-size: 0.68rem;
    font-style: normal;
    font-weight: 650;
    line-height: 1.25;
}

.ide-ui-ref-menu button:hover,
.ide-ui-ref-menu button:focus-visible {
    background: linear-gradient(135deg, rgba(106, 166, 255, 0.14), rgba(59, 209, 127, 0.06));
    color: #ffffff;
    outline: none;
}

.ide-ui-ref-menu button:hover em,
.ide-ui-ref-menu button:focus-visible em {
    color: rgba(204, 220, 242, 0.94);
}

.ide-ui-ref-menu-status {
    min-height: 20px;
    padding: 4px 8px 2px;
    color: rgba(111, 224, 153, 0.95);
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.68rem;
    font-weight: 800;
}

.ide-ui-ref-menu-status.is-error {
    color: rgba(255, 136, 136, 0.95);
}

.ide-ui-info-modal .modal-body {
    display: grid;
    gap: 14px;
}

#ideUiInfoModal {
    z-index: 13050;
}

.modal-backdrop.ide-ui-info-backdrop {
    z-index: 13040;
}

.ide-ui-info-modal .modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.ide-ui-info-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
    margin-right: auto;
}

.ide-ui-info-actions .ws-btn-soft {
    min-height: 34px;
    padding: 7px 10px;
    border-radius: 8px;
    font-size: 0.78rem;
    white-space: nowrap;
}

.ide-ui-info-action-status {
    min-width: 120px;
    color: rgba(140, 217, 169, 0.92);
    font-size: 0.78rem;
    font-weight: 700;
    text-align: right;
}

.ide-ui-info-action-status.is-error {
    color: rgba(255, 136, 136, 0.94);
}

.ide-ui-info-type {
    margin-top: 4px;
    color: rgba(170, 187, 211, 0.82);
    font-size: 13px;
    font-weight: 650;
}

.ide-ui-info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.ide-ui-info-grid section {
    border: 1px solid rgba(112, 145, 190, 0.2);
    border-radius: 8px;
    background: rgba(13, 24, 39, 0.64);
    padding: 12px;
    min-width: 0;
}

.ide-ui-info-grid span,
.ide-ui-feedback-title {
    display: block;
    margin-bottom: 6px;
    color: rgba(142, 165, 198, 0.86);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.ide-ui-info-grid p {
    margin: 0;
    color: rgba(230, 238, 249, 0.92);
    font-size: 14px;
    line-height: 1.45;
}

.ide-ui-info-tech {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.ide-ui-info-tech span {
    border: 1px solid rgba(112, 145, 190, 0.24);
    border-radius: 999px;
    background: rgba(5, 12, 22, 0.48);
    color: rgba(185, 201, 224, 0.86);
    padding: 5px 8px;
    font-family: "JetBrains Mono", monospace;
    font-size: 11px;
}

.ide-ui-feedback-panel {
    display: grid;
    gap: 10px;
    border-top: 1px solid rgba(112, 145, 190, 0.18);
    padding-top: 14px;
}

.ide-ui-feedback-panel .form-control {
    background: rgba(8, 16, 27, 0.84);
    border-color: rgba(112, 145, 190, 0.28);
    color: #edf4ff;
}

.ide-ui-feedback-panel .form-control:focus {
    background: rgba(8, 16, 27, 0.95);
    border-color: rgba(130, 173, 245, 0.62);
    color: #ffffff;
    box-shadow: 0 0 0 0.2rem rgba(63, 126, 214, 0.14);
}

.ide-ui-feedback-status {
    min-height: 18px;
    color: #8ee6b0;
    font-size: 13px;
    font-weight: 650;
}

.ide-ui-feedback-status.is-error {
    color: #ff8f9c;
}

.ide-ui-ref-highlight {
    animation: ide-ui-ref-pulse 1.8s ease;
}

@keyframes ide-ui-ref-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(83, 159, 255, 0.0);
    }
    18% {
        box-shadow: 0 0 0 3px rgba(83, 159, 255, 0.38);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(83, 159, 255, 0.0);
    }
}

.ide-demo-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 0;
    padding: 10px 18px;
    border-bottom: 1px solid rgba(94, 159, 255, 0.24);
    background:
        linear-gradient(135deg, rgba(20, 47, 76, 0.92), rgba(11, 22, 36, 0.94)),
        radial-gradient(circle at 12% 0%, rgba(76, 208, 160, 0.18), transparent 34%);
    color: #dce9fb;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

.ide-demo-banner strong {
    display: block;
    color: #ffffff;
    font-size: 14px;
    font-weight: 800;
}

.ide-demo-banner span {
    display: block;
    margin-top: 2px;
    color: #9fb2ca;
    font-size: 12px;
    line-height: 1.45;
}

.ide-demo-banner nav {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}

.ide-demo-banner a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0 12px;
    border: 1px solid rgba(117, 169, 245, 0.38);
    border-radius: 10px;
    background: rgba(14, 27, 44, 0.68);
    color: #eaf2ff;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.ide-demo-banner a:hover {
    border-color: rgba(126, 198, 255, 0.78);
    color: #ffffff;
}

.ws-demo-exit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 13px;
    border: 1px solid rgba(117, 169, 245, 0.38);
    border-radius: 10px;
    background: rgba(14, 27, 44, 0.72);
    color: #eaf2ff;
    font-size: 12px;
    font-weight: 850;
    text-decoration: none;
    white-space: nowrap;
}

.ws-demo-exit-btn:hover {
    border-color: rgba(126, 198, 255, 0.78);
    color: #ffffff;
}

.ws-demo-sidebar-exit {
    display: flex;
    text-decoration: none;
}

.ide-demo-readonly-notice {
    position: fixed;
    left: 50%;
    bottom: 24px;
    z-index: 10080;
    max-width: min(520px, calc(100vw - 28px));
    transform: translate(-50%, 18px);
    opacity: 0;
    pointer-events: none;
    padding: 12px 16px;
    border: 1px solid rgba(117, 169, 245, 0.38);
    border-radius: 14px;
    background: rgba(8, 16, 27, 0.96);
    color: #edf4ff;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(53, 104, 176, 0.18) inset;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.45;
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.ide-demo-readonly-notice.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
}

@media (max-width: 720px) {
    .ide-demo-banner {
        align-items: flex-start;
        flex-direction: column;
        padding: 10px 12px;
    }

    .ide-demo-banner nav {
        width: 100%;
        flex-wrap: wrap;
    }

    .ide-demo-banner a {
        flex: 1 1 140px;
    }

    .open-library-lineage-grid {
        grid-template-columns: 1fr;
    }

    .open-library-compare header {
        flex-direction: column;
    }

    .open-library-compare-grid,
    .open-library-compare-modules {
        grid-template-columns: 1fr;
    }

    .open-library-derivative-row {
        grid-template-columns: 1fr;
    }

    .open-library-derivative-meta {
        flex-wrap: wrap;
    }

    .open-library-version-row,
    .project-open-version-row {
        grid-template-columns: 1fr 1fr;
    }

    .ide-ui-info-grid {
        grid-template-columns: 1fr;
    }

.ide-ui-ref-menu {
    width: min(224px, calc(100vw - 16px));
}
}

/* Sound Identity tab */
.sound-identity-workspace-card {
    display: grid;
    gap: 16px;
}

.workspace-command-sound {
    display: grid;
    gap: 8px;
    padding: 10px;
    border: 1px solid rgba(125, 183, 255, 0.14);
    border-radius: 16px;
    background: rgba(8, 17, 29, 0.45);
}

.workspace-command-sound-label {
    color: rgba(219, 232, 248, 0.68);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.sound-identity-workspace-card .sound-identity-header {
    align-items: flex-start;
    padding-right: 56px;
}

.sound-identity-workspace-card .sound-identity-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.sound-identity-workspace-card .sound-identity-step {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 12px;
    row-gap: 2px;
    align-items: start;
    padding: 14px;
    border: 1px solid rgba(125, 183, 255, 0.16);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(12, 26, 42, 0.78), rgba(8, 36, 39, 0.54));
}

.sound-identity-workspace-card .sound-identity-step span {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    grid-row: 1 / span 2;
    border: 1px solid rgba(91, 207, 255, 0.32);
    border-radius: 13px;
    background: rgba(24, 76, 92, 0.55);
    color: #dff7ff;
    font-family: "JetBrains Mono", monospace;
    font-weight: 800;
}

.sound-identity-workspace-card .sound-identity-step strong {
    color: #edf4ff;
    font-size: 1rem;
}

.sound-identity-workspace-card .sound-identity-step em {
    color: rgba(219, 232, 248, 0.68);
    font-style: normal;
    line-height: 1.45;
}

.sound-identity-workspace-card .sound-identity-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 14px;
}

.sound-identity-workspace-card .sound-identity-panel {
    min-width: 0;
    border: 1px solid rgba(125, 183, 255, 0.16);
    border-radius: 18px;
    background: rgba(8, 17, 29, 0.42);
}

.sound-identity-workspace-card .admin-sound-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.sound-identity-workspace-card .admin-sound-form label,
.sound-identity-workspace-card .admin-sound-form select,
.sound-identity-workspace-card .admin-sound-form input {
    min-width: 0;
    width: 100%;
}

.sound-identity-workspace-card .admin-sound-form .settings-wide-field {
    grid-column: 1 / -1;
}

.sound-identity-workspace-card .form-control,
.sound-identity-workspace-card .form-select,
.sound-identity-workspace-card input[type="file"],
.sound-identity-workspace-card input[type="number"],
.sound-identity-workspace-card input[type="text"],
.sound-identity-workspace-card select {
    min-height: 44px !important;
    width: 100% !important;
    border: 1px solid rgba(116, 151, 190, 0.24) !important;
    border-radius: 14px !important;
    background-color: rgba(13, 22, 32, 0.92) !important;
    color: #e8eef7 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
}

.sound-identity-workspace-card .form-control::placeholder {
    color: rgba(219, 232, 248, 0.46) !important;
}

.sound-identity-workspace-card .form-control:focus,
.sound-identity-workspace-card .form-select:focus,
.sound-identity-workspace-card input[type="file"]:focus,
.sound-identity-workspace-card input[type="number"]:focus,
.sound-identity-workspace-card input[type="text"]:focus,
.sound-identity-workspace-card select:focus {
    border-color: rgba(91, 207, 255, 0.62) !important;
    box-shadow: 0 0 0 3px rgba(91, 207, 255, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
    outline: none !important;
}

.sound-identity-workspace-card .form-select,
.sound-identity-workspace-card select {
    appearance: none;
    padding-right: 42px !important;
    background-image:
        linear-gradient(45deg, transparent 50%, rgba(219, 232, 248, 0.86) 50%),
        linear-gradient(135deg, rgba(219, 232, 248, 0.86) 50%, transparent 50%),
        linear-gradient(145deg, rgba(21, 38, 56, 0.96), rgba(13, 22, 32, 0.92)) !important;
    background-position:
        calc(100% - 21px) 50%,
        calc(100% - 15px) 50%,
        0 0 !important;
    background-size:
        6px 6px,
        6px 6px,
        100% 100% !important;
    background-repeat: no-repeat !important;
}

.sound-identity-workspace-card .form-select option,
.sound-identity-workspace-card .form-select optgroup,
.sound-identity-workspace-card select option,
.sound-identity-workspace-card select optgroup {
    background: #101720 !important;
    color: #e8eef7 !important;
}

.sound-identity-workspace-card .form-select option:checked,
.sound-identity-workspace-card select option:checked {
    background: #16375a !important;
    color: #ffffff !important;
}

.sound-identity-workspace-card input[type="file"] {
    padding: 8px 10px !important;
}

.sound-identity-workspace-card input[type="file"]::file-selector-button {
    min-height: 28px;
    margin-right: 12px;
    border: 1px solid rgba(91, 207, 255, 0.36);
    border-radius: 10px;
    background: linear-gradient(145deg, rgba(31, 71, 104, 0.95), rgba(18, 50, 70, 0.95));
    color: #edf8ff;
    font-weight: 800;
    cursor: pointer;
}

.sound-identity-workspace-card input[type="file"]::-webkit-file-upload-button {
    min-height: 28px;
    margin-right: 12px;
    border: 1px solid rgba(91, 207, 255, 0.36);
    border-radius: 10px;
    background: linear-gradient(145deg, rgba(31, 71, 104, 0.95), rgba(18, 50, 70, 0.95));
    color: #edf8ff;
    font-weight: 800;
    cursor: pointer;
}

.sound-identity-workspace-card .admin-sound-list {
    display: grid;
    gap: 10px;
    max-height: 360px;
    overflow: auto;
    padding-right: 4px;
}

.sound-identity-workspace-card .admin-sound-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 11px 12px;
    border: 1px solid rgba(125, 183, 255, 0.14);
    border-radius: 14px;
    background: rgba(14, 27, 43, 0.74);
}

.sound-identity-workspace-card .admin-sound-row strong,
.sound-identity-workspace-card .admin-sound-row span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.sound-identity-workspace-card .admin-sound-row small {
    display: block;
    color: rgba(219, 232, 248, 0.62);
    margin-top: 2px;
}

.sound-identity-workspace-card .admin-sound-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.sound-identity-workspace-card .sound-test-wave {
    display: inline-grid;
    grid-auto-flow: column;
    align-items: center;
    gap: 3px;
    min-width: 34px;
    height: 28px;
    padding: 4px 6px;
    border: 1px solid rgba(91, 207, 255, 0.24);
    border-radius: 999px;
    background: rgba(9, 24, 36, 0.72);
}

.sound-identity-workspace-card .sound-test-wave i {
    width: 3px;
    height: 6px;
    display: block;
    border-radius: 999px;
    background: linear-gradient(180deg, #7fe7ff, #57d68d);
    box-shadow: 0 0 8px rgba(91, 207, 255, 0.45);
    transform-origin: center;
}

.sound-identity-workspace-card .sound-test-wave.is-playing i {
    animation: sound-test-pulse 0.62s ease-in-out infinite;
}

.sound-identity-workspace-card .sound-test-wave.is-playing i:nth-child(2) {
    animation-delay: 0.08s;
}

.sound-identity-workspace-card .sound-test-wave.is-playing i:nth-child(3) {
    animation-delay: 0.16s;
}

.sound-identity-workspace-card .sound-test-wave.is-playing i:nth-child(4) {
    animation-delay: 0.24s;
}

.sound-identity-workspace-card .sound-test-wave.is-playing i:nth-child(5) {
    animation-delay: 0.32s;
}

@keyframes sound-test-pulse {
    0%,
    100% {
        height: 6px;
        opacity: 0.65;
    }
    45% {
        height: 20px;
        opacity: 1;
    }
}

body[data-theme="daylight"] .sound-identity-workspace-card .form-control,
body[data-theme="daylight"] .sound-identity-workspace-card .form-select,
body[data-theme="daylight"] .sound-identity-workspace-card input[type="file"],
body[data-theme="daylight"] .sound-identity-workspace-card input[type="number"],
body[data-theme="daylight"] .sound-identity-workspace-card input[type="text"],
body[data-theme="daylight"] .sound-identity-workspace-card select {
    background-color: rgba(255, 255, 255, 0.88) !important;
    border-color: rgba(87, 107, 137, 0.24) !important;
    color: #162133 !important;
}

@media (max-width: 920px) {
    .sound-identity-workspace-card .admin-sound-form,
    .sound-identity-workspace-card .sound-identity-steps,
    .sound-identity-workspace-card .sound-identity-layout {
        grid-template-columns: 1fr;
    }
}