#assistant-launcher {
    position:fixed;
    left:20px;
    bottom:20px;
    z-index:1000;
    width:54px;
    height:54px;
    margin:0;
    padding:0;
    border:0;
    border-radius:50%;
    background:#5b45d6;
    color:#fff;
    box-shadow:0 10px 28px #241a6160;
    font-size:24px;
    cursor:pointer;
}

#assistant-panel {
    --assistant-primary:#5b45d6;
    --assistant-soft:#ece9ff;
    --assistant-bg:#ffffff;
    --assistant-page:#f7f6fb;
    --assistant-text:#252438;
    --assistant-muted:#6b687d;
    --assistant-border:#dedbe9;
    position:fixed;
    left:20px;
    bottom:86px;
    z-index:1000;
    display:flex;
    width:min(380px,calc(100vw - 40px));
    max-height:min(620px,calc(100vh - 120px));
    flex-direction:column;
    overflow:hidden;
    border:1px solid var(--assistant-border);
    border-radius:16px;
    background:var(--assistant-bg);
    color:var(--assistant-text);
    box-shadow:0 18px 48px #17112945;
    font-family:Arial,sans-serif;
    font-size:14px;
}

:root[data-theme="dark"] #assistant-panel {
    --assistant-primary:#9b8cff;
    --assistant-soft:#302858;
    --assistant-bg:#242232;
    --assistant-page:#302e42;
    --assistant-text:#f4f2ff;
    --assistant-muted:#b7b2c8;
    --assistant-border:#454158;
}

#assistant-panel[hidden] { display:none; }
#assistant-panel *,
#assistant-panel *::before,
#assistant-panel *::after { box-sizing:border-box; min-width:0; }

.assistant-header {
    display:flex;
    align-items:center;
    gap:10px;
    padding:16px 18px;
    background:var(--assistant-primary);
    color:#fff;
}
.assistant-header div { flex:1; }
.assistant-header strong,.assistant-header span { display:block; }
.assistant-header span { margin-top:2px; font-size:12px; opacity:.85; }
#assistant-close {
    flex:0 0 34px;
    width:34px;
    height:34px;
    margin:0;
    padding:0;
    border:0;
    border-radius:8px;
    background:#ffffff24;
    color:#fff;
    font-size:22px;
    cursor:pointer;
}

.assistant-messages {
    display:grid;
    gap:10px;
    min-height:180px;
    padding:16px;
    overflow-y:auto;
    background:var(--assistant-page);
}
.assistant-message {
    width:fit-content;
    max-width:88%;
    padding:10px 12px;
    border-radius:12px;
    background:var(--assistant-bg);
    text-align:left;
    line-height:1.4;
    white-space:normal;
    overflow-wrap:anywhere;
}
.assistant-message.user {
    margin-left:auto;
    background:var(--assistant-primary);
    color:#fff;
}
.assistant-message.status { color:var(--assistant-muted); font-style:italic; }

.assistant-actions {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:7px;
    padding:12px 14px 0;
    background:var(--assistant-bg);
    width:100%;
    overflow:hidden;
}
.assistant-mode {
    width:auto;
    min-width:0;
    margin:0;
    padding:8px 5px;
    border:1px solid var(--assistant-border);
    border-radius:8px;
    background:var(--assistant-bg);
    color:var(--assistant-text);
    font-size:12px;
    font-weight:bold;
    line-height:1.2;
    white-space:normal;
    cursor:pointer;
}
.assistant-mode.active {
    border-color:var(--assistant-primary);
    background:var(--assistant-soft);
    color:var(--assistant-primary);
}

#assistant-form {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:9px;
    padding:12px 14px 14px;
    background:var(--assistant-bg);
    width:100%;
    overflow:hidden;
}
#assistant-input {
    width:100%;
    min-width:0;
    min-height:46px;
    max-height:120px;
    resize:vertical;
    padding:11px;
    border:1px solid var(--assistant-border);
    border-radius:9px;
    background:var(--assistant-bg);
    color:var(--assistant-text);
    font:14px Arial,sans-serif;
}
#assistant-send {
    width:auto;
    min-width:74px;
    align-self:end;
    height:46px;
    margin:0;
    padding:0 14px;
    border:0;
    border-radius:9px;
    background:var(--assistant-primary);
    color:#fff;
    font-weight:bold;
    cursor:pointer;
}
#assistant-send:disabled,#assistant-input:disabled { opacity:.6; cursor:wait; }

@media(max-width:700px) {
    #assistant-launcher { left:14px; bottom:14px; }
    #assistant-panel {
        left:10px;
        bottom:78px;
        width:calc(100vw - 20px);
        max-height:calc(100vh - 96px);
    }
    .assistant-actions {
        grid-template-columns:1fr 1fr;
    }
    .assistant-mode[data-mode="bug"] {
        grid-column:1 / -1;
    }
    #assistant-form {
        grid-template-columns:1fr;
    }
    #assistant-send {
        width:100%;
    }
    .assistant-message {
        max-width:94%;
    }
}