/* Study Helper workspace: one calm, browser-like surface for every tool. */
/* Shared notebook surfaces used by the Math Study Helper. */
.study-workspace {
    --study-bg: var(--bg-dark, #2a2927);
    --study-panel: var(--bg-card, #30302e);
    --study-line: #484744;
    --study-text: #eeedeb;
    --study-muted: #b0aeaa;
    --study-accent-workspace: #aaa;
    --study-editor: #2a2927;
    --study-error: #f18b87;
    --study-border-workspace: var(--study-line);
    flex-direction: column;
    gap: 18px;
    padding: 24px clamp(12px, 2.5vw, 36px) 32px;
    color: var(--study-text);
    background: var(--study-bg);
    overflow: auto;
    min-height: 0;
}
html[data-theme="light"] .study-workspace,
body.light-mode .study-workspace {
    --study-bg: var(--bg-dark, #f5f5f0);
    --study-panel: #f5f4f2;
    --study-editor: #faf9f7;
    --study-line: #d6d3cf;
    --study-text: #302f2c;
    --study-muted: #706c66;
    --study-accent-workspace: #686661;
    --study-error: #b72e2e;
}
.study-workspace * { box-sizing: border-box; }
.study-workspace button, .study-workspace input, .study-workspace textarea, .study-workspace select { font: inherit; }
.study-workspace button { cursor: pointer; border: 1px solid var(--study-line); border-radius: 6px; color: var(--study-text); background: transparent; padding: 7px 10px; font-size: 12px; }
.study-workspace button:hover { background: color-mix(in srgb, var(--study-accent-workspace) 14%, transparent); border-color: var(--study-accent-workspace); }
.study-workspace :is(button, textarea, input, select, summary):focus-visible { outline: 2px solid var(--study-accent-workspace); outline-offset: 2px; }
.study-workspace button:disabled { opacity: .5; cursor: wait; }
.study-workspace [hidden] { display: none !important; }
.study-header, .study-header-actions { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.study-eyebrow { font-size: 10px; letter-spacing: .12em; color: var(--study-muted); margin: 0 0 6px; }
.study-header h1 { font-size: 26px; font-weight: 600; margin: 0 0 5px; letter-spacing: -.03em; }
.study-header p:not(.study-eyebrow) { font-size: 12px; color: var(--study-muted); margin: 0; }
.study-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: stretch; }
.study-main { display: grid; gap: 12px; min-width: 0; }
.study-panel, .study-console, .study-chat { background: var(--study-panel); border: 0; border-radius: 12px; overflow: hidden; min-width: 0; }
.study-toolbar { min-height: 46px; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 12px; border-bottom: 1px solid var(--study-line); }
.study-file { font: 11px ui-monospace, monospace; color: var(--study-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.study-run-controls { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.study-workspace .study-primary { background: #dedcd8; color: #292825; border-color: #dedcd8; font-weight: 600; }
.study-editor-scroll { height: clamp(360px, 48vh, 600px); overflow: auto; background: var(--study-editor); color: var(--study-text); }
.study-error-line { position: absolute; left: 0; right: 0; height: 24px; background: #d64b4b20; border-bottom: 1px solid var(--study-error); pointer-events: none; z-index: 0; }
.study-editor-status { display: flex; gap: 16px; padding: 8px 12px; font-size: 10px; color: var(--study-muted); border-top: 1px solid var(--study-line); flex-wrap: wrap; }
.study-inline-agent { position: absolute; width: 32px; height: 32px; top: 16px; right: 16px; pointer-events: none; transition: left 850ms cubic-bezier(.22,.8,.25,1), top 850ms 850ms cubic-bezier(.22,.8,.25,1); z-index: 4; }
.study-mini-mascot, .study-chat-mascot { --mascot-size: 32px; width: 32px; height: 40px; flex: 0 0 32px; }
.study-mini-mascot .agenda-agent-mascot, .study-chat-mascot .agenda-agent-mascot { width: 32px; height: 40px; }
.study-inline-bubble { pointer-events: auto; position: absolute; left: 44px; top: 36px; background: var(--study-panel); border: 1px solid var(--study-line); border-radius: 0 8px 8px 8px; padding: 10px 20px 10px 10px; color: var(--study-text); width: min(270px, calc(100vw - 112px)); max-height: 260px; overflow: auto; box-shadow: 0 4px 14px #0003; }
.study-inline-bubble strong { font-size: 12px; }
.study-inline-bubble p { font-size: 13px; line-height: 1.55; margin: 5px 0 0; overflow-wrap: anywhere; }
.study-console { background: var(--study-editor); }
.study-console-heading { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; border-bottom: 1px solid var(--study-line); }
.study-console h2 { font: 12px ui-monospace, monospace; margin: 0; }
.study-chat { display: flex; flex-direction: column; padding: 16px; min-height: 0; height: calc(clamp(360px, 48vh, 600px) + 355px); }
.study-chat-heading { display: flex; align-items: center; gap: 10px; }
.study-chat h2 { margin: 0 0 4px; font-size: 14px; font-weight: 600; }
.study-context { display: flex; justify-content: space-between; gap: 10px; font-size: 10px; color: var(--study-muted); border-bottom: 1px solid var(--study-line); padding: 14px 0 10px; }
.study-messages { flex: 1; min-height: 0; overflow: auto; padding: 15px 0; }
.study-message { padding: 10px; font-size: 12px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; border-left: 2px solid var(--study-line); margin-bottom: 12px; }
.study-message > strong { display: block; font-size: 9px; color: var(--study-muted); margin-bottom: 4px; }
.study-message-copy { display: block; }
.study-message.assistant { padding: 0; border: 0; background: transparent; color: var(--text-primary, var(--study-text)); }
.study-message.user { width: fit-content; max-width: min(64ch, 85%); margin-left: auto; padding: 7px 16px; border-radius: 24px; background: var(--accent-color, var(--study-accent)); color: #fff; line-height: 1.6; }
.study-message-copy strong { font-weight: 750; color: var(--study-text); }
.study-message-copy em { font-style: italic; }
.study-message-copy code { padding: 1px 5px; border-radius: 5px; background: color-mix(in srgb, var(--study-muted) 15%, var(--study-panel)); font: .92em ui-monospace, monospace; }
.study-message-copy > :first-child { margin-top: 0; }
.study-message-copy > :last-child { margin-bottom: 0; }
.study-message-copy p { margin: .25em 0 .65em; }
.study-message-copy ul, .study-message-copy ol { margin: .35em 0 .65em; padding-left: 1.4em; }
.study-message-copy li + li { margin-top: .25em; }
.study-message-copy pre { max-width: 100%; overflow: auto; white-space: pre; }
.study-message-copy .katex-display { max-width: 100%; overflow-x: auto; overflow-y: hidden; margin: .9em 0; }
.study-message-copy .katex { font-size: 1.13em; }
.study-message-copy .katex-display > .katex { font-size: 1.24em; }
.study-inline-agent > .study-mini-mascot { width: 32px; height: 32px; flex-basis: 32px; pointer-events: auto; cursor: pointer; }
.study-inline-agent > .study-mini-mascot .agenda-agent-mascot { width: 32px; height: 32px; }
.study-inline-agent.is-error > .study-mini-mascot { filter: drop-shadow(0 0 3px #d64b4b88); }
.study-inline-agent.is-error .study-inline-bubble,
.math-editor-canvas:has(.study-error-line:not([hidden])) .study-inline-bubble { border-color: var(--study-error); }
.study-workspace #mathDismissHint { position: absolute; right: 3px; top: 2px; border: 0; color: var(--study-muted); font-size: 14px; padding: 0 3px; line-height: 18px; }
.study-error-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.study-workspace .study-error-actions button { border: 0; background: color-mix(in srgb, var(--study-muted) 14%, transparent); padding: 7px 11px; border-radius: 13px; font-size: 12px; }
.study-workspace #mathErrorFix { background: color-mix(in srgb, var(--study-error) 18%, var(--study-panel)); color: var(--study-error); }
.study-chat > :not(.study-messages) { flex-shrink: 0; }
.study-inline-agent:not(.is-walking) .agenda-mascot-art { animation: study-mascot-idle 2.8s ease-in-out infinite; transform-origin: 50% 100%; }
.study-inline-agent:not(.is-walking) > .study-mini-mascot:hover .agenda-mascot-art { animation: study-mascot-greeting .9s ease-in-out infinite; }
.study-inline-agent:not(.is-walking) > .study-mini-mascot:hover .arm-right { animation: study-mascot-wave .45s ease-in-out infinite; }
@keyframes study-mascot-idle { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-2px) scale(1.015, 1.025); } }
@keyframes study-mascot-greeting { 0%, 100% { transform: translateY(0) rotate(0); } 35% { transform: translateY(-5px) rotate(-5deg); } 65% { transform: translateY(-3px) rotate(4deg); } }
@keyframes study-mascot-wave { 0%, 100% { transform: rotate(-25deg); } 50% { transform: rotate(-65deg); } }
:root {
    --study-workspace-bg: #101114;
    --study-surface: #17191d;
    --study-surface-raised: #1c1f24;
    --study-border: rgba(255, 255, 255, 0.10);
    --study-border-soft: rgba(255, 255, 255, 0.07);
    --study-text-muted: rgba(235, 238, 245, 0.64);
    --study-accent: var(--accent-color, #8b83f7);
}

body.light-mode {
    --study-workspace-bg: #f5f6f8;
    --study-surface: #ffffff;
    --study-surface-raised: #f8f9fb;
    --study-border: rgba(19, 24, 34, 0.12);
    --study-border-soft: rgba(19, 24, 34, 0.08);
    --study-text-muted: rgba(33, 39, 51, 0.64);
}

/* Resolve the active theme accent at the workspace level. Resolving it only
   on :root can freeze an earlier fallback color before theme classes load. */
body.study-workspace-active,
body.media-workspace-active {
    --study-accent: var(--accent-color, #8b83f7);
}

/* A clear, tool-first navigation bar. The larger tabs retain the original
   section order while making the active study mode easier to scan. */
#studyHelperTabBar.browser-tabs-container,
#mediaTabBar.browser-tabs-container {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 0 32px;
    background: var(--study-workspace-bg);
    border-bottom: 1px solid var(--study-border);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.025);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.study-browser-tab-strip {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 64px;
    padding: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.study-browser-tab-strip::-webkit-scrollbar { display: none; }

#studyHelperTabBar .browser-tab,
#mediaTabBar .browser-tab {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 42px;
    min-height: 42px;
    box-sizing: border-box;
    align-self: center;
    padding: 0 10px;
    margin: 0;
    border: 1px solid transparent !important;
    border-radius: 12px;
    background: transparent !important;
    color: var(--study-text-muted);
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    white-space: nowrap;
    transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

#studyHelperTabBar .browser-tab:hover,
#mediaTabBar .browser-tab:hover {
    z-index: auto;
    color: var(--text-primary);
    background: color-mix(in srgb, var(--study-surface-raised) 82%, transparent) !important;
    border-color: var(--study-border-soft) !important;
}

#studyHelperTabBar .browser-tab:focus-visible,
#mediaTabBar .browser-tab:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--study-accent) 74%, transparent);
    outline-offset: -2px;
}

#studyHelperTabBar .browser-tab.active,
#mediaTabBar .browser-tab.active {
    color: var(--text-primary);
    background: color-mix(in srgb, var(--study-accent) 12%, var(--study-surface)) !important;
    border-color: color-mix(in srgb, var(--study-accent) 26%, var(--study-border)) !important;
    box-shadow: none;
}

#studyHelperTabBar .browser-tab::after,
#mediaTabBar .browser-tab::after {
    left: 18px;
    right: 18px;
    height: 2px;
    bottom: 0;
    background: var(--study-accent);
    transition: opacity 160ms ease;
    transform: none;
    opacity: 0;
}

#studyHelperTabBar .browser-tab.active::after,
#mediaTabBar .browser-tab.active::after { opacity: 1; }
#studyHelperTabBar .browser-tab svg,
#mediaTabBar .browser-tab svg { width: 16px; height: 16px; opacity: 0.72; }
#studyHelperTabBar .browser-tab.active svg,
#mediaTabBar .browser-tab.active svg { color: var(--study-accent); opacity: 1; }

/* Shared workspace geometry */
body.study-workspace-active #quizView,
body.study-workspace-active #noteView,
body.study-workspace-active #interrogationView,
body.study-workspace-active #mindMapView {
    background: var(--study-workspace-bg);
    min-height: 0;
    padding: 28px 32px 44px;
}

body.study-workspace-active #quizEditor,
body.study-workspace-active #noteEditor,
body.study-workspace-active #mindMapView > .new-mm-container,
body.study-workspace-active #interrogationView > .interrog-shell {
    width: min(100%, 1040px);
    max-width: 1040px;
    margin: 0 auto;
}


.study-module-shell,
body.study-workspace-active .interrog-view,
body.study-workspace-active .new-mindmap-view { background: transparent; }

.study-hub-back-btn {
    min-height: 34px;
    margin-bottom: 22px;
    padding: 0 12px;
    border-color: var(--study-border);
    border-radius: 8px;
    font-size: 13px;
}

.study-hub-back-btn:hover { transform: none; }

/* The tab strip is now the Study Helper home; avoid showing the legacy back
   control inside each tab as a second navigation system. */
body.study-workspace-active .study-hub-back-btn { display: none !important; }

.study-module-header-block {
    align-items: flex-start;
    margin-bottom: 22px;
    padding-bottom: 20px;
    border-bottom-color: var(--study-border);
}

.study-module-header-block .header-left { gap: 14px; }
.study-module-header-block .header-icon-badge {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--study-accent) 9%, transparent);
    border-color: color-mix(in srgb, var(--study-accent) 22%, transparent);
}
.study-module-header-block .header-title { font-size: 24px; letter-spacing: -0.025em; }
.study-module-header-block .header-subtitle { font-size: 14px; color: var(--study-text-muted); }
.study-module-header-block .header-size-row { gap: 12px !important; margin-top: 14px !important; }
.study-module-header-block .header-size-row > div { gap: 7px !important; }
.study-module-header-block .size-label { font-size: 12px !important; color: var(--study-text-muted) !important; }

.clean-segmented-switch.size-segmented-switch,
.clean-segmented-switch.control-segmented-switch {
    height: 36px !important;
    padding: 3px !important;
    border: 1px solid var(--study-border) !important;
    border-radius: 999px !important;
    corner-shape: round !important;
    background: var(--study-surface-raised) !important;
    overflow: hidden !important;
}

.clean-segmented-switch.size-segmented-switch button,
.clean-segmented-switch.control-segmented-switch button {
    min-width: 66px;
    height: 28px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    corner-shape: round !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
}

.study-input-container-card {
    gap: 14px !important;
    padding: 18px !important;
    margin-top: 0 !important;
    border: 1px solid var(--study-border) !important;
    border-radius: 12px !important;
    background: var(--study-surface) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.10) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.study-upload-dropzone,
.interrog-drop-zone {
    min-height: 148px;
    margin-bottom: 0 !important;
    padding: 26px 18px !important;
    border-color: var(--study-border) !important;
    border-radius: 10px !important;
    background: var(--study-surface-raised) !important;
    transition: border-color 160ms ease, background-color 160ms ease !important;
}

.study-upload-dropzone:hover,
.interrog-drop-zone:hover {
    border-color: color-mix(in srgb, var(--study-accent) 60%, var(--study-border)) !important;
    background: color-mix(in srgb, var(--study-accent) 4%, var(--study-surface-raised)) !important;
}

.study-upload-dropzone:hover .upload-icon,
.interrog-drop-zone:hover .dz-icon { transform: none !important; }
.study-upload-dropzone .upload-title { font-size: 14px !important; font-weight: 650 !important; }
.study-upload-dropzone .upload-subtitle { font-size: 12.5px !important; }

.study-library-picker-btn,
.study-dropdown-toggle-btn {
    min-height: 38px;
    border-radius: 9px !important;
    border-color: var(--study-border) !important;
    background: var(--study-surface-raised) !important;
    color: var(--text-primary) !important;
    font-size: 13px !important;
    transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease !important;
}

/* Header options occupy the same 32 px control row as Mind Map's size
   selector.  The source-library button intentionally keeps its larger target
   inside the input card. */
body.study-workspace-active .study-module-header-block .study-dropdown-toggle-btn {
    min-height: 32px !important;
    height: 32px !important;
}

/* mindmap-page.css is optional in v1.9; keep note loading hidden until JS starts it. */
.mindmap-loading-overlay:not(.active):not([aria-hidden="false"]) { display: none; }
.mindmap-loading-overlay.active,
.mindmap-loading-overlay[aria-hidden="false"] { display: flex; }

#noteLoadingBar.note-loading-indeterminate {
    width: 34%;
    animation: note-loading-sweep 1.4s ease-in-out infinite alternate;
}

@keyframes note-loading-sweep {
    from { transform: translateX(-110%); }
    to { transform: translateX(320%); }
}

@media (prefers-reduced-motion: reduce) {
    #noteLoadingBar.note-loading-indeterminate {
        width: 100%;
        animation: none;
        transform: none;
    }
}

.study-library-picker-btn:hover,
.study-dropdown-toggle-btn:hover {
    border-color: color-mix(in srgb, var(--study-accent) 45%, var(--study-border)) !important;
    background: color-mix(in srgb, var(--study-accent) 5%, var(--study-surface-raised)) !important;
}

.study-textarea-input {
    min-height: 132px !important;
    max-height: 360px !important;
    padding: 14px 15px !important;
    border: 1px solid var(--study-border) !important;
    border-radius: 10px !important;
    background: var(--study-surface-raised) !important;
    color: var(--text-primary) !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    resize: vertical !important;
    transition: border-color 160ms ease, box-shadow 160ms ease !important;
}

.study-textarea-input:focus {
    border-color: color-mix(in srgb, var(--study-accent) 68%, var(--study-border)) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--study-accent) 12%, transparent) !important;
    outline: none !important;
}

.study-generate-btn,
.new-mm-generate {
    display: inline-flex !important;
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
    min-height: 40px;
    align-self: flex-end !important;
    margin: 14px 0 0 auto !important;
    padding: 0 16px !important;
    border-radius: 8px !important;
    font-size: 13.5px !important;
    font-weight: 650 !important;
    letter-spacing: 0 !important;
    justify-content: center !important;
    box-shadow: 0 6px 16px color-mix(in srgb, var(--study-accent) 18%, transparent) !important;
    transition: background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease !important;
}

body.study-workspace-active .interrog-start-btn {
    width: auto !important;
    max-width: 220px !important;
    min-height: 40px;
    padding: 0 16px !important;
    border-radius: 8px !important;
    font-size: 13.5px !important;
}

.study-generate-btn:hover:not(:disabled),
.new-mm-generate:hover:not(:disabled),
body.study-workspace-active .interrog-start-btn:hover:not(:disabled) {
    transform: translateY(-1px) !important;
    filter: none !important;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--study-accent) 26%, transparent) !important;
}

.study-generate-btn:active:not(:disabled),
.new-mm-generate:active:not(:disabled),
body.study-workspace-active .interrog-start-btn:active:not(:disabled) { transform: none !important; }

/* Canonical Study Helper geometry. Every tab uses the same vertical rhythm,
   content column and header grid, independent of its legacy module CSS. */
body.study-workspace-active #studyHelperTabBar.browser-tabs-container,
body.media-workspace-active #mediaTabBar.browser-tabs-container {
    flex: 0 0 64px !important;
    height: 64px !important;
    min-height: 64px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

body.study-workspace-active .study-browser-tab-strip {
    flex: 0 0 64px !important;
    height: 64px !important;
    min-height: 64px !important;
    box-sizing: border-box !important;
}

body.media-workspace-active #mediaTabBar .study-browser-tab-strip {
    flex: 0 0 64px !important;
    height: 64px !important;
    min-height: 64px !important;
    box-sizing: border-box !important;
}

body.study-workspace-active #quizView,
body.study-workspace-active #noteView,
body.study-workspace-active #interrogationView,
body.study-workspace-active #mindMapView {
    flex: 1 1 0 !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 28px 32px 44px !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

body.study-workspace-active #quizEditor,
body.study-workspace-active #noteEditor,
body.study-workspace-active #mindMapView > .new-mm-container,
body.study-workspace-active #interrogationView > .interrog-shell {
    width: min(100%, 1040px) !important;
    max-width: 1040px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

/* Legacy Quiz/Notes shells owned the viewport and painted a scrollbar track
   across the lower edge. Let the Study view handle overflow consistently for
   every helper, while keeping generated results scrollable when they grow. */
body.study-workspace-active #quizEditor,
body.study-workspace-active #noteEditor {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

/* Mind Map is the geometry reference for every Study Helper. Normalize the
   oral-exam wrapper to the same content column before its header and input card. */
body.study-workspace-active #interrogationView > .interrog-shell,
body.study-workspace-active #interrogSetup {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

body.study-workspace-active .study-module-header-block {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 148px;
    align-items: start !important;
    column-gap: 24px !important;
    row-gap: 0 !important;
    width: 100% !important;
    height: 128px !important;
    min-height: 128px !important;
    margin: 0 0 18px !important;
    padding: 0 0 20px !important;
    box-sizing: border-box !important;
}

body.study-workspace-active .study-module-header-block .header-left {
    grid-column: 1;
    grid-row: 1;
    align-items: flex-start !important;
    min-width: 0 !important;
    gap: 14px !important;
}

body.study-workspace-active .study-module-header-block .header-info {
    min-width: 0 !important;
    gap: 4px !important;
}

body.study-workspace-active .study-module-header-block .header-title {
    white-space: nowrap;
}

body.study-workspace-active .study-module-header-block .header-right-mode {
    grid-column: 2;
    grid-row: 1;
    align-self: start !important;
    justify-content: stretch !important;
    width: 148px !important;
    padding-top: 0 !important;
}

/* Segmented options are one framed control. The active option is a single
   inset capsule, so it cannot overlap the frame or another indicator. */
body.study-workspace-active .clean-segmented-switch.size-segmented-switch,
body.study-workspace-active .clean-segmented-switch.control-segmented-switch {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 3px !important;
    gap: 0 !important;
    border: 1px solid var(--study-border) !important;
    border-radius: 999px !important;
    corner-shape: round !important;
    background: var(--study-surface-raised) !important;
    box-shadow: none !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

body.study-workspace-active .clean-segmented-switch.size-segmented-switch {
    width: 220px !important;
}

body.study-workspace-active .clean-segmented-switch.control-segmented-switch {
    width: 148px !important;
}

body.study-workspace-active .clean-segmented-switch.control-segmented-switch.format-switch {
    width: 220px !important;
}

body.study-workspace-active .clean-segmented-switch.size-segmented-switch button,
body.study-workspace-active .clean-segmented-switch.control-segmented-switch button {
    width: auto !important;
    min-width: 0 !important;
    flex: 1 1 0 !important;
    height: 28px !important;
    padding: 0 10px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 12px !important;
}

body.study-workspace-active .clean-segmented-switch.size-segmented-switch button.active,
body.study-workspace-active .clean-segmented-switch.size-segmented-switch button.selected,
body.study-workspace-active .clean-segmented-switch.control-segmented-switch button.active,
body.study-workspace-active .clean-segmented-switch.control-segmented-switch button.selected {
    background: var(--study-accent) !important;
    color: #fff !important;
    /* Match the existing selector outline; the active slider should not be a capsule. */
    border-radius: 999px !important;
    corner-shape: round !important;
    box-shadow: 0 3px 10px color-mix(in srgb, var(--study-accent) 24%, transparent) !important;
}

/* The active button is the single visual selection state in the Study
   workspace. The shared animated pill would otherwise render a second
   highlight on top of the active button, especially after switching to
   Balance. Keep it available for the chat switch, but disable it here. */
.clean-segmented-switch.control-segmented-switch .segmented-switch-pill,
.clean-segmented-switch.size-segmented-switch .segmented-switch-pill {
    display: none !important;
}

/* Keep every setup action on the same right edge, including legacy panels. */
body.study-workspace-active #interrogSetup {
    display: flex !important;
    flex-direction: column !important;
}

body.study-workspace-active #interrogStartBtn {
    align-self: flex-end !important;
    margin-left: auto !important;
}

/* Keep the source picker available without letting it add a module-specific
   row.  That preserves Mind Map's input-card height and the shared Generate
   baseline while placing the picker at one predictable point. */
body.study-workspace-active .study-input-container-card {
    position: relative !important;
}

body.study-workspace-active .study-input-container-card .study-library-picker-wrap {
    position: absolute !important;
    top: 18px !important;
    right: 18px !important;
    z-index: 1;
    margin: 0 !important;
}

/* At medium widths, give the option row the full column and place the mode
   control on its own predictable row. This prevents Note Maker's extra
   format selector from colliding with the input card. */
@media (max-width: 1000px) and (min-width: 721px) {
    body.study-workspace-active .study-module-header-block {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto;
        height: 168px !important;
        min-height: 168px !important;
    }

    body.study-workspace-active .study-module-header-block .header-left {
        grid-column: 1;
        grid-row: 1;
    }

    body.study-workspace-active .study-module-header-block .header-right-mode {
        grid-column: 1;
        grid-row: 2;
        width: 148px !important;
        padding-top: 0 !important;
    }

    body.study-workspace-active .study-module-header-block .header-size-row {
        flex-wrap: nowrap !important;
        overflow-x: auto;
        scrollbar-width: none;
    }

    body.study-workspace-active .study-module-header-block .header-size-row::-webkit-scrollbar {
        display: none;
    }
}

.study-dropdown-menu {
    border-color: var(--study-border) !important;
    border-radius: 10px !important;
    background: var(--study-surface) !important;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.quiz-type-row { border-radius: 7px !important; }
#quizStatusArea { border-color: var(--study-border) !important; border-radius: 12px !important; background: var(--study-surface) !important; }

/* Keep tab changes present but quiet: no large sliding panel animation. */
body.study-workspace-active .interrog-panel { animation: studyPanelIn 160ms ease-out both; }
@keyframes studyPanelIn { from { opacity: 0.85; } to { opacity: 1; } }

@media (max-width: 720px) {
    body.study-workspace-active #quizView,
body.study-workspace-active #noteView,
body.study-workspace-active #interrogationView,
body.study-workspace-active #mindMapView { padding: 20px 16px 32px; }
    .study-browser-tab-strip { padding-left: 12px; padding-right: 12px; }
    #studyHelperTabBar .browser-tab,
    #mediaTabBar .browser-tab { min-height: 42px; padding: 0 15px; font-size: 14px; }
    .study-module-header-block {
        display: flex !important;
        flex-direction: column;
        gap: 14px;
        height: auto !important;
        min-height: 0 !important;
    }
    .study-module-header-block .header-right-mode {
        width: 148px !important;
        margin-left: 54px;
    }
    .study-module-header-block .header-title { font-size: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    #studyHelperTabBar .browser-tab,
    #mediaTabBar .browser-tab,
    .study-textarea-input,
    .study-generate-btn,
    .interrog-start-btn { transition: none !important; }
    body.study-workspace-active .interrog-panel { animation: none !important; }
}

/* The compact primary sidebar is fixed on small screens. Keep the workspace
   in the unobstructed content area instead of letting it render underneath. */
@media (max-width: 768px) {
    body.study-workspace-active #quizView,
    body.study-workspace-active #noteView,
    body.study-workspace-active #interrogationView,
    body.study-workspace-active #mindMapView {
        padding: 24px 16px 32px 88px !important;
    }

    body.sidebar-open.study-workspace-active #quizView,
    body.sidebar-open.study-workspace-active #noteView,
    body.sidebar-open.study-workspace-active #interrogationView,
    body.sidebar-open.study-workspace-active #mindMapView {
        padding-left: calc(min(82vw, 320px) + 16px) !important;
    }

    body.study-workspace-active .study-module-header-block {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto;
        height: 168px !important;
        min-height: 168px !important;
        gap: 14px !important;
    }

    body.study-workspace-active .study-module-header-block .header-left {
        grid-column: 1;
        grid-row: 1;
        width: 100% !important;
    }

    body.study-workspace-active .study-module-header-block .header-right-mode {
        grid-column: 1;
        grid-row: 2;
        width: 148px !important;
        margin-left: 0 !important;
        padding-top: 0 !important;
    }

    body.study-workspace-active .study-module-header-block .header-title {
        white-space: nowrap;
    }

    body.study-workspace-active .study-module-header-block .header-size-row {
        flex-wrap: nowrap !important;
        max-width: 100%;
        overflow-x: auto;
        scrollbar-width: none;
    }

    body.study-workspace-active .study-module-header-block .header-size-row::-webkit-scrollbar {
        display: none;
    }

    body.study-workspace-active #quizEditor,
    body.study-workspace-active #noteEditor,
    body.study-workspace-active #mindMapView > .new-mm-container,
    body.study-workspace-active #interrogationView > .interrog-shell {
        width: 100% !important;
        max-width: none !important;
    }

    #studyHelperTabBar.browser-tabs-container,
    #mediaTabBar.browser-tabs-container { padding: 0 12px; }

}