/* Study Helper / Agenda AI visual parity.
 *
 * The study modules still contain legacy blue styles in study-modules.css.
 * This file is loaded last so the helpers use the same warm graphite surfaces,
 * amber accent and textarea treatment as Agenda AI without changing module JS.
 */

body.study-workspace-active,
body.media-workspace-active,
body.study-chat-ui-active {
    --study-workspace-bg: var(--agenda-body-surface, #2f2d2b);
    --study-surface: var(--agenda-surface, #373532);
    --study-surface-raised: var(--agenda-surface-strong, #312f2d);
    --study-border: var(--agenda-soft-line, rgba(226, 220, 210, 0.11));
    --study-border-soft: color-mix(in srgb, var(--agenda-soft-line, rgba(226, 220, 210, 0.11)) 76%, transparent);
    --study-text-muted: var(--text-secondary, #aaa69d);
    --study-accent: var(--agenda-accent, var(--accent-color, #f59e0b));
    --study-chat-panel: var(--agenda-surface, #373532);
    --study-chat-panel-raised: var(--agenda-surface-strong, #312f2d);
    --study-chat-line: var(--agenda-soft-line, rgba(226, 220, 210, 0.11));
    --study-chat-line-soft: color-mix(in srgb, var(--agenda-soft-line, rgba(226, 220, 210, 0.11)) 72%, transparent);
    --study-chat-muted: var(--text-secondary, #aaa69d);
}

/* Keep the mode switch clear of the saved-items shortcut on the right. */
body.study-workspace-active #studyHelperTabBar.browser-tabs-container {
    padding-right: 140px !important;
}

body.study-workspace-active #studyHelperModeSlot.study-helper-mode-slot {
    flex: 0 0 206px !important;
    height: 64px !important;
    transform: none !important;
}

body.study-workspace-active #studyHelperModeSlot .header-right-mode {
    width: 206px !important;
    min-width: 206px !important;
}

body.study-workspace-active #studyHelperModeSlot .clean-segmented-switch.control-segmented-switch {
    box-sizing: border-box !important;
    width: 206px !important;
    min-width: 206px !important;
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 999px !important;
    padding: 3px !important;
    overflow: hidden !important;
}

body.study-workspace-active #studyHelperModeSlot .clean-segmented-switch.control-segmented-switch .mode-switch-btn {
    flex: 0 0 100px !important;
    width: 100px !important;
    min-width: 100px !important;
    height: 28px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

body.study-workspace-active #studyHelperModeSlot .clean-segmented-switch.control-segmented-switch .mode-switch-btn.active,
body.study-workspace-active #studyHelperModeSlot .clean-segmented-switch.control-segmented-switch .mode-switch-btn.selected {
    background: transparent !important;
    box-shadow: none !important;
}

body.study-workspace-active #studyHelperModeSlot .clean-segmented-switch.control-segmented-switch .segmented-switch-pill {
    display: block !important;
    top: 2px !important;
    left: 2px !important;
    width: 100px !important;
    height: 28px !important;
    border-radius: 999px !important;
}

body.study-workspace-active #studyHelperModeSlot .clean-segmented-switch.control-segmented-switch[data-active="study"] .segmented-switch-pill {
    transform: translateX(0) !important;
}

body.study-workspace-active #studyHelperModeSlot .clean-segmented-switch.control-segmented-switch[data-active="balanced"] .segmented-switch-pill {
    transform: translateX(100px) !important;
}

/* Keep the Notes page count as a compact numeric field without browser
   increment/decrement spinner controls. */
body.study-chat-ui-active #notePageCountInput.study-page-count-input {
    appearance: textfield !important;
    -moz-appearance: textfield !important;
}

body.study-chat-ui-active #notePageCountInput.study-page-count-input::-webkit-inner-spin-button,
body.study-chat-ui-active #notePageCountInput.study-page-count-input::-webkit-outer-spin-button {
    display: none !important;
    -webkit-appearance: none !important;
    margin: 0 !important;
}

/* The Quiz/Quick Generator type picker sits above the composer now, so its
   menu must open upward into the free conversation area. */
body.study-chat-ui-active #quizTypeSection {
    position: relative !important;
    z-index: 30 !important;
}

body.study-chat-ui-active #quizTypeDropdown.quiz-type-menu {
    top: auto !important;
    bottom: calc(100% + 8px) !important;
    left: 0 !important;
    right: auto !important;
    z-index: 120 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    max-height: min(60vh, 320px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    transform-origin: bottom left !important;
    animation: quizTypeMenuInUp 150ms cubic-bezier(0.2, 0.7, 0.25, 1) !important;
}

body.study-chat-ui-active #quizTypeToggle[aria-expanded="true"] #quizTypeArrow {
    transform: rotate(180deg) !important;
}

body.study-chat-ui-active #quizTypeToggle[aria-expanded="false"] #quizTypeArrow {
    transform: none !important;
}

@keyframes quizTypeMenuInUp {
    from { opacity: 0; transform: translateY(4px) scale(0.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    body.study-chat-ui-active #quizTypeDropdown.quiz-type-menu {
        animation: none !important;
    }
}

@media (max-width: 768px) {
    body.study-workspace-active #studyHelperTabBar.browser-tabs-container {
        padding-right: 84px !important;
    }

    body.study-workspace-active #studyHelperModeSlot.study-helper-mode-slot {
        transform: translateY(-3px) !important;
    }
}

/* Shared warm workspace surfaces */
body.study-workspace-active #studyHelperTabBar.browser-tabs-container,
body.media-workspace-active #mediaTabBar.browser-tabs-container,
body.study-workspace-active #quizView,
body.study-workspace-active #noteView,
body.study-workspace-active #interrogationView,
body.study-workspace-active #mindMapView {
    background: var(--agenda-body-surface, #2f2d2b) !important;
}

body.study-workspace-active .study-input-container-card,
body.study-workspace-active .interrog-setup-card,
body.study-workspace-active .study-chat-settings {
    border: 1px solid var(--agenda-soft-line, rgba(226, 220, 210, 0.11)) !important;
    border-radius: 20px !important;
    background: var(--agenda-surface, #373532) !important;
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.11) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

body.study-workspace-active .study-upload-dropzone,
body.study-workspace-active .interrog-drop-zone {
    border: 1px solid transparent !important;
    border-radius: 16px !important;
    background:
        radial-gradient(circle at 50% 36%, color-mix(in srgb, var(--study-accent) 11%, transparent), transparent 58%),
        color-mix(in srgb, var(--study-accent) 3%, var(--agenda-surface-strong, #312f2d)) !important;
}

body.study-workspace-active .study-upload-dropzone:hover,
body.study-workspace-active .study-upload-dropzone:focus-visible,
body.study-workspace-active .interrog-drop-zone:hover,
body.study-workspace-active .interrog-drop-zone:focus-visible {
    border-color: color-mix(in srgb, var(--study-accent) 30%, transparent) !important;
    background:
        radial-gradient(circle at 50% 36%, color-mix(in srgb, var(--study-accent) 16%, transparent), transparent 58%),
        color-mix(in srgb, var(--study-accent) 5%, var(--agenda-surface-strong, #312f2d)) !important;
}

/* Text fields follow Agenda AI's context-notes treatment. */
body.study-workspace-active .study-textarea-input,
body.study-workspace-active .interrog-textarea {
    border: 1px solid var(--agenda-soft-line, rgba(226, 220, 210, 0.11)) !important;
    border-radius: 12px !important;
    outline: 0 !important;
    background: color-mix(in srgb, var(--agenda-surface-strong, #312f2d) 72%, transparent) !important;
    color: var(--text-primary, #f5f4ef) !important;
    box-shadow: none !important;
    font-family: inherit !important;
}

body.study-workspace-active .study-textarea-input:focus,
body.study-workspace-active .interrog-textarea:focus {
    border-color: color-mix(in srgb, var(--study-accent) 62%, var(--agenda-soft-line, rgba(226, 220, 210, 0.11))) !important;
    background: color-mix(in srgb, var(--study-accent) 4%, var(--agenda-surface-strong, #312f2d)) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--study-accent) 12%, transparent) !important;
}

body.study-workspace-active .study-textarea-input::placeholder,
body.study-workspace-active .interrog-textarea::placeholder {
    color: var(--text-secondary, #aaa69d) !important;
    opacity: 0.82 !important;
}

body.study-workspace-active .study-library-picker-btn,
body.study-workspace-active .study-dropdown-toggle-btn,
body.study-workspace-active .interrog-lib-btn {
    border: 1px solid var(--agenda-soft-line, rgba(226, 220, 210, 0.11)) !important;
    border-radius: 12px !important;
    background: color-mix(in srgb, var(--agenda-surface-strong, #312f2d) 72%, transparent) !important;
    color: var(--text-primary, #f5f4ef) !important;
}

body.study-workspace-active .study-library-picker-btn:hover,
body.study-workspace-active .study-dropdown-toggle-btn:hover,
body.study-workspace-active .interrog-lib-btn:hover {
    border-color: color-mix(in srgb, var(--study-accent) 48%, var(--agenda-soft-line, rgba(226, 220, 210, 0.11))) !important;
    background: color-mix(in srgb, var(--study-accent) 9%, var(--agenda-surface-strong, #312f2d)) !important;
    color: var(--text-primary, #f5f4ef) !important;
}

body.study-workspace-active .new-mm-btn.active,
body.study-workspace-active .new-mm-upload:hover,
body.study-workspace-active .new-mm-prompt textarea:focus {
    border-color: color-mix(in srgb, var(--study-accent) 52%, var(--agenda-soft-line, rgba(226, 220, 210, 0.11))) !important;
    background: color-mix(in srgb, var(--study-accent) 9%, var(--agenda-surface-strong, #312f2d)) !important;
    color: var(--text-primary, #f5f4ef) !important;
}

body.study-workspace-active .new-mm-btn.active {
    color: var(--accent-text, #292826) !important;
}

body.study-workspace-active .new-mm-upload,
body.study-workspace-active .new-mm-prompt textarea,
body.study-workspace-active .new-mm-canvas-wrap {
    border-color: var(--agenda-soft-line, rgba(226, 220, 210, 0.11)) !important;
    background: color-mix(in srgb, var(--agenda-surface-strong, #312f2d) 72%, transparent) !important;
}

body.study-workspace-active .new-mm-upload svg,
body.study-workspace-active .new-mm-file-name,
body.study-workspace-active .new-mm-progress-fill {
    color: var(--study-accent) !important;
    border-color: color-mix(in srgb, var(--study-accent) 28%, var(--agenda-soft-line, rgba(226, 220, 210, 0.11))) !important;
}

body.study-workspace-active .new-mm-progress-fill {
    background: var(--study-accent) !important;
}

body.study-workspace-active .study-generate-btn,
body.study-workspace-active .new-mm-generate,
body.study-workspace-active .interrog-start-btn {
    border: 1px solid color-mix(in srgb, var(--study-accent) 48%, var(--agenda-soft-line, rgba(226, 220, 210, 0.11))) !important;
    border-radius: 11px !important;
    background: var(--study-accent) !important;
    color: var(--accent-text, #292826) !important;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--study-accent) 18%, transparent) !important;
}

body.study-workspace-active .study-generate-btn:hover:not(:disabled),
body.study-workspace-active .new-mm-generate:hover:not(:disabled),
body.study-workspace-active .interrog-start-btn:hover:not(:disabled) {
    background: color-mix(in srgb, var(--study-accent) 88%, white) !important;
    color: var(--accent-text, #292826) !important;
    box-shadow: 0 10px 25px color-mix(in srgb, var(--study-accent) 22%, transparent) !important;
    filter: none !important;
}

body.study-workspace-active .learning-card-icon {
    color: var(--study-accent) !important;
}


body.study-workspace-active #interrogationView .interrog-icon-main {
    border-color: color-mix(in srgb, var(--study-accent) 38%, var(--agenda-soft-line, rgba(226, 220, 210, 0.11))) !important;
    background: color-mix(in srgb, var(--study-accent) 12%, var(--agenda-surface, #373532)) !important;
    color: var(--study-accent) !important;
}


/* Reuse the main Chat composer itself; keep the Study controls aligned to its
   same centered 800px column. */
body.study-chat-ui-active .study-chat-composer-wrap {
    z-index: 80 !important;
    overflow: visible !important;
    padding: 8px 0 0 !important;
    max-width: 800px !important;
    margin-inline: auto !important;
    background: transparent !important;
}

body.study-chat-ui-active .study-chat-options {
    position: relative !important;
    z-index: 81 !important;
    overflow: visible !important;
    max-width: 800px !important;
    margin-inline: auto !important;
}

body.study-chat-ui-active .study-chat-composer {
    display: flex !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    align-items: flex-end !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    aspect-ratio: auto !important;
    min-height: 48px !important;
    padding: 6px 10px !important;
    border: 0 !important;
    border-radius: 28px !important;
    background: var(--agenda-surface-strong, var(--input-bg)) !important;
    background-image: none !important;
    box-shadow: none !important;
    transform: none !important;
    box-sizing: border-box !important;
}

body.study-chat-ui-active .study-chat-composer:focus-within {
    border: 0 !important;
    background: var(--agenda-surface-strong, var(--input-bg)) !important;
    background-image: none !important;
    transform: none !important;
    box-shadow: none !important;
}

body.study-chat-ui-active .study-chat-voice { order: 5 !important; }

body.study-chat-ui-active .study-chat-input {
    display: block !important;
    flex: 1 1 auto !important;
    order: 2 !important;
    width: auto !important;
    min-width: 0 !important;
    height: var(--logicum-chat-input-height, 40px) !important;
    min-height: 40px !important;
    max-height: 220px !important;
    padding: 8px 10px !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    box-sizing: border-box !important;
}

/* Legacy module rules target each textarea by ID and otherwise draw a second
   raised field inside the chat bubble. Match the ordinary chat composer: only
   the outer composer is a surface, while the textarea remains transparent. */
body.study-chat-ui-active #quizTopicInput.study-chat-input,
body.study-chat-ui-active #noteTopicInput.study-chat-input,
body.study-chat-ui-active #interrogTopicInput.study-chat-input,
body.study-chat-ui-active #newMmPromptInput.study-chat-input {
    flex: 1 1 auto !important;
    order: 2 !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 40px !important;
    max-height: 220px !important;
    height: var(--logicum-chat-input-height, 40px) !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--text-primary) !important;
    font: inherit !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    outline: none !important;
    resize: none !important;
    box-shadow: none !important;
    overflow-y: hidden;
    box-sizing: border-box !important;
}

body.study-chat-ui-active #quizTopicInput.study-chat-input:focus,
body.study-chat-ui-active #noteTopicInput.study-chat-input:focus,
body.study-chat-ui-active #interrogTopicInput.study-chat-input:focus,
body.study-chat-ui-active #newMmPromptInput.study-chat-input:focus {
    border: 0 !important;
    background: transparent !important;
    outline: none !important;
    box-shadow: none !important;
}

body.study-chat-ui-active #quizTopicInput.study-chat-input::placeholder,
body.study-chat-ui-active #noteTopicInput.study-chat-input::placeholder,
body.study-chat-ui-active #interrogTopicInput.study-chat-input::placeholder,
body.study-chat-ui-active #newMmPromptInput.study-chat-input::placeholder {
    color: #757575 !important;
    opacity: 1 !important;
}

body.light-mode.study-chat-ui-active #quizTopicInput.study-chat-input::placeholder,
body.light-mode.study-chat-ui-active #noteTopicInput.study-chat-input::placeholder,
body.light-mode.study-chat-ui-active #interrogTopicInput.study-chat-input::placeholder,
body.light-mode.study-chat-ui-active #newMmPromptInput.study-chat-input::placeholder {
    color: #677080 !important;
}

body.study-chat-ui-active .study-chat-upload-btn {
    display: inline-flex !important;
    flex: 0 0 38px !important;
    align-self: center !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
}

body.study-chat-ui-active .study-chat-attachments {
    flex: 0 1 auto !important;
    align-self: center !important;
    margin: 0 !important;
}

body.study-chat-ui-active .study-chat-send {
    display: inline-flex !important;
    flex: 0 0 40px !important;
    align-self: center !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 -2px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--accent-color) !important;
    color: var(--accent-text) !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease !important;
}

body.study-chat-ui-active .study-chat-send:hover:not(:disabled),
body.study-chat-ui-active .study-chat-send:focus-visible:not(:disabled) {
    background: var(--accent-color) !important;
    box-shadow: none !important;
    transform: none !important;
    filter: brightness(1.05) !important;
}

body.study-chat-ui-active .study-chat-send:active:not(:disabled) {
    transform: none !important;
    filter: brightness(0.98) !important;
}

body.study-chat-ui-active .study-chat-meta {
    display: none !important;
}

@media (max-width: 720px) {
    body.study-workspace-active .study-input-container-card,
    body.study-workspace-active .interrog-setup-card,
    body.study-workspace-active .study-chat-settings {
        border-radius: 16px !important;
    }

    body.study-chat-ui-active .study-chat-composer {
        display: flex !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        aspect-ratio: auto !important;
        min-height: 48px !important;
        padding: 6px 10px !important;
    }

    body.study-chat-ui-active .study-chat-input { font-size: 16px !important; }

    body.study-chat-ui-active .study-chat-options-row {
        flex-wrap: wrap !important;
        width: 100% !important;
    }
}

/* Match Chat's mobile composer dimensions and fixed button anchors. */
@media (max-width: 768px) {
    body.study-chat-ui-active .study-chat-composer {
        width: 100% !important;
        min-height: 54px !important;
        padding: 7px 8px !important;
        gap: 4px !important;
    }

    body.study-chat-ui-active .study-chat-composer :where(.attach-btn, .voice-btn, .send-btn) {
        flex: 0 0 42px !important;
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
    }
}

/* Put the generation bubble with the navigation tools, above the footer line. */
.study-generation-widget {
    flex: 0 0 auto;
    display: none;
    width: 100%;
    min-width: 0;
    margin: 0;
}

.sidebar-footer > .study-generation-widget {
    margin: 0 0 4px;
}

.study-generation-widget[hidden] {
    display: none !important;
}

.study-generation-widget.is-visible {
    display: block;
}

.study-generation-widget-items {
    display: flex;
    max-height: min(40vh, 300px);
    flex-direction: column;
    gap: 6px;
    overflow-y: auto;
    scrollbar-width: thin;
}

.study-generation-widget-item {
    position: relative;
    flex: 0 0 auto;
    min-width: 0;
    transition: opacity 220ms ease, transform 220ms ease;
}

.sidebar .study-generation-sidebar-open.tool-btn {
    position: relative;
    box-sizing: border-box;
    min-height: 54px;
    border: 1px solid color-mix(in srgb, var(--accent-color, #f59e0b) 46%, transparent) !important;
    border-radius: 12px !important;
    background: color-mix(in srgb, var(--accent-color, #f59e0b) 15%, var(--bg-sidebar, #242320)) !important;
    box-shadow: 0 3px 14px rgb(0 0 0 / 14%) !important;
}

.sidebar .study-generation-sidebar-open.tool-btn:hover,
.sidebar .study-generation-sidebar-open.tool-btn:focus-visible {
    border-color: color-mix(in srgb, var(--accent-color, #f59e0b) 68%, transparent) !important;
    background: color-mix(in srgb, var(--accent-color, #f59e0b) 21%, var(--bg-sidebar, #242320)) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent-color, #f59e0b) 13%, transparent) !important;
    outline: none;
}

.study-generation-sidebar-open .study-generation-sidebar-copy {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
}

.study-generation-sidebar-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-generation-sidebar-state.tool-icon {
    display: grid;
    place-items: center;
    color: var(--accent-color, #f59e0b) !important;
    filter: none !important;
}

.study-generation-sidebar-state > i {
    width: 15px;
    height: 15px;
    border: 2px solid color-mix(in srgb, currentColor 28%, transparent);
    border-top-color: currentColor;
    border-radius: 50%;
    animation: study-widget-spin 850ms linear infinite;
}

.study-generation-sidebar-state > svg {
    display: none;
    width: 19px;
    height: 19px;
    overflow: visible;
    color: #70c992;
}

.study-generation-sidebar-state circle,
.study-generation-sidebar-state path {
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.study-generation-sidebar-state circle {
    stroke-width: 1.8;
    stroke-dasharray: 60;
    stroke-dashoffset: 60;
}

.study-generation-sidebar-state path {
    stroke-width: 2.2;
    stroke-dasharray: 20;
    stroke-dashoffset: 20;
}

.study-generation-widget-item.is-complete .study-generation-sidebar-state > i {
    display: none;
}

.study-generation-widget-item.is-complete .study-generation-sidebar-state > svg {
    display: block;
}

.study-generation-widget-item.is-complete .study-generation-sidebar-state circle {
    animation: study-generation-notice-check 320ms ease-out forwards;
}

.study-generation-widget-item.is-complete .study-generation-sidebar-state path {
    animation: study-generation-notice-check 280ms 160ms ease-out forwards;
}

.study-generation-sidebar-progress {
    position: relative;
    display: block;
    width: 100%;
    height: 3px;
    margin-top: 4px;
    overflow: hidden;
    border-radius: 999px;
    background: color-mix(in srgb, var(--accent-color, #f59e0b) 22%, transparent);
}

.study-generation-sidebar-progress > i {
    position: absolute;
    inset: 0 auto 0 0;
    width: 38%;
    border-radius: inherit;
    background: var(--accent-color, #f59e0b);
    animation: study-generation-sidebar-progress 1.25s ease-in-out infinite;
}

.study-generation-sidebar-progress.is-determinate > i {
    width: 100%;
    animation: none;
    transform: scaleX(var(--study-generation-progress, 0));
    transform-origin: left center;
    transition: transform 300ms ease;
}

.study-generation-widget-item.is-complete .study-generation-sidebar-progress {
    background: color-mix(in srgb, #70c992 28%, transparent);
}

.study-generation-widget-item.is-leaving {
    opacity: 0;
    transform: translateY(-4px);
    pointer-events: none;
}

@media (min-width: 769px) {
    body.sidebar-collapsed .study-generation-sidebar-open.tool-btn {
        min-height: 44px !important;
    }

    body.sidebar-collapsed .study-generation-sidebar-open.tool-btn .study-generation-sidebar-state {
        display: grid !important;
    }

    body.sidebar-collapsed .study-generation-sidebar-open.tool-btn .study-generation-sidebar-copy {
        display: block !important;
        position: absolute;
        right: 8px;
        bottom: 5px;
        left: 8px;
        height: 3px;
        overflow: visible;
    }

    body.sidebar-collapsed .study-generation-sidebar-open.tool-btn .study-generation-sidebar-progress {
        display: block !important;
    }

    body.sidebar-collapsed .study-generation-sidebar-title {
        display: none !important;
    }

    body.sidebar-collapsed .study-generation-sidebar-progress {
        height: 3px;
        margin: 0;
    }
}

@keyframes study-widget-spin {
    to { transform: rotate(360deg); }
}

@keyframes study-generation-notice-check {
    to { stroke-dashoffset: 0; }
}

@keyframes study-generation-sidebar-progress {
    0% { transform: translateX(-110%); }
    55%, 100% { transform: translateX(175%); }
}

@media (prefers-reduced-motion: reduce) {
    .study-generation-widget,
    .study-generation-widget * {
        animation: none !important;
        transition: none !important;
    }

    .study-generation-widget-item.is-complete .study-generation-sidebar-state circle,
    .study-generation-widget-item.is-complete .study-generation-sidebar-state path {
        stroke-dashoffset: 0;
    }
}

/* Quiz overlays inherit the same warm graphite surfaces as the Study Helper
   workspace instead of retaining the legacy blue-violet modal palette. */
body.study-workspace-active .quiz-modal-card {
    color: var(--text-primary, #f5f4ef) !important;
    background: var(--study-surface, #373532) !important;
    border-color: var(--study-border, rgba(226, 220, 210, 0.11)) !important;
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.38) !important;
}

body.study-workspace-active .quiz-modal-header,
body.study-workspace-active .quiz-modal-footer {
    border-color: var(--study-border, rgba(226, 220, 210, 0.11)) !important;
}

body.study-workspace-active .quiz-modal-count {
    color: var(--study-accent, #d0a85c) !important;
}

body.study-workspace-active .quiz-modal-title,
body.study-workspace-active .quiz-modal-question {
    color: var(--text-primary, #f5f4ef) !important;
}

body.study-workspace-active .quiz-modal-question {
    background: var(--study-surface-raised, #312f2d) !important;
    border-color: var(--study-border, rgba(226, 220, 210, 0.11)) !important;
}

body.study-workspace-active .quiz-question-hint-btn,
body.study-workspace-active .quiz-choice-btn {
    color: var(--text-primary, #f5f4ef) !important;
    background: color-mix(in srgb, var(--study-surface-raised, #312f2d) 82%, #000) !important;
    border-color: var(--study-border, rgba(226, 220, 210, 0.11)) !important;
}

body.study-workspace-active .quiz-choice-btn:hover {
    background: var(--study-surface-raised, #312f2d) !important;
    border-color: color-mix(in srgb, var(--text-primary, #f5f4ef) 22%, transparent) !important;
}

body.study-workspace-active .quiz-choice-btn.selected,
body.study-workspace-active .quiz-question-hint-btn[aria-expanded="true"] {
    color: var(--study-accent, #d0a85c) !important;
    background: color-mix(in srgb, var(--study-accent, #d0a85c) 10%, var(--study-surface-raised, #312f2d)) !important;
    border-color: color-mix(in srgb, var(--study-accent, #d0a85c) 42%, var(--study-border, transparent)) !important;
}

body.study-workspace-active .quiz-modal-btn {
    color: var(--text-primary, #f5f4ef) !important;
    background: var(--study-surface-raised, #312f2d) !important;
    border: 1px solid var(--study-border, rgba(226, 220, 210, 0.11)) !important;
}

body.study-workspace-active #quizModalSubmitBtn,
body.study-workspace-active #quizModalNextBtn,
body.study-workspace-active #quizModalConfirmBtn {
    color: var(--accent-text, #211f1b) !important;
    background: var(--study-accent, #d0a85c) !important;
    border-color: var(--study-accent, #d0a85c) !important;
}

body.study-workspace-active #quizModalInput {
    color: var(--text-primary, #f5f4ef) !important;
    background: var(--study-surface-raised, #312f2d) !important;
    border-color: var(--study-border, rgba(226, 220, 210, 0.11)) !important;
}