/* Slack-style layout. Scoped to html[data-slack-style="1"].
   Shape, spacing, and typography only — theme, accent, and sidebar
   colours come from the user's appearance settings. Lato is the
   open-source typeface (SIL OFL). No logos or trademarks. */

html[data-slack-style="1"] {
    --radius: 6px;
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 12px;
    --font-body: calc(15px * var(--font-scale, 1));
    --font-meta: calc(12px * var(--font-scale, 1));
    --shadow-sm: 0 1px 1px rgba(0, 0, 0, 0.06);
    --sidebar-width: 260px;
    --header-height: 49px;
    --msg-avatar: 36px;
    --msg-gap: 8px;
    --msg-pad-x: 20px;
}

html[data-slack-style="1"],
html[data-slack-style="1"] body,
html[data-slack-style="1"] button,
html[data-slack-style="1"] input,
html[data-slack-style="1"] textarea,
html[data-slack-style="1"] select {
    font-family: Lato, "Segoe UI", -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Sidebar geometry. Colours stay on the chosen sidebar theme. */
html[data-slack-style="1"] .sidebar {
    border-right: none;
}
html[data-slack-style="1"] .sidebar-search-btn {
    margin: 12px 16px 8px;
    border: none;
    border-radius: 6px;
}
html[data-slack-style="1"] .sidebar-section-header,
html[data-slack-style="1"] .sidebar-section-header span {
    font-size: 13px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
}
html[data-slack-style="1"] .channel-item {
    border-radius: 6px;
    margin: 0;
    padding: 0 8px 0 0;
    min-height: 28px;
    font-size: calc(15px * var(--font-scale, 1));
    font-weight: 400;
}
html[data-slack-style="1"] .channel-item.has-unread,
html[data-slack-style="1"] .channel-item.has-unread .channel-name,
html[data-slack-style="1"] .channel-item.has-unread .channel-name-text,
html[data-slack-style="1"] .channel-item.has-unread .channel-prefix {
    font-weight: 700;
    color: var(--text);
}
html[data-slack-style="1"][data-sidebar-theme]:not([data-sidebar-theme="default"]) .channel-item.has-unread,
html[data-slack-style="1"][data-sidebar-theme]:not([data-sidebar-theme="default"]) .channel-item.has-unread .channel-name,
html[data-slack-style="1"][data-sidebar-theme]:not([data-sidebar-theme="default"]) .channel-item.has-unread .channel-name-text,
html[data-slack-style="1"][data-sidebar-theme]:not([data-sidebar-theme="default"]) .channel-item.has-unread .channel-prefix {
    color: #fff;
    font-weight: 700;
}
html[data-slack-style="1"] .chat-list-item:not(.has-unread):has(.chat-list-icon) .chat-list-title {
    font-weight: 500;
    color: var(--text-secondary);
}
html[data-slack-style="1"] .chat-list-item.has-unread .chat-list-title,
html[data-slack-style="1"] .chat-list-item.has-unread .chat-list-icon {
    font-weight: 700;
    color: var(--text);
}
html[data-slack-style="1"] .sidebar-nav a,
html[data-slack-style="1"] .sidebar-nav button {
    font-size: calc(15px * var(--font-scale, 1));
    font-weight: 400;
    min-height: 28px;
}

/* Header rhythm */
html[data-slack-style="1"] .header {
    height: 49px;
    box-shadow: none;
}
html[data-slack-style="1"] .header-title {
    font-weight: 900;
    font-size: calc(18px * var(--font-scale, 1));
    letter-spacing: -0.2px;
}

/* Messages */
html[data-slack-style="1"] .message-list {
    --msg-avatar: 36px;
    --msg-gap: 8px;
    --msg-pad-x: 20px;
}
html[data-slack-style="1"] .message:hover { background: var(--surface-2); }
html[data-slack-style="1"] .message-author {
    font-weight: 900;
    font-size: calc(15px * var(--font-scale, 1));
}
html[data-slack-style="1"] .message-content {
    font-size: calc(15px * var(--font-scale, 1));
    line-height: 1.46668;
}
html[data-slack-style="1"] .message-time,
html[data-slack-style="1"] .message-gutter-time,
html[data-slack-style="1"] .date-separator {
    font-weight: 400;
}
html[data-slack-style="1"] .message-avatar,
html[data-slack-style="1"] .message-avatar-img {
    border-radius: 4px;
}
html[data-slack-style="1"] .message-actions-bar {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 6px;
    box-shadow: var(--shadow-sm);
}
html[data-slack-style="1"] .reaction-pill {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 999px;
    min-height: 24px;
    box-shadow: none;
}
html[data-slack-style="1"] .reaction-pill.reaction-mine {
    background: var(--accent-dim);
    border-color: var(--accent);
    color: var(--accent);
}
html[data-slack-style="1"] .reaction-pill.reaction-mine .reaction-count { color: var(--accent); }
html[data-slack-style="1"] .reply-context {
    border-left: 3px solid var(--border);
}

/* Composer */
html[data-slack-style="1"] .message-input {
    background: var(--surface);
    border: 1px solid var(--border-hover);
    border-radius: 8px;
    box-shadow: none;
}
html[data-slack-style="1"] .message-input:focus-within {
    border-color: var(--accent) !important;
    box-shadow: 0 0 0 1px var(--accent) !important;
}
html[data-slack-style="1"] .send-btn { border-radius: 4px; }

/* Thread */
html[data-slack-style="1"] .thread-panel {
    border-left: 1px solid var(--border);
}
html[data-slack-style="1"] .thread-panel-header {
    border-bottom: 1px solid var(--border);
}
html[data-slack-style="1"] .thread-panel-title { font-weight: 900; }
html[data-slack-style="1"] .thread-panel-input textarea {
    border: 1px solid var(--border-hover);
    border-radius: 8px;
    font-family: inherit;
}
html[data-slack-style="1"] .thread-panel-input textarea:focus {
    border-color: var(--accent);
    outline: none;
}

/* Directory */
html[data-slack-style="1"] .chat-list-card {
    background: transparent !important;
    border-radius: 0 !important;
    margin-bottom: 8px !important;
}
html[data-slack-style="1"] .chat-list-item {
    border-bottom: none;
    padding: 8px 4px;
}
html[data-slack-style="1"] .chat-list-title {
    font-weight: 700;
    font-size: calc(16px * var(--font-scale, 1));
}
html[data-slack-style="1"] .chat-section-label {
    font-size: calc(15px * var(--font-scale, 1));
    font-weight: 900;
    padding: 12px 0 4px;
    text-transform: none;
    letter-spacing: 0;
}
html[data-slack-style="1"] .chat-list-item svg { display: none; }
html[data-slack-style="1"] .chat-list-icon svg,
html[data-slack-style="1"] .chat-section-add svg,
html[data-slack-style="1"] .chat-section-toggle svg,
html[data-slack-style="1"] .list-compose-btn svg { display: block; }
html[data-slack-style="1"] .chat-list-icon {
    border-radius: 6px;
}

/* Mobile list + message rhythm */
@media (max-width: 768px) {
    html[data-slack-style="1"] .header {
        height: calc(44px + env(safe-area-inset-top));
        padding-top: env(safe-area-inset-top);
    }
    html[data-slack-style="1"] .mobile-tab-bar a {
        font-size: 10px;
        font-weight: 700;
        gap: 2px;
    }
    html[data-slack-style="1"] .mobile-tab-bar a.active::before { background: transparent; }
    html[data-slack-style="1"] .mobile-tab-bar a svg { width: 24px; height: 24px; }
    html[data-slack-style="1"] .message-toolbar { display: none; }
    html[data-slack-style="1"] .thread-panel { border-left: none; }
    html[data-slack-style="1"] .message-list,
    html[data-slack-style="1"][data-density="cozy"] .message-list,
    html[data-slack-style="1"][data-density="compact"] .message-list {
        --msg-pad-x: 16px;
        --msg-gap: 8px;
        --msg-avatar: 36px;
    }
    html[data-slack-style="1"] .thread-panel {
        width: 100%;
        left: 0;
        top: 0;
        border-left: none;
        z-index: 80;
    }
    html[data-slack-style="1"] .thread-back { display: flex; }
    html[data-slack-style="1"] .thread-close { display: none; }
    html[data-slack-style="1"] .thread-panel-header > div:first-child { display: none; }
    html[data-slack-style="1"] .thread-panel-header { justify-content: flex-start; }
    html[data-slack-style="1"] .context-sheet { border-radius: 12px 12px 0 0; }

    html[data-slack-style="1"] .chat-list-item {
        min-height: max(48px, calc(56px * var(--font-scale, 1)));
        padding: 12px 4px;
    }
    html[data-slack-style="1"] .chat-list-title { font-size: calc(17px * var(--font-scale, 1)); }
    html[data-slack-style="1"] .chat-list-avatar,
    html[data-slack-style="1"] .chat-list-icon { width: 40px; height: 40px; }
    html[data-slack-style="1"] .channel-item { min-height: max(44px, calc(44px * var(--font-scale, 1))); font-size: calc(16px * var(--font-scale, 1)); }

    html[data-slack-style="1"] .header.list-header {
        height: auto;
        min-height: calc(64px + env(safe-area-inset-top));
        padding: calc(12px + env(safe-area-inset-top)) 16px 8px;
        align-items: flex-end;
        border-bottom: none;
        background: var(--bg);
        color: var(--text);
    }
    html[data-slack-style="1"] .list-header .header-title,
    html[data-slack-style="1"][data-sidebar-theme] .header.list-header .header-title,
    html[data-slack-style="1"][data-sidebar-theme] .header.list-header .list-compose-btn {
        color: var(--text);
    }
    html[data-slack-style="1"] .list-header .header-title {
        font-size: 34px;
        font-weight: 800;
        letter-spacing: -0.6px;
        line-height: 1.05;
        max-width: none;
        overflow: visible;
        text-overflow: unset;
    }
}

.thread-back { display: none; }
html[data-slack-style="1"] .thread-back {
    align-items: center;
    gap: 4px;
    background: none;
    border: none;
    font-weight: 900;
    font-size: 18px;
    font-family: inherit;
    padding: 8px 4px;
    cursor: pointer;
    color: inherit;
}

html[data-slack-style="1"] .modal,
html[data-slack-style="1"] .card,
html[data-slack-style="1"] .settings-section,
html[data-slack-style="1"] .form-input,
html[data-slack-style="1"] .btn {
    font-family: inherit;
}
html[data-slack-style="1"] .form-input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 1px var(--accent);
}

/* Phone chrome: pill dock on lists. Inside a conversation the dock hides
   and the composer sits on the bottom edge. */
@media (max-width: 768px) {
    html[data-slack-style="1"] .main-content { position: relative; }

    html[data-slack-style="1"] .mobile-tab-bar {
        background: transparent;
        box-shadow: none;
        border: none;
        height: auto;
        padding: 0 12px calc(8px + env(safe-area-inset-bottom));
        pointer-events: none;
    }
    html[data-slack-style="1"] .dock-row,
    html[data-slack-style="1"] .dock-fab,
    html[data-slack-style="1"] .dock-more,
    html[data-slack-style="1"] .dock-more-backdrop { pointer-events: auto; }

    html[data-slack-style="1"] .dock-fab {
        position: absolute;
        right: 14px;
        top: auto;
        bottom: calc(100% + 10px);
        width: 52px;
        height: 52px;
        border: none;
        border-radius: 50%;
        background: var(--text);
        color: var(--bg);
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
    }
    html[data-slack-style="1"] .dock-row {
        display: flex;
        align-items: flex-end;
        gap: 10px;
    }
    html[data-slack-style="1"] .dock-pill {
        flex: 1;
        display: flex;
        align-items: stretch;
        height: 64px;
        padding: 6px;
        background: color-mix(in srgb, var(--surface) 92%, transparent);
        backdrop-filter: blur(16px);
        border-radius: 32px;
        box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
    }
    html[data-slack-style="1"] .dock-pill a,
    html[data-slack-style="1"] .dock-pill button {
        position: relative;
        flex: 1;
        border: none;
        background: transparent;
        color: var(--text);
        font-family: inherit;
        font-size: 11px;
        font-weight: 700;
        border-radius: 24px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 0;
        min-width: 0;
    }
    html[data-slack-style="1"] .dock-pill a::before,
    html[data-slack-style="1"] .dock-pill button::before { display: none; }
    html[data-slack-style="1"] .dock-pill a.active,
    html[data-slack-style="1"] .dock-pill button.active {
        background: color-mix(in srgb, var(--text) 10%, transparent);
        color: var(--text);
    }
    html[data-slack-style="1"] .dock-pill a .app-icon,
    html[data-slack-style="1"] .dock-pill button .app-icon { width: 24px; height: 24px; }
    html[data-slack-style="1"] .dock-pill .tab-badge {
        top: 2px;
        left: calc(50% + 4px);
    }
    html[data-slack-style="1"] .dock-search {
        width: 56px;
        height: 56px;
        flex-shrink: 0;
        border: none;
        border-radius: 50%;
        background: var(--surface);
        color: var(--text);
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
    }
    html[data-slack-style="1"] .mobile-tab-bar:has(.dock-more) .dock-fab { display: none; }
    html[data-slack-style="1"] .dock-more {
        left: 12px;
        right: 12px;
        bottom: calc(96px + env(safe-area-inset-bottom));
        background: color-mix(in srgb, var(--surface) 96%, transparent);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        color: var(--text);
        border-radius: 28px;
        box-shadow: 0 16px 48px rgba(0, 0, 0, 0.16);
        padding: 8px 8px 12px;
    }
    html[data-slack-style="1"] .dock-more-head { color: var(--text); font-size: 20px; }
    html[data-slack-style="1"] .dock-more-close { color: var(--text); }
    html[data-slack-style="1"] .mobile-tab-bar .dock-more a {
        color: var(--text);
        font-size: 17px;
        font-weight: 700;
        border-radius: 18px;
    }
    html[data-slack-style="1"] .mobile-tab-bar .dock-more a.active,
    html[data-slack-style="1"] .mobile-tab-bar .dock-more a:hover {
        background: var(--surface-2);
        color: var(--text);
    }
    html[data-slack-style="1"] .dock-more-icon {
        background: var(--surface-2);
        color: var(--text);
        border-radius: 14px;
    }

    /* Conversation header stays in flow so it never covers messages,
       and the action buttons shrink inside the screen. */
    html[data-slack-style="1"] .app-shell.in-conversation .conv-header {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        z-index: 2;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        height: auto;
        min-height: 56px;
        padding: 6px 8px;
        gap: 6px;
        border: none;
        border-bottom: 1px solid var(--border);
        border-radius: 0;
        background: var(--sidebar-top);
        color: var(--sidebar-fg);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        box-shadow: none;
        align-items: center;
        overflow: hidden;
    }
    html[data-slack-style="1"] .app-shell.in-conversation .conv-identity {
        flex: 1 1 auto;
        min-width: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        border-radius: 0;
        padding: 0;
        overflow: hidden;
    }
    html[data-slack-style="1"] .conv-identity-avatar,
    html[data-slack-style="1"] .conv-sub { display: flex; }
    html[data-slack-style="1"] .conv-hash {
        display: flex;
        width: 28px;
        height: 28px;
        border-radius: 8px;
        background: var(--surface-2);
        align-items: center;
        justify-content: center;
        font-weight: 800;
        flex-shrink: 0;
    }
    html[data-slack-style="1"] .conv-avatar { width: 28px; height: 28px; border-radius: 8px; }
    html[data-slack-style="1"] .conv-identity-text {
        display: flex;
        flex-direction: column;
        gap: 0;
        align-items: flex-start;
        min-width: 0;
        overflow: hidden;
    }
    html[data-slack-style="1"] .conv-hash-inline,
    html[data-slack-style="1"] .header-topic,
    html[data-slack-style="1"] .header-action-extra { display: none; }
    html[data-slack-style="1"] .conv-header .header-title {
        font-size: calc(17px * var(--font-scale, 1));
        font-weight: 800;
        max-width: 100%;
        line-height: 1.15;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    html[data-slack-style="1"] .conv-sub {
        font-size: calc(13px * var(--font-scale, 1));
        color: var(--text-tertiary);
        font-weight: 500;
        line-height: 1.2;
    }
    html[data-slack-style="1"] .conv-header .header-actions { gap: 6px; }
    html[data-slack-style="1"] .conv-header .icon-circle {
        width: 36px;
        height: 36px;
        min-width: 36px;
        min-height: 36px;
        border-radius: 50%;
        background: var(--surface);
        color: var(--text);
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
        border: none;
        text-decoration: none;
    }
    html[data-slack-style="1"] .app-shell.in-conversation .message-list { padding-top: 8px; }

    html[data-slack-style="1"] .message-author { font-weight: 800; font-size: calc(17px * var(--font-scale, 1)); letter-spacing: -0.01em; }
    html[data-slack-style="1"] .message-content { font-size: calc(17px * var(--font-scale, 1)); line-height: 1.45; }
    html[data-slack-style="1"] .message-time { font-weight: 500; font-size: calc(13px * var(--font-scale, 1)); }
    html[data-slack-style="1"] .date-separator {
        justify-content: flex-start;
        gap: 0;
        font-size: calc(17px * var(--font-scale, 1));
        font-weight: 800;
        color: var(--text);
        padding-left: 16px;
    }
    html[data-slack-style="1"] .date-separator::before,
    html[data-slack-style="1"] .date-separator::after { display: none; }

    /* Image previews stay short; tap still opens the lightbox. */
    html[data-slack-style="1"] .message-attachments,
    html[data-slack-style="1"] .message-attachments.images-multi {
        width: auto;
        max-width: min(100%, 360px);
    }
    html[data-slack-style="1"] .image-attachment,
    html[data-slack-style="1"] .message-attachments.images-multi .image-attachment,
    html[data-slack-style="1"] .message-attachments.images-count-3 .image-attachment:first-child {
        display: inline-block;
        width: auto;
        max-width: min(100%, 360px);
        max-height: 360px;
        min-width: 0;
        min-height: 0;
        aspect-ratio: auto;
        border-radius: 12px;
        overflow: hidden;
        grid-column: auto;
    }
    html[data-slack-style="1"] .image-attachment img,
    html[data-slack-style="1"] .message-attachments.images-multi .image-attachment img {
        display: block;
        width: auto;
        height: auto;
        max-width: min(100%, 360px);
        max-height: 360px;
        object-fit: contain;
        border-radius: 12px;
    }

    html[data-slack-style="1"] .message-list,
    html[data-slack-style="1"] .content,
    html[data-slack-style="1"] .main-content {
        scrollbar-width: none;
    }
    html[data-slack-style="1"] .message-list::-webkit-scrollbar,
    html[data-slack-style="1"] .content::-webkit-scrollbar,
    html[data-slack-style="1"] .main-content::-webkit-scrollbar,
    html[data-slack-style="1"] .sidebar-resize-handle,
    html[data-slack-style="1"] .chat-resize-handle {
        display: none;
        width: 0;
        height: 0;
    }

    html[data-slack-style="1"] .message-input-container {
        background: transparent;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    html[data-slack-style="1"] .app-shell.in-conversation .message-input-container {
        padding-bottom: calc(8px + env(safe-area-inset-bottom)) !important;
    }
    html[data-slack-style="1"] .message-input,
    html[data-slack-style="1"] .message-input:focus-within {
        background: var(--surface) !important;
        border: none !important;
        border-radius: 26px !important;
        box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12) !important;
        padding: 6px 8px 6px 6px;
        transition: box-shadow 180ms ease, border-radius 180ms ease;
    }
    html[data-slack-style="1"] .message-toolbar { display: none !important; }
    /* The toolbar send button is display:none unless the field is focused.
       iOS blurs the field on the tap that should send, so that button
       disappears before click. The row button stays put whenever there is
       text, focused or not. */
    html[data-slack-style="1"] .message-input-row .send-btn { display: none; }
    html[data-slack-style="1"] .message-input:has(.wysiwyg-editor:not(.is-empty)) .message-input-row .send-btn,
    html[data-slack-style="1"] .message-input-container:has(.attachment-preview) .message-input-row .send-btn {
        display: flex;
        width: 44px;
        height: 44px;
        min-width: 44px;
        min-height: 44px;
        margin-left: 0;
        border-radius: 50%;
        background: var(--accent);
        color: #fff;
        border: none;
    }
    html[data-slack-style="1"] .message-input:has(.wysiwyg-editor:not(.is-empty)) .composer-mic,
    html[data-slack-style="1"] .message-input-container:has(.attachment-preview) .composer-mic { display: none; }
    html[data-slack-style="1"] .slack-composer-tools .send-btn { display: none; }
    html[data-slack-style="1"] .composer-plus,
    html[data-slack-style="1"] .composer-mic {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border: none;
        border-radius: 50%;
        background: transparent;
        color: var(--text);
        flex-shrink: 0;
    }
    html[data-slack-style="1"] .message-input:focus-within .composer-mic,
    html[data-slack-style="1"] .message-input:focus-within .composer-plus,
    html[data-slack-style="1"] .message-input:has(.wysiwyg-editor:not(.is-empty)) .composer-plus { display: none; }
    /* Keep the formatting row mounted while there is text. Hiding it on blur
       shrinks the pill and the send control slides out from under the finger. */
    html[data-slack-style="1"] .message-input:focus-within .slack-composer-tools,
    html[data-slack-style="1"] .message-input:has(.wysiwyg-editor:not(.is-empty)) .slack-composer-tools { display: flex; }
    html[data-slack-style="1"] .slack-composer-tools,
    html[data-slack-style="1"] .slack-thread-tools {
        align-items: center;
        gap: 2px;
        padding: 4px 2px 2px;
    }
    html[data-slack-style="1"] .slack-composer-tools .toolbar-btn,
    html[data-slack-style="1"] .slack-thread-tools button {
        width: 36px;
        height: 36px;
        border: none;
        background: transparent;
        color: var(--text);
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    html[data-slack-style="1"] .slack-composer-tools .send-btn,
    html[data-slack-style="1"] .slack-thread-tools .send-btn,
    html[data-slack-style="1"] .thread-send {
        margin-left: auto;
        width: 34px;
        height: 34px;
        border-radius: 50%;
        background: var(--surface-3);
        color: var(--text-tertiary);
        border: none;
    }
    html[data-slack-style="1"] .slack-composer-tools .send-btn:not(:disabled),
    html[data-slack-style="1"] .slack-thread-tools .send-btn:not(:disabled),
    html[data-slack-style="1"] .thread-send:not(:disabled) {
        background: var(--accent);
        color: #fff;
    }
    html[data-slack-style="1"] .wysiwyg-editor { font-size: calc(17px * var(--font-scale, 1)); padding: 8px 4px; }

    html[data-slack-style="1"] .thread-panel-header {
        margin: 8px 10px 0;
        height: auto;
        min-height: 52px;
        padding: 6px 8px;
        border: none;
        border-radius: 28px;
        background: color-mix(in srgb, var(--surface) 88%, transparent);
        backdrop-filter: blur(18px);
        box-shadow: 0 6px 24px rgba(0, 0, 0, 0.08);
    }
    html[data-slack-style="1"] .thread-back { display: flex; }
    html[data-slack-style="1"] .thread-close { display: none; }
    html[data-slack-style="1"] .thread-identity { align-items: flex-start; padding-left: 4px; }
    html[data-slack-style="1"] .thread-panel-title { font-size: 15px; font-weight: 800; }
    html[data-slack-style="1"] .thread-panel-channel { margin: 0; font-size: 12px; }
    html[data-slack-style="1"] .thread-react-add {
        background: var(--surface);
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
    }
    html[data-slack-style="1"] .thread-reply-bar { border-top: none; font-weight: 700; }
    html[data-slack-style="1"] .thread-panel-input {
        margin: 8px 10px calc(10px + env(safe-area-inset-bottom));
        padding: 12px;
        border: none;
        border-radius: 22px;
        background: var(--surface);
        box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
    }
    html[data-slack-style="1"] .thread-input-row textarea {
        border: none;
        background: transparent;
        padding: 4px 0 8px;
        min-height: 28px;
    }
    html[data-slack-style="1"] .thread-send { display: none; }
    html[data-slack-style="1"] .slack-thread-tools { display: flex; }
    html[data-slack-style="1"] .also-send-toggle { font-size: 15px; font-weight: 600; gap: 10px; }
    html[data-slack-style="1"] .also-send-toggle input[type="checkbox"] {
        width: 18px;
        height: 18px;
        accent-color: var(--accent);
    }
}

.activity-list, .pane-link-list { display: flex; flex-direction: column; }
.activity-item, .pane-link {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 64px;
    padding: 12px 4px;
    text-decoration: none;
    color: var(--text);
    border-bottom: 1px solid var(--border);
}
.activity-copy, .pane-link-copy { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.activity-title, .pane-link-label { font-size: calc(17px * var(--font-scale, 1)); font-weight: 700; line-height: 1.25; }
.activity-snippet {
    font-size: calc(15px * var(--font-scale, 1));
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.activity-meta { font-size: calc(13px * var(--font-scale, 1)); color: var(--text-tertiary); }
.pane-link-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: var(--surface-2);
    color: var(--text);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}