* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    height: 100%;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    background: #171a1f;
    color: #eceff3;
}

.app {
    height: 100vh;
    display: flex;
    flex-direction: column;
}


/* HEADER */

.topbar {
    min-height: 92px;
    flex-shrink: 0;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 12px 30px;

    background: #111419;
    border-bottom: 1px solid #2b3038;
}

.header-branding {
    display: flex;
    align-items: center;
    gap: 16px;
}

.header-logo {
    width: 58px;
    height: 58px;
    object-fit: contain;
}

.header-text {
    display: flex;
    flex-direction: column;
}

.brand {
    font-size: 20px;
    font-weight: 650;
    letter-spacing: 1.2px;
}

.tagline-primary {
    margin-top: 4px;

    font-size: 12px;
    font-weight: 650;
    letter-spacing: 1.4px;

    color: var(--jarvis-type-caption-color);
}

.tagline-secondary {
    margin-top: 2px;

    font-size: 10px;
    font-weight: 500;
    letter-spacing: 1.2px;

    color: #838a94;
}

.status {
    display: flex;
    align-items: center;
    gap: 7px;

    padding: 7px 12px;

    border: 1px solid #313741;
    border-radius: 16px;

    background: #181c22;

    font-size: 11px;
    color: #aeb5be;
}

.status-dot {
    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: #54d890;

    box-shadow: 0 0 7px rgba(84, 216, 144, 0.4);
}

.status-dot.thinking {
    background: #d8b354;
}

.status-dot.web {
    background: #61bde8;
}

.status-dot.error {
    background: #e76b6b;
}


/* CHAT */

.chat {
    flex: 1;
    overflow-y: auto;

    padding: 30px 20px 170px;
}


/* WELCOME */

.welcome {
    height: 100%;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    text-align: center;

    transform: translateY(-30px);
}

.welcome-logo {
    width: 125px;
    height: 125px;

    object-fit: contain;

    margin-bottom: 20px;

    filter: drop-shadow(
        0 0 10px
        rgba(66, 194, 230, 0.12)
    );
}

.welcome h1 {
    margin: 0;

    font-size: 30px;
    font-weight: 500;
}

.welcome p {
    margin-top: 9px;

    color: #8e959f;

    font-size: 14px;
}


/* MESSAGES */

.message {
    width: 100%;
    margin-bottom: 30px;
}

.message-inner {
    width: 100%;
    max-width: 820px;

    margin: 0 auto;
}

.message.user .message-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.message-text {
    font-size: 15.5px;
    line-height: 1.65;
}

.message.user .message-text {
    max-width: 75%;

    padding: 11px 17px;

    background: #292e35;

    border: 1px solid #373d46;
    border-radius: 20px;
}

.message.assistant .message-text {
    width: 100%;
}


/* JARVIS RESPONSE IDENTITY */

.assistant-identity {
    display: flex;
    align-items: center;

    gap: 8px;

    margin-bottom: 10px;
}

/*
   Reduced to roughly 75% of the
   previous 34px chat-logo size.
*/
.assistant-icon {
    width: 26px;
    height: 26px;

    object-fit: contain;

    filter: drop-shadow(
        0 0 4px
        rgba(66, 194, 230, 0.10)
    );
}

.assistant-name {
    font-size: 11px;

    font-weight: 650;

    letter-spacing: 1px;

    color: #bec4cb;
}


/* SOURCES */

.sources {
    margin-top: 18px;

    padding-top: 14px;

    border-top: 1px solid #343a43;
}

.sources-title {
    margin-bottom: 8px;

    font-size: 11px;
    font-weight: 650;

    color: #858d97;

    text-transform: uppercase;

    letter-spacing: 1px;
}

.sources a {
    display: block;

    margin: 7px 0;

    color: #aeb9c4;

    font-size: 13px;

    text-decoration: none;
}

.sources a:hover {
    color: #ffffff;
    text-decoration: underline;
}


/* MESSAGE COMPOSER */

.composer-area {
    position: fixed;

    left: 0;
    right: 0;
    bottom: 0;

    padding: 22px 20px 13px;

    background:
        linear-gradient(
            transparent,
            #171a1f 35%
        );
}

.composer {
    max-width: 820px;

    margin: 0 auto;

    padding: 8px 17px;

    background: #292e35;

    border: 1px solid #414852;
    border-radius: 26px;

    box-shadow:
        0 5px 20px
        rgba(0, 0, 0, 0.25);
}

textarea {
    display: block;

    width: 100%;

    min-height: 34px;
    max-height: 180px;

    padding: 7px 3px;

    resize: none;
    overflow-y: auto;

    border: none;
    outline: none;

    background: transparent;

    color: #eceff3;

    font-family: inherit;
    font-size: 16px;
    line-height: 1.35;
}

textarea::placeholder {
    color: #858c95;
}

textarea:disabled {
    opacity: 0.6;
}

.hint {
    margin-top: 8px;

    text-align: center;

    color: #656c75;

    font-size: 11px;
}


/* SCROLLBAR */

::-webkit-scrollbar {
    width: 9px;
}

::-webkit-scrollbar-track {
    background: #171a1f;
}

::-webkit-scrollbar-thumb {
    background: #373d45;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: #484f59;
}


/* MOBILE */




/* =========================================================
   JARVIS MOBILE / iPHONE REFINEMENTS
   ========================================================= */

html,
body {
    width: 100%;
    overflow: hidden;
}

.app {
    height: 100dvh;
    min-height: 100vh;
}


/* iPhone / mobile layout */




/* Extra-small phones */




/* =========================================================
   JARVIS MOBILE / iPHONE REFINEMENTS
   ========================================================= */

html,
body {
    width: 100%;
    overflow: hidden;
}

.app {
    height: 100dvh;
    min-height: 100vh;
}


/* iPhone / mobile layout */




/* Extra-small phones */




/* iPhone header safe-area adjustment */




/* Additional iPhone header positioning */



/* JARVIS Stats for Nerds */

.stats-toggle {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    height: 34px;
    padding: 0 12px;
    border: 1px solid #2c3540;
    border-radius: 999px;
    background: #171c22;
    color: #9ca8b5;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.stats-toggle:hover {
    background: #1c232b;
    border-color: #3a4652;
    color: #d7dee6;
}

.stats-switch {
    position: relative;
    width: 30px;
    height: 16px;
    border-radius: 999px;
    background: #343d47;
}

.stats-knob {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #9aa5b1;
    transition: transform 0.18s ease;
}

.stats-state {
    min-width: 22px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #7f8a96;
}

.stats-toggle.enabled {
    border-color: rgba(54, 190, 225, 0.35);
    color: #d7e8ee;
}

.stats-toggle.enabled .stats-switch {
    background: rgba(43, 177, 211, 0.45);
}

.stats-toggle.enabled .stats-knob {
    transform: translateX(14px);
    background: #62d7f2;
}

.stats-toggle.enabled .stats-state {
    color: #62d7f2;
}

.perf-box {
    display: none;
}

body.show-stats .perf-box {
    display: block;
    margin-top: 8px;
}


/* JARVIS Voice Microphone */

.composer {
    display: flex;
    align-items: flex-end;
    gap: 8px;
}

.composer textarea {
    flex: 1;
    min-width: 0;
}

.mic-button {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;
    flex: 0 0 38px;

    padding: 0;

    border: 1px solid #414852;
    border-radius: 50%;

    background: #20252b;
    color: #aab4bf;

    cursor: pointer;

    transition:
        background 0.18s ease,
        border-color 0.18s ease,
        transform 0.18s ease;
}

.mic-button:hover {
    background: #303740;
    border-color: #59636e;
}

.mic-button:active {
    transform: scale(0.94);
}

.mic-button.recording {
    background: rgba(190, 55, 55, 0.22);
    border-color: #d25555;
}

.mic-icon {
    font-size: 17px;
    line-height: 1;
}


/* JARVIS Listening Animation */

.mic-button.recording {
    position: relative;
    background: rgba(190, 55, 55, 0.20);
    border-color: #d25555;
    animation: jarvisMicPulse 1.4s ease-in-out infinite;
}

.mic-button.recording::before {
    content: "";
    position: absolute;
    inset: -5px;
    border: 2px solid rgba(210, 85, 85, 0.45);
    border-radius: 50%;
    animation: jarvisMicRing 1.4s ease-out infinite;
    pointer-events: none;
}

.mic-button.recording .mic-icon {
    animation: jarvisMicIcon 1.4s ease-in-out infinite;
}

@keyframes jarvisMicPulse {
    0%,
    100% {
        box-shadow:
            0 0 0 0 rgba(210, 85, 85, 0.15),
            0 0 8px rgba(210, 85, 85, 0.20);
    }

    50% {
        box-shadow:
            0 0 0 5px rgba(210, 85, 85, 0.08),
            0 0 16px rgba(210, 85, 85, 0.38);
    }
}

@keyframes jarvisMicRing {
    0% {
        transform: scale(0.88);
        opacity: 0.75;
    }

    100% {
        transform: scale(1.38);
        opacity: 0;
    }
}

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

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





/* JARVIS identity-era header action layout */

.header-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 6px;
}


/* =========================================================
   JARVIS Administration
   ========================================================= */

.admin-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 0 11px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 7px;
    color: rgba(255, 255, 255, 0.72);
    text-decoration: none;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transition:
        border-color 0.2s ease,
        color 0.2s ease,
        background 0.2s ease;
}

.admin-link:hover {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.05);
}


.admin-body {
    min-height: 100vh;
    margin: 0;
    background:
        radial-gradient(
            circle at top left,
            rgba(61, 103, 255, 0.10),
            transparent 34%
        ),
        #080b10;
    color: #f4f6fb;
}


.admin-topbar {
    min-height: 82px;
    padding: 14px 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(8, 11, 16, 0.92);
    box-sizing: border-box;
}


.admin-brand {
    display: flex;
    align-items: center;
    gap: 13px;
}


.admin-logo {
    width: 42px;
    height: 42px;
    object-fit: contain;
}


.admin-brand-title {
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0.14em;
}


.admin-brand-subtitle {
    margin-top: 3px;
    color: rgba(255, 255, 255, 0.48);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.16em;
}


.admin-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}


.admin-header-actions form {
    margin: 0;
}


.admin-button {
    min-height: 36px;
    padding: 0 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    text-decoration: none;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}


.admin-button:hover {
    background: rgba(255, 255, 255, 0.13);
}


.admin-button-secondary {
    background: transparent;
    color: rgba(255, 255, 255, 0.74);
}


.admin-main {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    padding: 44px 0 70px;
}


.admin-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 46px;
}


.admin-eyebrow {
    margin-bottom: 8px;
    color: #8797c8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.18em;
}


.admin-intro h1 {
    margin: 0;
    font-size: clamp(30px, 5vw, 48px);
    line-height: 1.05;
}


.admin-intro p {
    max-width: 650px;
    margin: 13px 0 0;
    color: rgba(255, 255, 255, 0.55);
    font-size: 14px;
    line-height: 1.6;
}


.admin-user-card {
    min-width: 180px;
    padding: 17px 19px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.035);
}


.admin-user-label {
    color: rgba(255, 255, 255, 0.38);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.14em;
}


.admin-user-card strong {
    margin-top: 4px;
    font-size: 17px;
}


.admin-role {
    color: #7f92ca;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}


.admin-section {
    margin-top: 42px;
}


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


.admin-section-heading h2 {
    margin: 0;
    font-size: 21px;
}


.admin-live-indicator {
    display: flex;
    align-items: center;
    gap: 7px;
    color: rgba(255, 255, 255, 0.50);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.14em;
}


.admin-live-indicator span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #53d98c;
    box-shadow: 0 0 10px rgba(83, 217, 140, 0.65);
}


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


.admin-service-card,
.admin-feature-card {
    border: 1px solid rgba(255, 255, 255, 0.085);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.032);
}


.admin-service-card {
    padding: 20px;
}


.admin-service-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 22px;
}


.admin-service-card h3,
.admin-feature-card h3 {
    margin: 0;
    font-size: 15px;
}


.admin-status {
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0.12em;
}


.admin-status-online {
    background: rgba(65, 205, 126, 0.12);
    color: #66de9b;
}


.admin-status-warning {
    background: rgba(240, 189, 78, 0.12);
    color: #e9c263;
}


.admin-status-offline {
    background: rgba(237, 83, 83, 0.12);
    color: #ed7777;
}


.admin-service-detail {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
    padding: 8px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.055);
    font-size: 11px;
}


.admin-service-detail span {
    color: rgba(255, 255, 255, 0.40);
}


.admin-service-detail strong {
    max-width: 68%;
    color: rgba(255, 255, 255, 0.72);
    font-weight: 600;
    text-align: right;
    overflow-wrap: anywhere;
}


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


.admin-feature-card {
    min-height: 130px;
    padding: 20px;
    display: flex;
    gap: 17px;
}


.admin-feature-icon {
    flex: 0 0 39px;
    width: 39px;
    height: 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(120, 146, 220, 0.25);
    border-radius: 10px;
    background: rgba(91, 119, 196, 0.10);
    color: #9cacdc;
    font-size: 11px;
    font-weight: 900;
}


.admin-feature-card p {
    margin: 8px 0 12px;
    color: rgba(255, 255, 255, 0.47);
    font-size: 12px;
    line-height: 1.55;
}


.admin-coming-soon {
    color: #7788ba;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0.14em;
}








/* =========================================================
   JARVIS Main UI — lighter workspace / stronger header
   ========================================================= */

body {
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(61, 91, 145, 0.10),
            transparent 38%
        ),
        #171b22;
}


/* Make the main JARVIS title bar more prominent */

.topbar {
    background:
        linear-gradient(
            180deg,
            #111722 0%,
            #0d121a 100%
        );

    border-bottom: 1px solid rgba(125, 153, 215, 0.24);

    box-shadow:
        0 5px 20px rgba(0, 0, 0, 0.32),
        0 1px 0 rgba(125, 153, 215, 0.08);

    min-height: 94px;
}


/* Give the JARVIS identity slightly more presence */

.topbar .brand,
.topbar .logo,
.topbar h1 {
    filter: brightness(1.08);
}


/* Keep the chat workspace visually separate from the header */

.chat {
    background:
        linear-gradient(
            180deg,
            rgba(31, 37, 47, 0.96) 0%,
            rgba(24, 29, 37, 0.98) 100%
        );
}


/* Admin should share the updated JARVIS visual language */

.admin-body {
    background:
        radial-gradient(
            circle at top left,
            rgba(61, 103, 255, 0.12),
            transparent 36%
        ),
        #171b22;
}


.admin-topbar {
    background:
        linear-gradient(
            180deg,
            #111722 0%,
            #0d121a 100%
        );

    border-bottom: 1px solid rgba(125, 153, 215, 0.24);

    box-shadow:
        0 5px 20px rgba(0, 0, 0, 0.32);
}



/* =========================================================
   JARVIS Model Management
   ========================================================= */

.admin-feature-link {
    position: relative;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    transition:
        background 0.18s ease,
        border-color 0.18s ease,
        transform 0.18s ease;
}

.admin-feature-link:hover {
    background: rgba(255, 255, 255, 0.055);
    border-color: rgba(111, 145, 225, 0.28);
    transform: translateY(-1px);
}

.admin-feature-arrow {
    margin-left: auto;
    align-self: center;
    color: rgba(255, 255, 255, 0.38);
    font-size: 30px;
    font-weight: 300;
}


.model-active-badge {
    min-width: 230px;
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    border: 1px solid rgba(99, 136, 224, 0.24);
    border-radius: 12px;
    background:
        linear-gradient(
            135deg,
            rgba(67, 101, 185, 0.12),
            rgba(255, 255, 255, 0.025)
        );
}

.model-active-badge span,
.model-card-label {
    color: #8296d0;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.16em;
}

.model-active-badge strong {
    font-size: 18px;
}


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

.model-status-card {
    min-height: 125px;
    padding: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
    border: 1px solid rgba(255, 255, 255, 0.085);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.032);
}

.model-status-card .admin-status {
    position: absolute;
    top: 18px;
    right: 18px;
}

.model-status-value {
    margin-top: 4px;
    font-size: 17px;
}

.model-card-subtext {
    color: rgba(255, 255, 255, 0.42);
    font-size: 11px;
}


.model-detail-panel {
    padding: 23px;
    border: 1px solid rgba(255, 255, 255, 0.085);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.032);
}

.model-detail-header {
    padding-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.065);
}

.model-detail-header h3 {
    margin: 7px 0 0;
    font-size: 23px;
}


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

.model-detail-item {
    min-height: 78px;
    padding: 18px 17px;
    display: flex;
    flex-direction: column;
    gap: 7px;
    border-right: 1px solid rgba(255, 255, 255, 0.055);
    border-bottom: 1px solid rgba(255, 255, 255, 0.055);
}

.model-detail-item:nth-child(4n) {
    border-right: 0;
}

.model-detail-item span {
    color: rgba(255, 255, 255, 0.38);
    font-size: 10px;
}

.model-detail-item strong {
    color: rgba(255, 255, 255, 0.82);
    font-size: 13px;
}


.model-served-row {
    display: flex;
    align-items: center;
    gap: 13px;
}

.model-served-row strong,
.model-served-row span {
    display: block;
}

.model-served-row span {
    margin-top: 4px;
    color: rgba(255, 255, 255, 0.40);
    font-size: 11px;
}

.model-served-dot {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #59dd98;
    box-shadow: 0 0 11px rgba(89, 221, 152, 0.55);
}

.model-served-dot-offline {
    background: #ef7373;
    box-shadow: 0 0 11px rgba(239, 115, 115, 0.45);
}


.model-notice {
    padding: 18px 20px;
    display: flex;
    gap: 14px;
    border: 1px solid rgba(110, 139, 210, 0.18);
    border-radius: 12px;
    background: rgba(67, 91, 151, 0.07);
}

.model-notice-icon {
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(115, 148, 230, 0.30);
    border-radius: 50%;
    color: #91a7df;
    font-weight: 800;
}

.model-notice strong {
    font-size: 12px;
}

.model-notice p {
    margin: 5px 0 0;
    color: rgba(255, 255, 255, 0.43);
    font-size: 11px;
    line-height: 1.5;
}


@media (max-width: 900px) {

    .model-status-grid {
        grid-template-columns: 1fr;
    }

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

    .model-detail-item:nth-child(4n) {
        border-right:
            1px solid rgba(255, 255, 255, 0.055);
    }

    .model-detail-item:nth-child(2n) {
        border-right: 0;
    }

}



EOFcat >> static/style.css <<'EOF'


/* =========================================================
   JARVIS Model Management
   ========================================================= */

.admin-feature-link {
    position: relative;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    transition:
        background 0.18s ease,
        border-color 0.18s ease,
        transform 0.18s ease;
}

.admin-feature-link:hover {
    background: rgba(255, 255, 255, 0.055);
    border-color: rgba(111, 145, 225, 0.28);
    transform: translateY(-1px);
}

.admin-feature-arrow {
    margin-left: auto;
    align-self: center;
    color: rgba(255, 255, 255, 0.38);
    font-size: 30px;
    font-weight: 300;
}


.model-active-badge {
    min-width: 230px;
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    border: 1px solid rgba(99, 136, 224, 0.24);
    border-radius: 12px;
    background:
        linear-gradient(
            135deg,
            rgba(67, 101, 185, 0.12),
            rgba(255, 255, 255, 0.025)
        );
}

.model-active-badge span,
.model-card-label {
    color: #8296d0;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.16em;
}

.model-active-badge strong {
    font-size: 18px;
}


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

.model-status-card {
    min-height: 125px;
    padding: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 9px;
    border: 1px solid rgba(255, 255, 255, 0.085);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.032);
}

.model-status-card .admin-status {
    position: absolute;
    top: 18px;
    right: 18px;
}

.model-status-value {
    margin-top: 4px;
    font-size: 17px;
}

.model-card-subtext {
    color: rgba(255, 255, 255, 0.42);
    font-size: 11px;
}


.model-detail-panel {
    padding: 23px;
    border: 1px solid rgba(255, 255, 255, 0.085);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.032);
}

.model-detail-header {
    padding-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.065);
}

.model-detail-header h3 {
    margin: 7px 0 0;
    font-size: 23px;
}


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

.model-detail-item {
    min-height: 78px;
    padding: 18px 17px;
    display: flex;
    flex-direction: column;
    gap: 7px;
    border-right: 1px solid rgba(255, 255, 255, 0.055);
    border-bottom: 1px solid rgba(255, 255, 255, 0.055);
}

.model-detail-item:nth-child(4n) {
    border-right: 0;
}

.model-detail-item span {
    color: rgba(255, 255, 255, 0.38);
    font-size: 10px;
}

.model-detail-item strong {
    color: rgba(255, 255, 255, 0.82);
    font-size: 13px;
}


.model-served-row {
    display: flex;
    align-items: center;
    gap: 13px;
}

.model-served-row strong,
.model-served-row span {
    display: block;
}

.model-served-row span {
    margin-top: 4px;
    color: rgba(255, 255, 255, 0.40);
    font-size: 11px;
}

.model-served-dot {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #59dd98;
    box-shadow: 0 0 11px rgba(89, 221, 152, 0.55);
}

.model-served-dot-offline {
    background: #ef7373;
    box-shadow: 0 0 11px rgba(239, 115, 115, 0.45);
}


.model-notice {
    padding: 18px 20px;
    display: flex;
    gap: 14px;
    border: 1px solid rgba(110, 139, 210, 0.18);
    border-radius: 12px;
    background: rgba(67, 91, 151, 0.07);
}

.model-notice-icon {
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(115, 148, 230, 0.30);
    border-radius: 50%;
    color: #91a7df;
    font-weight: 800;
}

.model-notice strong {
    font-size: 12px;
}

.model-notice p {
    margin: 5px 0 0;
    color: rgba(255, 255, 255, 0.43);
    font-size: 11px;
    line-height: 1.5;
}


@media (max-width: 900px) {

    .model-status-grid {
        grid-template-columns: 1fr;
    }

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

    .model-detail-item:nth-child(4n) {
        border-right:
            1px solid rgba(255, 255, 255, 0.055);
    }

    .model-detail-item:nth-child(2n) {
        border-right: 0;
    }

}





/* =========================================================
   JARVIS Memory Management
   ========================================================= */

.memory-health-card {
    min-width: 210px;
    padding: 17px 19px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 5px;
    border: 1px solid rgba(93, 215, 151, 0.18);
    border-radius: 12px;
    background: rgba(70, 180, 120, 0.055);
}

.memory-health-card > span:first-child {
    color: rgba(255,255,255,0.42);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.15em;
}

.memory-health-card > strong {
    font-size: 18px;
}

.memory-health-card .admin-status {
    position: absolute;
    top: 17px;
    right: 17px;
}


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

.memory-stat-card {
    padding: 21px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    border: 1px solid rgba(255,255,255,0.085);
    border-radius: 13px;
    background: rgba(255,255,255,0.032);
}

.memory-stat-card span {
    color: rgba(255,255,255,0.40);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.14em;
}

.memory-stat-card strong {
    font-size: 24px;
}


.memory-add-form {
    padding: 20px;
    border: 1px solid rgba(255,255,255,0.085);
    border-radius: 13px;
    background: rgba(255,255,255,0.032);
}

.memory-add-form textarea {
    width: 100%;
    min-height: 90px;
    padding: 13px;
    box-sizing: border-box;
    resize: vertical;
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 9px;
    outline: none;
    background: rgba(0,0,0,0.18);
    color: #ffffff;
    font: inherit;
}

.memory-add-controls {
    margin-top: 12px;
    display: grid;
    grid-template-columns: 1fr 170px auto;
    gap: 10px;
}

.memory-add-controls input,
.memory-add-controls select,
.memory-search-form input {
    min-height: 39px;
    padding: 0 11px;
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 8px;
    outline: none;
    background: rgba(0,0,0,0.18);
    color: #ffffff;
    font: inherit;
}

.memory-add-controls select option {
    background: #171b22;
}

.memory-add-button {
    min-width: 120px;
}


.memory-search-form {
    margin-bottom: 15px;
    display: flex;
    gap: 8px;
}

.memory-search-form input {
    flex: 1;
}


.memory-list {
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.memory-card {
    padding: 18px 20px;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 12px;
    background: rgba(255,255,255,0.03);
}

.memory-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.memory-meta {
    display: flex;
    gap: 7px;
}

.memory-category,
.memory-source {
    padding: 5px 8px;
    border-radius: 6px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.memory-category {
    background: rgba(95, 124, 204, 0.13);
    color: #9aaddf;
}

.memory-source {
    background: rgba(255,255,255,0.055);
    color: rgba(255,255,255,0.48);
}

.memory-importance {
    color: rgba(255,255,255,0.34);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.12em;
}

.memory-importance strong {
    margin-left: 4px;
    color: #98aadd;
    font-size: 11px;
}

.memory-content {
    padding: 17px 0;
    color: rgba(255,255,255,0.88);
    font-size: 14px;
    line-height: 1.55;
}

.memory-card-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding-top: 11px;
    border-top: 1px solid rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.31);
    font-size: 9px;
}

.memory-empty {
    padding: 35px;
    border: 1px dashed rgba(255,255,255,0.11);
    border-radius: 12px;
    color: rgba(255,255,255,0.38);
    text-align: center;
}





/* =========================================================
   JARVIS APPLICATION SHELL
   ========================================================= */

:root {
    --sidebar-width: 220px;
}


/* HEADER RIGHT SIDE */

.header-actions {
    display: flex;
    align-items: center;
    gap: 20px;
}

.header-system {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 7px;
}

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

    min-width: 120px;

    padding-left: 18px;

    border-left: 1px solid #30353d;
}

.user-avatar {
    width: 34px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid #3a414b;
    border-radius: 50%;

    background: #20252c;

    font-size: 13px;
    font-weight: 700;

    color: #dce1e7;
}

.user-details {
    display: flex;
    flex-direction: column;

    line-height: 1.2;
}

.user-name {
    font-size: 12px;
    font-weight: 650;

    color: #e0e4e9;
}

.user-role {
    margin-top: 3px;

    font-size: 9px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: 1px;

    color: #747c86;
}


/* SIDEBAR */

.sidebar {
    position: fixed;

    top: 92px;
    left: 0;
    bottom: 0;

    width: var(--sidebar-width);

    display: flex;
    flex-direction: column;

    padding: 18px 12px 14px;

    background: #12151a;

    border-right: 1px solid #2b3038;

    z-index: 20;
}

.sidebar-nav {
    display: flex;
    flex-direction: column;

    gap: 4px;
}

.nav-item {
    min-height: 42px;

    display: flex;
    align-items: center;

    gap: 12px;

    padding: 0 13px;

    border: 1px solid transparent;
    border-radius: 8px;

    color: #929aa4;

    font-size: 13px;
    font-weight: 500;

    text-decoration: none;

    transition:
        background 0.15s ease,
        color 0.15s ease,
        border-color 0.15s ease;
}

.nav-item:hover {
    background: #1b1f25;

    color: #e5e9ed;
}

.nav-item.active {
    background: #20252c;

    border-color: #303740;

    color: #f0f2f4;
}

.nav-icon {
    width: 18px;

    text-align: center;

    font-size: 15px;

    color: #737c87;
}

.nav-item.active .nav-icon {
    color: #b8c2cd;
}

.nav-placeholder {
    cursor: default;
}

.nav-divider {
    height: 1px;

    margin: 10px 8px;

    background: #292e35;
}

.sidebar-footer {
    margin-top: auto;

    padding: 12px 13px 4px;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: 1.5px;

    color: #555d67;
}

.sidebar-footer span {
    display: block;

    margin-top: 3px;

    font-size: 8px;
    font-weight: 500;

    letter-spacing: 1.2px;

    color: #40464e;
}


/* MOVE EXISTING CHAT UI TO THE RIGHT OF SIDEBAR */

.chat {
    margin-left: var(--sidebar-width);
}

.composer-area {
    left: var(--sidebar-width);
}


/* BASIC RESPONSIVE BEHAVIOR */







/* =========================================================
   FIX SIDEBAR / HEADER OVERLAP
   ========================================================= */

:root {
    --header-height: 140px;
}

.topbar {
    height: var(--header-height);
    min-height: var(--header-height);
}

.sidebar {
    top: var(--header-height);
}

.chat {
    padding-top: 30px;
}



/* =========================================================
   JARVIS APPLICATION SHELL - FINAL DESKTOP OVERRIDES
   ========================================================= */

@media (min-width: 801px) {

    :root {
        --header-height: 110px;
        --sidebar-width: 220px;
    }


    /* HEADER */

    .topbar {
        height: var(--header-height);
        min-height: var(--header-height);

        padding: 12px 26px;

        align-items: center;
    }

    .header-logo {
        width: 56px;
        height: 56px;
    }

    .header-branding {
        gap: 15px;
    }

    .brand {
        font-size: 19px;
        letter-spacing: 1.15px;
    }

    .tagline-primary {
        margin-top: 3px;

        font-size: 11px;
    }

    .tagline-secondary {
        margin-top: 2px;

        font-size: 9px;
    }


    /* HEADER STATUS / USER */

    .header-actions {
        gap: 18px;
    }

    .header-system {
        gap: 6px;
    }

    .status {
        padding: 6px 11px;

        font-size: 10px;
    }

    .stats-toggle {
        height: 31px;

        padding: 0 11px;

        font-size: 11px;
    }

    .user-menu {
        min-width: 116px;

        padding-left: 17px;
    }

    .user-avatar {
        width: 32px;
        height: 32px;
    }


    /* SIDEBAR */

    .sidebar {
        top: var(--header-height);

        padding: 16px 11px 14px;
    }

    .sidebar-nav {
        gap: 3px;
    }

    .nav-item {
        min-height: 40px;

        padding: 0 12px;

        border-radius: 7px;

        font-size: 12.5px;
    }

    .nav-icon {
        width: 18px;

        font-size: 14px;
    }

    .nav-item.active {
        background:
            linear-gradient(
                90deg,
                rgba(73, 112, 188, 0.16),
                rgba(255, 255, 255, 0.045)
            );

        border-color: rgba(108, 139, 199, 0.22);
    }

    .nav-item.active::before {
        content: "";

        position: absolute;

        left: 0;

        width: 2px;
        height: 20px;

        border-radius: 2px;

        background: #65cfe8;
    }

    .nav-item {
        position: relative;
    }

    .nav-item:hover {
        background: rgba(255, 255, 255, 0.045);
    }

    .nav-divider {
        margin: 9px 8px;
    }


    /* WORKSPACE */

    .chat {
        margin-left: var(--sidebar-width);

        padding-top: 26px;
    }

    .composer-area {
        left: var(--sidebar-width);
    }

}


/* =========================================================
   JARVIS APPLICATION SHELL - MOBILE/TABLET
   ========================================================= */




/* =========================================================
   JARVIS HEADER STATUS CLUSTER
   ========================================================= */

@media (min-width: 801px) {

    .header-actions {
        display: flex;
        align-items: center;
        gap: 18px;
    }

    .header-system {
        min-width: 190px;

        display: flex;
        flex-direction: column;
        align-items: stretch;

        gap: 5px;
    }


    /* ONLINE STATUS */

    .status {
        justify-content: flex-end;

        min-height: 28px;

        padding: 0 8px;

        border: 0;
        border-radius: 0;

        background: transparent;

        font-size: 10px;
        font-weight: 600;

        color: #a9b2bd;
    }

    .status-dot {
        width: 7px;
        height: 7px;

        margin-right: 2px;
    }


    /* STATS CONTROL */

    .stats-toggle {
        width: 100%;
        height: 30px;

        justify-content: flex-end;

        gap: 8px;

        padding: 0 8px;

        border: 0;
        border-top: 1px solid rgba(255,255,255,0.07);
        border-radius: 0;

        background: transparent;

        color: #8f99a5;

        font-size: 10.5px;
        font-weight: 600;
    }

    .stats-toggle:hover {
        background: rgba(255,255,255,0.025);

        border-color: rgba(255,255,255,0.09);

        color: #d5dbe2;
    }

    .stats-switch {
        width: 28px;
        height: 15px;
    }

    .stats-knob {
        width: 11px;
        height: 11px;
    }

    .stats-toggle.enabled .stats-knob {
        transform: translateX(13px);
    }

    .stats-state {
        min-width: 20px;

        font-size: 9px;
    }


    /* USER SEPARATOR */

    .user-menu {
        min-width: 126px;

        padding-left: 18px;

        border-left: 1px solid rgba(255,255,255,0.10);
    }

    .user-avatar {
        width: 34px;
        height: 34px;

        background:
            linear-gradient(
                145deg,
                #252b34,
                #1a1f26
            );

        border-color: #3c4652;
    }

    .user-name {
        font-size: 12px;
    }

    .user-role {
        color: #68727e;
    }

}


/* =========================================================
   JARVIS HEADER CLUSTER - CLEAN FINAL LAYOUT
   ========================================================= */

@media (min-width: 801px) {

    .topbar {
        height: 110px;
        min-height: 110px;

        display: flex;
        align-items: center;
        justify-content: space-between;

        padding: 0 28px;
    }


    /* Entire right side becomes one centered row */

    .header-actions {
        height: 100%;

        display: flex;
        align-items: center;
        justify-content: flex-end;

        gap: 18px;

        margin: 0;
        padding: 0;
    }


    /* Online + stats sit together */

    .header-system {
        min-width: 0;

        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;

        gap: 14px;

        margin: 0;
        padding: 0;
    }


    /* ONLINE */

    .header-system .status {
        min-height: 0;

        display: flex;
        align-items: center;
        justify-content: center;

        gap: 7px;

        margin: 0;
        padding: 0;

        border: 0;

        background: transparent;

        white-space: nowrap;

        font-size: 11px;
        font-weight: 600;
    }

    .header-system .status-dot {
        width: 7px;
        height: 7px;

        margin: 0;

        flex-shrink: 0;
    }


    /* STATS */

    .header-system .stats-toggle {
        width: auto;
        height: 32px;

        display: inline-flex;
        align-items: center;
        justify-content: center;

        gap: 8px;

        margin: 0;
        padding: 0 11px;

        border: 1px solid rgba(255,255,255,0.08);
        border-radius: 16px;

        background: rgba(255,255,255,0.025);

        white-space: nowrap;
    }

    .header-system .stats-toggle:hover {
        background: rgba(255,255,255,0.045);
    }


    /* USER */

    .header-actions .user-menu {
        height: 46px;
        min-width: 130px;

        display: flex;
        align-items: center;

        gap: 11px;

        margin: 0;
        padding: 0 0 0 18px;

        border-left: 1px solid rgba(255,255,255,0.11);

        align-self: center;
    }

    .header-actions .user-avatar {
        width: 36px;
        height: 36px;

        flex: 0 0 36px;

        margin: 0;
    }

    .header-actions .user-details {
        display: flex;
        flex-direction: column;
        justify-content: center;

        gap: 2px;

        margin: 0;
        padding: 0;
    }

    .header-actions .user-name {
        margin: 0;

        font-size: 12px;
        font-weight: 650;

        line-height: 1.15;
    }

    .header-actions .user-role {
        margin: 0;

        font-size: 9px;

        line-height: 1.15;
    }

}


/* =========================================================
   JARVIS CHAT WORKSPACE - POLISH
   ========================================================= */

@media (min-width: 801px) {

    /* MAIN CHAT AREA */

    .chat {
        padding:
            24px
            36px
            150px;

        background:
            radial-gradient(
                circle at 50% 25%,
                rgba(63, 105, 175, 0.035),
                transparent 32%
            ),
            linear-gradient(
                180deg,
                #1c222b 0%,
                #181d24 100%
            );
    }


    /* WELCOME SCREEN */

    .welcome {
        transform: translateY(-12px);
    }

    .welcome-logo {
        width: 112px;
        height: 112px;

        margin-bottom: 18px;
    }

    .welcome h1 {
        font-size: 29px;
        font-weight: 520;

        letter-spacing: -0.3px;
    }

    .welcome p {
        margin-top: 8px;

        font-size: 13px;

        color: #7f8995;
    }


    /* MESSAGE WIDTH */

    .message-inner {
        max-width: 900px;
    }

    .message {
        margin-bottom: 28px;
    }

    .message-text {
        font-size: 15.5px;
        line-height: 1.68;
    }


    /* USER MESSAGE */

    .message.user .message-text {
        max-width: 72%;

        padding: 12px 17px;

        border: 1px solid rgba(255,255,255,0.08);

        border-radius: 18px 18px 5px 18px;

        background:
            linear-gradient(
                145deg,
                #2b323c,
                #252b33
            );

        box-shadow:
            0 3px 10px rgba(0,0,0,0.14);
    }


    /* JARVIS IDENTITY */

    .assistant-identity {
        margin-bottom: 11px;

        gap: 9px;
    }

    .assistant-icon {
        width: 28px;
        height: 28px;
    }

    .assistant-name {
        font-size: 10px;

        letter-spacing: 1.3px;

        color: #9faab6;
    }


    /* COMPOSER AREA */

    .composer-area {
        padding:
            30px
            28px
            14px;

        background:
            linear-gradient(
                transparent,
                rgba(24,29,36,0.96) 36%,
                #181d24 72%
            );
    }

    .composer {
        width: 100%;
        max-width: 900px;

        min-height: 58px;

        margin: 0 auto;

        padding: 8px 10px 8px 19px;

        align-items: center;

        border: 1px solid #3b434e;
        border-radius: 29px;

        background:
            linear-gradient(
                180deg,
                #2b3139,
                #272d35
            );

        box-shadow:
            0 8px 28px rgba(0,0,0,0.24);

        transition:
            border-color 0.16s ease,
            box-shadow 0.16s ease,
            background 0.16s ease;
    }

    .composer:focus-within {
        border-color: rgba(91, 191, 220, 0.55);

        box-shadow:
            0 0 0 1px rgba(91, 191, 220, 0.08),
            0 8px 28px rgba(0,0,0,0.26);
    }


    /* TEXT INPUT */

    .composer textarea {
        min-height: 38px;
        max-height: 160px;

        padding: 8px 0;

        border: 0;
        outline: 0;

        background: transparent;

        color: #e7eaee;

        font-family: inherit;
        font-size: 15px;
        line-height: 1.45;

        resize: none;
    }

    .composer textarea::placeholder {
        color: #7c858f;
    }


    /* MIC BUTTON */

    .mic-button {
        width: 40px;
        height: 40px;
        flex: 0 0 40px;

        border-color: rgba(255,255,255,0.09);

        background: #20262e;
    }

    .mic-button:hover {
        background: #303842;

        border-color: #53606d;
    }


    /* COMPOSER HINT */

    .hint {
        margin-top: 8px;

        font-size: 9px;

        color: #626b75;
    }

}


/* =========================================================
   JARVIS USER / LOGOUT MENU
   ========================================================= */

.user-menu-wrapper {
    position: relative;

    display: flex;
    align-items: center;
}


.header-actions .user-menu {
    appearance: none;

    cursor: pointer;

    font-family: inherit;

    color: inherit;

    background: transparent;

    border-top: 0;
    border-right: 0;
    border-bottom: 0;
}


.header-actions .user-menu:hover {
    background: rgba(255,255,255,0.025);
}


.user-chevron {
    margin-left: auto;

    font-size: 13px;

    color: #69737e;

    transition:
        transform 0.15s ease,
        color 0.15s ease;
}


.user-menu[aria-expanded="true"] .user-chevron {
    transform: rotate(180deg);

    color: #aeb8c3;
}


.user-dropdown {
    position: absolute;

    top: calc(100% + 10px);
    right: 0;

    width: 190px;

    padding: 8px;

    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 10px;

    background:
        linear-gradient(
            180deg,
            #1b2027,
            #161b21
        );

    box-shadow:
        0 14px 35px rgba(0,0,0,0.38);

    z-index: 1000;
}


.user-dropdown[hidden] {
    display: none;
}


.user-dropdown-header {
    display: flex;
    flex-direction: column;

    padding: 9px 10px 10px;
}


.user-dropdown-header strong {
    font-size: 12px;

    color: #e5e9ee;
}


.user-dropdown-header span {
    margin-top: 3px;

    font-size: 9px;
    font-weight: 600;

    letter-spacing: 0.9px;
    text-transform: uppercase;

    color: #68727d;
}


.user-dropdown-divider {
    height: 1px;

    margin: 2px 4px 6px;

    background: rgba(255,255,255,0.08);
}


.user-dropdown form {
    margin: 0;
}


.user-dropdown-item {
    width: 100%;

    padding: 9px 10px;

    text-align: left;

    border: 0;
    border-radius: 7px;

    background: transparent;

    color: #b6bec7;

    font-family: inherit;
    font-size: 11px;
    font-weight: 600;

    cursor: pointer;
}


.user-dropdown-item:hover {
    background: rgba(255,255,255,0.05);

    color: #ffffff;
}


.logout-item:hover {
    background: rgba(190,70,70,0.14);

    color: #efb2b2;
}



/* =========================================================
   JARVIS ADMIN APPLICATION SHELL
   ========================================================= */

.admin-body {
    min-height: 100vh;

    display: flex;
    flex-direction: column;
}


/* SHELL */

.admin-shell {
    flex: 1;

    display: flex;

    min-height: 0;

    background: #171b22;
}


/* SIDEBAR */

.admin-sidebar {
    width: 220px;
    flex: 0 0 220px;

    display: flex;
    flex-direction: column;

    padding: 22px 12px 16px;

    background:
        linear-gradient(
            180deg,
            #11161d,
            #10141a
        );

    border-right: 1px solid rgba(255,255,255,0.075);
}


.admin-nav {
    display: flex;
    flex-direction: column;

    gap: 24px;
}


.admin-nav-group {
    display: flex;
    flex-direction: column;

    gap: 4px;
}


.admin-nav-heading {
    padding: 0 12px 7px;

    font-size: 8px;
    font-weight: 800;

    letter-spacing: 1.5px;

    color: #59636e;
}


.admin-nav-item {
    position: relative;

    min-height: 40px;

    display: flex;
    align-items: center;

    gap: 11px;

    padding: 0 11px;

    border: 1px solid transparent;
    border-radius: 7px;

    color: #929ca7;

    font-size: 12px;
    font-weight: 550;

    text-decoration: none;

    transition:
        background 0.15s ease,
        color 0.15s ease,
        border-color 0.15s ease;
}


a.admin-nav-item:hover {
    background: rgba(255,255,255,0.045);

    color: #e3e7eb;
}


.admin-nav-item.active {
    background:
        linear-gradient(
            90deg,
            rgba(70, 108, 184, 0.20),
            rgba(255,255,255,0.035)
        );

    border-color: rgba(105, 139, 204, 0.22);

    color: #eef1f4;
}


.admin-nav-item.active::before {
    content: "";

    position: absolute;

    left: -1px;

    width: 2px;
    height: 20px;

    border-radius: 2px;

    background: #65cfe8;
}


.admin-nav-icon {
    width: 22px;

    flex: 0 0 22px;

    text-align: center;

    font-size: 10px;
    font-weight: 800;

    color: #717c87;
}


.admin-nav-item.active .admin-nav-icon {
    color: #b8d8e1;
}


.admin-nav-item.disabled {
    color: #58616b;

    cursor: default;
}


.admin-nav-item.disabled .admin-nav-icon {
    color: #49515a;
}


.admin-nav-soon {
    margin-left: auto;

    padding: 2px 5px;

    border: 1px solid rgba(86, 183, 211, 0.18);
    border-radius: 4px;

    font-size: 7px;
    font-weight: 800;

    letter-spacing: 0.7px;

    color: #649bae;
}


/* SIDEBAR USER */

.admin-sidebar-footer {
    margin-top: auto;

    padding: 15px 12px 4px;

    border-top: 1px solid rgba(255,255,255,0.06);
}


.admin-sidebar-user {
    font-size: 11px;
    font-weight: 650;

    color: #aeb6bf;
}


.admin-sidebar-role {
    margin-top: 3px;

    font-size: 8px;
    font-weight: 700;

    letter-spacing: 1px;

    color: #58616b;
}


/* MAIN ADMIN WORKSPACE */

.admin-shell .admin-main {
    flex: 1;

    width: auto;
    max-width: none;

    min-width: 0;

    margin: 0;

    padding-left: 38px;
    padding-right: 38px;
}


/* KEEP CONTENT FROM BECOMING RIDICULOUSLY WIDE */

.admin-shell .admin-main > section {
    width: 100%;
    max-width: 1320px;

    margin-left: auto;
    margin-right: auto;
}


/* RESPONSIVE */

@media (max-width: 850px) {

    .admin-sidebar {
        width: 64px;
        flex-basis: 64px;

        padding-left: 7px;
        padding-right: 7px;
    }

    .admin-nav-heading,
    .admin-nav-item > span:not(.admin-nav-icon),
    .admin-sidebar-footer {
        display: none;
    }

    .admin-nav-item {
        justify-content: center;

        padding: 0;
    }

    .admin-nav-icon {
        width: auto;

        flex-basis: auto;
    }

    .admin-shell .admin-main {
        padding-left: 18px;
        padding-right: 18px;
    }

}


/* =========================================================
   JARVIS KNOWLEDGE PAGE
   ========================================================= */

.knowledge-stats-grid {
    width: 100%;
    max-width: 1320px;

    margin: 0 auto 30px;

    display: grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 12px;
}


.knowledge-stat-card {
    min-height: 104px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 18px;

    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 11px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,0.035),
            rgba(255,255,255,0.015)
        );
}


.knowledge-stat-card span {
    font-size: 8px;
    font-weight: 800;

    letter-spacing: 1.2px;

    color: #697583;
}


.knowledge-stat-card strong {
    margin-top: 8px;

    font-size: 26px;
    font-weight: 650;

    color: #e7ebef;
}


.knowledge-stat-card .knowledge-green {
    font-size: 14px;

    color: #62d692;
}


.knowledge-stat-card .knowledge-red {
    font-size: 14px;

    color: #df7e7e;
}


.knowledge-file-count {
    color: #65717e;

    font-size: 10px;
    font-weight: 600;
}


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

    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 11px;

    background: rgba(255,255,255,0.02);
}


.knowledge-table {
    width: 100%;

    border-collapse: collapse;
}


.knowledge-table th {
    padding: 12px 14px;

    text-align: left;

    border-bottom:
        1px solid rgba(255,255,255,0.08);

    background:
        rgba(255,255,255,0.025);

    font-size: 8px;
    font-weight: 800;

    letter-spacing: 1px;

    color: #65717e;
}


.knowledge-table td {
    padding: 13px 14px;

    border-bottom:
        1px solid rgba(255,255,255,0.055);

    font-size: 11px;

    color: #aeb7c0;
}


.knowledge-table tbody tr:last-child td {
    border-bottom: 0;
}


.knowledge-table tbody tr:hover {
    background:
        rgba(255,255,255,0.025);
}


.knowledge-file-name {
    font-weight: 600;

    color: #d9dfe5 !important;
}


.knowledge-error {
    color: #dd9090 !important;
}


.knowledge-empty {
    padding: 35px !important;

    text-align: center;

    color: #66717c !important;
}


@media (max-width: 1100px) {

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

}


/* =========================================================
   JARVIS USERS & ACCESS
   ========================================================= */

.users-summary-grid {
    width: 100%;
    max-width: 1320px;

    margin: 0 auto 30px;

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 12px;
}


.users-role-label {
    font-size: 15px !important;

    color: #72cde3 !important;
}


.users-coming-next {
    padding: 5px 8px;

    border:
        1px solid rgba(105,139,204,0.18);

    border-radius: 5px;

    font-size: 7px;
    font-weight: 800;

    letter-spacing: 1px;

    color: #6688aa;
}


.users-identity {
    display: flex;
    align-items: center;

    gap: 10px;
}


.users-avatar {
    width: 32px;
    height: 32px;

    flex: 0 0 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid rgba(255,255,255,0.10);

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #29313a,
            #1e242b
        );

    font-size: 11px;
    font-weight: 700;

    color: #dbe2e8;
}


.users-identity strong {
    display: block;

    font-size: 11px;

    color: #d8dee4;
}


.users-identity span {
    display: block;

    margin-top: 2px;

    font-size: 9px;

    color: #697582;
}


.users-role {
    padding: 4px 7px;

    border-radius: 5px;

    font-size: 8px;
    font-weight: 800;

    letter-spacing: 0.8px;
}


.users-role-owner {
    background:
        rgba(79, 151, 196, 0.12);

    color: #76cbe4;
}


.users-role-admin {
    background:
        rgba(116, 102, 194, 0.12);

    color: #a89ae2;
}


.users-role-standard {
    background:
        rgba(102, 146, 112, 0.12);

    color: #93c59e;
}


.users-role-guest {
    background:
        rgba(145, 145, 145, 0.10);

    color: #9ba2a8;
}


.users-status-active {
    font-size: 9px;
    font-weight: 700;

    color: #67d494;
}


.users-status-disabled {
    font-size: 9px;
    font-weight: 700;

    color: #d57474;
}


@media (max-width: 900px) {

    .users-summary-grid {
        grid-template-columns: 1fr;
    }

}


/* =========================================================
   JARVIS USER MANAGEMENT CONTROLS
   ========================================================= */

.users-create-form {
    display: grid;

    grid-template-columns:
        1fr
        1fr
        1fr
        180px
        auto;

    gap: 12px;

    align-items: end;
}


.users-form-field {
    display: flex;
    flex-direction: column;

    gap: 6px;
}


.users-form-field label {
    font-size: 8px;
    font-weight: 800;

    letter-spacing: 1px;

    color: #6d7884;
}


.users-form-field input,
.users-form-field select,
.users-mini-select {
    height: 38px;

    padding: 0 10px;

    border:
        1px solid rgba(255,255,255,0.10);

    border-radius: 7px;

    outline: 0;

    background: #171c22;

    color: #d4dbe1;

    font-family: inherit;
}


.users-form-field input:focus,
.users-form-field select:focus,
.users-mini-select:focus {
    border-color:
        rgba(91,191,220,0.50);
}


.users-create-button {
    height: 38px;
}


.users-inline-form,
.users-actions form {
    margin: 0;
}


.users-mini-select {
    height: 30px;

    min-width: 105px;

    padding: 0 7px;

    font-size: 9px;
}


.users-actions {
    display: flex;
    align-items: center;

    gap: 8px;
}


.users-action-button {
    min-height: 28px;

    padding: 0 8px;

    border:
        1px solid rgba(255,255,255,0.10);

    border-radius: 6px;

    background: rgba(255,255,255,0.025);

    color: #aeb7c0;

    font-family: inherit;
    font-size: 9px;

    cursor: pointer;
}


.users-action-button:hover {
    background:
        rgba(255,255,255,0.06);

    color: #ffffff;
}


.users-reset {
    position: relative;
}


.users-reset summary {
    cursor: pointer;

    font-size: 9px;

    color: #87929e;
}


.users-reset form {
    position: absolute;

    top: 25px;
    right: 0;

    z-index: 20;

    width: 220px;

    display: flex;

    gap: 6px;

    padding: 9px;

    border:
        1px solid rgba(255,255,255,0.10);

    border-radius: 8px;

    background: #171c22;

    box-shadow:
        0 10px 25px rgba(0,0,0,0.35);
}


.users-reset input {
    min-width: 0;

    flex: 1;

    height: 30px;

    padding: 0 7px;

    border:
        1px solid rgba(255,255,255,0.10);

    border-radius: 5px;

    background: #11161c;

    color: #d4dbe1;
}


.users-owner-protected {
    font-size: 8px;
    font-weight: 700;

    letter-spacing: 0.6px;

    color: #68737e;
}


@media (max-width: 1200px) {

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

}


/* =========================================================
   JARVIS PASSWORD RESET MODAL
   ========================================================= */

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


.users-modal {
    position: fixed;

    inset: 0;

    z-index: 5000;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 24px;
}


.users-modal-backdrop {
    position: absolute;

    inset: 0;

    background:
        rgba(7, 10, 14, 0.72);

    backdrop-filter:
        blur(3px);
}


.users-modal-card {
    position: relative;

    width: min(460px, 100%);

    padding: 22px;

    border:
        1px solid rgba(255,255,255,0.10);

    border-radius: 12px;

    background:
        linear-gradient(
            180deg,
            #1c2229,
            #171c22
        );

    box-shadow:
        0 24px 70px rgba(0,0,0,0.50);
}


.users-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 20px;

    margin-bottom: 20px;
}


.users-modal-header h2 {
    margin:
        4px
        0
        0;

    font-size: 22px;
}


.users-modal-header p {
    margin:
        6px
        0
        0;

    font-size: 11px;

    color: #77828d;
}


.users-modal-close {
    width: 32px;
    height: 32px;

    border: 0;
    border-radius: 7px;

    background: transparent;

    color: #7e8994;

    font-size: 22px;

    cursor: pointer;
}


.users-modal-close:hover {
    background:
        rgba(255,255,255,0.05);

    color: #ffffff;
}


.users-modal-field {
    display: flex;
    flex-direction: column;

    gap: 6px;

    margin-bottom: 14px;
}


.users-modal-field label {
    font-size: 8px;
    font-weight: 800;

    letter-spacing: 1px;

    color: #6e7985;
}


.users-modal-field input {
    height: 40px;

    padding: 0 11px;

    border:
        1px solid rgba(255,255,255,0.11);

    border-radius: 7px;

    outline: 0;

    background: #11161c;

    color: #e0e5ea;

    font-family: inherit;
}


.users-modal-field input:focus {
    border-color:
        rgba(91,191,220,0.55);

    box-shadow:
        0 0 0 1px
        rgba(91,191,220,0.08);
}


.users-modal-error {
    margin-top: -4px;
    margin-bottom: 12px;

    padding: 9px 10px;

    border:
        1px solid rgba(207,84,84,0.25);

    border-radius: 7px;

    background:
        rgba(170,48,48,0.10);

    font-size: 10px;

    color: #dc9292;
}


.users-modal-actions {
    display: flex;
    justify-content: flex-end;

    gap: 9px;

    margin-top: 20px;
}


/* =========================================================
   JARVIS ACCESS DENIED / ERROR PAGE
   ========================================================= */

.jarvis-error-body {
    min-height: 100vh;

    margin: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 30px;

    background:
        radial-gradient(
            circle at 50% 30%,
            rgba(55, 104, 170, 0.10),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            #171c23,
            #11161c
        );

    color: #e7ebef;
}


.jarvis-error-card {
    width: min(520px, 100%);

    padding: 42px;

    text-align: center;

    border:
        1px solid rgba(255,255,255,0.09);

    border-radius: 16px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,0.035),
            rgba(255,255,255,0.015)
        );

    box-shadow:
        0 24px 70px rgba(0,0,0,0.38);
}


.jarvis-error-logo {
    width: 78px;
    height: 78px;

    object-fit: contain;

    margin-bottom: 22px;
}


.jarvis-error-eyebrow {
    margin-bottom: 8px;

    font-size: 9px;
    font-weight: 800;

    letter-spacing: 1.8px;

    color: #7fa1d3;
}


.jarvis-error-card h1 {
    margin: 0;

    font-size: 32px;
    font-weight: 650;
}


.jarvis-error-message {
    max-width: 380px;

    margin: 14px auto 0;

    font-size: 14px;
    line-height: 1.6;

    color: #909ba6;
}


.jarvis-error-user {
    margin: 24px auto 0;

    padding: 12px 14px;

    display: inline-flex;
    align-items: center;

    gap: 7px;

    border:
        1px solid rgba(255,255,255,0.07);

    border-radius: 8px;

    background:
        rgba(255,255,255,0.025);

    font-size: 10px;

    color: #74808c;
}


.jarvis-error-user strong {
    color: #dce2e8;
}


.jarvis-error-user span {
    padding-left: 7px;

    border-left:
        1px solid rgba(255,255,255,0.08);

    font-size: 8px;
    font-weight: 800;

    letter-spacing: 0.8px;

    color: #70bdd2;
}


.jarvis-error-actions {
    margin-top: 28px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 10px;
}


.jarvis-error-actions form {
    margin: 0;
}


.jarvis-error-code {
    margin-top: 25px;

    font-size: 7px;
    font-weight: 700;

    letter-spacing: 1.2px;

    color: #4f5964;
}


/* =========================================================
   JARVIS VISUAL SYSTEM - CYAN ACCENT / GLOW
   ========================================================= */

:root {
    --jarvis-cyan: #20c7f4;
    --jarvis-cyan-soft: rgba(32, 199, 244, 0.18);
    --jarvis-cyan-faint: rgba(32, 199, 244, 0.08);

    --jarvis-glow:
        0 0 14px rgba(32, 199, 244, 0.16);

    --jarvis-glow-strong:
        0 0 20px rgba(32, 199, 244, 0.24);
}


/* LOGOS */

.header-logo,
.welcome-logo,
.admin-logo,
.jarvis-error-logo {
    filter:
        drop-shadow(
            0 0 8px
            rgba(32, 199, 244, 0.12)
        );
}


/* ACTIVE NAVIGATION */

.nav-item.active,
.admin-nav-item.active {
    box-shadow:
        inset 0 0 0 1px
        rgba(32, 199, 244, 0.04),
        var(--jarvis-glow);
}

.nav-item.active::before,
.admin-nav-item.active::before {
    box-shadow:
        0 0 8px
        rgba(32, 199, 244, 0.55);
}


/* PRIMARY BUTTONS */

.admin-button {
    transition:
        background 0.16s ease,
        border-color 0.16s ease,
        box-shadow 0.16s ease,
        color 0.16s ease;
}

.admin-button:hover {
    border-color:
        rgba(32, 199, 244, 0.38);

    box-shadow:
        0 0 12px
        rgba(32, 199, 244, 0.10);
}


/* COMPOSER / INPUT FOCUS */

.composer:focus-within {
    border-color:
        rgba(32, 199, 244, 0.48);

    box-shadow:
        0 0 0 1px
        rgba(32, 199, 244, 0.06),
        0 0 18px
        rgba(32, 199, 244, 0.10),
        0 8px 28px
        rgba(0, 0, 0, 0.26);
}

.users-form-field input:focus,
.users-form-field select:focus,
.users-mini-select:focus,
.users-modal-field input:focus {
    border-color:
        rgba(32, 199, 244, 0.48);

    box-shadow:
        0 0 10px
        rgba(32, 199, 244, 0.08);
}


/* STATUS DOTS */

.status-dot {
    box-shadow:
        0 0 8px
        rgba(84, 216, 144, 0.42);
}

.status-dot.web {
    box-shadow:
        0 0 8px
        rgba(32, 199, 244, 0.42);
}


/* CLICKABLE ADMIN CARDS */

.admin-feature-link:hover,
.model-status-card:hover,
.knowledge-stat-card:hover {
    border-color:
        rgba(32, 199, 244, 0.16);

    box-shadow:
        0 0 14px
        rgba(32, 199, 244, 0.055);
}


/* TABLE LINKS */

.knowledge-file-link:hover {
    color: var(--jarvis-cyan);

    text-shadow:
        0 0 8px
        rgba(32, 199, 244, 0.18);
}


/* ROLE / ACTIVE ACCENTS */

.users-role-owner,
.knowledge-green {
    text-shadow:
        0 0 8px
        rgba(32, 199, 244, 0.12);
}


/* ACCESS DENIED ACCENTS */

.jarvis-error-eyebrow {
    text-shadow:
        0 0 10px
        rgba(32, 199, 244, 0.16);
}

.jarvis-error-code::before,
.jarvis-error-code::after {
    content: "";

    display: inline-block;

    width: 42px;
    height: 1px;

    margin: 0 10px 2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(32, 199, 244, 0.30)
        );
}

.jarvis-error-code::after {
    background:
        linear-gradient(
            90deg,
            rgba(32, 199, 244, 0.30),
            transparent
        );
}



/* =========================================================
   ROLE-AWARE NAVIGATION
   ========================================================= */

.nav-soon {
    margin-left: auto;

    padding: 2px 5px;

    border:
        1px solid rgba(32, 199, 244, 0.12);

    border-radius: 4px;

    font-size: 6px;
    font-weight: 800;

    letter-spacing: 0.7px;

    color: #536b73;
}


.nav-placeholder {
    opacity: 0.62;

    cursor: default;
}


.nav-placeholder:hover {
    background: transparent;

    color: #929aa4;
}



/* =========================================================
   USER-FACING KNOWLEDGE
   ========================================================= */

.user-knowledge-main {
    width: 100%;
    max-width: 1400px;

    margin: 0 auto;

    padding: 120px 36px 60px;
}


.user-knowledge-section {
    max-width: 1320px;

    margin-left: auto;
    margin-right: auto;
}


.user-knowledge-identity {
    display: flex;
    align-items: center;

    gap: 8px;

    font-size: 10px;

    color: #89949f;
}


.user-knowledge-identity strong {
    color: #dbe1e6;
}


.user-knowledge-identity span {
    padding-left: 8px;

    border-left:
        1px solid rgba(255,255,255,0.08);

    font-size: 8px;
    font-weight: 800;

    letter-spacing: 0.8px;

    color: var(--jarvis-cyan);
}


.user-knowledge-empty {
    padding: 55px 30px;

    text-align: center;

    border:
        1px solid rgba(255,255,255,0.07);

    border-radius: 10px;

    background:
        rgba(255,255,255,0.015);
}


.user-knowledge-empty h3 {
    margin: 8px 0;

    font-size: 17px;

    color: #cdd4da;
}


.user-knowledge-empty p {
    margin: 0;

    font-size: 11px;

    color: #68747f;
}


/* =========================================================
   USER KNOWLEDGE HEADER CLEANUP
   ========================================================= */

.user-knowledge-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;

    gap: 7px;
}


.user-knowledge-identity {
    display: flex;
    flex-direction: column;
    align-items: flex-end;

    gap: 2px;

    line-height: 1.15;
}


.user-knowledge-identity strong {
    font-size: 11px;
    font-weight: 700;

    color: #dbe1e6;
}


.user-knowledge-identity span {
    padding: 0;

    border: 0;

    font-size: 7px;
    font-weight: 800;

    letter-spacing: 1.1px;

    color: var(--jarvis-cyan);
}



/* =========================================================
   MAIN HEADER - FINAL RIGHT-SIDE ALIGNMENT
   ========================================================= */

@media (min-width: 801px) {

    .header-actions {
        height: 100%;

        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;

        gap: 20px;

        margin-left: auto;
    }


    .header-system {
        display: flex;
        flex-direction: row;
        align-items: center;

        gap: 14px;

        margin: 0;
    }


    .user-menu-wrapper {
        position: relative;

        display: flex;
        align-items: center;

        margin-left: 4px;
    }


    .header-actions .user-menu {
        min-width: 158px;
        height: 48px;

        display: flex;
        flex-direction: row;
        align-items: center;

        gap: 11px;

        padding: 0 4px 0 18px;

        border-left:
            1px solid rgba(255,255,255,0.11);

        background: transparent;
    }


    .header-actions .user-avatar {
        width: 36px;
        height: 36px;

        flex: 0 0 36px;
    }


    .header-actions .user-details {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;

        gap: 2px;

        min-width: 70px;
    }


    .header-actions .user-name {
        font-size: 12px;
        font-weight: 700;

        line-height: 1.1;

        color: #e1e6eb;
    }


    .header-actions .user-role {
        margin: 0;

        font-size: 8px;
        font-weight: 800;

        letter-spacing: 1px;

        line-height: 1.1;

        color: #68737e;
    }


    .header-actions .user-chevron {
        margin-left: auto;
        margin-right: 3px;

        font-size: 11px;

        color: #66717c;
    }

}


/* =========================================================
   JARVIS UNIFIED APPLICATION SHELL
   ========================================================= */

.jarvis-shell-sidebar {
    position: fixed;

    top: 82px;
    bottom: 0;
    left: 0;

    width: 215px;

    display: flex;
    flex-direction: column;

    padding: 22px 14px 16px;

    border-right:
        1px solid rgba(255,255,255,0.065);

    background:
        linear-gradient(
            180deg,
            rgba(18,23,29,0.98),
            rgba(14,18,23,0.99)
        );

    z-index: 90;
}


.jarvis-shell-nav {
    display: flex;
    flex-direction: column;

    gap: 5px;
}


.jarvis-shell-sidebar .nav-item {
    min-height: 42px;

    display: flex;
    align-items: center;

    gap: 12px;

    padding: 0 13px;

    border-radius: 7px;

    text-decoration: none;
}


.jarvis-shell-sidebar .nav-icon {
    width: 20px;

    display: flex;
    justify-content: center;

    font-size: 14px;
}


.jarvis-shell-account {
    margin-top: auto;

    padding-top: 15px;

    border-top:
        1px solid rgba(255,255,255,0.065);
}


.jarvis-shell-user {
    display: flex;
    align-items: center;

    gap: 11px;

    padding: 8px 8px 13px;
}


.jarvis-shell-avatar {
    width: 34px;
    height: 34px;

    flex: 0 0 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid rgba(32,199,244,0.20);

    border-radius: 50%;

    background:
        rgba(32,199,244,0.055);

    box-shadow:
        0 0 12px
        rgba(32,199,244,0.055);

    font-size: 12px;
    font-weight: 800;

    color: #cddce2;
}


.jarvis-shell-user-details {
    min-width: 0;

    display: flex;
    flex-direction: column;

    gap: 3px;
}


.jarvis-shell-user-details strong {
    overflow: hidden;

    font-size: 11px;
    font-weight: 700;

    text-overflow: ellipsis;
    white-space: nowrap;

    color: #dce2e7;
}


.jarvis-shell-user-details span {
    font-size: 7px;
    font-weight: 800;

    letter-spacing: 1.1px;

    color: var(--jarvis-cyan);
}


.jarvis-shell-logout-form {
    margin: 0;
}


.jarvis-shell-logout {
    width: 100%;
    height: 37px;

    display: flex;
    align-items: center;

    gap: 10px;

    padding: 0 12px;

    border:
        1px solid transparent;

    border-radius: 7px;

    background: transparent;

    font-family: inherit;
    font-size: 10px;

    color: #77838e;

    cursor: pointer;

    transition:
        color 0.16s ease,
        background 0.16s ease,
        border-color 0.16s ease;
}


.jarvis-shell-logout:hover {
    border-color:
        rgba(255,255,255,0.06);

    background:
        rgba(255,255,255,0.025);

    color: #d4dbe0;
}


/*
   Main content areas used with the persistent sidebar.
*/

.jarvis-shell-content {
    margin-left: 215px;
}


/*
   Desktop header now starts after the sidebar.
*/

@media (min-width: 801px) {

    body:has(.jarvis-shell-sidebar) .topbar,
    body:has(.jarvis-shell-sidebar) .admin-topbar {
        left: 215px;
        width: calc(100% - 215px);
    }

}


/*
   Mobile keeps the existing behavior for now.
   We'll design a collapsible sidebar later.
*/




/* =========================================================
   JARVIS HEADER SYSTEM STATUS - VERTICAL
   ========================================================= */

@media (min-width: 801px) {

    body:has(.jarvis-shell-sidebar) .header-system {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        justify-content: center;

        gap: 5px;

        margin: 0;
    }

    body:has(.jarvis-shell-sidebar) .status {
        order: 1;
    }

    body:has(.jarvis-shell-sidebar) .stats-toggle {
        order: 2;
    }

}


/* =========================================================
   UNIFIED SHELL - FULL WIDTH TOP BAR FIX
   ========================================================= */

@media (min-width: 801px) {

    body:has(.jarvis-shell-sidebar) .topbar,
    body:has(.jarvis-shell-sidebar) .admin-topbar {
        left: 0;
        right: 0;

        width: 100%;

        margin-left: 0;

        box-sizing: border-box;
    }

}


/* =========================================================
   UNIFIED SHELL - ADMIN OVERVIEW
   ========================================================= */

body:has(.jarvis-shell-sidebar) .admin-shell {
    display: block;

    width: 100%;

    min-height: calc(100vh - 82px);
}


body:has(.jarvis-shell-sidebar)
.admin-shell
.admin-main.jarvis-shell-content {

    width: auto;
    max-width: none;

    margin-left: 215px;

    padding-left: 38px;
    padding-right: 38px;
}





/* =========================================================
   UNIFIED SHELL - HEADER / SIDEBAR ALIGNMENT + CONTENT GUTTER
   ========================================================= */

:root {
    --jarvis-shell-sidebar-width: 215px;
    --jarvis-shell-header-height: 102px;
    --jarvis-shell-content-gutter: 34px;
}


/*
   Give all unified-shell pages the same header height.
   This prevents the sidebar divider from bleeding upward
   into the branding area.
*/

@media (min-width: 801px) {

    body:has(.jarvis-shell-sidebar) .topbar,
    body:has(.jarvis-shell-sidebar) .admin-topbar {
        position: relative;

        width: 100%;
        height: var(--jarvis-shell-header-height);
        min-height: var(--jarvis-shell-header-height);

        box-sizing: border-box;
    }


    /*
       Sidebar starts exactly below the header.
    */

    body:has(.jarvis-shell-sidebar)
    .jarvis-shell-sidebar {

        top: var(--jarvis-shell-header-height);

        width: var(--jarvis-shell-sidebar-width);

        box-sizing: border-box;
    }


    /*
       Generic unified-shell content begins after sidebar.
    */

    body:has(.jarvis-shell-sidebar)
    .jarvis-shell-content {

        margin-left:
            var(--jarvis-shell-sidebar-width);

        box-sizing: border-box;
    }


    /*
       Content-heavy pages need breathing room
       between the sidebar and page content.
    */

    body:has(.jarvis-shell-sidebar)
    .user-knowledge-main.jarvis-shell-content,

    body:has(.jarvis-shell-sidebar)
    .admin-main.jarvis-shell-content {

        padding-left:
            var(--jarvis-shell-content-gutter);

        padding-right:
            var(--jarvis-shell-content-gutter);
    }


    /*
       Override the older Admin compatibility rule
       that hard-coded 215px + separate padding.
    */

    body:has(.jarvis-shell-sidebar)
    .admin-shell
    .admin-main.jarvis-shell-content {

        margin-left:
            var(--jarvis-shell-sidebar-width);

        padding-left:
            var(--jarvis-shell-content-gutter);

        padding-right:
            var(--jarvis-shell-content-gutter);
    }

}


/* =========================================================
   FINAL SHELL CLEANUP
   ========================================================= */

@media (min-width: 801px) {

    body:has(.jarvis-shell-sidebar) .header-actions {
        display: flex;
        justify-content: flex-end;
        align-items: center;

        margin-left: auto;
    }


    body:has(.jarvis-shell-sidebar) .header-system {
        display: flex;
        flex-direction: column;
        align-items: flex-end;

        gap: 5px;
    }


    body:has(.jarvis-shell-sidebar) .status {
        order: 1;
    }


    body:has(.jarvis-shell-sidebar) .stats-toggle {
        order: 2;
    }


    /*
       Unified pages no longer need miscellaneous
       top-right navigation buttons.
    */

    body:has(.jarvis-shell-sidebar)
    .admin-header-actions {

        display: none;
    }

}


/* =========================================================
   JARVIS SHARED HEADER
   ========================================================= */

.jarvis-shell-header {
    position: relative;

    width: 100%;
    height: var(--jarvis-shell-header-height);
    min-height: var(--jarvis-shell-header-height);

    box-sizing: border-box;

    flex: 0 0 var(--jarvis-shell-header-height);
}


/*
   Every page now uses the exact Chat branding.
*/

.jarvis-shell-header .header-logo {
    width: 58px;
    height: 58px;

    object-fit: contain;
}


.jarvis-shell-header .brand {
    font-size: 20px;
    font-weight: 650;

    letter-spacing: 1.2px;
}


.jarvis-shell-header .tagline-primary {
    margin-top: 4px;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 1.1px;
}


.jarvis-shell-header .tagline-secondary {
    margin-top: 2px;

    font-size: 10px;
    font-weight: 500;

    letter-spacing: 1.2px;
}


/*
   Sidebar divider begins precisely beneath
   the shared header.
*/

@media (min-width: 801px) {

    body:has(.jarvis-shell-sidebar)
    .jarvis-shell-sidebar {

        top:
            var(--jarvis-shell-header-height);
    }

}


/* =========================================================
   USER KNOWLEDGE - TOP SPACING FIX
   ========================================================= */

body:has(.jarvis-shell-sidebar)
.user-knowledge-main.jarvis-shell-content {

    padding-top: 42px;
}



/* =========================================================
   UNIFIED SHELL - CONSISTENT CONTENT ALIGNMENT
   ========================================================= */

:root {
    --jarvis-shell-content-gutter: 34px;
}


/*
   All unified pages align to the same left edge
   beside the persistent sidebar.
*/

@media (min-width: 801px) {

    body:has(.jarvis-shell-sidebar)
    .jarvis-shell-content {

        margin-left:
            var(--jarvis-shell-sidebar-width);

        padding-left:
            var(--jarvis-shell-content-gutter);

        padding-right:
            var(--jarvis-shell-content-gutter);

        box-sizing: border-box;
    }


    /*
       Remove older Admin-specific spacing differences.
    */

    body:has(.jarvis-shell-sidebar)
    .admin-shell
    .admin-main.jarvis-shell-content {

        margin-left:
            var(--jarvis-shell-sidebar-width);

        padding-left:
            var(--jarvis-shell-content-gutter);

        padding-right:
            var(--jarvis-shell-content-gutter);
    }


    body:has(.jarvis-shell-sidebar)
    .admin-main.jarvis-shell-content {

        margin-left:
            var(--jarvis-shell-sidebar-width);

        padding-left:
            var(--jarvis-shell-content-gutter);

        padding-right:
            var(--jarvis-shell-content-gutter);
    }

}


/* =========================================================
   ADMIN CONTENT - ALIGN WITH SHARED SHELL
   ========================================================= */

@media (min-width: 801px) {

    body:has(.jarvis-shell-sidebar)
    .admin-shell
    .admin-main.jarvis-shell-content > section {

        width: 100%;
        max-width: none;

        margin-left: 0;
        margin-right: 0;
    }

}


/* =========================================================
   JARVIS HEADER HOME LINK
   ========================================================= */

.jarvis-home-link {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.jarvis-home-link:hover .brand {
    opacity: 0.9;
}

.jarvis-home-link:focus-visible {
    outline: 1px solid rgba(32, 199, 244, 0.45);
    outline-offset: 6px;
    border-radius: 6px;
}



/* =========================================================
   ADMIN SUBNAV
   ========================================================= */

.admin-subnav {
    display: flex;
    align-items: center;
    gap: 6px;

    margin-bottom: 30px;

    padding-bottom: 12px;

    border-bottom: 1px solid rgba(255,255,255,0.07);
}


.admin-subnav-item {
    display: inline-flex;
    align-items: center;

    min-height: 34px;

    padding: 0 12px;

    border-radius: 7px;

    color: rgba(255,255,255,0.58);

    text-decoration: none;

    font-size: 12px;
    font-weight: 650;

    transition:
        color 0.16s ease,
        background 0.16s ease,
        box-shadow 0.16s ease;
}


.admin-subnav-item:hover {
    color: rgba(255,255,255,0.90);

    background: rgba(255,255,255,0.035);
}


.admin-subnav-item.active {
    color: #ffffff;

    background: rgba(32,199,244,0.08);

    box-shadow:
        inset 0 0 0 1px rgba(32,199,244,0.16),
        0 0 12px rgba(32,199,244,0.07);
}





/* =========================================================
   ADMIN PAGES - RESTORE NORMAL PAGE SCROLLING
   ========================================================= */

html:has(body.admin-body) {
    height: auto;
    min-height: 100%;
    overflow-y: auto;
}


body.admin-body {
    height: auto;
    min-height: 100vh;

    overflow-x: hidden;
    overflow-y: auto;
}


body.admin-body .admin-shell {
    height: auto;
    min-height: calc(
        100vh - var(--jarvis-shell-header-height)
    );

    overflow: visible;
}


body.admin-body .admin-main {
    height: auto;
    overflow: visible;
}



/* =========================================================
   JARVIS SHELL - FIXED SIDEBAR DURING PAGE SCROLL
   ========================================================= */

@media (min-width: 801px) {

    body:has(.jarvis-shell-sidebar)
    .jarvis-shell-sidebar {

        position: fixed;

        left: 0;
        top: var(--jarvis-shell-header-height);
        bottom: 0;

        width: var(--jarvis-shell-sidebar-width);
        height: auto;

        overflow-y: auto;
        overflow-x: hidden;

        z-index: 90;
    }

}


/* =========================================================
   JARVIS SHELL - STICKY GLOBAL HEADER
   ========================================================= */

@media (min-width: 801px) {

    body:has(.jarvis-shell-sidebar)
    .jarvis-shell-header {

        position: sticky;

        top: 0;
        left: 0;
        right: 0;

        width: 100%;

        z-index: 100;
    }


    body:has(.jarvis-shell-sidebar)
    .jarvis-shell-sidebar {

        top: var(--jarvis-shell-header-height);

        z-index: 90;
    }

}


/* =========================================================
   ADMIN SHELL - FIXED HEADER + FIXED SIDEBAR
   ========================================================= */

@media (min-width: 801px) {

    /*
       Fixed positioning removes the header from normal flow,
       so reserve exactly one header-height at the top.
    */

    body.admin-body {
        padding-top: var(--jarvis-shell-header-height);
        box-sizing: border-box;
    }


    /*
       Global JARVIS header never scrolls away.
    */

    body.admin-body
    .jarvis-shell-header {

        position: fixed;

        top: 0;
        left: 0;
        right: 0;

        width: 100%;
        height: var(--jarvis-shell-header-height);

        z-index: 100;
    }


    /*
       Sidebar is permanently attached directly beneath
       the fixed header.
    */

    body.admin-body
    .jarvis-shell-sidebar {

        position: fixed;

        left: 0;
        top: var(--jarvis-shell-header-height);
        bottom: 0;

        width: var(--jarvis-shell-sidebar-width);

        z-index: 90;
    }

}


/* =========================================================
   JARVIS BASE APPLICATION LAYOUT
   ========================================================= */

:root {
    --jarvis-shell-sidebar-width: 215px;
    --jarvis-shell-header-height: 102px;
    --jarvis-shell-content-gutter: 34px;
    --jarvis-page-background: #171b22;
}


body.admin-body {
    margin: 0;
    min-height: 100vh;

    background: var(--jarvis-page-background);

    overflow-x: hidden;
}


.jarvis-page-shell {
    min-height:
        calc(
            100vh
            - var(--jarvis-shell-header-height)
        );

    background: var(--jarvis-page-background);
}


.jarvis-page-workspace {
    margin-left:
        var(--jarvis-shell-sidebar-width);

    min-height:
        calc(
            100vh
            - var(--jarvis-shell-header-height)
        );

    padding:
        30px
        var(--jarvis-shell-content-gutter)
        70px;

    box-sizing: border-box;

    background: var(--jarvis-page-background);
}


.jarvis-page-main {
    width: 100%;
    max-width: none;

    margin: 0;
    padding: 0;
}


@media (min-width: 801px) {

    body.admin-body {
        padding-top:
            var(--jarvis-shell-header-height);
    }


    body.admin-body
    .jarvis-shell-header {

        position: fixed;

        top: 0;
        left: 0;
        right: 0;

        width: 100%;
        height:
            var(--jarvis-shell-header-height);

        z-index: 100;
    }


    body.admin-body
    .jarvis-shell-sidebar {

        position: fixed;

        top:
            var(--jarvis-shell-header-height);

        left: 0;
        bottom: 0;

        width:
            var(--jarvis-shell-sidebar-width);

        z-index: 90;
    }

}





/* =========================================================
   CHAT PAGE - MATCH APPLICATION BACKGROUND
   ========================================================= */

.app {
    background: #171b22;
}

.chat {
    background: #171b22;
}

.composer-area {
    background:
        linear-gradient(
            transparent,
            #171b22 35%
        );
}



/* =========================================================
   JARVIS GLOBAL THEME
   One value controls the application background everywhere.
   ========================================================= */

:root {
    --jarvis-page-background: #171b22;
}


/* GLOBAL PAGE BACKGROUND */

html,
body,
body.admin-body,
.app,
.chat,
.admin-shell,
.jarvis-page-shell,
.jarvis-page-workspace {
    background: var(--jarvis-page-background);
}


/* CHAT COMPOSER FADE */

.composer-area {
    background:
        linear-gradient(
            transparent,
            var(--jarvis-page-background) 35%
        );
}


/* SCROLLBAR TRACK */

::-webkit-scrollbar-track {
    background: var(--jarvis-page-background);
}



/* =========================================================
   SIDEBAR ACCOUNT AREA - READABILITY POLISH
   ========================================================= */

.jarvis-shell-account {
    padding-top: 16px;
}


.jarvis-shell-account .jarvis-shell-user-name,
.jarvis-shell-account .jarvis-shell-user {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
}


.jarvis-shell-account .jarvis-shell-user-role,
.jarvis-shell-account .jarvis-shell-role {
    margin-top: 3px;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 0.08em;
}


.jarvis-shell-account button,
.jarvis-shell-account .jarvis-shell-logout {
    min-height: 36px;

    font-size: 12px;
    font-weight: 700;
}



/* =========================================================
   SIDEBAR ACCOUNT AREA - SLIGHTLY LARGER
   ========================================================= */

.jarvis-shell-account .jarvis-shell-user-name,
.jarvis-shell-account .jarvis-shell-user {
    font-size: 16px;
}


.jarvis-shell-account .jarvis-shell-user-role,
.jarvis-shell-account .jarvis-shell-role {
    font-size: 12px;
}


.jarvis-shell-account button,
.jarvis-shell-account .jarvis-shell-logout {
    min-height: 40px;

    font-size: 13px;
}



/* =========================================================
   SIDEBAR ACCOUNT AREA - LARGE READABILITY
   ========================================================= */

.jarvis-shell-account .jarvis-shell-user-name,
.jarvis-shell-account .jarvis-shell-user {
    font-size: 18px;
    font-weight: 750;
}


.jarvis-shell-account .jarvis-shell-user-role,
.jarvis-shell-account .jarvis-shell-role {
    margin-top: 4px;

    font-size: 13px;
    font-weight: 750;

    letter-spacing: 0.09em;
}


.jarvis-shell-account button,
.jarvis-shell-account .jarvis-shell-logout {
    min-height: 44px;

    font-size: 14px;
    font-weight: 750;
}



/* =========================================================
   SIDEBAR ACCOUNT AREA - LARGE READABILITY
   ========================================================= */

.jarvis-shell-account .jarvis-shell-user-name,
.jarvis-shell-account .jarvis-shell-user {
    font-size: 18px;
    font-weight: 750;
}


.jarvis-shell-account .jarvis-shell-user-role,
.jarvis-shell-account .jarvis-shell-role {
    margin-top: 4px;

    font-size: 13px;
    font-weight: 750;

    letter-spacing: 0.09em;
}


.jarvis-shell-account button,
.jarvis-shell-account .jarvis-shell-logout {
    min-height: 44px;

    font-size: 14px;
    font-weight: 750;
}



/* =========================================================
   ACCOUNT MANAGEMENT
   ========================================================= */

.users-password-help {
    display: block;

    margin-top: 6px;

    color: rgba(255,255,255,0.42);

    font-size: 10px;
    line-height: 1.4;
}


.users-password-change-option {
    display: flex;
    align-items: center;

    gap: 9px;

    margin-top: 18px;

    color: rgba(255,255,255,0.72);

    font-size: 12px;
}


.users-password-change-option input {
    width: auto;
    margin: 0;

    accent-color: var(--jarvis-cyan);
}


.users-form-error {
    margin-bottom: 18px;
    padding: 11px 13px;

    border:
        1px solid rgba(220,90,90,0.30);

    border-radius: 8px;

    background:
        rgba(180,50,50,0.10);

    color: #e6a1a1;

    font-size: 12px;
}


.users-delete-button {
    border-color:
        rgba(220,80,80,0.28);

    color: #dda0a0;
}


.users-delete-button:hover {
    background:
        rgba(200,60,60,0.10);

    border-color:
        rgba(220,80,80,0.48);
}


/* =========================================================
   FORCED PASSWORD CHANGE
   ========================================================= */

.jarvis-auth-body {
    margin: 0;

    min-height: 100vh;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #0d1014;

    color: #e5e7eb;
}


.jarvis-auth-card {
    width: min(400px, calc(100% - 40px));

    padding: 34px;

    background: #15191f;

    border: 1px solid #2b3038;
    border-radius: 18px;

    box-sizing: border-box;
}


.jarvis-auth-logo {
    display: block;

    width: 90px;
    height: 90px;

    margin: 0 auto 18px;

    object-fit: contain;
}


.jarvis-auth-card h1 {
    margin: 0;

    text-align: center;

    font-size: 24px;
}


.jarvis-auth-subtitle {
    margin: 8px 0 20px;

    text-align: center;

    color: #8e959f;

    font-size: 13px;
    line-height: 1.5;
}


.jarvis-password-requirements {
    padding: 11px 13px;

    border:
        1px solid rgba(32,199,244,0.14);

    border-radius: 8px;

    background:
        rgba(32,199,244,0.04);

    color: #9ca7b1;

    font-size: 11px;
    line-height: 1.6;
}


.jarvis-auth-card label {
    display: block;

    margin: 15px 0 6px;

    color: #b9c0c9;

    font-size: 12px;
}


.jarvis-auth-card input {
    width: 100%;

    padding: 12px 13px;

    box-sizing: border-box;

    border: 1px solid #343b45;
    border-radius: 9px;

    outline: none;

    color: #f1f3f5;
    background: #0f1318;
}


.jarvis-auth-card input:focus {
    border-color:
        rgba(32,199,244,0.55);
}


.jarvis-auth-card button {
    width: 100%;

    margin-top: 22px;
    padding: 12px;

    border:
        1px solid rgba(32,199,244,0.30);

    border-radius: 9px;

    background:
        rgba(32,199,244,0.10);

    color: #e9f3f7;

    font-weight: 650;
    cursor: pointer;
}


.jarvis-auth-error {
    margin-top: 16px;
    padding: 10px;

    border-radius: 8px;

    background: #321d20;
    color: #ef9ca5;

    font-size: 12px;
    text-align: center;
}



/* =========================================================
   USERS & ACCESS - ROLE LABEL READABILITY
   ========================================================= */

.users-role,
.users-role-owner {
    font-size: 13px;
    font-weight: 750;

    letter-spacing: 0.08em;
}


.users-role-owner {
    font-size: 14px;
}


.users-mini-select {
    font-size: 13px;
    font-weight: 650;
}


/* USERS & ACCESS - ROLE LABEL SIZE TWEAK */

.users-role,
.users-role-owner {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.07em;
}

.users-role-owner {
    font-size: 12.5px;
}

.users-mini-select {
    font-size: 12px;
    font-weight: 650;
}


/* USERS & ACCESS - ROLE LABEL SIZE TWEAK */

.users-role,
.users-role-owner {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.07em;
}

.users-role-owner {
    font-size: 12.5px;
}

.users-mini-select {
    font-size: 12px;
    font-weight: 650;
}



/* =========================================================
   USERS & ACCESS - ROLE LABEL CONSISTENCY
   ========================================================= */

.users-role,
.users-role-owner {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
}


/*
   Keep OWNER visually distinct with the cyan background,
   but remove the heavier/bolder treatment.
*/

.users-role-owner {
    font-weight: 600;
}


/* =========================================================
   CREATE USER - CLEAN TWO-ROW LAYOUT
   ========================================================= */

.users-create-form {
    display: grid;

    grid-template-columns:
        minmax(180px, 1fr)
        minmax(180px, 1fr)
        minmax(220px, 1.15fr);

    gap: 18px 20px;

    align-items: end;
}


/*
   First row:
   Username | Display Name | Initial Password
*/

.users-create-form
.users-form-field:nth-of-type(1) {
    grid-column: 1;
}

.users-create-form
.users-form-field:nth-of-type(2) {
    grid-column: 2;
}

.users-create-form
.users-form-field:nth-of-type(3) {
    grid-column: 3;
}


/*
   Second row:
   Role | Force Password Change | Create User
*/

.users-create-form
.users-form-field:nth-of-type(4) {
    grid-column: 1;
}


.users-password-change-option {
    grid-column: 2;

    display: flex;
    align-items: center;

    min-height: 42px;

    margin: 0;
}


.users-create-button {
    grid-column: 3;

    width: 100%;

    min-height: 42px;

    margin: 0;
}


/*
   Keep all form controls aligned.
*/

.users-create-form
.users-form-field {
    margin: 0;
}


.users-create-form
.users-form-field input,
.users-create-form
.users-form-field select {

    width: 100%;
    min-height: 42px;

    box-sizing: border-box;
}


/*
   Password help stays directly beneath its field.
*/

.users-password-help {
    margin-top: 6px;
}


/* RESPONSIVE */

@media (max-width: 1100px) {

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

    .users-create-form
    .users-form-field:nth-of-type(1),
    .users-create-form
    .users-form-field:nth-of-type(2),
    .users-create-form
    .users-form-field:nth-of-type(3),
    .users-create-form
    .users-form-field:nth-of-type(4),
    .users-password-change-option,
    .users-create-button {

        grid-column: auto;
    }

}



/* =========================================================
   USERS & ACCESS - ROLE LABEL CONSISTENCY
   ========================================================= */

.users-role,
.users-role-owner {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
}


/*
   Keep OWNER visually distinct with the cyan background,
   but remove the heavier/bolder treatment.
*/

.users-role-owner {
    font-weight: 600;
}


/* =========================================================
   CREATE USER - CLEAN TWO-ROW LAYOUT
   ========================================================= */

.users-create-form {
    display: grid;

    grid-template-columns:
        minmax(180px, 1fr)
        minmax(180px, 1fr)
        minmax(220px, 1.15fr);

    gap: 18px 20px;

    align-items: end;
}


/*
   First row:
   Username | Display Name | Initial Password
*/

.users-create-form
.users-form-field:nth-of-type(1) {
    grid-column: 1;
}

.users-create-form
.users-form-field:nth-of-type(2) {
    grid-column: 2;
}

.users-create-form
.users-form-field:nth-of-type(3) {
    grid-column: 3;
}


/*
   Second row:
   Role | Force Password Change | Create User
*/

.users-create-form
.users-form-field:nth-of-type(4) {
    grid-column: 1;
}


.users-password-change-option {
    grid-column: 2;

    display: flex;
    align-items: center;

    min-height: 42px;

    margin: 0;
}


.users-create-button {
    grid-column: 3;

    width: 100%;

    min-height: 42px;

    margin: 0;
}


/*
   Keep all form controls aligned.
*/

.users-create-form
.users-form-field {
    margin: 0;
}


.users-create-form
.users-form-field input,
.users-create-form
.users-form-field select {

    width: 100%;
    min-height: 42px;

    box-sizing: border-box;
}


/*
   Password help stays directly beneath its field.
*/

.users-password-help {
    margin-top: 6px;
}


/* RESPONSIVE */

@media (max-width: 1100px) {

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

    .users-create-form
    .users-form-field:nth-of-type(1),
    .users-create-form
    .users-form-field:nth-of-type(2),
    .users-create-form
    .users-form-field:nth-of-type(3),
    .users-create-form
    .users-form-field:nth-of-type(4),
    .users-password-change-option,
    .users-create-button {

        grid-column: auto;
    }

}



/* =========================================================
   CREATE USER - FIELD ALIGNMENT FIX
   ========================================================= */

.users-create-form {
    align-items: start;
}


/*
   Keep labels identical height so all three
   first-row inputs begin on the same line.
*/

.users-create-form
.users-form-field > label {

    display: block;
    min-height: 16px;

    margin-bottom: 7px;
}


/*
   Second row controls align cleanly with each other.
*/

.users-create-form
.users-form-field:nth-of-type(4),
.users-password-change-option,
.users-create-button {

    align-self: start;
}



/* =========================================================
   CREATE USER - COMPACT SECOND ROW
   ========================================================= */

.users-create-form {
    grid-template-columns:
        minmax(180px, 1fr)
        auto
        auto;

    column-gap: 18px;
}


.users-password-change-option {
    justify-self: start;
    white-space: nowrap;
}


.users-create-button {
    width: auto;
    min-width: 130px;

    padding-left: 20px;
    padding-right: 20px;

    justify-self: start;
}



/* =========================================================
   CREATE USER - BALANCED FIELD WIDTHS
   ========================================================= */

.users-create-form {
    grid-template-columns:
        minmax(240px, 1.15fr)
        minmax(220px, 1fr)
        minmax(260px, 1fr);

    column-gap: 20px;
    row-gap: 18px;
}


/* ROW 1 */

.users-create-form
.users-form-field:nth-of-type(1) {
    grid-column: 1;
}

.users-create-form
.users-form-field:nth-of-type(2) {
    grid-column: 2;
}

.users-create-form
.users-form-field:nth-of-type(3) {
    grid-column: 3;
}


/* ROW 2 */

.users-create-form
.users-form-field:nth-of-type(4) {
    grid-column: 1;

    max-width: 320px;
}


.users-password-change-option {
    grid-column: 2;

    justify-self: start;

    white-space: nowrap;
}


.users-create-button {
    grid-column: 3;

    justify-self: start;

    width: auto;
    min-width: 130px;
}



/* =========================================================
   CREATE USER - BALANCED FIELD WIDTHS
   ========================================================= */

.users-create-form {
    grid-template-columns:
        minmax(240px, 1.15fr)
        minmax(220px, 1fr)
        minmax(260px, 1fr);

    column-gap: 20px;
    row-gap: 18px;
}


/* ROW 1 */

.users-create-form
.users-form-field:nth-of-type(1) {
    grid-column: 1;
}

.users-create-form
.users-form-field:nth-of-type(2) {
    grid-column: 2;
}

.users-create-form
.users-form-field:nth-of-type(3) {
    grid-column: 3;
}


/* ROW 2 */

.users-create-form
.users-form-field:nth-of-type(4) {
    grid-column: 1;

    max-width: 320px;
}


.users-password-change-option {
    grid-column: 2;

    justify-self: start;

    white-space: nowrap;
}


.users-create-button {
    grid-column: 3;

    justify-self: start;

    width: auto;
    min-width: 130px;
}



/* =========================================================
   CREATE USER - FINAL TWO-ROW LAYOUT
   ========================================================= */

.users-create-form {
    display: grid;

    grid-template-columns:
        minmax(220px, 1fr)
        minmax(220px, 1fr)
        minmax(240px, 1fr);

    column-gap: 20px;
    row-gap: 18px;

    align-items: start;
}


/* ROW 1 */

.users-create-form
.users-form-field:nth-of-type(1) {
    grid-column: 1;
    grid-row: 1;
}

.users-create-form
.users-form-field:nth-of-type(2) {
    grid-column: 2;
    grid-row: 1;
}

.users-create-form
.users-form-field:nth-of-type(3) {
    grid-column: 3;
    grid-row: 1;
}


/* ROW 2 */

.users-create-form
.users-form-field:nth-of-type(4) {
    grid-column: 1;
    grid-row: 2;

    max-width: 320px;
}


.users-create-button {
    grid-column: 2;
    grid-row: 2;

    justify-self: start;

    width: auto;
    min-width: 150px;

    margin: 0;
}


.users-password-change-option {
    grid-column: 2;
    grid-row: 2;

    justify-self: start;
    align-self: start;

    margin-top: 52px;

    white-space: nowrap;
}


.users-confirm-password {
    grid-column: 3 !important;
    grid-row: 2 !important;
}


/* ALIGN ALL INPUTS */

.users-create-form
.users-form-field > label {
    display: block;

    min-height: 16px;
    margin-bottom: 7px;
}


.users-create-form
.users-form-field input,
.users-create-form
.users-form-field select {

    width: 100%;
    min-height: 42px;

    box-sizing: border-box;
}


@media (max-width: 1100px) {

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

    .users-create-form
    .users-form-field,
    .users-create-button,
    .users-password-change-option,
    .users-confirm-password {

        grid-column: 1 !important;
        grid-row: auto !important;

        max-width: none;
    }

    .users-password-change-option {
        margin-top: 0;
    }

}



/* =========================================================
   CREATE USER - CLEAN TWO COLUMN LAYOUT
   ========================================================= */

.users-create-form {
    display: grid;

    grid-template-columns:
        minmax(300px, 1fr)
        minmax(300px, 1fr);

    column-gap: 34px;
    row-gap: 18px;

    max-width: 980px;

    align-items: start;
}


/* LEFT COLUMN */

.users-create-form
.users-form-field:nth-of-type(1) {
    grid-column: 1;
    grid-row: 1;
}

.users-create-form
.users-form-field:nth-of-type(2) {
    grid-column: 1;
    grid-row: 2;
}

.users-create-form
.users-form-field:nth-of-type(4) {
    grid-column: 1;
    grid-row: 3;

    max-width: none;
}


/* RIGHT COLUMN */

.users-create-form
.users-form-field:nth-of-type(3) {
    grid-column: 2;
    grid-row: 1;
}

.users-confirm-password {
    grid-column: 2 !important;
    grid-row: 2 !important;
}


/* ACTIONS */

.users-create-button {
    grid-column: 2;
    grid-row: 3;

    justify-self: start;

    width: auto;
    min-width: 150px;

    margin: 0;
}


.users-password-change-option {
    grid-column: 2;
    grid-row: 4;

    justify-self: start;

    margin: 0;

    white-space: nowrap;
}


/* CONSISTENT CONTROL SIZE */

.users-create-form
.users-form-field input,
.users-create-form
.users-form-field select {

    width: 100%;
    min-height: 42px;

    box-sizing: border-box;
}


/* RESPONSIVE */

@media (max-width: 900px) {

    .users-create-form {
        grid-template-columns: 1fr;

        max-width: none;
    }

    .users-create-form
    .users-form-field,
    .users-create-button,
    .users-password-change-option,
    .users-confirm-password {

        grid-column: 1 !important;
        grid-row: auto !important;
    }

}


/* CREATE USER - MOVE CHECKBOX UP */

.users-password-change-option {
    grid-column: 2;
    grid-row: 3;

    align-self: end;
    justify-self: start;

    margin-left: 220px;
    margin-top: 0;

    white-space: nowrap;
}



/* =========================================================
   CREATE USER - CLEAN ACTION STACK
   ========================================================= */

/*
   Checkbox sits directly beneath Confirm Password.
*/

.users-password-change-option {
    grid-column: 2;
    grid-row: 3;

    justify-self: start;
    align-self: start;

    margin: 0;

    white-space: nowrap;
}


/*
   Create button directly beneath checkbox.
*/

.users-create-button {
    grid-column: 2;
    grid-row: 4;

    justify-self: start;

    width: auto;
    min-width: 150px;

    margin: 0;
}


/*
   Keep Role on left aligned naturally with
   the credential/action stack.
*/

.users-create-form
.users-form-field:nth-of-type(4) {
    grid-column: 1;
    grid-row: 3;

    max-width: none;
}


/*
   Slightly tighten the vertical spacing between
   checkbox and Create User button.
*/

.users-create-form {
    row-gap: 16px;
}



/* =========================================================
   CREATE USER - FINAL ACTION ALIGNMENT
   ========================================================= */

/* Role stays in row 3 on the left */

.users-create-form
.users-form-field:nth-of-type(4) {
    grid-column: 1;
    grid-row: 3;

    max-width: none;
}


/*
   Create User aligns vertically with Role
   and centers beneath Confirm Password.
*/

.users-create-button {
    grid-column: 2;
    grid-row: 3;

    justify-self: center;
    align-self: start;

    width: 180px;
    min-width: 180px;

    margin: 0;
}


/*
   Checkbox sits immediately under Create User
   and is centered with the button.
*/

.users-password-change-option {
    grid-column: 2;
    grid-row: 4;

    justify-self: center;
    align-self: start;

    margin: -4px 0 0;

    white-space: nowrap;
}


/* Keep the two-column form balanced */

.users-create-form {
    row-gap: 14px;
}


/* CREATE USER - TIGHTEN ACTION AREA */

.users-create-button {
    grid-column: 2;
    grid-row: 3;

    justify-self: center;
    align-self: start;

    width: 180px;
    min-width: 180px;

    margin: 0;
}

.users-password-change-option {
    grid-column: 2;
    grid-row: 3;

    justify-self: center;
    align-self: start;

    margin-top: 58px;

    white-space: nowrap;
}


/* CREATE USER - COMPACT INLINE ERROR */

.users-form-error {
    max-width: 520px;

    margin: 8px 0 0 auto;
    padding: 8px 10px;

    border: 1px solid rgba(220,90,90,0.28);
    border-radius: 7px;

    background: rgba(180,50,50,0.07);
    color: #e1a0a0;

    font-size: 11px;
    line-height: 1.4;
}


/* CREATE USER - ERROR MESSAGE LEFT ALIGNMENT */

.users-form-error {
    max-width: 520px;

    margin:
        8px
        auto
        0
        0;

    padding: 8px 10px;

    border: 1px solid rgba(220,90,90,0.28);
    border-radius: 7px;

    background: rgba(180,50,50,0.07);
    color: #e1a0a0;

    font-size: 11px;
    line-height: 1.4;
}


/* CREATE USER - ERROR BANNER SPACING */

.users-form-error {
    margin:
        8px
        auto
        14px
        0;
}



/* =========================================================
   GLOBAL SUMMARY / STAT CARD ALIGNMENT
   Keep summary cards left-aligned on all JARVIS pages.
   ========================================================= */

.users-summary-grid,
.knowledge-stats-grid,
.model-status-grid {
    justify-content: flex-start;
    justify-items: start;

    margin-left: 0;
    margin-right: 0;
}


/*
   Prevent older page-specific centering rules from
   pulling summary sections toward the middle.
*/

.jarvis-page-main > .users-summary-grid,
.jarvis-page-main > .knowledge-stats-grid,
.jarvis-page-main > .model-status-grid,
.admin-main > .users-summary-grid,
.admin-main > .knowledge-stats-grid,
.admin-main > .model-status-grid {
    width: 100%;
    max-width: none;

    margin-left: 0;
    margin-right: 0;
}


/*
   Cards themselves stay at their natural grid positions
   instead of centering inside the available workspace.
*/

.users-summary-grid > *,
.knowledge-stats-grid > *,
.model-status-grid > * {
    justify-self: start;
}



/* =========================================================
   GLOBAL JARVIS SUMMARY CARD GRID
   Standardize summary/stat cards across pages.
   ========================================================= */

.users-summary-grid,
.knowledge-stats-grid,
.model-status-grid,
.memory-stat-grid {
    width: 100%;
    max-width: none;

    margin-left: 0;
    margin-right: 0;
    margin-bottom: 30px;

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 14px;

    justify-content: stretch;
    justify-items: stretch;
}


/* Cards fill their grid columns */

.users-summary-grid > *,
.knowledge-stats-grid > *,
.model-status-grid > *,
.memory-stat-grid > * {
    width: auto;
    max-width: none;

    justify-self: stretch;
}


/* Normalize summary card proportions */

.knowledge-stat-card,
.memory-stat-card,
.model-status-card {
    min-height: 116px;

    padding: 21px;

    box-sizing: border-box;
}


/* Five-item Knowledge grid:
   first 3 cards on row one,
   remaining 2 naturally begin row two.
*/

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


/* Responsive */

@media (max-width: 900px) {

    .users-summary-grid,
    .knowledge-stats-grid,
    .model-status-grid,
    .memory-stat-grid {
        grid-template-columns: 1fr;
    }

}


/* PASSWORD EYE - CLEAN RIGHT-SIDE CONTROL */

.password-field-wrap {
    position: relative;
    width: 100%;
}

.password-field-wrap input {
    width: 100%;
    padding-right: 52px;
    box-sizing: border-box;
}

.password-toggle {
    position: absolute;

    top: 50%;
    right: 12px;

    transform: translateY(-50%);

    width: 34px;
    height: 34px;

    padding: 0;

    border: none !important;
    border-radius: 0;

    background: transparent !important;
    box-shadow: none !important;

    color: rgba(255,255,255,0.42);

    font-size: 20px;
    line-height: 1;

    cursor: pointer;
}

.password-toggle:hover {
    color: rgba(255,255,255,0.90);
    background: transparent !important;
}

.password-toggle:focus {
    outline: none;
    box-shadow: none !important;
}


/* USERS & ACCESS - FLOATING TOAST */

.jarvis-users-toast {
    position: fixed;
    top: 116px;
    right: 28px;
    z-index: 10000;

    min-width: 260px;
    max-width: 430px;

    padding: 12px 16px;

    border-radius: 9px;

    font-size: 12px;
    font-weight: 600;
    line-height: 1.45;

    box-shadow: 0 12px 30px rgba(0,0,0,0.35);

    opacity: 0;
    transform: translateY(-8px);

    pointer-events: none;

    transition:
        opacity 150ms ease,
        transform 150ms ease;
}

.jarvis-users-toast.show {
    opacity: 1;
    transform: translateY(0);
}

.jarvis-users-toast-success {
    border: 1px solid rgba(72,190,137,0.38);
    background: rgba(22,53,43,0.97);
    color: #9ce0bf;
}

.jarvis-users-toast-error {
    border: 1px solid rgba(220,90,90,0.38);
    background: rgba(55,28,31,0.97);
    color: #efaaaa;
}




/* KNOWLEDGE PAGE - ALIGN CONTENT SECTIONS LEFT */

.knowledge-stats-grid ~ .admin-section {
    width: 100%;
    max-width: none;

    margin-left: 0;
    margin-right: 0;
}


/* =========================================================
   GLOBAL PAGE ALIGNMENT
   Shared default: all page content starts at the left edge.
   ========================================================= */

.jarvis-page-main {
    width: 100%;
    max-width: none;

    margin-left: 0;
    margin-right: 0;

    text-align: left;
}


/* Standard page sections should inherit the left edge */

.jarvis-page-main > section,
.jarvis-page-main > .admin-section,
.jarvis-page-main > .admin-intro,
.jarvis-page-main > .users-summary-grid,
.jarvis-page-main > .knowledge-stats-grid,
.jarvis-page-main > .memory-stat-grid,
.jarvis-page-main > .model-status-grid {
    width: 100%;
    max-width: none;

    margin-left: 0;
    margin-right: 0;
}


/* Prevent old auto-centering rules from surviving */

.admin-section,
.admin-intro,
.users-summary-grid,
.knowledge-stats-grid,
.memory-stat-grid,
.model-status-grid {
    margin-left: 0;
    margin-right: 0;
}


/* Tables and content blocks follow the same left edge */

.knowledge-table-wrap,
.users-table,
.memory-add-form,
.memory-search-form {
    margin-left: 0;
    margin-right: 0;
}


/* =========================================================
   PASSWORD TOGGLE PLACEMENT
   ========================================================= */

.jarvis-password-wrap {
    position: relative;
}

.jarvis-password-wrap input {
    padding-right: 52px;
}

.jarvis-password-wrap .password-toggle {
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);

    width: 28px;
    height: 28px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;
    margin: 0;

    border: none;
    background: transparent;

    color: rgba(255,255,255,0.72);
    cursor: pointer;
    z-index: 2;
}

.jarvis-password-wrap .password-toggle:hover {
    color: #ffffff;
}

.jarvis-password-wrap .password-toggle:focus {
    outline: none;
}

/* PASSWORD EYE - FINAL POSITIONING */

.password-field-wrap,
.jarvis-password-wrap {
    position: relative;
    width: 100%;
}

.password-field-wrap input,
.jarvis-password-wrap input {
    width: 100%;
    padding-right: 54px;
    box-sizing: border-box;
}

.password-toggle {
    position: absolute;

    top: 50%;
    right: 12px;

    transform: translateY(-50%);

    width: 32px;
    height: 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;
    margin: 0;

    border: none !important;
    background: transparent !important;
    box-shadow: none !important;

    color: rgba(255,255,255,0.58);

    font-size: 20px;
    line-height: 1;

    cursor: pointer;
    z-index: 3;

    user-select: none;
    -webkit-user-select: none;
}

.password-toggle:hover {
    color: rgba(255,255,255,0.95);
}

.password-toggle:focus {
    outline: none;
    box-shadow: none !important;
}

/* PASSWORD EYE - FINAL POSITIONING */

.password-field-wrap,
.jarvis-password-wrap {
    position: relative;
    width: 100%;
}

.password-field-wrap input,
.jarvis-password-wrap input {
    width: 100%;
    padding-right: 54px;
    box-sizing: border-box;
}

.password-toggle {
    position: absolute;

    top: 50%;
    right: 12px;

    transform: translateY(-50%);

    width: 32px;
    height: 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;
    margin: 0;

    border: none !important;
    background: transparent !important;
    box-shadow: none !important;

    color: rgba(255,255,255,0.58);

    font-size: 20px;
    line-height: 1;

    cursor: pointer;
    z-index: 3;

    user-select: none;
    -webkit-user-select: none;
}

.password-toggle:hover {
    color: rgba(255,255,255,0.95);
}

.password-toggle:focus {
    outline: none;
    box-shadow: none !important;
}

/* =========================================================
   AUTH PASSWORD FIELDS - MATCH ADMIN CREATE USER
   ========================================================= */

.jarvis-auth-card .password-field-wrap {
    position: relative;
    width: 100%;
}

/* Leave a small dedicated area for the eye */
.jarvis-auth-card .password-field-wrap input {
    width: calc(100% - 42px) !important;
    box-sizing: border-box;
}

/* Eye sits directly beside the right edge of the field */
.jarvis-auth-card .password-field-wrap .password-toggle {
    position: absolute !important;

    top: 50% !important;
    right: 2px !important;

    transform: translateY(-50%) !important;

    width: 34px !important;
    height: 34px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: none !important;
    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;

    color: rgba(255,255,255,0.55) !important;

    font-size: 20px !important;
    line-height: 1 !important;

    cursor: pointer;
    z-index: 5;
}

.jarvis-auth-card .password-field-wrap .password-toggle:hover {
    color: rgba(255,255,255,0.95) !important;
}

/* =========================================================
   AUTH FORMS - UNIFORM FIELD / BUTTON WIDTH
   Leave room for password eye at right.
   Applies to Register + Change Password.
   ========================================================= */

.jarvis-auth-card {
    --auth-control-width: calc(100% - 42px);
}


/* Normal text inputs */

.jarvis-auth-card > input {
    width: var(--auth-control-width) !important;
    box-sizing: border-box;
}


/* Password rows */

.jarvis-auth-card .password-field-wrap {
    position: relative;
    width: 100%;
}

.jarvis-auth-card .password-field-wrap input {
    width: var(--auth-control-width) !important;
    box-sizing: border-box;
}


/* Main form button matches input width */

.jarvis-auth-card > button[type="submit"] {
    width: var(--auth-control-width) !important;
    box-sizing: border-box;
}


/* Eye lives in the reserved right-side space */

.jarvis-auth-card .password-field-wrap .password-toggle {
    position: absolute !important;

    top: 50% !important;
    right: 2px !important;

    transform: translateY(-50%) !important;

    width: 34px !important;
    height: 34px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: none !important;
    background: transparent !important;
    box-shadow: none !important;

    color: rgba(255,255,255,0.58) !important;

    font-size: 20px !important;
    line-height: 1 !important;

    cursor: pointer;
}

.jarvis-auth-card .password-field-wrap .password-toggle:hover {
    color: rgba(255,255,255,0.95) !important;
}



/* =========================================================
   AUTH FORM FINAL GEOMETRY
   Uniform centered controls with eye beside password field
   ========================================================= */

.jarvis-auth-card {
    --auth-control-width: calc(100% - 70px);
}


/* Labels align with controls */

.jarvis-auth-card > label {
    width: var(--auth-control-width) !important;

    margin-left: auto !important;
    margin-right: auto !important;
}


/* Display Name / Username / other normal inputs */

.jarvis-auth-card > input {
    display: block;

    width: var(--auth-control-width) !important;

    margin-left: auto !important;
    margin-right: auto !important;

    box-sizing: border-box;
}


/* Password requirement banner matches fields exactly */

.jarvis-auth-card .jarvis-password-requirements {
    width: var(--auth-control-width) !important;

    margin-left: auto !important;
    margin-right: auto !important;

    box-sizing: border-box;
}


/* Password wrapper itself is SAME width as normal fields */

.jarvis-auth-card .password-field-wrap {
    position: relative;

    width: var(--auth-control-width) !important;

    margin-left: auto !important;
    margin-right: auto !important;
}


/* Password textbox is full width of wrapper */

.jarvis-auth-card .password-field-wrap input {
    width: 100% !important;

    margin: 0 !important;

    padding-right: 14px !important;

    box-sizing: border-box;
}


/* Eye sits just beyond right edge of the box */

.jarvis-auth-card .password-field-wrap .password-toggle {
    position: absolute !important;

    top: 50% !important;
    right: -42px !important;

    transform: translateY(-50%) !important;

    width: 32px !important;
    height: 32px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: none !important;
    background: transparent !important;
    box-shadow: none !important;

    color: rgba(255,255,255,0.58) !important;

    font-size: 20px !important;
    line-height: 1 !important;

    cursor: pointer;
}


/* Main button EXACTLY matches field width */

.jarvis-auth-card > button[type="submit"] {
    display: block;

    width: var(--auth-control-width) !important;

    margin-left: auto !important;
    margin-right: auto !important;

    box-sizing: border-box;
}


/* AUTH PRIMARY BUTTON - FORCE CENTER */

.jarvis-auth-card > button[type="submit"] {
    width: var(--auth-control-width) !important;
    max-width: none !important;

    display: block !important;

    margin-left: auto !important;
    margin-right: auto !important;

    box-sizing: border-box !important;
}


/* Admin Knowledge: ingestion issues */

.ingestion-issues-copy {
    margin: 8px 0 0;
    color: #8f9bac;
    font-size: 0.9rem;
}

.issues-feedback {
    margin: 0 0 18px;
    padding: 11px 14px;
    border: 1px solid;
    border-radius: 8px;
    font-size: 0.88rem;
}

.issues-feedback-success {
    border-color: rgba(72, 202, 142, 0.38);
    background: rgba(34, 126, 84, 0.15);
    color: #8ce5b8;
}

.issues-feedback-error {
    border-color: rgba(235, 91, 105, 0.4);
    background: rgba(150, 42, 53, 0.16);
    color: #f2a0aa;
}

.issues-filter-form {
    display: grid;
    grid-template-columns:
        minmax(130px, 1fr)
        minmax(130px, 1fr)
        minmax(130px, 1fr)
        minmax(145px, 1fr)
        minmax(145px, 1fr)
        auto;
    gap: 12px;
    align-items: end;
    margin-bottom: 18px;
}

.issues-filter-form label {
    display: grid;
    gap: 6px;
    color: #93a0b2;
    font-size: 0.76rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.issues-filter-form select,
.issues-filter-form input {
    width: 100%;
    min-height: 38px;
    box-sizing: border-box;
    border: 1px solid #293343;
    border-radius: 7px;
    background: #101722;
    color: #dce5ef;
    padding: 7px 9px;
    color-scheme: dark;
}

.issues-filter-form select:focus-visible,
.issues-filter-form input:focus-visible,
.issues-button:focus-visible,
.issue-delete-details summary:focus-visible {
    outline: 2px solid #5aa9ff;
    outline-offset: 2px;
}

.issues-filter-actions {
    display: flex;
    gap: 8px;
}

.issues-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    border: 1px solid #376895;
    border-radius: 7px;
    background: #173858;
    color: #dceeff;
    padding: 6px 10px;
    font: inherit;
    font-size: 0.78rem;
    line-height: 1.1;
    text-decoration: none;
    cursor: pointer;
}

.issues-button:hover {
    background: #204a70;
}

.issues-button-muted {
    border-color: #384353;
    background: #1a222e;
    color: #b9c3cf;
}

.issues-button-danger {
    border-color: #9d3946;
    background: #5b2029;
    color: #ffd9dd;
}

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

.ingestion-issues-table {
    min-width: 1380px;
}

.ingestion-issues-table th,
.ingestion-issues-table td {
    vertical-align: top;
}

.issue-status {
    display: inline-flex;
    border: 1px solid #465164;
    border-radius: 999px;
    padding: 3px 8px;
    color: #c3ccd7;
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.issue-status-failed {
    border-color: #82404a;
    color: #f1a0aa;
}

.issue-status-quarantined {
    border-color: #8b6a34;
    color: #e9c278;
}

.issue-status-retrying {
    border-color: #376895;
    color: #84c4ff;
}

.issue-status-dismissed {
    opacity: 0.68;
}

.issue-reason {
    min-width: 210px;
    max-width: 320px;
    white-space: normal;
}

.issue-identifiers {
    min-width: 145px;
}

.issue-identifiers span {
    display: block;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 0.76rem;
}

.issue-actions {
    display: grid;
    min-width: 190px;
    gap: 8px;
}

.issue-actions form {
    margin: 0;
}

.issue-confirm-form {
    display: grid;
    gap: 7px;
    padding: 8px;
    border: 1px solid #313c4b;
    border-radius: 7px;
    background: #111925;
}

.issue-confirm-form label {
    display: flex;
    gap: 7px;
    align-items: flex-start;
    color: #aeb9c6;
    font-size: 0.76rem;
}

.issue-confirm-form input[type="checkbox"] {
    margin-top: 2px;
    accent-color: #5aa9ff;
}

.issue-delete-details {
    border-top: 1px solid #2b3543;
    padding-top: 7px;
}

.issue-delete-details summary {
    color: #d88f99;
    font-size: 0.76rem;
    cursor: pointer;
}

.issue-delete-form {
    margin-top: 8px !important;
    border-color: #61333a;
}

.issue-delete-form p {
    margin: 0;
    color: #d7a6ac;
    font-size: 0.76rem;
    line-height: 1.4;
}

@media (max-width: 1100px) {
    .issues-filter-form {
        grid-template-columns: repeat(3, minmax(130px, 1fr));
    }
}




/* Deployed Admin Integrations: explicit Box controls */

.admin-main .box-sync-form {
    display: grid;
    grid-template-columns: minmax(220px, 420px) auto;
    gap: 9px 12px;
    align-items: end;
    margin-top: 18px;
}

.admin-main .box-sync-form .box-sync-label {
    grid-column: 1 / -1;
    color: #9aa8b8;
    font-size: 0.78rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.admin-main .box-sync-form .box-folder-input {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 100% !important;
    min-height: 42px !important;
    box-sizing: border-box !important;
    border: 1px solid #34465b !important;
    border-radius: 8px !important;
    background: #0f1722 !important;
    color: #e4edf7 !important;
    padding: 9px 12px !important;
    font: inherit !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.025) !important;
}

.admin-main .box-sync-form .box-folder-input:focus-visible {
    outline: 2px solid #5aa9ff !important;
    outline-offset: 2px !important;
    border-color: #5aa9ff !important;
}

.admin-main .box-sync-form .box-sync-button {
    appearance: none !important;
    -webkit-appearance: none !important;
    min-height: 42px !important;
    border: 1px solid #3472a8 !important;
    border-radius: 8px !important;
    background: #173d60 !important;
    color: #e7f3ff !important;
    padding: 9px 16px !important;
    font: inherit !important;
    font-weight: 650 !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

.admin-main .box-sync-form .box-sync-button:hover {
    background: #20527e !important;
}

.admin-main .box-sync-form .box-sync-button:focus-visible {
    outline: 2px solid #5aa9ff !important;
    outline-offset: 2px !important;
}




/* Shared sidebar account: preserve the complete authenticated display name. */
.jarvis-shell-account .jarvis-shell-user {
    align-items: flex-start;
}

.jarvis-shell-account .jarvis-shell-user-details {
    flex: 1 1 auto;
    min-width: 0;
}

.jarvis-shell-account .jarvis-shell-user-name {
    display: block;
    overflow: visible;
    white-space: normal;
    text-overflow: clip;
    overflow-wrap: anywhere;
    font-size: 14px;
    line-height: 1.25;
}

.jarvis-shell-account .jarvis-shell-user-role {
    display: block;
    line-height: 1.25;
}

.jarvis-shell-account .jarvis-shell-logout-form {
    clear: both;
}


/* Admin Integrations: refined Box synchronization field group. */
.admin-main .box-sync-form {
    display: block;
    margin-top: 22px;
}

.admin-main .box-sync-form .box-sync-label {
    display: block;
    margin: 0 0 9px;
    color: #aebbc8;
    font-size: 0.78rem;
    font-weight: 650;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.admin-main .box-sync-controls {
    display: flex;
    align-items: stretch;
    gap: 11px;
    width: 100%;
}

.admin-main .box-sync-form .box-folder-input {
    flex: 1 1 340px;
    width: min(100%, 520px) !important;
    max-width: 520px !important;
    height: 44px !important;
    min-height: 44px !important;
    border: 1px solid #405366 !important;
    border-radius: 9px !important;
    background-color: #1b2530 !important;
    color: #edf2f5 !important;
    padding: 0 13px !important;
    caret-color: #54c7d9;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.22) !important;
    transition: border-color 150ms ease, background-color 150ms ease, box-shadow 150ms ease;
}

.admin-main .box-sync-form .box-folder-input:hover:not(:disabled) {
    border-color: #536a80 !important;
    background-color: #202c38 !important;
}

.admin-main .box-sync-form .box-folder-input:focus,
.admin-main .box-sync-form .box-folder-input:focus-visible {
    outline: none !important;
    border-color: #42b8cd !important;
    background-color: #202c38 !important;
    box-shadow: 0 0 0 3px rgba(66,184,205,0.16) !important;
}

.admin-main .box-sync-form .box-folder-input:user-invalid,
.admin-main .box-sync-form .box-folder-input[aria-invalid="true"] {
    border-color: #b96068 !important;
    box-shadow: 0 0 0 3px rgba(185,96,104,0.13) !important;
}

.admin-main .box-sync-form .box-folder-input:disabled {
    border-color: #303d49 !important;
    background-color: #151c24 !important;
    color: #6f7c87 !important;
    cursor: not-allowed;
    opacity: 0.72;
}

.admin-main .box-sync-form .box-sync-button {
    flex: 0 0 auto;
    height: 44px !important;
    min-height: 44px !important;
    border: 1px solid #319eb5 !important;
    border-radius: 9px !important;
    background: #177f98 !important;
    color: #f2fbfd !important;
    padding: 0 20px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.18) !important;
    transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.admin-main .box-sync-form .box-sync-button:hover:not(:disabled) {
    border-color: #44bad0 !important;
    background: #1b91ac !important;
    box-shadow: 0 3px 10px rgba(0,0,0,0.23) !important;
}

.admin-main .box-sync-form .box-sync-button:focus,
.admin-main .box-sync-form .box-sync-button:focus-visible {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(66,184,205,0.2) !important;
}

.admin-main .box-sync-form .box-sync-button:active:not(:disabled) {
    transform: translateY(1px);
}

.admin-main .box-sync-form .box-sync-button:disabled {
    border-color: #35515a !important;
    background: #27434b !important;
    color: #82979d !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    opacity: 0.7;
}

.admin-main .box-sync-guidance {
    display: block;
    margin-top: 7px;
    color: #71808e;
    font-size: 0.72rem;
}




/* Box connector: reuse Users & Access controls and align the card as one component. */
.admin-main .box-connector-card {
    display: block;
    min-height: 0;
    padding: 20px;
}

.admin-main .box-connector-heading-row {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 0;
}

.admin-main .box-connector-heading-row h2 {
    margin: 0;
    line-height: 39px;
}

.admin-main .box-connector-icon {
    flex: 0 0 39px;
    width: 39px;
    height: 39px;
    box-sizing: border-box;
}

.admin-main .box-connector-content {
    margin: 14px 0 0 57px;
    padding: 0;
}

.admin-main .box-connector-card .box-connector-status {
    margin: 0 0 18px;
}

.admin-main .box-connector-card .box-sync-form {
    display: block;
    margin: 0;
}

.admin-main .box-connector-card .box-folder-field {
    width: 100%;
    max-width: 560px;
    gap: 7px;
}

.admin-main .box-connector-card .box-sync-controls {
    display: flex;
    align-items: stretch;
    gap: 12px;
    width: 100%;
}

.admin-main .box-connector-card .users-form-field .box-sync-controls input {
    flex: 0 1 400px;
    width: 400px;
    max-width: 100%;
    height: 42px;
    min-height: 42px;
    box-sizing: border-box;
}

.admin-main .box-connector-card .box-sync-primary {
    flex: 0 0 auto;
    width: auto;
    min-width: 118px;
    height: 42px;
    min-height: 42px;
    margin: 0;
    padding: 0 18px;
    border-color: rgba(32,199,244,0.42);
    background: rgba(18,139,168,0.88);
    color: #f2fbfd;
}

.admin-main .box-connector-card .box-sync-primary:hover:not(:disabled) {
    border-color: rgba(62,213,239,0.62);
    background: rgba(20,157,188,0.96);
}

.admin-main .box-connector-card .box-sync-primary:focus-visible {
    outline: 0;
    border-color: rgba(91,191,220,0.72);
    box-shadow: 0 0 0 3px rgba(32,199,244,0.14);
}

.admin-main .box-connector-card .box-sync-primary:disabled {
    border-color: rgba(255,255,255,0.08);
    background: rgba(64,78,86,0.55);
    color: #7f8a91;
    cursor: not-allowed;
    box-shadow: none;
}

.admin-main .box-connector-card .box-sync-guidance {
    display: block;
    margin: 1px 0 0;
    color: #6d7884;
    font-size: 10px;
    line-height: 1.4;
}






/* Box connector final hierarchy: full-width header followed by one aligned body. */
.admin-main .box-connector-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
}

.admin-main .box-connector-header {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
    margin: 0;
    padding: 0;
}

.admin-main .box-connector-header h2 {
    margin: 0;
    line-height: 1.2;
}

.admin-main .box-connector-header .box-connector-icon {
    flex: 0 0 39px;
    width: 39px;
    height: 39px;
}

.admin-main .box-connector-body {
    width: auto;
    margin: 16px 0 0 55px;
    padding: 0;
}

.admin-main .box-connector-body .box-connector-status {
    margin: 0 0 18px;
}




/* Chat composer send control */
.composer .send-button {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(62,213,239,.5);
    border-radius: 50%;
    background: #17839a;
    color: #f5fcff;
    font: 700 24px/1 system-ui, sans-serif;
    cursor: pointer;
    transition: background-color .15s ease, transform .15s ease, opacity .15s ease;
}
.composer .send-button:hover:not(:disabled) { background: #1b9bb5; }
.composer .send-button:active:not(:disabled) { transform: translateY(1px); }
.composer .send-button:focus-visible { outline: 2px solid #65d9ec; outline-offset: 2px; }
.composer .send-button:disabled { opacity: .38; cursor: not-allowed; }


/* Chat composer control-pair refinement */
.composer {
    align-items: center;
    padding-right: 10px;
    gap: 8px;
}
.composer textarea {
    min-width: 0;
    padding-right: 10px;
    align-self: center;
}
.composer .mic-button,
.composer .send-button {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(151,171,184,.34);
    border-radius: 50%;
    vertical-align: middle;
}
.composer .composer-control-icon {
    width: 21px;
    height: 21px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}
.composer .mic-button {
    background: #202a34;
    color: #d4dee5;
}
.composer .mic-button:hover:not(:disabled) { background: #2a3743; border-color: #607486; }
.composer .mic-button:active:not(:disabled) { background: #18212a; transform: translateY(1px); }
.composer .mic-button.recording {
    background: #56323a;
    border-color: #ef7182;
    color: #fff;
    box-shadow: 0 0 0 3px rgba(239,113,130,.18);
}
.composer .mic-button.recording::after {
    content: "";
    position: absolute;
    width: 6px;
    height: 6px;
    margin: -31px 0 0 31px;
    border-radius: 50%;
    background: #ff8191;
}
.composer .send-button {
    background: #16879e;
    border-color: #35bdd2;
    color: #fff;
}
.composer .send-button:hover:not(:disabled) { background: #1b9eb8; border-color: #70dbea; }
.composer .send-button:active:not(:disabled) { background: #126f83; transform: translateY(1px); }
.composer .send-button:disabled {
    background: #27323a;
    border-color: #3b4953;
    color: #71808a;
    opacity: 1;
}
.composer .send-button.submitting {
    border-style: dashed;
    animation: jarvis-send-spin 1s linear infinite;
}
.composer .mic-button:focus-visible,
.composer .send-button:focus-visible {
    outline: 3px solid #70dbea;
    outline-offset: 2px;
}
@keyframes jarvis-send-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .composer .send-button.submitting { animation: none; }
}



/* Chat composer helper-text visibility */
.composer-area .hint {
    width: 100%;
    box-sizing: border-box;
    margin: 8px auto 10px;
    padding: 0 12px;
    text-align: center;
    color: rgba(207, 220, 229, 0.72);
    line-height: 1.4;
    overflow: visible;
}



/* Final shared-shell consistency and mobile drawer */
.jarvis-mobile-nav-toggle,
.jarvis-mobile-nav-backdrop { display: none; }

.jarvis-shell-user-name,
.jarvis-shell-user-role,
.nav-item span,
.admin-card,
.admin-feature-card,
.admin-service-card { min-width: 0; }
.long-id, .issue-identifiers, code {
    overflow-wrap: anywhere;
    word-break: break-word;
}
.table-wrap,
.admin-table-wrap,
.ingestion-issues-table-wrap {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
}
.jarvis-shell-sidebar .nav-item,
.jarvis-shell-logout {
    min-height: 44px;
}
.jarvis-shell-content,
.admin-main {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

@media (prefers-reduced-motion: reduce) {
    .jarvis-shell-sidebar { transition: none; }
}

/* Targeted mobile-shell recovery */
.app { height: 100vh; height: 100dvh; min-height: 0; }
.jarvis-mobile-nav-extra { display: none; }
.jarvis-mobile-nav-toggle svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
td, th, .admin-subnav-item, .nav-item span, .jarvis-shell-user-name,
.jarvis-shell-user-role, .admin-user-card, .admin-service-card {
    word-break: normal; overflow-wrap: normal;
}



/* Final mobile-shell cascade: explicit compact brand and navigation */
.brand-mobile { display:none; }
.nav-icon svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }


/* Mobile horizontal geometry containment */
.jarvis-drawer-header { display:none; }


/* Memory category selector */
.memory-category-field {
    display:flex; flex-direction:column; gap:7px; min-width:0;
}
.memory-category-field label {
    color:rgba(232,240,244,.82); font-size:12px; font-weight:700;
}
.memory-category-field select,
.memory-category-field input {
    width:100%; min-width:0; min-height:44px; padding:0 12px;
    border:1px solid rgba(151,171,184,.32); border-radius:9px;
    background:#0f1722; color:#eef4f7; font:inherit;
}
.memory-category-field select:focus-visible,
.memory-category-field input:focus-visible {
    outline:3px solid rgba(112,219,234,.8); outline-offset:2px;
}
.memory-new-category-field[hidden] { display:none; }
.memory-form-error {
    margin:0 0 12px; padding:10px 12px; border:1px solid rgba(255,115,115,.45);
    border-radius:8px; background:rgba(120,28,36,.2); color:#ffd7d7;
}


/* Desktop sidebar account compactness and Memory category combobox */
@media (min-width:801px) {
    .jarvis-shell-account { padding-top:6px; }
    .jarvis-shell-account .jarvis-shell-user {
        gap:8px; padding:4px 11px 5px; font-size:13px;
    }
    .jarvis-shell-account .jarvis-shell-avatar {
        width:28px; height:28px; flex:0 0 28px; font-size:10px;
    }
    .jarvis-shell-account .jarvis-shell-user-details { min-width:0; gap:0; }
    .jarvis-shell-account .jarvis-shell-user-name {
        display:block; font-size:13px; line-height:1.2; font-weight:600;
        white-space:nowrap; overflow:visible; text-overflow:clip; overflow-wrap:normal;
    }
    .jarvis-shell-account .jarvis-shell-user-role {
        margin-top:1px; font-size:10.5px; line-height:1.15;
        font-weight:600; letter-spacing:.04em;
    }
    .jarvis-shell-account .jarvis-shell-logout-form { margin:1px 0 0; }
    .jarvis-shell-account .jarvis-shell-logout {
        min-height:30px; height:30px; padding:0 11px; gap:8px;
        font-size:13px; font-weight:550;
    }
    .jarvis-shell-account .jarvis-shell-logout .nav-icon { width:16px; min-width:16px; }
    .jarvis-shell-account .jarvis-shell-logout .nav-icon svg { width:16px; height:16px; }
}
.jarvis-combobox { position:relative; width:100%; min-width:0; }
.memory-select-control {
    width:100%; height:44px; min-height:44px; padding:0 11px;
    border:1px solid rgba(255,255,255,.10); border-radius:8px;
    background:rgba(0,0,0,.18); color:#fff; font:inherit;
    box-sizing:border-box; transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.jarvis-combobox-trigger.memory-select-control {
    display:flex; align-items:center; justify-content:space-between;
    gap:12px; text-align:left;
}
.memory-select-control:hover:not(:disabled) {
    border-color:rgba(255,255,255,.22); background:rgba(0,0,0,.25);
}
.memory-select-control:focus-visible {
    outline:3px solid rgba(112,219,234,.8); outline-offset:2px;
    border-color:rgba(112,219,234,.62);
}
.memory-select-control:disabled {
    cursor:not-allowed; opacity:.55; color:rgba(255,255,255,.58);
    background:rgba(0,0,0,.12);
}
.jarvis-combobox-panel {
    position:absolute; z-index:160; top:calc(100% + 6px); left:0; right:0;
    max-height:320px; padding:8px; overflow:hidden;
    border:1px solid rgba(151,171,184,.34); border-radius:10px;
    background:#171b20; box-shadow:0 18px 42px rgba(0,0,0,.45);
}
.jarvis-combobox-search {
    width:100%; min-height:42px; margin-bottom:7px; padding:0 11px;
    border:1px solid rgba(151,171,184,.3); border-radius:8px;
    background:#0b121a; color:#eef4f7;
}
.jarvis-combobox-listbox { max-height:252px; overflow-y:auto; padding-right:2px; }
.jarvis-combobox-option {
    width:100%; min-height:38px; display:flex; align-items:center; padding:7px 10px;
    border:0; border-radius:7px; background:transparent; color:#dce8ed;
    font:inherit; text-align:left;
}
.jarvis-combobox-option:hover,
.jarvis-combobox-option:focus-visible { background:rgba(32,199,244,.1); color:#fff; outline:2px solid rgba(112,219,234,.55); outline-offset:-2px; }
.jarvis-combobox-option[aria-selected="true"] { background:rgba(32,199,244,.16); color:#fff; }
.jarvis-combobox-separator { margin:6px 4px; border-top:1px solid rgba(255,255,255,.1); }
.jarvis-combobox-create { color:#70dbea; font-weight:700; }
.sr-only {
    position:absolute!important; width:1px!important; height:1px!important; padding:0!important;
    margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important;
}

/* Final targeted mobile horizontal geometry */
.header-balance { display:none; }


.stats-toggle {
    width:44px;
    height:44px;
    min-width:44px;
    padding:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}
.stats-toggle svg {
    width:22px;
    height:22px;
    display:block;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.stats-toggle.enabled,
.stats-toggle[aria-pressed="true"] {
    border-color:rgba(32,199,244,.62);
    color:#70dbea;
}

.mobile-brand-status {
    display:none;
}

.jarvis-agent-indicator {
    width:9px;
    height:9px;
    flex:0 0 9px;
    border-radius:50%;
    border:1px solid rgba(236,244,247,.34);
    background:#687681;
    box-shadow:0 0 0 2px rgba(104,118,129,.12);
}
.jarvis-agent-indicator.is-unknown {
    background:#687681;
    box-shadow:0 0 0 2px rgba(104,118,129,.12);
}
.jarvis-agent-indicator.is-online {
    background:#35c977;
    box-shadow:0 0 0 2px rgba(53,201,119,.16);
}
.jarvis-agent-indicator.is-unavailable {
    background:#e46060;
    box-shadow:0 0 0 2px rgba(228,96,96,.14);
}

/* =========================================================
   AUTHORITATIVE MOBILE SHELL — consolidated
   ========================================================= */
@media (max-width: 800px) {
    html, body {
        width:100%; max-width:100%; min-width:0; margin:0; padding:0;
        box-sizing:border-box;
    }
    *, *::before, *::after { box-sizing:border-box; }
    .app { width:100%; max-width:100%; min-width:0; height:100vh; height:100dvh; }
    .topbar.jarvis-shell-header {
        position:relative; z-index:121; display:grid;
        grid-template-columns:48px minmax(0,1fr) 48px; align-items:center; gap:8px;
        width:100%; max-width:100%; min-width:0;
        min-height:calc(76px + env(safe-area-inset-top));
        padding:calc(8px + env(safe-area-inset-top)) 8px 8px;
    }
    .jarvis-mobile-nav-toggle {
        position:static; grid-column:1; display:inline-flex; justify-self:start;
        align-items:center; justify-content:center; width:44px; height:44px; min-width:44px;
        padding:0; border:1px solid rgba(151,171,184,.34); border-radius:10px;
        background:#18212a; color:#e5edf2;
    }
    .jarvis-mobile-nav-toggle:focus-visible { outline:3px solid #70dbea; outline-offset:2px; }
    .header-branding {
        grid-column:2; justify-self:center; display:flex; align-items:center; gap:8px;
        width:auto; max-width:100%; min-width:0; overflow:visible;
    }
    .header-logo { width:38px; height:38px; flex:0 0 38px; object-fit:contain; }
    .header-text { min-width:0; }
    .brand-desktop, .tagline-primary { display:none!important; }
    .brand-desktop::before, .brand-mobile::before, .brand-mobile::after { content:none!important; display:none!important; }
    .brand-mobile {
        display:block; font-size:16px; line-height:1.2; font-weight:750;
        letter-spacing:.8px; color:#f1f6f8; white-space:nowrap;
    }
    .header-actions { grid-column:3; justify-self:end; width:44px; max-width:44px; min-width:44px; }
    .header-system { width:44px; min-width:44px; }
    .header-system .status { display:none; }
    .header-balance { display:block; grid-column:3; width:44px; height:44px; }
    .stats-toggle {
        display:inline-flex; align-items:center; justify-content:center;
        width:44px; height:44px; min-width:44px; padding:0;
        border:1px solid rgba(151,171,184,.34); border-radius:10px;
        background:#18212a; color:#c8d7dd;
    }
    .stats-toggle svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
    .stats-toggle.enabled, .stats-toggle[aria-pressed="true"] {
        border-color:rgba(32,199,244,.62); background:rgba(18,139,168,.35); color:#70dbea;
    }
    .stats-toggle:focus-visible { outline:3px solid #70dbea; outline-offset:2px; }
    .stats-label, .stats-switch, .stats-state { display:none!important; }

    .jarvis-mobile-nav-backdrop:not([hidden]) {
        position:fixed; inset:0; z-index:125; display:block; background:rgba(2,7,11,.66);
    }
    .jarvis-shell-sidebar {
        position:fixed; inset:0 auto 0 0; z-index:130; display:flex;
        flex-direction:column; width:min(86vw,320px); max-width:320px;
        height:100vh; height:100dvh;
        padding:calc(10px + env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom));
        border-right:1px solid rgba(255,255,255,.08); background:#101820; color:#eef4f7;
        visibility:hidden; transform:translateX(-105%); opacity:1;
        transition:transform .2s ease,visibility .2s ease; overflow:hidden;
    }
    body.jarvis-drawer-open .jarvis-shell-sidebar { visibility:visible; transform:translateX(0); }
    body.jarvis-drawer-open { overflow:hidden; }
    .jarvis-drawer-header {
        display:flex; flex:0 0 auto; align-items:center; justify-content:space-between;
        min-height:50px; margin-bottom:7px; padding:0 2px 7px;
        border-bottom:1px solid rgba(255,255,255,.08);
    }
    .jarvis-drawer-brand { display:flex; align-items:center; gap:9px; min-width:0; }
    .jarvis-drawer-brand img { width:32px; height:32px; object-fit:contain; }
    .jarvis-drawer-brand strong { color:#f1f6f8; white-space:nowrap; letter-spacing:.08em; }
    .jarvis-drawer-close {
        display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px;
        flex:0 0 44px; border:1px solid rgba(151,171,184,.3); border-radius:10px;
        background:#18212a; color:#e5edf2;
    }
    .jarvis-drawer-close svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:2; }
    .jarvis-shell-nav { flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; gap:3px; }
    .jarvis-shell-sidebar .nav-item, .jarvis-shell-sidebar .jarvis-shell-logout {
        display:flex; align-items:center; gap:11px; width:100%; min-height:44px; padding:0 11px;
    }
    .jarvis-shell-sidebar .nav-label {
        display:inline; width:auto; height:auto; color:#eef4f7; opacity:1; visibility:visible;
        font-size:14px; line-height:1.3; white-space:nowrap;
    }
    .jarvis-shell-sidebar .nav-icon {
        display:inline-flex; align-items:center; justify-content:center;
        width:24px; min-width:24px; color:#b9d5df; font-size:0;
    }
    .jarvis-shell-sidebar .nav-icon svg { width:20px; height:20px; }
    .jarvis-mobile-nav-extra { display:flex; }
    .jarvis-shell-account { flex:0 0 auto; margin-top:8px; padding-top:9px; padding-bottom:env(safe-area-inset-bottom); }
    .jarvis-shell-user { gap:10px; padding:6px 7px 9px; }
    .jarvis-shell-avatar { width:34px; height:34px; flex:0 0 34px; }
    .jarvis-shell-user-details { min-width:0; gap:2px; }
    .jarvis-shell-user-name { font-size:14px; white-space:normal; overflow:visible; }
    .jarvis-shell-user-role { font-size:11px; }
    .jarvis-shell-logout { height:36px; }

    .jarvis-page-shell { display:block; width:100%; max-width:100%; min-width:0; margin:0; padding:0; }
    .jarvis-page-workspace {
        width:100%; max-width:100%; min-width:0; margin:0;
        padding:20px 16px max(48px,calc(24px + env(safe-area-inset-bottom)));
    }
    .jarvis-page-main, .jarvis-shell-content, .admin-shell, .admin-main {
        width:100%; max-width:100%; min-width:0; margin-left:0; margin-right:0;
        padding-left:0; padding-right:0; grid-column:auto;
    }
    .admin-intro, .admin-section, .admin-card, .admin-feature-card, .admin-service-card,
    .knowledge-stat-card, .memory-stat-card, .users-summary-grid, .knowledge-stats-grid,
    .memory-stat-grid, .model-status-grid, .model-detail-grid {
        width:100%; max-width:100%; min-width:0; margin-left:0; margin-right:0;
    }
    .users-summary-grid, .knowledge-stats-grid, .memory-stat-grid, .model-status-grid,
    .model-detail-grid { grid-template-columns:minmax(0,1fr); }
    .admin-intro { gap:16px; }
    .admin-section-heading { min-width:0; gap:12px; }

    .admin-subnav {
        position:relative; display:flex; width:100%; max-width:100%; min-width:0;
        gap:6px; overflow-x:auto; overflow-y:hidden; padding-bottom:10px;
        white-space:nowrap; scroll-behavior:auto;
        mask-image:linear-gradient(to right,transparent 0,#000 14px,#000 calc(100% - 14px),transparent 100%);
        -webkit-mask-image:linear-gradient(to right,transparent 0,#000 14px,#000 calc(100% - 14px),transparent 100%);
    }
    .admin-subnav-item { flex:0 0 auto; min-height:44px; white-space:nowrap; }

    .chat, .chat-shell {
        width:100%; max-width:100%; min-width:0; margin:0; padding-left:16px; padding-right:16px;
    }
    .welcome {
        width:100%; max-width:760px; min-width:0; margin-left:auto; margin-right:auto;
        padding-left:0; padding-right:0; text-align:center;
    }
    .composer-area {
        left:0; right:0; bottom:0; width:100%; max-width:100%; min-width:0;
        margin:0; padding:16px 16px max(10px,env(safe-area-inset-bottom));
        transform:none; box-sizing:border-box;
    }
    .composer {
        display:flex; align-items:center; width:calc(100% - 0px); max-width:760px; min-width:0;
        margin-left:auto; margin-right:auto; padding:7px 8px 7px 14px; gap:6px; box-sizing:border-box;
    }
    .composer textarea { flex:1 1 0; width:0; min-width:0; max-width:none; font-size:16px; }
    .composer .mic-button, .composer .send-button {
        flex:0 0 44px; width:44px; min-width:44px; height:44px; min-height:44px;
    }
    .composer-area .hint { width:100%; margin:8px auto 0; padding:0; text-align:center; }

    .knowledge-table-wrap, .memory-table-wrap, .admin-table-wrap, .ingestion-issues-table-wrap {
        width:100%; max-width:100%; min-width:0; overflow-x:auto; overscroll-behavior-inline:contain;
    }
    .issues-filter-form { grid-template-columns:minmax(0,1fr); }
    .issues-filter-actions { flex-wrap:wrap; }

    .users-create-form { width:100%; max-width:100%; grid-template-columns:minmax(0,1fr); }
    .users-create-form .users-form-field, .users-create-button, .password-field-wrap { width:100%; max-width:100%; min-width:0; }
    .knowledge-table-wrap:has(.users-table) { overflow:visible; }
    .users-table, .users-table tbody, .users-table tr, .users-table td { display:block; width:100%; box-sizing:border-box; }
    .users-table thead { display:none; }
    .users-table { min-width:0; }
    .users-table tr {
        margin:0 0 14px; padding:14px; border:1px solid rgba(151,171,184,.2);
        border-radius:12px; background:rgba(15,23,34,.72);
    }
    .users-table td {
        display:grid; grid-template-columns:minmax(92px,34%) minmax(0,1fr);
        gap:12px; padding:9px 0; border:0; white-space:normal; word-break:normal;
    }
    .users-table td::before {
        content:attr(data-label); color:rgba(207,220,229,.65); font-size:11px;
        font-weight:700; letter-spacing:.06em; text-transform:uppercase;
    }
    .users-table .users-identity, .users-table .users-actions { min-width:0; flex-wrap:wrap; }
    .jarvis-users-toast { left:16px; right:16px; min-width:0; max-width:none; }

    .memory-add-form, .memory-category-field, .memory-add-controls, .memory-search-form {
        width:100%; max-width:100%; min-width:0; box-sizing:border-box;
    }
    .memory-add-controls { grid-template-columns:minmax(0,1fr); }
    .memory-search-form { flex-wrap:wrap; }
    .memory-add-button { min-height:44px; margin-bottom:max(16px,env(safe-area-inset-bottom)); }

    .admin-main .box-connector-card {
        display:block; width:100%; max-width:100%; min-width:0; padding:18px; box-sizing:border-box;
    }
    .admin-main .box-connector-header { display:flex; align-items:center; gap:16px; width:100%; min-width:0; }
    .admin-main .box-connector-body {
        display:block; width:100%; min-width:0; margin:16px 0 0; padding:0;
    }
    .admin-main .box-connector-status { margin:0 0 16px; }
    .admin-main .box-sync-form, .admin-main .box-folder-field, .admin-main .box-sync-controls {
        display:flex; flex-direction:column; width:100%; max-width:100%; min-width:0; margin:0;
    }
    .admin-main .box-sync-controls { gap:10px; }
    .admin-main .box-sync-form .box-folder-input,
    .admin-main .box-connector-card .users-form-field .box-sync-controls input {
        flex:0 0 auto; width:100%; max-width:100%; min-width:0; box-sizing:border-box;
    }
    .admin-main .box-sync-primary, .admin-main .box-sync-button {
        width:100%; max-width:100%; min-width:0;
    }
    .admin-main .box-sync-guidance { width:100%; margin-top:8px; }

    /* Targeted mobile Admin geometry and authenticated Agent status. */
    .mobile-brand-status {
        display:flex; align-items:center; justify-content:center; gap:7px;
        width:auto; max-width:100%; min-width:0;
    }
    .jarvis-agent-indicator { display:block; }

    .jarvis-page-main > *, .admin-section > *, .admin-intro > *,
    .admin-service-grid > *, .model-status-grid > *, .memory-stat-grid > * {
        min-width:0; max-width:100%; box-sizing:border-box;
    }
    .admin-intro {
        display:flex; flex-direction:column; align-items:stretch;
        width:100%; max-width:100%; min-width:0; gap:14px;
    }
    .admin-intro > div:first-child { width:100%; max-width:100%; min-width:0; }
    .admin-user-card, .model-active-badge, .memory-health-card {
        width:100%; max-width:100%; min-width:0; margin:0;
        align-self:stretch; box-sizing:border-box;
    }
    .admin-service-grid, .model-status-grid, .memory-stat-grid {
        display:grid; grid-template-columns:minmax(0,1fr);
        width:100%; max-width:100%; min-width:0; gap:14px;
    }
    .admin-service-card, .model-status-card, .memory-stat-card,
    .model-detail-panel, .memory-history-card {
        width:100%; max-width:100%; min-width:0; box-sizing:border-box;
    }
    .admin-service-card-top {
        display:flex; align-items:flex-start; justify-content:space-between;
        gap:12px; min-width:0;
    }
    .admin-service-card-top > * { min-width:0; }
    .admin-service-status { flex:0 0 auto; white-space:nowrap; }
    .admin-service-detail {
        display:grid; grid-template-columns:minmax(72px,auto) minmax(0,1fr);
        align-items:start; gap:8px 12px; width:100%; min-width:0;
    }
    .admin-service-detail strong {
        width:auto; max-width:100%; min-width:0; text-align:left;
        white-space:normal; word-break:normal; overflow-wrap:break-word;
    }
    .admin-main .box-sync-form .box-folder-input,
    .admin-main .box-connector-card .users-form-field .box-sync-controls input {
        font-size:16px!important;
    }

    /* Readable Create User labels at mobile widths. */
    .users-create-form .users-form-field {
        gap:8px;
    }
    .users-create-form .users-form-field > label {
        min-height:0; margin:0; color:rgba(238,244,247,.88);
        font-size:14px; line-height:1.35; font-weight:600; letter-spacing:.01em;
    }
    .users-create-form .users-password-help {
        margin-top:7px; color:rgba(226,236,241,.66);
        font-size:12px; line-height:1.45; letter-spacing:0;
    }
    .users-create-form .users-password-change-option {
        min-height:44px; gap:10px; margin-top:8px;
        color:rgba(238,244,247,.86); font-size:14px; line-height:1.35;
        font-weight:600; letter-spacing:.01em;
    }

    /* Integrations containment: internal tab scrolling never widens the document. */
    body.admin-body .jarvis-page-shell,
    body.admin-body .jarvis-page-workspace,
    body.admin-body .jarvis-page-main,
    body.admin-body .admin-section,
    body.admin-body .admin-section > *,
    body.admin-body .box-connector-card,
    body.admin-body .box-connector-header,
    body.admin-body .box-connector-body,
    body.admin-body .box-sync-form,
    body.admin-body .box-folder-field,
    body.admin-body .box-sync-controls {
        width:100%; max-width:100%; min-width:0; box-sizing:border-box;
    }
    body.admin-body .admin-subnav {
        contain:inline-size; overscroll-behavior-inline:contain;
        max-width:100%; min-width:0;
    }
    body.admin-body .admin-subnav-item { max-width:none; }
    body.admin-body #folder_id,
    body.admin-body #folder_id:focus,
    body.admin-body #folder_id:focus-visible {
        width:100%; max-width:100%; min-width:0; box-sizing:border-box;
        font-size:16px!important;
    }
    body.admin-body .box-sync-primary {
        max-width:100%; min-width:0; box-sizing:border-box;
    }
}

/* =========================================================
   JARVIS SHARED TYPOGRAPHY TOKENS
   ========================================================= */

:root {
    --jarvis-type-metadata-size: 0.6875rem; /* 11px */
    --jarvis-type-metadata-line-height: 1.3;
    --jarvis-type-metadata-weight: 800;
    --jarvis-type-metadata-tracking: 0.12em;
    --jarvis-type-metadata-color: rgba(232, 240, 244, 0.68);

    --jarvis-type-field-size: 0.75rem; /* 12px desktop */
    --jarvis-type-field-line-height: 1.35;
    --jarvis-type-field-weight: 700;
    --jarvis-type-field-tracking: 0.02em;
    --jarvis-type-field-color: rgba(232, 240, 244, 0.82);

    --jarvis-type-help-size: 0.75rem; /* 12px */
    --jarvis-type-help-line-height: 1.45;
    --jarvis-type-help-color: rgba(226, 236, 241, 0.66);

    --jarvis-type-caption-size: 0.6875rem; /* 11px */
    --jarvis-type-caption-line-height: 1.4;
    --jarvis-type-caption-weight: 600;
    --jarvis-type-caption-color: rgba(226, 236, 241, 0.58);
}


/*
 * Generic design-system classes are mobile-safe by default.
 * Future System and Web & Tools pages can use these directly.
 */

.jarvis-metadata-label {
    color: var(--jarvis-type-metadata-color);
    font-size: var(--jarvis-type-metadata-size);
    line-height: var(--jarvis-type-metadata-line-height);
    font-weight: var(--jarvis-type-metadata-weight);
    letter-spacing: var(--jarvis-type-metadata-tracking);
    text-transform: uppercase;
}

.jarvis-field-label {
    color: var(--jarvis-type-field-color);
    font-size: var(--jarvis-type-field-size);
    line-height: var(--jarvis-type-field-line-height);
    font-weight: var(--jarvis-type-field-weight);
    letter-spacing: var(--jarvis-type-field-tracking);
}

.jarvis-help-text {
    color: var(--jarvis-type-help-color);
    font-size: var(--jarvis-type-help-size);
    line-height: var(--jarvis-type-help-line-height);
    letter-spacing: 0;
}

.jarvis-table th {
    color: var(--jarvis-type-metadata-color);
    font-size: var(--jarvis-type-metadata-size);
    line-height: var(--jarvis-type-metadata-line-height);
    font-weight: var(--jarvis-type-metadata-weight);
    letter-spacing: var(--jarvis-type-metadata-tracking);
    text-transform: uppercase;
}

.jarvis-caption {
    color: var(--jarvis-type-caption-color);
    font-size: var(--jarvis-type-caption-size);
    line-height: var(--jarvis-type-caption-line-height);
    font-weight: var(--jarvis-type-caption-weight);
}

.jarvis-status-label {
    font-size: var(--jarvis-type-metadata-size);
    line-height: var(--jarvis-type-metadata-line-height);
    font-weight: var(--jarvis-type-metadata-weight);
    letter-spacing: var(--jarvis-type-metadata-tracking);
    text-transform: uppercase;
}


/*
 * Existing components are normalized only on desktop.
 * Existing mobile rules—including the 14px Users labels—remain untouched.
 */

@media (min-width: 801px) {

    /* Uppercase metadata and statistic labels */

    :is(
        .memory-stat-card,
        .knowledge-stat-card
    ) > span,
    :is(
        .model-card-label,
        .admin-user-label,
        .admin-live-indicator,
        .memory-importance,
        .admin-coming-soon,
        .admin-eyebrow
    ),
    .sources-title {
        color: var(--jarvis-type-metadata-color);
        font-size: var(--jarvis-type-metadata-size);
        line-height: var(--jarvis-type-metadata-line-height);
        font-weight: var(--jarvis-type-metadata-weight);
        letter-spacing: var(--jarvis-type-metadata-tracking);
        text-transform: uppercase;
    }


    /* Semantic statuses: typography only; preserve status colors */

    :is(
        .admin-status,
        .users-role,
        .issue-status
    ) {
        font-size: var(--jarvis-type-metadata-size);
        line-height: var(--jarvis-type-metadata-line-height);
        font-weight: var(--jarvis-type-metadata-weight);
        letter-spacing: var(--jarvis-type-metadata-tracking);
        text-transform: uppercase;
    }


    /* Form-field labels */

    :is(
        .users-form-field,
        .users-modal-field,
        .memory-category-field,
        .issues-filter-form
    ) > label,
    .box-sync-label {
        color: var(--jarvis-type-field-color);
        font-size: var(--jarvis-type-field-size);
        line-height: var(--jarvis-type-field-line-height);
        font-weight: var(--jarvis-type-field-weight);
        letter-spacing: var(--jarvis-type-field-tracking);
    }


    /* Helper and instruction text */

    :is(
        .users-password-help,
        .box-sync-guidance
    ),
    .composer-area .hint {
        color: var(--jarvis-type-help-color);
        font-size: var(--jarvis-type-help-size);
        line-height: var(--jarvis-type-help-line-height);
        letter-spacing: 0;
    }


    /* Table headings */

    :is(
        .knowledge-table,
        .users-table,
        .ingestion-issues-table
    ) th {
        color: var(--jarvis-type-metadata-color);
        font-size: var(--jarvis-type-metadata-size);
        line-height: var(--jarvis-type-metadata-line-height);
        font-weight: var(--jarvis-type-metadata-weight);
        letter-spacing: var(--jarvis-type-metadata-tracking);
        text-transform: uppercase;
    }


    /* Compact labels and captions */

    :is(
        .memory-card-footer,
        .knowledge-file-count
    ),
    :is(
        .admin-service-detail,
        .model-detail-item
    ) > span {
        color: var(--jarvis-type-caption-color);
        font-size: var(--jarvis-type-caption-size);
        line-height: var(--jarvis-type-caption-line-height);
        font-weight: var(--jarvis-type-caption-weight);
    }
}

/* =========================================================
   JARVIS INTEGRATION COMPONENTS
   ========================================================= */

.integration-section {
    width: 100%;
    min-width: 0;
}

.integration-page-heading {
    margin-bottom: 22px;
}

.integration-panels {
    display: grid;
    grid-template-columns:
        minmax(0, 1.05fr)
        minmax(320px, 0.95fr);
    gap: 18px;
    width: 100%;
    min-width: 0;
}

.integration-panel {
    min-width: 0;
    padding: 24px;
    border: 1px solid rgba(255,255,255,0.09);
    border-radius: 14px;
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,0.042),
            rgba(255,255,255,0.018)
        );
}

.integration-panel-header {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.integration-panel-header > div:not(.integration-connector-icon) {
    min-width: 0;
}

.integration-panel-header h2 {
    margin: 4px 0 0;
    font-size: 20px;
    line-height: 1.25;
}

.integration-connector-icon {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(32,199,244,0.28);
    border-radius: 12px;
    background: var(--jarvis-cyan-faint);
    color: var(--jarvis-cyan);
    box-shadow: var(--jarvis-glow);
}

.integration-connector-icon svg {
    width: 26px;
    height: 26px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.integration-health {
    margin-left: auto;
    flex: 0 0 auto;
    padding: 6px 9px;
    border-radius: 999px;
    font-size: var(--jarvis-type-metadata-size);
    line-height: var(--jarvis-type-metadata-line-height);
    font-weight: var(--jarvis-type-metadata-weight);
    letter-spacing: var(--jarvis-type-metadata-tracking);
    text-transform: uppercase;
}

.integration-health-healthy {
    color: #66de9b;
    background: rgba(65,205,126,0.12);
}

.integration-health-offline,
.integration-health-unknown {
    color: #ed9292;
    background: rgba(237,83,83,0.12);
}

.integration-detail-list {
    display: grid;
    gap: 0;
    margin: 24px 0 20px;
}

.integration-detail-list > div {
    display: grid;
    grid-template-columns: minmax(130px, 0.7fr) minmax(0, 1fr);
    gap: 18px;
    padding: 12px 0;
    border-top: 1px solid rgba(255,255,255,0.06);
}

.integration-detail-list dd {
    margin: 0;
    color: rgba(238,244,247,0.90);
    font-size: 14px;
    line-height: 1.45;
    text-align: right;
    overflow-wrap: anywhere;
}

.integration-action-form,
.integration-target-form {
    margin: 0;
}

.integration-primary-action {
    width: 100%;
    min-height: 44px;
    margin-top: 16px;
}

.integration-primary-action[disabled] {
    cursor: wait;
    opacity: 0.62;
}

.integration-panel-copy {
    margin: 18px 0 20px;
}

.integration-target-form.box-sync-form {
    display: block;
    margin: 0;
}

.integration-target-form .box-folder-input {
    width: 100% !important;
    max-width: none !important;
    min-height: 44px !important;
    box-sizing: border-box !important;
}

.integration-target-form .box-sync-guidance {
    display: block;
    width: 100%;
    margin-top: 8px;
}

.integration-running {
    margin: 0 0 12px;
    color: #e9c263;
}

.integration-feedback {
    margin-bottom: 18px;
    padding: 15px 17px;
    border: 1px solid rgba(255,255,255,0.09);
    border-radius: 11px;
    background: rgba(255,255,255,0.03);
}

.integration-feedback p {
    margin: 5px 0 0;
    color: rgba(238,244,247,0.82);
    font-size: 14px;
    line-height: 1.45;
}

.integration-feedback-success {
    border-color: rgba(65,205,126,0.28);
}

.integration-feedback-partial,
.integration-feedback-running {
    border-color: rgba(240,189,78,0.30);
}

.integration-feedback-failure {
    border-color: rgba(237,83,83,0.30);
}

.integration-result {
    margin-top: 18px;
}

.integration-result-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 14px 0 0;
}

.integration-result-grid > div {
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 9px;
    background: rgba(255,255,255,0.022);
}

.integration-result-grid dt,
.integration-result-grid dd {
    margin: 0;
}

.integration-result-grid dd {
    margin-top: 6px;
    color: rgba(238,244,247,0.92);
    font-size: 16px;
    font-weight: 700;
    overflow-wrap: anywhere;
}

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

    .integration-status-panel {
        order: 1;
    }

    .integration-target-panel {
        order: 2;
    }
}

@media (max-width: 800px) {
    .integration-panel {
        padding: 18px;
    }

    .integration-panel-header {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .integration-health {
        margin-left: 0;
    }

    .integration-detail-list > div {
        grid-template-columns: minmax(0, 1fr);
        gap: 5px;
    }

    .integration-detail-list dd {
        text-align: left;
    }

    .integration-primary-action {
        min-height: 48px;
    }

    .integration-target-form .box-folder-input {
        min-height: 48px !important;
        font-size: 16px !important;
    }

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

@media (max-width: 430px) {
    .integration-result-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Shared sidebar account refinement. */
.jarvis-shell-account .jarvis-shell-user-details {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.jarvis-shell-account .jarvis-shell-user-role {
    margin-top: 0;
}

.jarvis-shell-account .jarvis-shell-logout-form {
    margin: 20px 0 0;
}


/* GUI cleanup: desktop Stats slider and disabled future Projects item */
@media (min-width:801px) {
    .header-system {
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:7px;
    }
    .stats-toggle {
        width:auto;
        min-width:0;
        height:34px;
        padding:0 12px;
        gap:9px;
        border-radius:999px;
    }
    .stats-toggle .stats-mobile-icon {
        display:none;
    }
    .stats-toggle .stats-label,
    .stats-toggle .stats-switch,
    .stats-toggle .stats-state {
        display:inline-block;
    }
}
@media (max-width:800px) {
    .stats-toggle .stats-mobile-icon {
        display:block;
    }
}
.jarvis-shell-nav .nav-item.is-disabled {
    opacity:.42;
    cursor:not-allowed;
    user-select:none;
}
.nav-coming-soon {
    margin-left:auto;
    padding:.12rem .38rem;
    border:1px solid rgba(151,171,184,.28);
    border-radius:999px;
    font-size:.62rem;
    font-weight:700;
    letter-spacing:.05em;
    text-transform:uppercase;
}


/* Pinned and recent conversations */
.sidebar-new-chat {
    width:calc(100% - 1.5rem);
    min-height:42px;
    margin:.35rem .75rem .7rem;
    padding:.55rem .8rem;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.55rem;
    color:#d9f8ff;
    background:#101821;
    border:1px solid #18b9df;
    border-radius:.55rem;
    font:inherit;
    font-weight:700;
    cursor:pointer;
}

.sidebar-new-chat:hover {
    background:#14232d;
    border-color:#65dbf2;
}

.sidebar-new-chat span:first-child {
    color:#3ed7f5;
    font-size:1.35rem;
    line-height:1;
}

.conversation-sidebar {
    padding:0 .75rem .65rem;
}

.conversation-sidebar-group {
    margin:.7rem 0;
}

.conversation-sidebar-group h2 {
    margin:0 0 .35rem;
    color:#84939d;
    font-size:.67rem;
    font-weight:800;
    letter-spacing:.12em;
}

.sidebar-conversation-row {
    display:grid;
    grid-template-columns:minmax(0,1fr) 30px;
    align-items:center;
    gap:.2rem;
    border-radius:.45rem;
}

.sidebar-conversation-row:hover {
    background:rgba(44,190,220,.08);
}

.sidebar-conversation-open,
.sidebar-conversation-pin {
    border:0;
    color:#bac7cf;
    background:transparent;
    font:inherit;
    cursor:pointer;
}

.sidebar-conversation-open {
    min-width:0;
    padding:.48rem .4rem;
    overflow:hidden;
    text-align:left;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.sidebar-conversation-pin {
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    padding:0;
    opacity:.55;
}

.sidebar-conversation-pin:hover {
    color:#53d9f2;
    opacity:1;
}

.sidebar-conversation-pin svg {
    width:16px;
    height:16px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
}

/* Compact New Chat and conversation archive controls */
.jarvis-shell-nav .new-chat-primary {
    width:100%;
    min-height:40px;
    margin:0;
    padding:0 12px;
    appearance:none;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:12px;
    color:#929aa4;
    background:transparent;
    border:1px solid transparent;
    border-radius:8px;
    font-family:inherit;
    font-size:13px;
    font-weight:500;
    line-height:1.2;
    text-align:left;
    cursor:pointer;
}

.jarvis-shell-nav .new-chat-primary:hover {
    color:#e5e9ed;
    background:rgba(255,255,255,.045);
}

.jarvis-shell-nav .new-chat-primary.active {
    color:#eef9fc;
    background:
        linear-gradient(
            90deg,
            rgba(32,199,244,.10),
            rgba(255,255,255,.025)
        );
    border-color:rgba(32,199,244,.16);
}

.jarvis-shell-nav .new-chat-primary .nav-label {
    font-weight:500;
}

.sidebar-conversation-row {
    grid-template-columns:minmax(0,1fr) 30px 30px;
}

.sidebar-conversation-row.is-archived {
    grid-template-columns:minmax(0,1fr) 30px;
}

.sidebar-conversation-row.is-archived
.sidebar-conversation-open {
    color:#91a0aa;
}

.sidebar-conversation-open,
.sidebar-conversation-pin,
.sidebar-conversation-archive {
    border:0;
    background:transparent;
    font:inherit;
    cursor:pointer;
}

.sidebar-conversation-archive {
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    padding:0;
    color:#82929d;
    opacity:.58;
}

.sidebar-conversation-archive:hover {
    color:#53d9f2;
    opacity:1;
}

.sidebar-conversation-pin:focus-visible,
.sidebar-conversation-archive:focus-visible,
.sidebar-conversation-open:focus-visible,
.new-chat-primary:focus-visible {
    outline:2px solid #53d9f2;
    outline-offset:2px;
}

.sidebar-conversation-archive svg {
    width:16px;
    height:16px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.attachment-button {
    width:42px;
    height:42px;
    flex:0 0 42px;
    display:grid;
    place-items:center;
    padding:0;
    color:#82929d;
    background:transparent;
    border:1px solid transparent;
    border-radius:50%;
}

.attachment-button svg {
    width:21px;
    height:21px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
}

.attachment-button:disabled {
    cursor:not-allowed;
    opacity:.55;
}

@media (max-width:800px) {
    .conversation-sidebar {
        padding-bottom:1rem;
    }

    .sidebar-new-chat {
        min-height:44px;
    }
}


/* Speaker distinction and active composer controls */
.message.user .message-text {
    width:auto;
    max-width:min(78%, 760px);
    padding:.72rem .95rem;
    color:#e9faff;
    background:
        linear-gradient(
            135deg,
            rgba(20,112,145,.48),
            rgba(16,72,101,.58)
        );
    border:1px solid rgba(77,211,239,.28);
    border-radius:1rem 1rem .3rem 1rem;
    box-shadow:0 8px 24px rgba(0,0,0,.12);
}

.message.assistant .message-text {
    color:#e4e9ed;
}

.send-button:not(:disabled) {
    color:#061218;
    background:#50d6ef;
    border-color:#75e4f6;
    box-shadow:
        0 0 0 1px rgba(80,214,239,.12),
        0 5px 18px rgba(35,190,221,.22);
}

.send-button:not(:disabled):hover {
    background:#77e2f5;
    border-color:#a0edf9;
}

.send-button:disabled {
    color:#75858f;
    background:rgba(35,49,61,.62);
    border-color:rgba(117,139,153,.2);
    box-shadow:none;
}

.send-button.submitting {
    animation:
        jarvis-send-pulse
        1.4s ease-in-out infinite;
}

@keyframes jarvis-send-pulse {
    0%, 100% {
        box-shadow:
            0 0 0 0
            rgba(80,214,239,.08);
    }

    50% {
        box-shadow:
            0 0 0 6px
            rgba(80,214,239,.12);
    }
}

@media (max-width:800px) {
    .message.user .message-text {
        max-width:88%;
    }
}

@media (prefers-reduced-motion:reduce) {
    .send-button.submitting {
        animation:none;
    }
}


/* JARVIS GUI POLISH BATCH */
:root {
    --jarvis-sidebar-width:260px;
    --jarvis-sidebar-collapsed-width:72px;
}

@media (min-width:801px) {
    .jarvis-shell-sidebar {
        width:var(--jarvis-sidebar-width);
        min-width:var(--jarvis-sidebar-width);
        transition:
            width .18s ease,
            min-width .18s ease,
            padding .18s ease;
    }

    .jarvis-shell-content {
        margin-left:var(--jarvis-sidebar-width);
        transition:margin-left .18s ease;
    }

    body:has(.jarvis-shell-sidebar) .topbar,
    body:has(.jarvis-shell-sidebar) .admin-topbar {
        left:var(--jarvis-sidebar-width);
        width:calc(
            100% - var(--jarvis-sidebar-width)
        );
        transition:
            left .18s ease,
            width .18s ease;
    }

    .jarvis-shell-nav {
        flex:1 1 auto;
        min-height:0;
    }

    .conversation-sidebar {
        flex:1 1 auto;
        min-height:0;
        margin:.35rem 0 .55rem;
        padding:0 .35rem .55rem;
        overflow-x:hidden;
        overflow-y:auto;
        scrollbar-width:thin;
        scrollbar-color:
            rgba(99,132,150,.34)
            transparent;
    }

    .conversation-sidebar::-webkit-scrollbar {
        width:6px;
    }

    .conversation-sidebar::-webkit-scrollbar-thumb {
        background:rgba(99,132,150,.34);
        border-radius:999px;
    }

    .jarvis-sidebar-collapse {
        position:absolute;
        top:13px;
        right:-15px;
        z-index:4;
        width:30px;
        height:30px;
        display:grid;
        place-items:center;
        padding:0;
        color:#9fb0ba;
        background:#16212a;
        border:1px solid rgba(92,172,195,.28);
        border-radius:50%;
        box-shadow:0 5px 16px rgba(0,0,0,.28);
        cursor:pointer;
    }

    .jarvis-sidebar-collapse:hover {
        color:#73e0f3;
        border-color:rgba(80,214,239,.58);
        background:#1a2a34;
    }

    .jarvis-sidebar-collapse:focus-visible,
    .jarvis-sidebar-resizer:focus-visible {
        outline:3px solid rgba(112,219,234,.82);
        outline-offset:2px;
    }

    .jarvis-sidebar-collapse svg {
        width:16px;
        height:16px;
        fill:none;
        stroke:currentColor;
        stroke-width:2;
        stroke-linecap:round;
        stroke-linejoin:round;
        transition:transform .18s ease;
    }

    .jarvis-sidebar-resizer {
        position:absolute;
        top:0;
        right:-6px;
        bottom:0;
        z-index:3;
        width:12px;
        cursor:col-resize;
        touch-action:none;
    }

    .jarvis-sidebar-resizer::after {
        content:"";
        position:absolute;
        top:0;
        right:5px;
        bottom:0;
        width:2px;
        background:transparent;
        transition:
            background .15s ease,
            box-shadow .15s ease;
    }

    .jarvis-sidebar-resizer:hover::after,
    body.jarvis-sidebar-resizing
    .jarvis-sidebar-resizer::after {
        background:rgba(80,214,239,.72);
        box-shadow:0 0 9px rgba(80,214,239,.42);
    }

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

    body.jarvis-sidebar-collapsed
    .jarvis-shell-sidebar {
        width:var(--jarvis-sidebar-collapsed-width);
        min-width:var(--jarvis-sidebar-collapsed-width);
        padding-left:10px;
        padding-right:10px;
    }

    body.jarvis-sidebar-collapsed
    .jarvis-shell-content {
        margin-left:var(--jarvis-sidebar-collapsed-width);
    }

    body.jarvis-sidebar-collapsed:has(
        .jarvis-shell-sidebar
    ) .topbar,
    body.jarvis-sidebar-collapsed:has(
        .jarvis-shell-sidebar
    ) .admin-topbar {
        left:var(--jarvis-sidebar-collapsed-width);
        width:calc(
            100% - var(--jarvis-sidebar-collapsed-width)
        );
    }

    body.jarvis-sidebar-collapsed
    .jarvis-sidebar-collapse svg {
        transform:rotate(180deg);
    }

    body.jarvis-sidebar-collapsed
    .jarvis-sidebar-resizer {
        display:none;
    }

    body.jarvis-sidebar-collapsed
    .conversation-sidebar,
    body.jarvis-sidebar-collapsed
    .nav-label,
    body.jarvis-sidebar-collapsed
    .nav-coming-soon,
    body.jarvis-sidebar-collapsed
    .jarvis-shell-user-details {
        display:none!important;
    }

    body.jarvis-sidebar-collapsed
    .jarvis-shell-sidebar .nav-item,
    body.jarvis-sidebar-collapsed
    .jarvis-shell-logout,
    body.jarvis-sidebar-collapsed
    .jarvis-shell-user {
        justify-content:center;
        padding-left:0;
        padding-right:0;
    }

    body.jarvis-sidebar-collapsed
    .jarvis-shell-sidebar .nav-icon {
        width:22px;
        min-width:22px;
    }

    body.jarvis-sidebar-collapsed
    .jarvis-shell-account {
        padding-top:8px;
    }

    body.jarvis-sidebar-collapsed
    .jarvis-shell-user {
        padding:4px 0 7px;
    }
}

.jarvis-sidebar-collapse,
.jarvis-sidebar-resizer {
    display:none;
}

@media (min-width:801px) {
    .jarvis-sidebar-collapse {
        display:grid;
    }

    .jarvis-sidebar-resizer {
        display:block;
    }
}

.conversation-sidebar-group {
    margin:.8rem 0 1rem;
}

.conversation-sidebar-group h2 {
    margin:0 0 .45rem;
    line-height:1;
}

#pinned-conversations-group h2 {
    color:#d5ad64;
}

#recent-conversations-group h2 {
    color:#62bfd2;
}

#archived-conversations-group {
    margin-top:1.15rem;
    padding-top:.9rem;
    border-top:1px solid rgba(151,171,184,.14);
}

#archived-conversations-group h2 {
    color:#aa91cf;
}

.conversation-group-toggle {
    width:100%;
    min-height:28px;
    display:flex;
    align-items:center;
    gap:.45rem;
    padding:0 .25rem;
    color:inherit;
    background:transparent;
    border:0;
    border-radius:.35rem;
    font:inherit;
    font-weight:800;
    letter-spacing:.12em;
    text-align:left;
    cursor:pointer;
}

.conversation-group-toggle:hover {
    background:rgba(170,145,207,.08);
    color:#c5ace8;
}

.conversation-group-toggle:focus-visible {
    outline:2px solid #aa91cf;
    outline-offset:2px;
}

.conversation-group-toggle svg {
    width:14px;
    height:14px;
    margin-left:auto;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
    transition:transform .16s ease;
}

.conversation-group-toggle[aria-expanded="true"]
svg {
    transform:rotate(180deg);
}

.conversation-group-count {
    min-width:1.35rem;
    padding:.12rem .35rem;
    border:1px solid rgba(170,145,207,.22);
    border-radius:999px;
    color:#aa9aba;
    background:rgba(170,145,207,.07);
    font-size:.58rem;
    letter-spacing:0;
    text-align:center;
}

#recent-conversations-group
.sidebar-conversation-row:hover {
    background:rgba(50,177,207,.09);
}

#archived-conversations-group
.sidebar-conversation-row:hover {
    background:rgba(151,112,194,.10);
}

#pinned-conversations-group
.sidebar-conversation-pin {
    color:#c9a45e;
}

#archived-conversations-group
.sidebar-conversation-archive {
    color:#9f86c4;
}

#archived-conversations
.sidebar-conversation-open {
    padding-top:.4rem;
    padding-bottom:.4rem;
    color:#9ba8b1;
}

.jarvis-shell-nav
.new-chat-primary .nav-icon {
    color:#52cee7;
}

.attachment-button:disabled {
    color:#667782;
    background:rgba(75,91,103,.08);
    border-color:rgba(117,139,153,.10);
}

/* Reinforce speaker and Send colors on mobile. */
@media (max-width:800px) {
    body .message.user .message-text {
        width:auto;
        max-width:88%;
        color:#effcff;
        background:
            linear-gradient(
                135deg,
                rgba(17,126,163,.78),
                rgba(13,77,111,.88)
            );
        border-color:rgba(91,221,247,.44);
        border-radius:1rem 1rem .3rem 1rem;
        box-shadow:0 6px 20px rgba(0,0,0,.18);
    }

    body .send-button:not(:disabled) {
        color:#061218;
        background:#50d6ef;
        border-color:#8be8f7;
        box-shadow:0 4px 16px rgba(35,190,221,.28);
    }

    body .send-button:disabled {
        color:#71818b;
        background:rgba(35,49,61,.66);
        border-color:rgba(117,139,153,.20);
        box-shadow:none;
    }
}


/* JARVIS ACTIVE MODEL BADGE */
.jarvis-model-badge {
    color:#7f929e;
    font-size:.68rem;
    font-weight:650;
    letter-spacing:.025em;
    white-space:nowrap;
}

@media (min-width:801px) {
    .header-system .jarvis-model-badge {
        order:2;
        margin-top:-2px;
    }

    .header-system .stats-toggle {
        order:3;
    }
}

@media (max-width:800px) {
    .jarvis-model-badge {
        position:fixed;
        right:18px;
        bottom:
            calc(
                84px
                + env(safe-area-inset-bottom)
            );
        z-index:72;
        padding:.24rem .48rem;
        color:#91a5b0;
        background:rgba(13,20,27,.84);
        border:1px solid rgba(120,151,166,.16);
        border-radius:999px;
        backdrop-filter:blur(8px);
        pointer-events:none;
    }
}


/* JARVIS SIDEBAR OUTLINE ICONS */
.jarvis-shell-sidebar .nav-icon svg,
.conversation-heading-icon {
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.jarvis-shell-sidebar .nav-icon svg {
    width:19px;
    height:19px;
}

.conversation-section-title {
    display:flex;
    align-items:center;
    gap:.42rem;
}

.conversation-heading-icon {
    width:13px;
    height:13px;
    flex:0 0 13px;
}

.conversation-group-toggle
.conversation-heading-icon {
    width:13px;
    height:13px;
    flex:0 0 13px;
    margin-left:0;
}

.conversation-group-toggle
.conversation-group-chevron {
    width:14px;
    height:14px;
    margin-left:auto;
}

#pinned-conversations-group
.conversation-heading-icon {
    color:#d5ad64;
}

#recent-conversations-group
.conversation-heading-icon {
    color:#62bfd2;
}

#archived-conversations-group
.conversation-heading-icon {
    color:#aa91cf;
}


/* JARVIS CLEAN ACCOUNT PLACEMENT */
.sidebar-logout-form {
    margin:.35rem 0 0;
    padding-top:.5rem;
    border-top:1px solid rgba(151,171,184,.11);
}

.sidebar-logout-form .jarvis-shell-logout {
    color:#83919b;
}

.sidebar-logout-form
.jarvis-shell-logout:hover {
    color:#dce7ec;
    background:rgba(255,255,255,.04);
}

.jarvis-shell-account {
    margin-top:.55rem;
    padding-top:.6rem;
}

@media (min-width:801px) {
    body.jarvis-sidebar-collapsed
    .sidebar-logout-form {
        padding-top:.45rem;
    }
}


/* JARVIS GUI POLISH VISUAL CORRECTIONS */

/* The application header spans the complete viewport. */
@media (min-width:801px) {
    body:has(.jarvis-shell-sidebar) .topbar,
    body:has(.jarvis-shell-sidebar) .admin-topbar,
    body.jarvis-sidebar-collapsed:has(
        .jarvis-shell-sidebar
    ) .topbar,
    body.jarvis-sidebar-collapsed:has(
        .jarvis-shell-sidebar
    ) .admin-topbar {
        left:0;
        width:100%;
    }
}

/* Clearer primary navigation icons. */
.jarvis-shell-sidebar .nav-icon {
    color:#91a2ad;
}

.jarvis-shell-sidebar .nav-icon svg {
    width:21px;
    height:21px;
    stroke-width:1.8;
}

.jarvis-shell-sidebar
.nav-item:hover .nav-icon {
    color:#d9f5fb;
}

.jarvis-shell-sidebar
.nav-item.active .nav-icon {
    color:#62d9ef;
}

.jarvis-shell-nav
.new-chat-primary .nav-icon {
    color:#62d9ef;
}

/* Make conversation-section icons easy to recognize. */
.conversation-heading-icon,
.conversation-group-toggle
.conversation-heading-icon {
    width:16px;
    height:16px;
    flex:0 0 16px;
    stroke-width:1.9;
}

.conversation-section-title,
.conversation-group-toggle {
    gap:.52rem;
}

#pinned-conversations-group h2 {
    color:#dfb86e;
}

#recent-conversations-group h2 {
    color:#70cadc;
}

#archived-conversations-group h2 {
    color:#b79bdb;
}

/* Logout should read like a full navigation action. */
.sidebar-logout-form
.jarvis-shell-logout {
    width:100%;
    min-height:42px;
    height:42px;
    justify-content:flex-start;
    gap:12px;
    padding:0 12px;
    color:#9aa9b3;
    font-family:inherit;
    font-size:13px;
    font-weight:550;
    line-height:1.2;
}

.sidebar-logout-form
.jarvis-shell-logout .nav-icon {
    width:20px;
    min-width:20px;
}

.sidebar-logout-form
.jarvis-shell-logout:hover {
    color:#e3edf1;
    background:rgba(255,255,255,.05);
}

@media (min-width:801px) {
    body.jarvis-sidebar-collapsed
    .sidebar-logout-form
    .jarvis-shell-logout {
        justify-content:center;
        padding-left:0;
        padding-right:0;
    }
}


/* JARVIS SIDEBAR GEOMETRY AND STATS CORRECTION */
@media (min-width:801px) {
    .chat.jarvis-shell-content {
        width:calc(
            100vw - var(--jarvis-sidebar-width)
        );
        max-width:calc(
            100vw - var(--jarvis-sidebar-width)
        );
        margin-left:var(--jarvis-sidebar-width);
        box-sizing:border-box;
        overflow-x:hidden;
        transition:
            width .18s ease,
            max-width .18s ease,
            margin-left .18s ease;
    }

    .composer-area {
        left:var(--jarvis-sidebar-width);
        right:0;
        width:auto;
        max-width:none;
        box-sizing:border-box;
        transition:left .18s ease;
    }

    body.jarvis-sidebar-collapsed
    .chat.jarvis-shell-content {
        width:calc(
            100vw
            - var(--jarvis-sidebar-collapsed-width)
        );
        max-width:calc(
            100vw
            - var(--jarvis-sidebar-collapsed-width)
        );
        margin-left:
            var(--jarvis-sidebar-collapsed-width);
    }

    body.jarvis-sidebar-collapsed
    .composer-area {
        left:var(--jarvis-sidebar-collapsed-width);
    }

    .jarvis-sidebar-collapse {
        right:-18px;
        z-index:98;
        width:36px;
        height:36px;
        color:#bdeef7;
        background:#172832;
        border-color:rgba(80,214,239,.62);
        box-shadow:
            0 0 0 2px rgba(9,16,22,.82),
            0 5px 18px rgba(0,0,0,.36),
            0 0 12px rgba(48,193,222,.20);
    }

    .jarvis-sidebar-collapse svg {
        width:18px;
        height:18px;
    }

    .jarvis-sidebar-resizer {
        right:-8px;
        z-index:96;
        width:16px;
    }

    .jarvis-sidebar-resizer::after {
        right:7px;
        width:2px;
        background:rgba(111,155,174,.24);
    }

    .jarvis-sidebar-resizer::before {
        content:"";
        position:absolute;
        top:50%;
        right:3px;
        width:10px;
        height:58px;
        transform:translateY(-50%);
        border:1px solid rgba(91,190,214,.32);
        border-radius:999px;
        background:
            linear-gradient(
                90deg,
                rgba(21,34,43,.96),
                rgba(46,117,137,.52),
                rgba(21,34,43,.96)
            );
        box-shadow:
            0 5px 16px rgba(0,0,0,.24);
        opacity:.76;
        transition:
            opacity .15s ease,
            border-color .15s ease,
            box-shadow .15s ease;
    }

    .jarvis-sidebar-resizer:hover::before,
    body.jarvis-sidebar-resizing
    .jarvis-sidebar-resizer::before {
        opacity:1;
        border-color:rgba(80,214,239,.72);
        box-shadow:
            0 0 12px rgba(80,214,239,.28);
    }
}


/* JARVIS FINAL RESPONSIVE CHAT GEOMETRY */
@media (min-width:801px) {
    /*
       Keep Chat full-width and reserve sidebar space
       inside it. This prevents messages from remaining
       underneath the resized sidebar.
    */
    .chat.jarvis-shell-content {
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        padding-left:
            calc(
                var(--jarvis-sidebar-width)
                + 36px
            );
        padding-right:36px;
        box-sizing:border-box;
    }

    body.jarvis-sidebar-collapsed
    .chat.jarvis-shell-content {
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        padding-left:
            calc(
                var(--jarvis-sidebar-collapsed-width)
                + 36px
            );
        padding-right:36px;
    }

    /*
       Composer remains constrained to the workspace
       immediately to the right of the sidebar.
    */
    .composer-area {
        left:var(--jarvis-sidebar-width)!important;
        right:0!important;
        width:auto!important;
        margin-left:0!important;
    }

    body.jarvis-sidebar-collapsed
    .composer-area {
        left:
            var(--jarvis-sidebar-collapsed-width)
            !important;
    }

    /*
       Position the collapse control beside New Chat.
    */
    .jarvis-sidebar-collapse {
        top:24px;
        right:-18px;
    }
}


/* JARVIS CHAT HORIZONTAL CONTAINMENT */
@media (min-width:801px) {
    .chat.jarvis-shell-content {
        overflow-x:clip!important;
        overscroll-behavior-inline:none;
    }

    .chat .message,
    .chat .message-inner,
    .chat .message-text,
    .chat .sources,
    .chat .perf-box {
        min-width:0;
        max-width:100%;
        box-sizing:border-box;
    }

    .chat .message-inner {
        width:min(900px, 100%);
        margin-left:auto;
        margin-right:auto;
    }

    .chat .message-text,
    .chat .sources,
    .chat .source-link,
    .chat a {
        overflow-wrap:anywhere;
        word-break:normal;
    }
}


/* JARVIS AUTHORITATIVE CHAT WORKSPACE OFFSET */
@media (min-width:801px) {
    #chat.chat.jarvis-shell-content {
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        padding-left:
            calc(
                var(--jarvis-sidebar-width)
                + 36px
            )!important;
        padding-right:36px!important;
        box-sizing:border-box!important;
    }

    body.jarvis-sidebar-collapsed
    #chat.chat.jarvis-shell-content {
        padding-left:
            calc(
                var(--jarvis-sidebar-collapsed-width)
                + 36px
            )!important;
        padding-right:36px!important;
    }
}

/* JARVIS SHARED PAGE SIDEBAR GEOMETRY */
@media (min-width:801px) {
    .jarvis-page-workspace {
        box-sizing:border-box!important;
        width:calc(
            100vw - var(--jarvis-sidebar-width)
        )!important;
        max-width:calc(
            100vw - var(--jarvis-sidebar-width)
        )!important;
        min-width:0!important;
        margin-left:var(
            --jarvis-sidebar-width
        )!important;
        transition:
            width .18s ease,
            max-width .18s ease,
            margin-left .18s ease;
    }

    .jarvis-page-main {
        box-sizing:border-box!important;
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        margin-left:0!important;
        margin-right:0!important;
        overflow-x:hidden!important;
    }

    body.jarvis-sidebar-collapsed
    .jarvis-page-workspace {
        width:calc(
            100vw
            - var(--jarvis-sidebar-collapsed-width)
        )!important;
        max-width:calc(
            100vw
            - var(--jarvis-sidebar-collapsed-width)
        )!important;
        margin-left:var(
            --jarvis-sidebar-collapsed-width
        )!important;
    }

    .admin-subnav {
        display:flex!important;
        align-items:center!important;
        justify-content:flex-start!important;
        flex-wrap:wrap!important;
        box-sizing:border-box!important;
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
        gap:6px!important;
        margin-left:0!important;
        margin-right:0!important;
        overflow:visible!important;
    }

    .admin-subnav-item {
        flex:0 0 auto!important;
        white-space:nowrap!important;
    }
}

@media (max-width:800px) {
    .jarvis-page-workspace,
    .jarvis-page-main {
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
    }
}


/* JARVIS ASSISTANT IDENTITY ENLARGEMENT */
.assistant-identity {
    gap:11px!important;
    margin-bottom:13px!important;
}

.assistant-icon {
    width:35px!important;
    height:35px!important;
    flex:0 0 35px!important;
    filter:
        drop-shadow(
            0 0 6px
            rgba(66,194,230,.18)
        )!important;
}

.assistant-name {
    font-size:13px!important;
    font-weight:700!important;
    line-height:1.2!important;
    letter-spacing:1.35px!important;
    color:#c8d1da!important;
}

@media (max-width:800px) {
    .assistant-identity {
        gap:9px!important;
        margin-bottom:11px!important;
    }

    .assistant-icon {
        width:31px!important;
        height:31px!important;
        flex-basis:31px!important;
    }

    .assistant-name {
        font-size:12px!important;
        letter-spacing:1.2px!important;
    }
}


/* JARVIS ADMIN TYPOGRAPHY REFINEMENT */
.admin-intro h1,
.integration-page-heading h1 {
    font-size:30px!important;
    line-height:1.12!important;
    font-weight:700!important;
    letter-spacing:-.02em!important;
}

.admin-subnav-item {
    font-size:13px!important;
    line-height:1.2!important;
    font-weight:650!important;
}

@media (max-width:800px) {
    .admin-intro h1,
    .integration-page-heading h1 {
        font-size:26px!important;
        line-height:1.15!important;
    }

    .admin-subnav-item {
        font-size:12px!important;
    }
}


/* JARVIS USERS FILTER AND LAST-LOGIN REFINEMENT */
.users-content-filter-select {
    min-width:82px!important;
    width:auto!important;
    font-size:12px!important;
    font-weight:700!important;
    text-transform:uppercase;
}

.users-last-login {
    display:inline-block;
    color:rgba(214,225,232,.72);
    font-size:12px!important;
    line-height:1.3!important;
    font-weight:500!important;
    white-space:nowrap;
    letter-spacing:0;
}

@media (max-width:800px) {
    .users-last-login {
        white-space:normal;
    }

    .users-content-filter-select {
        min-height:40px!important;
        font-size:13px!important;
    }
}


/* JARVIS CENTERED ADMIN METRICS */
.knowledge-stat-card,
.memory-stat-card,
.model-status-card {
    min-height:92px!important;
    padding:15px 16px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    text-align:center!important;
    box-sizing:border-box!important;
}

.knowledge-stat-card > span,
.memory-stat-card > span,
.model-status-card .model-card-label {
    margin:0!important;
    font-size:10px!important;
    line-height:1.25!important;
    font-weight:800!important;
    letter-spacing:1.05px!important;
    text-align:center!important;
}

.knowledge-stat-card > strong,
.memory-stat-card > strong {
    margin:2px 0 0!important;
    font-size:25px!important;
    line-height:1.1!important;
    font-weight:650!important;
    text-align:center!important;
}

.knowledge-stat-card .users-role-label {
    font-size:18px!important;
    line-height:1.2!important;
}

.knowledge-stat-card .knowledge-green,
.knowledge-stat-card .knowledge-red,
.model-status-card .model-status-value {
    margin-top:2px!important;
    font-size:14px!important;
    line-height:1.2!important;
    text-align:center!important;
}

@media (max-width:800px) {
    .knowledge-stat-card,
    .memory-stat-card,
    .model-status-card {
        min-height:84px!important;
        padding:13px 14px!important;
    }

    .knowledge-stat-card > strong,
    .memory-stat-card > strong {
        font-size:23px!important;
    }
}


/* JARVIS NEW-CHAT-ONLY STATS VISIBILITY */
#stats-toggle[hidden],
.stats-toggle[hidden],
.perf-box[hidden] {
    display:none!important;
}


/* JARVIS UNIFIED ADMIN HEADER CARDS */
.admin-user-card,
.model-active-badge,
.memory-health-card {
    width:260px!important;
    min-width:260px!important;
    min-height:106px!important;
    padding:18px 20px!important;
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    gap:6px!important;
    box-sizing:border-box!important;
    border:1px solid rgba(99,136,224,.24)!important;
    border-radius:12px!important;
    background:
        linear-gradient(
            135deg,
            rgba(67,101,185,.12),
            rgba(255,255,255,.025)
        )!important;
}

.admin-user-card .admin-user-label,
.model-active-badge > span:first-child,
.memory-health-card > span:first-child {
    margin:0!important;
    color:#8296d0!important;
    font-size:9px!important;
    line-height:1.25!important;
    font-weight:900!important;
    letter-spacing:.16em!important;
}

.admin-user-card > strong,
.model-active-badge > strong,
.memory-health-card > strong {
    margin:2px 0 0!important;
    color:#f0f3f8!important;
    font-size:18px!important;
    line-height:1.2!important;
    font-weight:700!important;
}

.admin-user-card .admin-role {
    color:#8296d0!important;
    font-size:11px!important;
    line-height:1.2!important;
    letter-spacing:.1em!important;
}

.memory-health-card .admin-status {
    top:16px!important;
    right:16px!important;
}

@media (max-width:800px) {
    .admin-user-card,
    .model-active-badge,
    .memory-health-card {
        width:100%!important;
        min-width:0!important;
        min-height:96px!important;
    }
}


/* JARVIS ENLARGED NEW CHAT ACTION */
.jarvis-shell-nav .new-chat-primary {
    min-height:52px!important;
    padding:0 16px!important;
    gap:13px!important;
    border-radius:10px!important;
    font-size:15px!important;
    box-sizing:border-box!important;
}

.jarvis-shell-nav .new-chat-primary .nav-icon {
    width:21px!important;
    height:21px!important;
    flex:0 0 21px!important;
}

.jarvis-shell-nav .new-chat-primary .nav-icon svg {
    width:21px!important;
    height:21px!important;
}

.jarvis-shell-nav .new-chat-primary .nav-label {
    font-size:15px!important;
    line-height:1.2!important;
    font-weight:600!important;
}

@media (max-width:800px) {
    .jarvis-shell-nav .new-chat-primary {
        min-height:50px!important;
        padding:0 14px!important;
    }
}


/* JARVIS CONVERSATION ACTION MENU */
.sidebar-conversation-row,
.sidebar-conversation-row.is-archived {
    position:relative!important;
    grid-template-columns:minmax(0,1fr) 32px!important;
    overflow:visible!important;
}

.conversation-action-host {
    position:relative;
    width:32px;
    height:32px;
}

.conversation-action-trigger {
    width:32px;
    height:32px;
    padding:0;
    display:grid;
    place-items:center;
    border:0;
    border-radius:7px;
    color:#8a9aa5;
    background:transparent;
    font-family:Arial,sans-serif;
    font-size:22px;
    line-height:1;
    cursor:pointer;
    opacity:.72;
}

.conversation-action-trigger:hover,
.conversation-action-trigger[aria-expanded="true"] {
    color:#70dbea;
    background:rgba(32,199,244,.10);
    opacity:1;
}

.conversation-action-menu {
    position:absolute;
    top:calc(100% + 4px);
    right:0;
    z-index:160;
    width:196px;
    padding:6px;
    box-sizing:border-box;
    border:1px solid rgba(120,151,166,.24);
    border-radius:10px;
    background:#151e27;
    box-shadow:
        0 14px 34px rgba(0,0,0,.42),
        0 0 0 1px rgba(255,255,255,.02);
}

.sidebar-conversation-row.is-archived
.conversation-action-menu {
    top:auto;
    bottom:calc(100% + 4px);
}

.conversation-action-menu[hidden] {
    display:none!important;
}

.conversation-action-item {
    width:100%;
    min-height:36px;
    padding:0 10px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    border:0;
    border-radius:7px;
    color:#d5dee4;
    background:transparent;
    font:inherit;
    font-size:13px;
    text-align:left;
    cursor:pointer;
}

.conversation-action-item:hover:not(:disabled) {
    color:#f1f6f8;
    background:rgba(32,199,244,.10);
}

.conversation-action-item:focus-visible,
.conversation-action-trigger:focus-visible {
    outline:2px solid #53d9f2;
    outline-offset:2px;
}

.conversation-action-item small {
    color:#75858f;
    font-size:9px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.conversation-action-item:disabled {
    color:#71808a;
    cursor:not-allowed;
    opacity:.62;
}

.conversation-action-item.is-danger {
    color:#ff9b9b;
}

.conversation-action-item.is-danger:hover {
    color:#ffd0d0;
    background:rgba(207,65,65,.13);
}

.conversation-action-divider {
    height:1px;
    margin:5px 4px;
    background:rgba(151,171,184,.14);
}


/* JARVIS ANSWER MARKDOWN REFINEMENT */
.message-heading {
    margin:14px 0 7px;
    color:#e8edf2;
    font-weight:750;
    line-height:1.3;
}

.message-heading-1 {
    font-size:18px;
}

.message-heading-2 {
    font-size:16px;
}

.message-heading-3 {
    font-size:14px;
}

.message-bullet {
    margin:4px 0;
    padding-left:14px;
    text-indent:-14px;
}


/* JARVIS PROJECTS PAGE */
.projects-intro {
    align-items:center;
}

.projects-summary-card {
    width:260px;
    min-width:260px;
    min-height:106px;
    padding:18px 20px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:6px;
    box-sizing:border-box;
    border:1px solid rgba(99,136,224,.24);
    border-radius:12px;
    background:linear-gradient(
        135deg,
        rgba(67,101,185,.12),
        rgba(255,255,255,.025)
    );
}

.projects-summary-card > span {
    color:#8296d0;
    font-size:9px;
    font-weight:900;
    letter-spacing:.16em;
}

.projects-summary-card > strong {
    color:#f0f3f8;
    font-size:24px;
    line-height:1;
}

.projects-summary-card > small {
    color:#939ca7;
    font-size:11px;
}

.project-create-form {
    display:grid;
    grid-template-columns:
        minmax(180px,1fr)
        minmax(240px,2fr)
        86px
        auto;
    align-items:end;
    gap:14px;
}

.project-create-form label {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:7px;
    color:#aeb7c0;
    font-size:11px;
    font-weight:750;
    letter-spacing:.05em;
}

.project-create-form input[type="text"] {
    width:100%;
    min-width:0;
    height:44px;
    padding:0 12px;
    box-sizing:border-box;
    border:1px solid rgba(151,171,184,.25);
    border-radius:9px;
    color:#edf3f6;
    background:#151c24;
    font:inherit;
    font-size:14px;
    font-weight:500;
    letter-spacing:0;
}

.project-color-field input {
    width:100%;
    height:44px;
    padding:4px;
    border:1px solid rgba(151,171,184,.25);
    border-radius:9px;
    background:#151c24;
    cursor:pointer;
}

.project-primary-button,
.project-action-button {
    min-height:40px;
    padding:0 14px;
    border:1px solid rgba(66,194,230,.34);
    border-radius:8px;
    color:#e8f7fa;
    background:rgba(24,112,135,.18);
    font-size:12px;
    font-weight:750;
    cursor:pointer;
}

.project-primary-button {
    height:44px;
}

.project-primary-button:hover,
.project-action-button:hover:not(:disabled) {
    border-color:rgba(66,194,230,.62);
    background:rgba(24,112,135,.3);
}

.project-primary-button:disabled,
.project-action-button:disabled {
    opacity:.42;
    cursor:not-allowed;
}

.project-message {
    min-height:18px;
    margin-top:12px;
    color:#65dca1;
    font-size:12px;
}

.project-message.is-error {
    color:#ef8d94;
}

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

.project-card {
    position:relative;
    min-width:0;
    min-height:178px;
    display:flex;
    overflow:hidden;
    border:1px solid rgba(151,171,184,.2);
    border-radius:12px;
    background:rgba(255,255,255,.025);
}

.project-card-color {
    width:5px;
    flex:0 0 5px;
    background:var(
        --project-color,
        #42c2e6
    );
}

.project-card-content {
    min-width:0;
    flex:1;
    padding:18px;
    display:flex;
    flex-direction:column;
}

.project-card-heading {
    min-width:0;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.project-card-title {
    min-width:0;
    margin:0;
    color:#eef3f6;
    font-size:17px;
    line-height:1.3;
    overflow-wrap:anywhere;
}

.project-conversation-count {
    flex:0 0 auto;
    color:#8794a0;
    font-size:10px;
    white-space:nowrap;
}

.project-card-description {
    min-width:0;
    margin:12px 0 18px;
    color:#9ea8b1;
    font-size:13px;
    line-height:1.5;
    overflow-wrap:anywhere;
}

.project-card-actions {
    margin-top:auto;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.project-action-button.is-danger {
    margin-left:auto;
    border-color:rgba(224,101,111,.3);
    color:#efa0a7;
    background:rgba(126,37,45,.12);
}

.projects-empty {
    min-height:150px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:7px;
    border:1px dashed rgba(151,171,184,.23);
    border-radius:12px;
    color:#8e99a3;
    text-align:center;
}

.projects-empty[hidden] {
    display:none;
}

.projects-empty strong {
    color:#dfe7eb;
    font-size:15px;
}

.projects-nav-item {
    margin-top:5px;
}

.files-nav-item {
    margin-bottom:8px;
}

@media (max-width:1100px) {
    .projects-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .project-create-form {
        grid-template-columns:
            minmax(0,1fr)
            minmax(0,1fr);
    }
}

@media (max-width:800px) {
    .projects-summary-card {
        width:100%;
        min-width:0;
    }

    .projects-grid,
    .project-create-form {
        grid-template-columns:
            minmax(0,1fr);
    }

    .project-primary-button {
        width:100%;
    }

    .project-card-actions {
        gap:7px;
    }

    .project-action-button {
        flex:1 1 auto;
    }

    .project-action-button.is-danger {
        margin-left:0;
    }
}


/* JARVIS COMPACT PROJECT LIST */
.projects-grid {
    display:flex!important;
    flex-direction:column!important;
    gap:9px!important;
}

.project-card {
    min-height:82px!important;
    width:100%!important;
}

.project-card-content {
    display:grid!important;
    grid-template-columns:
        minmax(210px,.8fr)
        minmax(260px,1.5fr)
        auto!important;
    align-items:center!important;
    gap:18px!important;
    padding:13px 16px!important;
}

.project-card-heading {
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    gap:5px!important;
}

.project-card-title {
    font-size:15px!important;
}

.project-conversation-count {
    font-size:10px!important;
}

.project-card-description {
    margin:0!important;
    font-size:12px!important;
}

.project-card-actions {
    margin:0!important;
    flex-wrap:nowrap!important;
    justify-content:flex-end!important;
}

.project-action-button {
    min-height:36px!important;
    padding:0 12px!important;
}

.project-action-button.is-danger {
    margin-left:0!important;
}

.project-move-dialog {
    width:min(440px,calc(100vw - 32px));
    padding:0;
    border:1px solid rgba(99,136,224,.32);
    border-radius:13px;
    color:#eaf0f4;
    background:#171e27;
    box-shadow:0 22px 70px rgba(0,0,0,.58);
}

.project-move-dialog::backdrop {
    background:rgba(3,7,11,.72);
    backdrop-filter:blur(3px);
}

.project-move-form {
    padding:22px;
    display:flex;
    flex-direction:column;
    gap:16px;
}

.project-move-form h2 {
    margin:0;
    font-size:20px;
}

.project-move-form p {
    margin:0;
    color:#9faab3;
    font-size:13px;
    line-height:1.5;
}

.project-move-form label {
    display:flex;
    flex-direction:column;
    gap:7px;
    color:#b3bec6;
    font-size:11px;
    font-weight:750;
    letter-spacing:.05em;
}

.project-move-form select {
    width:100%;
    height:44px;
    padding:0 11px;
    border:1px solid rgba(151,171,184,.3);
    border-radius:9px;
    color:#edf4f7;
    background:#111820;
    font-size:14px;
}

.project-move-actions {
    display:flex;
    justify-content:flex-end;
    gap:9px;
    margin-top:3px;
}

.project-move-cancel,
.project-move-save {
    min-height:40px;
    padding:0 14px;
    border-radius:8px;
    font-size:12px;
    font-weight:750;
    cursor:pointer;
}

.project-move-cancel {
    border:1px solid rgba(151,171,184,.25);
    color:#bec9cf;
    background:transparent;
}

.project-move-save {
    border:1px solid rgba(66,194,230,.45);
    color:#e8faff;
    background:rgba(25,126,151,.28);
}

@media (max-width:800px) {
    .project-card {
        min-height:0!important;
    }

    .project-card-content {
        grid-template-columns:
            minmax(0,1fr)!important;
        gap:10px!important;
    }

    .project-card-heading {
        flex-direction:row!important;
        align-items:flex-start!important;
        justify-content:space-between!important;
    }

    .project-card-actions {
        justify-content:stretch!important;
        flex-wrap:wrap!important;
    }

    .project-action-button {
        flex:1 1 auto!important;
    }

    .project-move-actions {
        flex-direction:column-reverse;
    }

    .project-move-cancel,
    .project-move-save {
        width:100%;
    }
}


/* JARVIS PROJECT DETAIL PAGE */
.project-detail-header {
    margin-bottom:34px;
}

.project-back-link {
    display:inline-flex;
    margin-bottom:24px;
    color:#6fcfe4;
    font-size:12px;
    font-weight:700;
    text-decoration:none;
}

.project-back-link:hover {
    color:#b4eff8;
}

.project-detail-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
}

.project-detail-heading h1 {
    margin:8px 0 9px;
    color:#f0f3f8;
    font-size:30px;
    line-height:1.15;
}

.project-detail-heading p {
    margin:0;
    color:#9da7b0;
    font-size:14px;
}

.project-detail-count {
    width:220px;
    min-width:220px;
    min-height:96px;
    padding:17px 19px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:7px;
    box-sizing:border-box;
    border:1px solid rgba(99,136,224,.24);
    border-radius:12px;
    background:linear-gradient(
        135deg,
        rgba(67,101,185,.12),
        rgba(255,255,255,.025)
    );
}

.project-detail-count span {
    color:#8296d0;
    font-size:9px;
    font-weight:900;
    letter-spacing:.16em;
}

.project-detail-count strong {
    color:#f0f3f8;
    font-size:24px;
    line-height:1;
}

.project-conversation-list {
    display:flex;
    flex-direction:column;
    gap:8px;
}

.project-conversation-row {
    min-height:68px;
    padding:11px 14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    box-sizing:border-box;
    border:1px solid rgba(151,171,184,.18);
    border-radius:10px;
    background:rgba(255,255,255,.022);
}

.project-conversation-information {
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:5px;
}

.project-conversation-information h3 {
    margin:0;
    color:#e6edf1;
    font-size:14px;
    line-height:1.35;
    overflow-wrap:anywhere;
}

.project-conversation-information span {
    color:#87939d;
    font-size:10px;
}

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

@media (max-width:800px) {
    .project-detail-heading {
        flex-direction:column;
        align-items:stretch;
    }

    .project-detail-count {
        width:100%;
        min-width:0;
    }

    .project-conversation-row {
        align-items:stretch;
        flex-direction:column;
    }

    .project-conversation-actions {
        width:100%;
    }

    .project-conversation-actions
    .project-action-button {
        flex:1 1 0;
    }
}


/* JARVIS PROJECT LIST MOVE CONTROL */
.project-conversation-move-host {
    position:relative;
    display:flex;
    align-items:center;
}

.project-conversation-move-select {
    min-width:190px;
    min-height:40px;
    padding:8px 34px 8px 12px;
    border:1px solid rgba(66,194,230,.42);
    border-radius:9px;
    color:#eef5f8;
    background:#15212a;
    font:inherit;
    font-size:13px;
    font-weight:700;
    cursor:pointer;
}

.project-conversation-move-select:focus {
    outline:2px solid rgba(66,194,230,.3);
    outline-offset:2px;
}

.project-conversation-move-select[hidden],
.project-action-button[hidden] {
    display:none!important;
}

@media (max-width:700px) {
    .project-conversation-actions {
        flex-wrap:wrap;
    }

    .project-conversation-move-host,
    .project-conversation-move-select {
        width:100%;
    }
}


/* JARVIS EXPANDABLE PROJECT TREE */
.sidebar-projects-section {
    display:flex;
    flex-direction:column;
    min-width:0;
}

.sidebar-projects-heading {
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1fr) 36px;
    align-items:center;
}

.sidebar-projects-heading .projects-nav-item {
    grid-column:1 / -1;
    padding-right:48px!important;
}

.sidebar-create-project {
    position:absolute;
    right:7px;
    top:50%;
    width:30px;
    height:30px;
    padding:0;
    display:grid;
    place-items:center;
    transform:translateY(-50%);
    border:1px solid transparent;
    border-radius:7px;
    color:#8fa4af;
    background:transparent;
    font-size:22px;
    line-height:1;
    cursor:pointer;
}

.sidebar-create-project:hover,
.sidebar-create-project:focus-visible {
    color:#55d9f2;
    border-color:rgba(66,194,230,.3);
    background:rgba(66,194,230,.08);
}

.sidebar-project-tree {
    display:flex;
    flex-direction:column;
    gap:2px;
    padding:3px 7px 7px 15px;
}

.sidebar-project-tree:empty {
    display:none;
}

.sidebar-project-item {
    min-width:0;
    border-left:2px solid transparent;
}

.sidebar-project-item.is-active-project {
    border-left-color:var(
        --project-color,
        #42c2e6
    );
}

.sidebar-project-heading {
    display:grid;
    grid-template-columns:minmax(0,1fr) 30px;
    align-items:center;
    min-width:0;
}

.sidebar-project-toggle {
    min-width:0;
    min-height:36px;
    padding:5px 4px 5px 5px;
    display:grid;
    grid-template-columns:14px 9px minmax(0,1fr) auto;
    align-items:center;
    gap:6px;
    border:0;
    border-radius:7px;
    color:#aebcc5;
    background:transparent;
    text-align:left;
    cursor:pointer;
}

.sidebar-project-toggle:hover,
.sidebar-project-toggle:focus-visible {
    color:#edf4f7;
    background:rgba(255,255,255,.045);
}

.sidebar-project-chevron {
    display:inline-block;
    color:#71838d;
    font-size:17px;
    line-height:1;
    transform-origin:center;
    transition:transform .15s ease;
}

.sidebar-project-toggle[
    aria-expanded="true"
] .sidebar-project-chevron {
    transform:rotate(90deg);
}

.sidebar-project-color {
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(
        --project-color,
        #42c2e6
    );
    box-shadow:0 0 8px
        color-mix(
            in srgb,
            var(--project-color, #42c2e6) 55%,
            transparent
        );
}

.sidebar-project-name {
    overflow:hidden;
    color:inherit;
    font-size:13px;
    font-weight:700;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.sidebar-project-count {
    min-width:20px;
    padding:1px 5px;
    border:1px solid rgba(132,151,163,.17);
    border-radius:999px;
    color:#758690;
    font-size:10px;
    text-align:center;
}

.sidebar-project-manage {
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:7px;
    color:#7e909a;
    font-family:Arial,sans-serif;
    font-size:18px;
    line-height:1;
    text-decoration:none;
}

.sidebar-project-manage:hover,
.sidebar-project-manage:focus-visible {
    color:#e8f3f6;
    background:rgba(255,255,255,.055);
}

.sidebar-project-conversations {
    padding:1px 0 5px 15px;
}

.sidebar-project-conversations[hidden] {
    display:none!important;
}

.sidebar-project-conversations
.sidebar-conversation-row {
    min-height:34px!important;
}

.sidebar-project-conversations
.sidebar-conversation-open {
    font-size:12.5px!important;
}

.sidebar-project-empty {
    display:block;
    padding:5px 8px 7px;
    color:#63747e;
    font-size:11px;
    font-style:italic;
}

@media (max-width:700px) {
    .sidebar-project-tree {
        padding-left:12px;
    }

    .sidebar-project-conversations {
        padding-left:11px;
    }
}


/* JARVIS SIDEBAR SHARED SCROLL REPAIR */
.jarvis-shell-nav {
    min-height:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:
        rgba(99,132,150,.34)
        transparent;
}

.jarvis-shell-nav::-webkit-scrollbar {
    width:6px;
}

.jarvis-shell-nav::-webkit-scrollbar-track {
    background:transparent;
}

.jarvis-shell-nav::-webkit-scrollbar-thumb {
    border-radius:999px;
    background:rgba(99,132,150,.34);
}

.jarvis-shell-nav::-webkit-scrollbar-thumb:hover {
    background:rgba(99,132,150,.52);
}

/*
The whole navigation now scrolls. The conversation area must
therefore grow naturally instead of creating a second scrollbar.
*/
.jarvis-shell-nav .conversation-sidebar {
    flex:0 0 auto!important;
    min-height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    margin:.35rem 0 .55rem!important;
    padding:0 .35rem .55rem!important;
}

.jarvis-shell-nav
.conversation-sidebar::-webkit-scrollbar {
    display:none!important;
}

.jarvis-shell-nav .sidebar-projects-section {
    flex:0 0 auto!important;
    min-height:auto!important;
    overflow:visible!important;
}

.jarvis-shell-nav .sidebar-project-tree {
    flex:0 0 auto!important;
    min-height:auto!important;
    overflow:visible!important;
}

/*
Files now begins the lower tools section directly above Knowledge.
*/
.jarvis-shell-nav .files-nav-item {
    flex:0 0 auto!important;
    margin-top:8px!important;
    margin-bottom:2px!important;
    border-top:1px solid rgba(124,147,160,.13);
    padding-top:12px!important;
}

/*
Menus remain above nearby rows but inside the shared scrolling
navigation area.
*/
.jarvis-shell-nav .conversation-action-host {
    z-index:10;
}

.jarvis-shell-nav
.conversation-action-trigger[
    aria-expanded="true"
] {
    position:relative;
    z-index:171;
}

.jarvis-shell-nav .conversation-action-menu {
    z-index:170!important;
}

/*
The account panel is outside the scrolling navigation and remains
visible at the bottom.
*/
.jarvis-shell-account {
    flex:0 0 auto!important;
    position:relative;
    z-index:5;
    background:
        linear-gradient(
            180deg,
            rgba(13,20,27,.97),
            #0d141b
        );
}

@media (max-width:800px) {
    .jarvis-shell-nav {
        overflow-y:auto!important;
        -webkit-overflow-scrolling:touch;
    }

    .jarvis-shell-nav
    .conversation-sidebar {
        overflow:visible!important;
        padding-bottom:.55rem!important;
    }
}


/* JARVIS MASTER PROJECT TREE TOGGLE */
.sidebar-projects-heading
.projects-nav-item {
    padding-right:82px!important;
}

.sidebar-project-tree-toggle {
    position:absolute;
    right:40px;
    top:50%;
    z-index:2;
    width:28px;
    height:30px;
    padding:0;
    display:grid;
    place-items:center;
    transform:translateY(-50%);
    border:1px solid transparent;
    border-radius:7px;
    color:#8fa4af;
    background:transparent;
    font:inherit;
    font-size:17px;
    line-height:1;
    cursor:pointer;
}

.sidebar-project-tree-toggle:hover,
.sidebar-project-tree-toggle:focus-visible {
    color:#55d9f2;
    border-color:rgba(66,194,230,.3);
    background:rgba(66,194,230,.08);
}

.sidebar-project-tree-toggle span {
    display:block;
    line-height:1;
}

.sidebar-project-tree[hidden] {
    display:none!important;
}


/* JARVIS MATCHING TREE HEADINGS */
.sidebar-projects-heading {
    position:relative!important;
    display:block!important;
}

.sidebar-section-toggle {
    width:100%;
    min-height:40px;
    padding:7px 42px 7px 10px;
    display:grid;
    grid-template-columns:
        14px
        19px
        max-content
        auto;
    align-items:center;
    justify-content:start;
    gap:8px;
    box-sizing:border-box;
    border:0;
    border-radius:8px;
    color:#9eabb4;
    background:transparent;
    font:inherit;
    text-align:left;
    cursor:pointer;
}

.sidebar-section-toggle:hover,
.sidebar-section-toggle:focus-visible {
    color:#e7f2f5;
    background:rgba(255,255,255,.045);
}

.sidebar-section-toggle.active {
    color:#eef6f8;
    background:
        linear-gradient(
            90deg,
            rgba(66,194,230,.10),
            rgba(66,194,230,.035)
        );
}

.sidebar-section-chevron {
    width:14px;
    display:grid;
    place-items:center;
    color:#7f929d;
    font-size:17px;
    font-weight:500;
    line-height:1;
}

.sidebar-section-icon {
    width:18px;
    height:18px;
    display:grid;
    place-items:center;
    color:currentColor;
}

.sidebar-section-icon svg {
    width:18px;
    height:18px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.sidebar-section-label {
    color:inherit;
    font-size:11px;
    line-height:1;
    font-weight:800;
    letter-spacing:.13em;
}

.sidebar-section-toggle
.conversation-group-count {
    justify-self:start;
    margin-left:1px;
}

.sidebar-create-project {
    right:8px!important;
    top:50%!important;
    z-index:4!important;
}

#archived-conversations-group h2 {
    margin:0 0 .35rem!important;
}

#archived-conversations-toggle {
    padding-right:10px;
    color:#b495d2;
}

#archived-conversations-toggle:hover,
#archived-conversations-toggle:focus-visible {
    color:#d4b9ed;
}

.sidebar-project-tree {
    padding-top:2px!important;
}

.sidebar-manage-projects {
    min-height:34px;
    margin:5px 7px 2px 22px;
    padding:0 10px;
    display:flex;
    align-items:center;
    border-top:1px solid rgba(126,150,163,.13);
    color:#7f929d;
    font-size:12px;
    font-weight:650;
    text-decoration:none;
}

.sidebar-manage-projects:hover,
.sidebar-manage-projects:focus-visible {
    color:#56d6ef;
}

/*
Disable obsolete positioning from the earlier separate
master-toggle design.
*/
.sidebar-project-tree-toggle {
    position:static!important;
    width:100%!important;
    height:auto!important;
    transform:none!important;
}


/* JARVIS CLEAN MATCHING SECTION HEADINGS */

/*
The old heading plus button is no longer used.
*/
.sidebar-create-project {
    display:none!important;
}

/*
Projects sits outside conversation-sidebar while Archived sits
inside it. This matching margin places both headings on the same
vertical line.
*/
.sidebar-projects-heading {
    margin-left:.35rem!important;
    margin-right:.35rem!important;
}

#archived-conversations-group h2 {
    margin-left:0!important;
    margin-right:0!important;
}

/*
Both headings now use the exact same column measurements:
chevron, icon, label, and count.
*/
.sidebar-section-toggle,
.sidebar-projects-toggle,
#archived-conversations-toggle {
    width:100%!important;
    min-height:40px!important;
    padding:7px 10px!important;
    display:grid!important;
    grid-template-columns:
        14px
        19px
        96px
        30px!important;
    align-items:center!important;
    justify-content:start!important;
    column-gap:8px!important;
    box-sizing:border-box!important;
    border-radius:8px!important;
}

.sidebar-section-toggle
.sidebar-section-chevron {
    grid-column:1;
    width:14px!important;
    justify-self:center;
}

.sidebar-section-toggle
.sidebar-section-icon {
    grid-column:2;
    width:19px!important;
    height:19px!important;
    justify-self:center;
}

.sidebar-section-toggle
.sidebar-section-icon svg {
    width:19px!important;
    height:19px!important;
}

.sidebar-section-toggle
.sidebar-section-label {
    grid-column:3;
    width:96px;
    justify-self:start;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.sidebar-section-toggle
.conversation-group-count {
    grid-column:4;
    width:auto;
    min-width:24px;
    margin:0!important;
    justify-self:start!important;
}

/*
The Projects heading is no longer reserving space for the plus
button.
*/
.sidebar-projects-heading
.projects-nav-item,
.sidebar-projects-heading
.sidebar-projects-toggle {
    padding-right:10px!important;
}

/*
Keep the selected state subtle.
*/
.sidebar-projects-toggle.active {
    box-shadow:
        inset 2px 0 0 rgba(66,194,230,.65);
    background:
        linear-gradient(
            90deg,
            rgba(66,194,230,.075),
            rgba(66,194,230,.018)
        )!important;
}

/*
New Project now lives inside the expanded tree.
*/
.sidebar-new-project-action {
    width:calc(100% - 14px);
    min-height:34px;
    margin:3px 7px 5px 7px;
    padding:5px 10px 5px 24px;
    display:flex;
    align-items:center;
    gap:8px;
    box-sizing:border-box;
    border:0;
    border-radius:7px;
    color:#72cfe1;
    background:transparent;
    font:inherit;
    font-size:12.5px;
    font-weight:700;
    text-align:left;
    cursor:pointer;
}

.sidebar-new-project-action:hover,
.sidebar-new-project-action:focus-visible {
    color:#75e5f6;
    background:rgba(66,194,230,.075);
}

.sidebar-new-project-action:disabled {
    cursor:wait;
    opacity:.55;
}

.sidebar-new-project-action
span:first-child {
    width:14px;
    color:#55d9f2;
    font-size:17px;
    line-height:1;
    text-align:center;
}

/*
The Manage Projects action uses the same indentation.
*/
.sidebar-manage-projects {
    margin-left:31px!important;
}

/*
Remove any leftover right-side toggle positioning from earlier
versions.
*/
.sidebar-project-tree-toggle {
    right:auto!important;
    top:auto!important;
}


/* JARVIS CLEAN SECTION CHEVRONS */
.sidebar-section-chevron {
    width:14px!important;
    height:14px!important;
    display:grid!important;
    place-items:center!important;
    color:transparent!important;
    font-size:0!important;
}

.sidebar-section-chevron::before {
    content:"";
    width:6px;
    height:6px;
    display:block;
    box-sizing:border-box;
    border-right:1.5px solid #879aa5;
    border-bottom:1.5px solid #879aa5;
    transform:rotate(-45deg);
    transform-origin:center;
    transition:
        transform .16s ease,
        border-color .16s ease;
}

/*
Rotate the same shape downward when the section is expanded.
*/
.sidebar-section-toggle[
    aria-expanded="true"
] .sidebar-section-chevron::before {
    transform:rotate(45deg);
}

/*
Brighten it slightly when hovering over the complete heading.
*/
.sidebar-section-toggle:hover
.sidebar-section-chevron::before,
.sidebar-section-toggle:focus-visible
.sidebar-section-chevron::before {
    border-color:#c4d3da;
}

/*
Projects uses cyan while selected. Archived keeps its purple tone.
*/
.sidebar-projects-toggle.active
.sidebar-section-chevron::before {
    border-color:#63d6eb;
}

#archived-conversations-toggle
.sidebar-section-chevron::before {
    border-color:#a98bc7;
}

#archived-conversations-toggle:hover
.sidebar-section-chevron::before,
#archived-conversations-toggle:focus-visible
.sidebar-section-chevron::before {
    border-color:#d2b5ea;
}


/* JARVIS PROJECT ACTION ROW */
.sidebar-project-actions {
    width:calc(100% - 14px);
    min-width:0;
    margin:4px 7px 7px;
    padding-bottom:6px;
    display:grid;
    grid-template-columns:
        minmax(0,1fr)
        minmax(0,1fr);
    align-items:center;
    gap:5px;
    box-sizing:border-box;
    border-bottom:
        1px solid rgba(126,150,163,.11);
}

.sidebar-project-actions
.sidebar-new-project-action,
.sidebar-manage-projects-action {
    width:100%;
    min-width:0;
    min-height:32px;
    margin:0!important;
    padding:5px 7px!important;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    box-sizing:border-box;
    border:1px solid transparent;
    border-radius:7px;
    background:transparent;
    font:inherit;
    font-size:11px;
    font-weight:700;
    line-height:1.15;
    text-align:center;
    text-decoration:none;
    white-space:nowrap;
}

.sidebar-project-actions
.sidebar-new-project-action {
    color:#63d8ed;
    cursor:pointer;
}

.sidebar-project-actions
.sidebar-new-project-action:hover,
.sidebar-project-actions
.sidebar-new-project-action:focus-visible {
    color:#84eafb;
    border-color:rgba(66,194,230,.22);
    background:rgba(66,194,230,.075);
}

.sidebar-project-actions
.sidebar-new-project-action
span:first-child {
    width:auto;
    font-size:15px;
}

.sidebar-manage-projects-action {
    color:#8e9da6;
}

.sidebar-manage-projects-action:hover,
.sidebar-manage-projects-action:focus-visible {
    color:#d1dde2;
    border-color:rgba(151,171,184,.17);
    background:rgba(255,255,255,.04);
}

/*
The old bottom Manage Projects style is retained harmlessly,
but no element now uses it.
*/
.sidebar-manage-projects {
    display:none!important;
}

@media (max-width:360px) {
    .sidebar-project-actions {
        grid-template-columns:minmax(0,1fr);
    }
}


/* JARVIS STACKED PROJECT ACTIONS */
.sidebar-project-actions {
    grid-template-columns:
        minmax(0,1fr)!important;
    gap:1px!important;
    padding:3px 0 7px!important;
}

.sidebar-manage-projects-action {
    order:1;
}

.sidebar-project-actions
.sidebar-new-project-action {
    order:2;
}

.sidebar-project-actions
.sidebar-manage-projects-action,
.sidebar-project-actions
.sidebar-new-project-action {
    min-height:31px!important;
    padding:5px 10px!important;
    justify-content:flex-start!important;
    text-align:left!important;
}

/*
Indent both controls so their text aligns with the project names.
*/
.sidebar-project-actions
.sidebar-manage-projects-action {
    padding-left:31px!important;
}

.sidebar-project-actions
.sidebar-new-project-action {
    padding-left:26px!important;
}

.sidebar-project-actions
.sidebar-new-project-action
span:first-child {
    width:14px!important;
    text-align:center;
}


/* JARVIS EDIT PROJECT DIALOG */
.project-edit-dialog {
    width:min(540px,calc(100vw - 32px));
    max-width:540px;
    padding:0;
    box-sizing:border-box;
    border:
        1px solid rgba(105,151,173,.30);
    border-radius:14px;
    color:#e7eef2;
    background:
        linear-gradient(
            145deg,
            #18222c,
            #111920
        );
    box-shadow:
        0 24px 70px rgba(0,0,0,.58),
        0 0 0 1px rgba(255,255,255,.025);
}

.project-edit-dialog::backdrop {
    background:rgba(4,8,12,.72);
    backdrop-filter:blur(3px);
}

.project-edit-form {
    padding:24px;
    display:flex;
    flex-direction:column;
    gap:16px;
}

.project-edit-title {
    margin:0;
    color:#f1f5f7;
    font-size:22px;
    line-height:1.2;
}

.project-edit-description {
    margin:-7px 0 2px;
    color:#98a7b0;
    font-size:13px;
    line-height:1.45;
}

.project-edit-form > label {
    display:flex;
    flex-direction:column;
    gap:7px;
    color:#b8c4ca;
    font-size:12px;
    font-weight:700;
}

.project-edit-form input[type="text"],
.project-edit-form textarea {
    width:100%;
    padding:11px 12px;
    box-sizing:border-box;
    border:
        1px solid rgba(126,153,168,.26);
    border-radius:9px;
    color:#edf3f5;
    background:#111a22;
    font:inherit;
    font-size:14px;
    resize:vertical;
}

.project-edit-form input[type="text"]:focus,
.project-edit-form textarea:focus {
    outline:2px solid rgba(66,194,230,.25);
    border-color:rgba(66,194,230,.55);
}

.project-edit-color-row {
    min-height:46px;
    padding:6px 10px;
    display:flex;
    align-items:center;
    gap:12px;
    box-sizing:border-box;
    border:
        1px solid rgba(126,153,168,.26);
    border-radius:9px;
    background:#111a22;
}

.project-edit-color-row
input[type="color"] {
    width:68px;
    height:34px;
    padding:2px;
    border:
        1px solid rgba(126,153,168,.30);
    border-radius:6px;
    background:#18232c;
    cursor:pointer;
}

.project-edit-color-value {
    color:#9fadb5;
    font-family:
        ui-monospace,
        SFMono-Regular,
        Consolas,
        monospace;
    font-size:12px;
}

.project-edit-actions {
    margin-top:4px;
    display:flex;
    justify-content:flex-end;
    gap:9px;
}

.project-edit-cancel,
.project-edit-save {
    min-height:40px;
    padding:0 15px;
    border-radius:9px;
    font:inherit;
    font-size:13px;
    font-weight:750;
    cursor:pointer;
}

.project-edit-cancel {
    border:
        1px solid rgba(140,159,170,.22);
    color:#bac6cc;
    background:rgba(255,255,255,.025);
}

.project-edit-save {
    border:
        1px solid rgba(66,194,230,.42);
    color:#eafcff;
    background:rgba(30,141,171,.18);
}

.project-edit-save:hover,
.project-edit-save:focus-visible {
    border-color:rgba(66,194,230,.72);
    background:rgba(30,141,171,.28);
}

.project-edit-cancel:hover,
.project-edit-cancel:focus-visible {
    color:#eef4f6;
    background:rgba(255,255,255,.055);
}

.project-edit-cancel:disabled,
.project-edit-save:disabled {
    cursor:wait;
    opacity:.55;
}

@media (max-width:600px) {
    .project-edit-form {
        padding:19px;
    }

    .project-edit-actions {
        flex-direction:column-reverse;
    }

    .project-edit-cancel,
    .project-edit-save {
        width:100%;
    }
}


/* JARVIS SIDEBAR PROJECT ACTION MENU */
.sidebar-project-action-host {
    position:relative;
    width:30px;
    height:30px;
    z-index:20;
}

.sidebar-project-action-host
.sidebar-project-manage {
    width:30px;
    height:30px;
    padding:0;
    display:grid;
    place-items:center;
    border:0;
    border-radius:7px;
    color:#7f919c;
    background:transparent;
    font-family:Arial,sans-serif;
    font-size:18px;
    line-height:1;
    cursor:pointer;
}

.sidebar-project-action-host
.sidebar-project-manage:hover,
.sidebar-project-action-host
.sidebar-project-manage[
    aria-expanded="true"
] {
    color:#64d9ed;
    background:rgba(66,194,230,.08);
}

.sidebar-project-action-menu {
    top:calc(100% + 3px)!important;
    right:0!important;
    bottom:auto!important;
    width:184px!important;
    z-index:190!important;
}

.sidebar-project-action-menu
.conversation-action-item.is-danger {
    color:#ef929b;
}

.sidebar-project-action-menu
.conversation-action-item.is-danger:hover {
    color:#ffadb4;
    background:rgba(190,56,70,.12);
}

@media (max-width:700px) {
    .sidebar-project-action-menu {
        width:176px!important;
    }
}


/* JARVIS MATCHING PROJECT ACTIONS */
.sidebar-project-actions
.sidebar-manage-projects-action,
.sidebar-project-actions
.sidebar-new-project-action {
    width:100%!important;
    min-height:32px!important;
    margin:0!important;
    padding:5px 10px 5px 25px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    box-sizing:border-box!important;
    border:1px solid transparent!important;
    border-radius:7px!important;
    color:#73cddd!important;
    background:transparent!important;
    font:inherit!important;
    font-size:12px!important;
    font-weight:700!important;
    line-height:1.2!important;
    text-align:left!important;
    text-decoration:none!important;
    cursor:pointer;
}

.sidebar-project-actions
.sidebar-manage-projects-action::before {
    content:"⚙";
    width:15px;
    flex:0 0 15px;
    display:inline-grid;
    place-items:center;
    color:#62c7da;
    font-family:
        Arial,
        sans-serif;
    font-size:13px;
    font-weight:400;
    line-height:1;
}

.sidebar-project-actions
.sidebar-new-project-action
span:first-child {
    width:15px!important;
    flex:0 0 15px!important;
    display:inline-grid!important;
    place-items:center!important;
    color:#62c7da!important;
    font-family:
        Arial,
        sans-serif!important;
    font-size:16px!important;
    font-weight:400!important;
    line-height:1!important;
}

.sidebar-project-actions
.sidebar-manage-projects-action:hover,
.sidebar-project-actions
.sidebar-manage-projects-action:focus-visible,
.sidebar-project-actions
.sidebar-new-project-action:hover,
.sidebar-project-actions
.sidebar-new-project-action:focus-visible {
    color:#90e8f7!important;
    border-color:rgba(66,194,230,.20)!important;
    background:rgba(66,194,230,.07)!important;
}

.sidebar-project-actions
.sidebar-manage-projects-action:hover::before,
.sidebar-project-actions
.sidebar-manage-projects-action:focus-visible::before,
.sidebar-project-actions
.sidebar-new-project-action:hover
span:first-child,
.sidebar-project-actions
.sidebar-new-project-action:focus-visible
span:first-child {
    color:#78e5f7!important;
}


/* JARVIS CENTERED MODAL SYSTEM */
.jarvis-modal {
    width:min(520px,calc(100vw - 32px));
    max-width:520px;
    max-height:calc(100vh - 48px);
    margin:auto;
    padding:0;
    box-sizing:border-box;
    overflow:auto;
    border:
        1px solid rgba(93,194,218,.30);
    border-radius:16px;
    color:#e8f0f3;
    background:
        radial-gradient(
            circle at top right,
            rgba(42,146,172,.13),
            transparent 42%
        ),
        linear-gradient(
            145deg,
            #18232d,
            #101820
        );
    box-shadow:
        0 28px 85px rgba(0,0,0,.68),
        0 0 30px rgba(32,151,180,.08),
        inset 0 1px rgba(255,255,255,.035);
}

.jarvis-modal[open] {
    animation:
        jarvis-modal-enter
        150ms
        ease-out;
}

.jarvis-modal::backdrop {
    background:rgba(3,7,11,.76);
    backdrop-filter:blur(4px);
}

.jarvis-modal-form {
    padding:25px;
    display:flex;
    flex-direction:column;
    gap:21px;
}

.jarvis-modal-heading {
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    align-items:start;
    gap:13px;
}

.jarvis-modal-icon {
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    box-sizing:border-box;
    border:
        1px solid rgba(71,201,228,.35);
    border-radius:50%;
    color:#7de7f6;
    background:
        radial-gradient(
            circle,
            rgba(53,190,218,.18),
            rgba(25,94,112,.06)
        );
    box-shadow:
        0 0 18px rgba(60,197,223,.10);
    font-size:15px;
    font-weight:800;
}

.jarvis-modal.is-danger
.jarvis-modal-icon {
    border-color:rgba(232,94,107,.42);
    color:#ffadb5;
    background:rgba(176,48,61,.12);
    box-shadow:
        0 0 18px rgba(215,70,83,.10);
}

.jarvis-modal-header {
    min-width:0;
}

.jarvis-modal-title {
    margin:1px 0 6px;
    color:#f0f6f8;
    font-size:21px;
    font-weight:750;
    line-height:1.2;
}

.jarvis-modal-message {
    margin:0;
    color:#9cacb5;
    font-size:13px;
    line-height:1.55;
    overflow-wrap:anywhere;
}

.jarvis-modal-field {
    display:flex;
    flex-direction:column;
    gap:7px;
    color:#bac7cd;
    font-size:12px;
    font-weight:700;
}

.jarvis-modal-input {
    width:100%;
    min-height:44px;
    padding:10px 12px;
    box-sizing:border-box;
    border:
        1px solid rgba(128,158,173,.28);
    border-radius:9px;
    outline:0;
    color:#edf4f6;
    background:#0e171e;
    box-shadow:
        inset 0 1px 4px rgba(0,0,0,.22);
    font:inherit;
    font-size:14px;
    line-height:1.4;
}

textarea.jarvis-modal-input {
    min-height:96px;
    resize:vertical;
}

.jarvis-modal-input:focus {
    border-color:rgba(70,207,233,.66);
    box-shadow:
        0 0 0 3px rgba(52,183,210,.11),
        inset 0 1px 4px rgba(0,0,0,.22);
}

.jarvis-modal-actions {
    display:flex;
    justify-content:flex-end;
    gap:9px;
}

.jarvis-modal-button {
    min-width:88px;
    min-height:40px;
    padding:0 16px;
    border-radius:9px;
    font:inherit;
    font-size:13px;
    font-weight:750;
    cursor:pointer;
}

.jarvis-modal-button.secondary {
    border:
        1px solid rgba(137,160,172,.23);
    color:#b9c6cc;
    background:rgba(255,255,255,.025);
}

.jarvis-modal-button.primary {
    border:
        1px solid rgba(67,202,229,.45);
    color:#e9fbff;
    background:
        linear-gradient(
            180deg,
            rgba(39,157,184,.27),
            rgba(23,111,134,.18)
        );
}

.jarvis-modal-button.primary.danger {
    border-color:rgba(232,91,104,.48);
    color:#fff0f1;
    background:
        linear-gradient(
            180deg,
            rgba(180,52,65,.32),
            rgba(128,34,45,.24)
        );
}

.jarvis-modal-button.secondary:hover,
.jarvis-modal-button.secondary:focus-visible {
    color:#eef5f7;
    background:rgba(255,255,255,.06);
}

.jarvis-modal-button.primary:hover,
.jarvis-modal-button.primary:focus-visible {
    border-color:rgba(91,224,246,.72);
    background:rgba(36,157,184,.34);
}

.jarvis-modal-button.primary.danger:hover,
.jarvis-modal-button.primary.danger:focus-visible {
    border-color:rgba(255,126,137,.72);
    background:rgba(184,51,64,.40);
}

@keyframes jarvis-modal-enter {
    from {
        opacity:0;
        transform:translateY(-8px) scale(.985);
    }

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

@media (prefers-reduced-motion:reduce) {
    .jarvis-modal[open] {
        animation:none;
    }
}

@media (max-width:600px) {
    .jarvis-modal {
        width:min(100% - 22px,520px);
        max-height:calc(100vh - 22px);
    }

    .jarvis-modal-form {
        padding:20px;
    }

    .jarvis-modal-heading {
        grid-template-columns:36px minmax(0,1fr);
        gap:11px;
    }

    .jarvis-modal-icon {
        width:35px;
        height:35px;
    }

    .jarvis-modal-actions {
        flex-direction:column-reverse;
    }

    .jarvis-modal-button {
        width:100%;
    }
}


/* JARVIS FIXED BOTTOM SIDEBAR UTILITIES */
.jarvis-shell-utility-nav {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: auto;
}

.jarvis-shell-utility-nav .files-nav-item {
    flex: 0 0 auto !important;
    margin-top: 8px !important;
    margin-bottom: 2px !important;
    border-top: 1px solid rgba(124,147,160,.13);
    padding-top: 12px !important;
}


/* JARVIS BOTTOM UTILITY ALIGNMENT CORRECTION */
.jarvis-shell-utility-nav {
    margin-top: auto !important;
}

.jarvis-shell-account {
    margin-top: 0 !important;
}


/* JARVIS APPROVED SIDEBAR PROJECT ACCENT AND ALIGNMENT */
:root {
    --jarvis-project-accent:#42c2e6;
}

.sidebar-project-color {
    background:var(--jarvis-project-accent)!important;
    box-shadow:0 0 8px rgba(66,194,230,.55)!important;
}

.sidebar-project-item.is-active-project {
    border-left-color:var(--jarvis-project-accent)!important;
}

.sidebar-projects-toggle,
.sidebar-project-toggle,
.sidebar-project-chevron,
.sidebar-project-manage,
.sidebar-project-action-host .sidebar-project-manage {
    color:var(--jarvis-project-accent)!important;
}

.sidebar-projects-toggle .sidebar-section-chevron::before {
    border-color:var(--jarvis-project-accent)!important;
}

.sidebar-project-toggle:hover,
.sidebar-project-toggle:focus-visible,
.sidebar-project-manage:hover,
.sidebar-project-manage:focus-visible,
.sidebar-project-action-host .sidebar-project-manage:hover,
.sidebar-project-action-host .sidebar-project-manage:focus-visible,
.sidebar-project-actions .sidebar-manage-projects-action:hover,
.sidebar-project-actions .sidebar-manage-projects-action:focus-visible,
.sidebar-project-actions .sidebar-new-project-action:hover,
.sidebar-project-actions .sidebar-new-project-action:focus-visible {
    border-color:rgba(66,194,230,.34)!important;
    background:rgba(66,194,230,.09)!important;
}

.sidebar-project-name {
    color:#bac7cf!important;
}

.sidebar-project-toggle:hover .sidebar-project-name,
.sidebar-project-toggle:focus-visible .sidebar-project-name,
.sidebar-project-item.is-active-project .sidebar-project-name {
    color:#edf4f7!important;
}

.sidebar-project-count {
    color:var(--jarvis-project-accent)!important;
    border-color:rgba(66,194,230,.28)!important;
}

#recent-conversations {
    padding-left:26px;
}

@media (max-width:700px) {
    #recent-conversations {
        padding-left:19px;
    }
}

.sidebar-project-actions .sidebar-manage-projects-action,
.sidebar-project-actions .sidebar-new-project-action {
    color:#bac7cf!important;
}

.sidebar-project-actions .sidebar-manage-projects-action:hover,
.sidebar-project-actions .sidebar-manage-projects-action:focus-visible,
.sidebar-project-actions .sidebar-new-project-action:hover,
.sidebar-project-actions .sidebar-new-project-action:focus-visible {
    color:#edf4f7!important;
}

.sidebar-project-actions .sidebar-manage-projects-action::before,
.sidebar-project-actions .sidebar-new-project-action span:first-child,
.sidebar-project-actions .sidebar-manage-projects-action:hover::before,
.sidebar-project-actions .sidebar-manage-projects-action:focus-visible::before,
.sidebar-project-actions .sidebar-new-project-action:hover span:first-child,
.sidebar-project-actions .sidebar-new-project-action:focus-visible span:first-child {
    color:var(--jarvis-project-accent)!important;
}

/* Approved Pinned refinement. */
#pinned-conversations-group h2 {
    color:#8f9da6;
}

#pinned-conversations-group .conversation-heading-icon,
#pinned-conversations-group .sidebar-conversation-pin {
    color:var(--jarvis-project-accent);
}

#pinned-conversations-group .sidebar-conversation-open {
    color:#bac7cf;
}

#pinned-conversations-group .conversation-action-trigger {
    color:#7e909a;
    opacity:.72;
}

#pinned-conversations-group .sidebar-conversation-row:hover {
    background:rgba(66,194,230,.08);
}

#pinned-conversations-group .sidebar-conversation-row:hover
.sidebar-conversation-open {
    color:#edf4f7;
}

#pinned-conversations-group .conversation-action-trigger:hover,
#pinned-conversations-group
.conversation-action-trigger[aria-expanded="true"] {
    color:var(--jarvis-project-accent);
    background:rgba(66,194,230,.09);
    opacity:1;
}

#pinned-conversations {
    padding-left:26px;
}

@media (max-width:700px) {
    #pinned-conversations {
        padding-left:19px;
    }
}

/* Approved Archived row alignment; existing purple heading styles remain. */
#archived-conversations {
    padding-left:26px;
}

#archived-conversations .sidebar-conversation-row {
    min-height:34px!important;
    grid-template-columns:minmax(0,1fr) 32px!important;
}

#archived-conversations .sidebar-conversation-open {
    min-width:0;
    padding:.48rem .4rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12.5px!important;
}

@media (max-width:700px) {
    #archived-conversations {
        padding-left:19px;
    }
}

/* Approved muted PROJECTS heading; blue iconography and accents remain. */
.sidebar-projects-toggle .sidebar-section-label {
    color:#8f9da6!important;
}


/* JARVIS UNIFIED COLLAPSIBLE SIDEBAR SECTIONS */
.conversation-sidebar {
    display:flex;
    flex-direction:column;
    gap:0;
    margin:0;
    padding:0;
}

.jarvis-sidebar-section,
.sidebar-projects-section.jarvis-sidebar-section,
.conversation-sidebar-group.jarvis-sidebar-section {
    margin:0 .35rem 2px!important;
    padding:0!important;
    border:0;
}

.jarvis-sidebar-section[hidden] {
    display:none!important;
}

.jarvis-sidebar-section .sidebar-section-heading,
.jarvis-sidebar-section .sidebar-projects-heading {
    display:block!important;
    margin:0!important;
    padding:0!important;
    min-height:40px;
}

.jarvis-sidebar-section .sidebar-section-toggle {
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    padding:0 10px!important;
    display:grid!important;
    grid-template-columns:14px 19px 96px 30px!important;
    align-items:center!important;
    column-gap:5px!important;
    border:0!important;
    border-radius:8px!important;
    color:#8f9da6!important;
    background:transparent!important;
    box-shadow:none!important;
    text-align:left!important;
    cursor:pointer;
    transition:
        color .16s ease,
        background-color .16s ease,
        box-shadow .16s ease;
}

.jarvis-sidebar-section .sidebar-section-toggle:hover,
.jarvis-sidebar-section .sidebar-section-toggle:focus-visible {
    color:#aebbc3!important;
    background:rgba(255,255,255,.045)!important;
}

.jarvis-sidebar-section .sidebar-section-toggle:focus-visible {
    outline:2px solid rgba(66,194,230,.52)!important;
    outline-offset:1px!important;
}

.jarvis-sidebar-section.contains-open-conversation
.sidebar-section-toggle {
    color:#c8d3d9!important;
    background:
        linear-gradient(
            90deg,
            rgba(66,194,230,.14),
            rgba(66,194,230,.035)
        )!important;
    box-shadow:
        inset 2px 0 0 rgba(66,194,230,.72)!important;
}

.jarvis-sidebar-section .sidebar-section-chevron {
    grid-column:1!important;
    width:14px!important;
    height:14px!important;
    display:grid!important;
    place-items:center!important;
    justify-self:center!important;
    color:var(--jarvis-project-accent)!important;
    font-size:0!important;
}

.jarvis-sidebar-section .sidebar-section-chevron::before {
    content:"";
    width:6px;
    height:6px;
    box-sizing:border-box;
    border-right:1.5px solid currentColor!important;
    border-bottom:1.5px solid currentColor!important;
    border-color:currentColor!important;
    transform:rotate(-45deg)!important;
    transform-origin:center;
    transition:transform .16s ease;
}

.jarvis-sidebar-section
.sidebar-section-toggle[aria-expanded="true"]
.sidebar-section-chevron::before {
    transform:rotate(45deg)!important;
}

.jarvis-sidebar-section .sidebar-section-icon {
    grid-column:2!important;
    width:19px!important;
    height:19px!important;
    display:grid!important;
    place-items:center!important;
    justify-self:center!important;
    margin:0!important;
    color:var(--jarvis-project-accent)!important;
}

.jarvis-sidebar-section .sidebar-section-icon svg,
.jarvis-sidebar-section .conversation-heading-icon svg {
    width:17px!important;
    height:17px!important;
    margin:0!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.8!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
}

.jarvis-sidebar-section .sidebar-section-label {
    grid-column:3!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    color:#8f9da6!important;
    font-size:10px!important;
    font-weight:800!important;
    line-height:1!important;
    letter-spacing:.13em!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
}

.jarvis-sidebar-section .conversation-group-count {
    grid-column:4!important;
    width:24px!important;
    min-width:24px!important;
    height:16px!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    justify-self:end!important;
    box-sizing:border-box!important;
    border:1px solid rgba(151,166,176,.22)!important;
    border-radius:999px!important;
    color:#87949d!important;
    background:rgba(151,166,176,.07)!important;
    font-size:9px!important;
    font-weight:750!important;
    line-height:1!important;
    letter-spacing:0!important;
}

#archived-conversations-group .sidebar-section-icon,
#archived-conversations-group .sidebar-section-chevron {
    color:#a98bc7!important;
}

#archived-conversations-group
.sidebar-section-toggle:focus-visible {
    outline-color:rgba(169,139,199,.52)!important;
}

#archived-conversations-group.contains-open-conversation
.sidebar-section-toggle {
    background:
        linear-gradient(
            90deg,
            rgba(169,139,199,.14),
            rgba(169,139,199,.035)
        )!important;
    box-shadow:
        inset 2px 0 0 rgba(169,139,199,.66)!important;
}

.jarvis-sidebar-section .sidebar-section-content {
    max-height:0;
    opacity:0;
    visibility:hidden;
    overflow:hidden;
    transform:translateY(-2px);
    pointer-events:none;
    transition:
        max-height .22s ease,
        opacity .16s ease,
        transform .18s ease,
        visibility 0s linear .22s;
}

.jarvis-sidebar-section .sidebar-section-content.is-expanded {
    max-height:2400px;
    opacity:1;
    visibility:visible;
    overflow:visible;
    transform:translateY(0);
    pointer-events:auto;
    transition:
        max-height .22s ease,
        opacity .16s ease,
        transform .18s ease,
        visibility 0s;
}

#recent-conversations,
#pinned-conversations,
#archived-conversations {
    padding-left:26px!important;
}

#recent-conversations .sidebar-conversation-row,
#pinned-conversations .sidebar-conversation-row,
#archived-conversations .sidebar-conversation-row,
.sidebar-project-conversations .sidebar-conversation-row {
    min-height:34px!important;
    grid-template-columns:minmax(0,1fr) 32px!important;
}

#recent-conversations .sidebar-conversation-open,
#pinned-conversations .sidebar-conversation-open,
#archived-conversations .sidebar-conversation-open,
.sidebar-project-conversations .sidebar-conversation-open {
    min-width:0!important;
    padding:.48rem .4rem!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:12.5px!important;
}

@media (max-width:700px) {
    #recent-conversations,
    #pinned-conversations,
    #archived-conversations {
        padding-left:19px!important;
    }
}

@media (prefers-reduced-motion:reduce) {
    .jarvis-sidebar-section .sidebar-section-toggle,
    .jarvis-sidebar-section .sidebar-section-chevron::before,
    .jarvis-sidebar-section .sidebar-section-content,
    .jarvis-sidebar-section .sidebar-section-content.is-expanded {
        transition:none!important;
    }
}

/* Project names remain readable body text; blue stays the accent. */
.sidebar-project-name {
    color:#bac7cf!important;
}

.sidebar-project-toggle:hover .sidebar-project-name,
.sidebar-project-toggle:focus-visible .sidebar-project-name,
.sidebar-project-item.is-active-project .sidebar-project-name {
    color:#edf4f7!important;
}

.sidebar-project-count {
    color:var(--jarvis-project-accent)!important;
    border-color:rgba(66,194,230,.28)!important;
}

/* Align Recent chat rows with chats nested beneath projects. */
#recent-conversations {
    padding-left:26px;
}

@media (max-width:700px) {
    #recent-conversations {
        padding-left:19px;
    }
}

/* Project action labels use normal sidebar text; icons stay blue. */
.sidebar-project-actions .sidebar-manage-projects-action,
.sidebar-project-actions .sidebar-new-project-action {
    color:#bac7cf!important;
}

.sidebar-project-actions .sidebar-manage-projects-action:hover,
.sidebar-project-actions .sidebar-manage-projects-action:focus-visible,
.sidebar-project-actions .sidebar-new-project-action:hover,
.sidebar-project-actions .sidebar-new-project-action:focus-visible {
    color:#edf4f7!important;
}

.sidebar-project-actions .sidebar-manage-projects-action::before,
.sidebar-project-actions .sidebar-new-project-action span:first-child,
.sidebar-project-actions .sidebar-manage-projects-action:hover::before,
.sidebar-project-actions .sidebar-manage-projects-action:focus-visible::before,
.sidebar-project-actions .sidebar-new-project-action:hover span:first-child,
.sidebar-project-actions .sidebar-new-project-action:focus-visible span:first-child {
    color:var(--jarvis-project-accent)!important;
}

/* Pinned chats use the shared blue accent without overpowering body text. */
#pinned-conversations-group h2 {
    color:#8f9da6;
}

#pinned-conversations-group .conversation-heading-icon,
#pinned-conversations-group .sidebar-conversation-pin {
    color:var(--jarvis-project-accent);
}

#pinned-conversations-group .sidebar-conversation-open {
    color:#bac7cf;
}

#pinned-conversations-group .conversation-action-trigger {
    color:#7e909a;
    opacity:.72;
}

#pinned-conversations-group .sidebar-conversation-row:hover {
    background:rgba(66,194,230,.08);
}

#pinned-conversations-group .sidebar-conversation-row:hover
.sidebar-conversation-open {
    color:#edf4f7;
}

#pinned-conversations-group .conversation-action-trigger:hover,
#pinned-conversations-group
.conversation-action-trigger[aria-expanded="true"] {
    color:var(--jarvis-project-accent);
    background:rgba(66,194,230,.09);
    opacity:1;
}

/* Match Pinned, Recent, and project-child conversation row geometry. */
#pinned-conversations {
    padding-left:26px;
}

@media (max-width:700px) {
    #pinned-conversations {
        padding-left:19px;
    }
}

/* Align expanded Archived rows without moving the Archived heading. */
#archived-conversations {
    padding-left:26px;
}

#archived-conversations .sidebar-conversation-row {
    min-height:34px!important;
    grid-template-columns:minmax(0,1fr) 32px!important;
}

#archived-conversations .sidebar-conversation-open {
    min-width:0;
    padding:.48rem .4rem;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12.5px!important;
}

@media (max-width:700px) {
    #archived-conversations {
        padding-left:19px;
    }
}

/* Keep PROJECTS readable as a heading; retain blue iconography and accents. */
.sidebar-projects-toggle .sidebar-section-label {
    color:#8f9da6!important;
}


/* USERS & ACCESS PRESENCE AND PASSWORD RESET */
.users-identity-copy {
    min-width:0;
}

.users-avatar-wrap {
    position:relative;
    width:32px;
    height:32px;
    flex:0 0 32px;
}

.users-identity .users-presence-dot {
    position:absolute;
    right:-1px;
    bottom:-1px;
    width:10px;
    height:10px;
    min-width:10px;
    margin:0!important;
    box-sizing:border-box;
    border:2px solid #151d25;
    border-radius:50%;
    background:#56616a;
    box-shadow:
        0 0 0 1px rgba(151,166,176,.48);
}

.users-identity .users-presence-dot.is-active {
    border-color:#151d25;
    background:#62d58f;
    box-shadow:
        0 0 0 1px rgba(105,220,151,.82),
        0 0 0 3px rgba(98,213,143,.10),
        0 0 9px rgba(98,213,143,.48);
}

.users-identity .users-presence-label {
    display:block;
    margin-top:3px;
    color:#82919a;
    font-size:9px;
    line-height:1.25;
    white-space:normal;
}

.users-status-active,
.users-status-disabled {
    letter-spacing:.06em;
}

.users-identity .users-presence-label time {
    color:inherit;
    font:inherit;
}

.users-reset-password-dialog {
    width:min(520px,calc(100vw - 32px));
}

.users-reset-password-form input[type="password"] {
    width:100%;
    padding:11px 12px;
    box-sizing:border-box;
    border:1px solid rgba(126,153,168,.26);
    border-radius:9px;
    color:#edf3f5;
    background:#111a22;
    font:inherit;
    font-size:14px;
}

.users-reset-password-form input[type="password"]:focus {
    outline:2px solid rgba(66,194,230,.25);
    border-color:rgba(66,194,230,.55);
}

.users-reset-password-rules,
.users-reset-password-error {
    margin:-7px 0 0;
    font-size:12px;
    line-height:1.4;
}

.users-reset-password-rules {
    color:#84949e;
}

.users-reset-password-error {
    min-height:17px;
    color:#efaaaa;
}

.users-reset-password-form .project-edit-save:disabled {
    cursor:not-allowed;
    opacity:.42;
}

.jarvis-users-toast[hidden] {
    display:none;
}

@media (max-width:800px) {
    .users-table .users-identity {
        flex-wrap:nowrap;
    }

    .users-reset-password-dialog {
        width:calc(100vw - 24px);
        max-height:calc(100dvh - 24px);
    }

    .users-reset-password-form {
        padding:18px;
    }
}


/* Final cascade lock for the shared sidebar-section component. */
.conversation-sidebar {
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
    margin:0!important;
    padding:0!important;
}

.jarvis-sidebar-section {
    margin:0 .35rem 2px!important;
    padding:0!important;
    border:0!important;
}

.jarvis-sidebar-section[hidden] { display:none!important; }

.jarvis-sidebar-section .sidebar-section-heading,
.jarvis-sidebar-section .sidebar-projects-heading {
    display:block!important;
    min-height:40px!important;
    margin:0!important;
    padding:0!important;
}

.jarvis-sidebar-section .sidebar-section-toggle {
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    padding:0 10px!important;
    display:grid!important;
    grid-template-columns:14px 19px 96px 30px!important;
    align-items:center!important;
    column-gap:5px!important;
    border:0!important;
    border-radius:8px!important;
    color:#8f9da6!important;
    background:transparent!important;
    box-shadow:none!important;
    text-align:left!important;
}

.jarvis-sidebar-section #archived-conversations-toggle {
    padding:0 10px!important;
}

.jarvis-sidebar-section .sidebar-section-toggle:hover,
.jarvis-sidebar-section .sidebar-section-toggle:focus-visible {
    color:#aebbc3!important;
    background:rgba(255,255,255,.045)!important;
}

.jarvis-sidebar-section .sidebar-section-toggle:focus-visible {
    outline:2px solid rgba(66,194,230,.52)!important;
    outline-offset:1px!important;
}

.jarvis-sidebar-section.contains-open-conversation .sidebar-section-toggle {
    background:linear-gradient(90deg,rgba(66,194,230,.14),rgba(66,194,230,.035))!important;
    box-shadow:inset 2px 0 0 rgba(66,194,230,.72)!important;
}

.jarvis-sidebar-section .sidebar-section-chevron {
    grid-column:1!important;
    width:14px!important;
    height:14px!important;
    display:grid!important;
    place-items:center!important;
    justify-self:center!important;
    color:var(--jarvis-project-accent)!important;
    font-size:0!important;
}

.jarvis-sidebar-section .sidebar-section-chevron::before {
    content:""!important;
    width:6px!important;
    height:6px!important;
    box-sizing:border-box!important;
    border:0!important;
    border-right:1.5px solid currentColor!important;
    border-bottom:1.5px solid currentColor!important;
    transform:rotate(-45deg)!important;
    transform-origin:center!important;
    transition:transform .16s ease!important;
}

.jarvis-sidebar-section .sidebar-section-toggle[aria-expanded="true"]
.sidebar-section-chevron::before {
    transform:rotate(45deg)!important;
}

.jarvis-sidebar-section .sidebar-section-icon {
    grid-column:2!important;
    width:19px!important;
    height:19px!important;
    display:grid!important;
    place-items:center!important;
    justify-self:center!important;
    margin:0!important;
    color:var(--jarvis-project-accent)!important;
}

.jarvis-sidebar-section .sidebar-section-icon svg {
    width:17px!important;
    height:17px!important;
    margin:0!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.8!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
}

.jarvis-sidebar-section .sidebar-section-label {
    grid-column:3!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    color:#8f9da6!important;
    font-size:10px!important;
    font-weight:800!important;
    line-height:1!important;
    letter-spacing:.13em!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
}

.jarvis-sidebar-section .conversation-group-count {
    grid-column:4!important;
    width:24px!important;
    min-width:24px!important;
    height:16px!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    justify-self:end!important;
    box-sizing:border-box!important;
    border:1px solid rgba(151,166,176,.22)!important;
    border-radius:999px!important;
    color:#87949d!important;
    background:rgba(151,166,176,.07)!important;
    font-size:9px!important;
    font-weight:750!important;
    line-height:1!important;
    letter-spacing:0!important;
}

#archived-conversations-group .sidebar-section-icon,
#archived-conversations-group .sidebar-section-chevron {
    color:#a98bc7!important;
}

#archived-conversations-group .sidebar-section-toggle:focus-visible {
    outline-color:rgba(169,139,199,.52)!important;
}

#archived-conversations-group.contains-open-conversation .sidebar-section-toggle {
    background:linear-gradient(90deg,rgba(169,139,199,.14),rgba(169,139,199,.035))!important;
    box-shadow:inset 2px 0 0 rgba(169,139,199,.66)!important;
}

.jarvis-sidebar-section .sidebar-section-content {
    max-height:0!important;
    opacity:0!important;
    visibility:hidden!important;
    overflow:hidden!important;
    transform:translateY(-2px)!important;
    pointer-events:none!important;
    transition:max-height .22s ease,opacity .16s ease,transform .18s ease,visibility 0s linear .22s!important;
}

.jarvis-sidebar-section .sidebar-section-content.is-expanded {
    max-height:2400px!important;
    opacity:1!important;
    visibility:visible!important;
    overflow:visible!important;
    transform:translateY(0)!important;
    pointer-events:auto!important;
    transition:max-height .22s ease,opacity .16s ease,transform .18s ease,visibility 0s!important;
}

#recent-conversations,
#pinned-conversations,
#archived-conversations { padding-left:26px!important; }

#recent-conversations .sidebar-conversation-row,
#pinned-conversations .sidebar-conversation-row,
#archived-conversations .sidebar-conversation-row,
.sidebar-project-conversations .sidebar-conversation-row {
    min-height:34px!important;
    grid-template-columns:minmax(0,1fr) 32px!important;
}

#recent-conversations .sidebar-conversation-open,
#pinned-conversations .sidebar-conversation-open,
#archived-conversations .sidebar-conversation-open,
.sidebar-project-conversations .sidebar-conversation-open {
    min-width:0!important;
    padding:.48rem .4rem!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:12.5px!important;
}

@media (max-width:700px) {
    #recent-conversations,
    #pinned-conversations,
    #archived-conversations { padding-left:19px!important; }
}

@media (prefers-reduced-motion:reduce) {
    .jarvis-sidebar-section .sidebar-section-toggle,
    .jarvis-sidebar-section .sidebar-section-chevron::before,
    .jarvis-sidebar-section .sidebar-section-content,
    .jarvis-sidebar-section .sidebar-section-content.is-expanded {
        transition:none!important;
    }
}