html,
body {
    scrollbar-gutter: stable;
}

body.tag-picker-open {
    overflow: hidden;
    overscroll-behavior: contain;
}

.questions-container .search-box {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 170px max-content max-content !important;
    align-items: stretch !important;
    gap: 0.7rem !important;
}

.questions-container #questionsSearch,
.questions-container #difficultyFilter,
.questions-container #questionFilterBtn,
.questions-container #uploadQuestionBtn {
    min-height: 44px !important;
    height: 44px !important;
    font-size: 0.92rem !important;
    line-height: 1 !important;
    /* radius omitted: design-system.css owns shape (input -> md, button -> pill) */
    box-shadow: none !important;
    margin: 0 !important;
}

.questions-container #questionsSearch {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 1.15rem !important;
}

.questions-container #difficultyFilter {
    width: 170px !important;
    min-width: 170px !important;
    max-width: 170px !important;
    padding: 0 2.1rem 0 0.95rem !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background: rgba(255, 255, 255, 0.92) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%2333455f' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e") no-repeat right 0.8rem center / 14px 14px !important;
    border: 1px solid rgba(15, 23, 42, 0.10) !important;
    color: #182235 !important;
    color-scheme: light !important;
}

.questions-container #difficultyFilter::-ms-expand {
    display: none !important;
}

.questions-container #difficultyFilter option {
    background: #ffffff !important;
    color: #182235 !important;
}

.questions-container #questionFilterBtn,
.questions-container #uploadQuestionBtn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.45rem !important;
    white-space: nowrap !important;
}

.questions-container #questionFilterBtn {
    min-width: 168px !important;
}

.questions-container #uploadQuestionBtn {
    min-width: 176px !important;
}

body.dark-mode .questions-container #questionsSearch,
body.dark-mode .questions-container #questionFilterBtn,
body.dark-mode .questions-container #uploadQuestionBtn,
[data-theme="dark"] .questions-container #questionsSearch,
[data-theme="dark"] .questions-container #questionFilterBtn,
[data-theme="dark"] .questions-container #uploadQuestionBtn {
    background-color: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

body.dark-mode .questions-container #questionsSearch::placeholder,
[data-theme="dark"] .questions-container #questionsSearch::placeholder {
    color: rgba(255, 255, 255, 0.46) !important;
}

body.dark-mode .questions-container #difficultyFilter,
[data-theme="dark"] .questions-container #difficultyFilter {
    background: rgba(255, 255, 255, 0.04) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23d8e0ee' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e") no-repeat right 0.8rem center / 14px 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    color-scheme: dark !important;
}

body.dark-mode .questions-container #difficultyFilter option,
[data-theme="dark"] .questions-container #difficultyFilter option {
    background: #161d2c !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

body.dark-mode .questions-container #questionFilterBtn.has-selection,
body.dark-mode .questions-container #uploadQuestionBtn,
[data-theme="dark"] .questions-container #questionFilterBtn.has-selection,
[data-theme="dark"] .questions-container #uploadQuestionBtn {
    background-color: rgba(255, 255, 255, 0.96) !important;
    border-color: rgba(255, 255, 255, 0.96) !important;
    color: #0f172a !important;
}

.editor-wrapper {
    --editor-control-height: 48px;
    --editor-control-radius: 16px;
    --editor-surface: rgba(255, 255, 255, 0.92);
    --editor-surface-strong: #ffffff;
    --editor-border: rgba(15, 23, 42, 0.10);
    --editor-text: #182235;
    --editor-muted: rgba(24, 34, 53, 0.62);
    --editor-button-bg: rgba(255, 255, 255, 0.92);
    --editor-button-border: rgba(15, 23, 42, 0.10);
    --editor-button-text: #182235;
    --editor-button-active-bg: rgba(15, 23, 42, 0.92);
    --editor-button-active-border: rgba(15, 23, 42, 0.92);
    --editor-button-active-text: #ffffff;
}

body.dark-mode .editor-wrapper,
[data-theme="dark"] .editor-wrapper {
    --editor-surface: rgba(20, 28, 42, 0.92);
    --editor-surface-strong: rgba(15, 21, 33, 0.96);
    --editor-border: rgba(255, 255, 255, 0.10);
    --editor-text: rgba(255, 255, 255, 0.94);
    --editor-muted: rgba(226, 232, 240, 0.70);
    --editor-button-bg: rgba(255, 255, 255, 0.04);
    --editor-button-border: rgba(255, 255, 255, 0.18);
    --editor-button-text: rgba(255, 255, 255, 0.94);
    --editor-button-active-bg: rgba(255, 255, 255, 0.96);
    --editor-button-active-border: rgba(255, 255, 255, 0.96);
    --editor-button-active-text: #0f172a;
}

.editor-wrapper .editor-hero-sub,
.editor-wrapper .question-tag-field__hint,
.editor-wrapper .question-tag-summary__empty {
    color: var(--editor-muted) !important;
}

.editor-card .form-group input[type="text"],
.editor-card .form-group input[type="number"],
.editor-card .form-group select,
.editor-card .question-tag-field__trigger,
.editor-actions .btn,
.editor-hero-right .btn {
    min-height: var(--editor-control-height) !important;
    border-radius: var(--editor-control-radius) !important;
    box-shadow: none !important;
}

.editor-card .form-group input[type="text"],
.editor-card .form-group input[type="number"],
.editor-card .form-group select,
.editor-card textarea,
.editor-card .helper-box,
.editor-card .question-tag-field__trigger,
.editor-card .md-editor,
.editor-card .md-toolbar,
.editor-card .md-tabs,
.editor-card .md-body,
.editor-card .md-preview {
    background: var(--editor-surface) !important;
    border-color: var(--editor-border) !important;
    color: var(--editor-text) !important;
    box-shadow: none !important;
}

.editor-card .md-textarea,
.editor-card .md-preview {
    background: var(--editor-surface-strong) !important;
    color: var(--editor-text) !important;
}

/* Keep the grading controls softly rounded instead of inheriting the global
   pill shape. The radius tightens slightly on narrow screens while the answer
   field retains a useful, content-friendly editing height. */
html body .editor-wrapper #gradingConfigRow #answerFormat,
html body .editor-wrapper #gradingConfigRow #acceptedAnswers {
    border-radius: clamp(10px, 1vw, 14px) !important;
}

html body .editor-wrapper #gradingConfigRow #answerFormat {
    min-height: var(--editor-control-height) !important;
}

html body .editor-wrapper #gradingConfigRow #acceptedAnswers {
    min-height: clamp(96px, 9vw, 116px) !important;
    padding: 14px 16px !important;
    line-height: 1.6 !important;
    resize: vertical !important;
}

.editor-card .md-tab,
.editor-card .md-btn,
.editor-card .question-tag-field__trigger,
.editor-actions .btn,
.editor-hero-right .btn {
    background: var(--editor-button-bg) !important;
    border-color: var(--editor-button-border) !important;
    color: var(--editor-button-text) !important;
    box-shadow: none !important;
}

.editor-wrapper #correctAnswerRow > label,
.editor-wrapper #correctAnswerRow .form-group > label,
.editor-wrapper label[for="correctAnswer"] {
    display: block !important;
    width: 100% !important;
    margin-bottom: 0.5rem !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
}

.editor-actions .btn.btn-primary,
.editor-card .question-tag-field__trigger.has-selection {
    background: var(--editor-button-active-bg) !important;
    border-color: var(--editor-button-active-border) !important;
    color: var(--editor-button-active-text) !important;
}

.question-tag-picker-modal {
    padding: clamp(8px, 2vw, 18px) !important;
}

.question-tag-picker-content {
    width: min(920px, calc(100vw - clamp(12px, 4vw, 56px))) !important;
    max-width: min(920px, calc(100vw - clamp(12px, 4vw, 56px))) !important;
    max-height: min(760px, calc(100dvh - clamp(12px, 4vw, 32px))) !important;
}

.question-tag-picker-modal .question-tag-picker-content {
    margin: auto !important;
    opacity: 0 !important;
    transition: opacity 0.2s ease !important;
    will-change: auto !important;
}

.question-tag-picker-modal.active .question-tag-picker-content {
    opacity: 1 !important;
    margin: auto !important;
}

.question-tag-picker-modal .modal-overlay {
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
}

.question-tag-picker-toolbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 320px) !important;
    align-items: center !important;
    gap: 0.8rem !important;
}

.question-tag-picker-search,
body.dark-mode .question-tag-picker-search,
[data-theme="dark"] .question-tag-picker-search {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    padding: 0 0.8rem !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

.question-tag-picker-search input,
body.dark-mode .question-tag-picker-search input,
[data-theme="dark"] .question-tag-picker-search input {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

@media (max-width: 1080px) {
    .questions-container .search-box {
        grid-template-columns: minmax(0, 1fr) 170px auto !important;
    }

    .questions-container #uploadQuestionBtn {
        grid-column: 2 / span 2;
        justify-self: end;
    }
}

@media (max-width: 820px) {
    .questions-container .search-box {
        grid-template-columns: 1fr !important;
    }

    .questions-container #difficultyFilter,
    .questions-container #questionFilterBtn,
    .questions-container #uploadQuestionBtn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    .questions-container #uploadQuestionBtn {
        grid-column: auto;
        justify-self: stretch;
    }
}

@media (max-width: 900px) {
    .question-tag-picker-content {
        width: calc(100vw - 18px) !important;
        max-width: calc(100vw - 18px) !important;
        max-height: calc(100dvh - 18px) !important;
    }

    .question-tag-picker-toolbar {
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
    }
}

@media (max-width: 640px) {
    .question-tag-picker-modal {
        padding: 6px !important;
    }

    .question-tag-picker-content {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        max-height: calc(100dvh - 12px) !important;
    }

    .question-tag-picker-modal .modal-header,
    .question-tag-picker-modal .modal-body,
    .question-tag-picker-modal .modal-footer {
        padding-left: 0.9rem !important;
        padding-right: 0.9rem !important;
    }
}


/* Extracted question-page overrides from main.css */
/* Final shared question toolbar + responsive tag picker */
.questions-container {
    --questions-toolbar-height: 44px;
    --questions-toolbar-radius: 22px;
    --questions-toolbar-font-size: 0.92rem;
    --questions-toolbar-gap: 0.7rem;
    --questions-toolbar-bg: rgba(255, 255, 255, 0.92);
    --questions-toolbar-border: rgba(15, 23, 42, 0.10);
    --questions-toolbar-text: #182235;
    --questions-toolbar-placeholder: rgba(24, 34, 53, 0.42);
    --questions-toolbar-active-bg: #000000;
    --questions-toolbar-active-border: #000000;
    --questions-toolbar-active-text: #ffffff;
    --questions-toolbar-option-bg: #ffffff;
    --questions-toolbar-option-text: #182235;
    --questions-toolbar-arrow: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%2333455f' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
}

body.dark-mode .questions-container,
[data-theme="dark"] .questions-container {
    --questions-toolbar-bg: rgba(255, 255, 255, 0.04);
    --questions-toolbar-border: rgba(255, 255, 255, 0.18);
    --questions-toolbar-text: rgba(255, 255, 255, 0.92);
    --questions-toolbar-placeholder: rgba(255, 255, 255, 0.46);
    --questions-toolbar-active-bg: #000000;
    --questions-toolbar-active-border: #000000;
    --questions-toolbar-active-text: #ffffff;
    --questions-toolbar-option-bg: #161d2c;
    --questions-toolbar-option-text: rgba(255, 255, 255, 0.92);
    --questions-toolbar-arrow: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23d8e0ee' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
}

.questions-container .search-box {
    display: flex !important;
    align-items: stretch !important;
    gap: var(--questions-toolbar-gap) !important;
    flex-wrap: wrap !important;
}

.questions-container #questionsSearch,
.questions-container #difficultyFilter,
.questions-container #questionFilterBtn,
.questions-container #uploadQuestionBtn {
    min-height: var(--questions-toolbar-height) !important;
    height: var(--questions-toolbar-height) !important;
    font-size: var(--questions-toolbar-font-size) !important;
    line-height: 1 !important;
    /* radius omitted: design-system.css owns shape (input -> md, button -> pill) */
    border: 1px solid var(--questions-toolbar-border) !important;
    box-shadow: none !important;
}

.questions-container #questionsSearch,
.questions-container #difficultyFilter,
.questions-container #questionFilterBtn {
    background: var(--questions-toolbar-bg) !important;
    background-image: none !important;
    color: var(--questions-toolbar-text) !important;
}

.questions-container #questionsSearch {
    flex: 1 1 380px !important;
    padding: 0 1.25rem !important;
}

.questions-container #questionsSearch::placeholder {
    color: var(--questions-toolbar-placeholder) !important;
}

.questions-container #difficultyFilter {
    flex: 0 0 156px !important;
    min-width: 156px !important;
    padding: 0 2.15rem 0 0.95rem !important;
    background-image: var(--questions-toolbar-arrow) !important;
    background-repeat: no-repeat !important;
    background-position: right 0.8rem center !important;
    background-size: 14px 14px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    color-scheme: light !important;
}

.questions-container #difficultyFilter::-ms-expand {
    display: none;
}

.questions-container #difficultyFilter option {
    background: var(--questions-toolbar-option-bg) !important;
    color: var(--questions-toolbar-option-text) !important;
}

.questions-container #questionFilterBtn,
.questions-container #uploadQuestionBtn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    width: var(--questions-toolbar-height) !important;
    min-width: var(--questions-toolbar-height) !important;
    max-width: var(--questions-toolbar-height) !important;
    flex: 0 0 var(--questions-toolbar-height) !important;
    padding: 0 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.questions-container #questionFilterBtn:hover,
.questions-container #questionFilterBtn:focus-visible,
.questions-container #questionFilterBtn:active,
.questions-container #uploadQuestionBtn:hover,
.questions-container #uploadQuestionBtn:focus-visible,
.questions-container #uploadQuestionBtn:active {
    transform: none !important;
}

.questions-container #questionFilterBtn:hover,
.questions-container #questionFilterBtn:focus-visible,
.questions-container #questionFilterBtn:active,
.question-tag-search-summary__clear:hover,
.question-tag-search-summary__clear:focus-visible,
.question-tag-search-summary__clear:active,
.question-tag-picker-clear:hover,
.question-tag-picker-clear:focus-visible,
.question-tag-picker-clear:active {
    background: #000000 !important;
    border-color: #000000 !important;
    color: #ffffff !important;
}

.questions-container #questionFilterBtn i,
.questions-container #uploadQuestionBtn i {
    color: inherit !important;
    font-size: 1rem !important;
}

.questions-container #uploadQuestionBtn:hover,
.questions-container #uploadQuestionBtn:focus-visible,
.questions-container #uploadQuestionBtn:active {
    background: #ffffff !important;
    border-color: #000000 !important;
    color: #000000 !important;
}

.question-tag-picker-content {
    width: min(960px, calc(100vw - clamp(16px, 4vw, 72px))) !important;
    max-width: min(960px, calc(100vw - clamp(16px, 4vw, 72px))) !important;
    max-height: min(760px, calc(100dvh - 24px)) !important;
    border-radius: clamp(16px, 2vw, 24px) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

.question-tag-picker-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-gutter: stable !important;
}

.question-tag-picker-selected__header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.75rem !important;
}

.question-tag-picker-selected__header > *:first-child {
    flex: 0 1 auto !important;
}

.question-tag-picker-selected__header > span {
    display: none !important;
}

.question-tag-picker-selected__header .question-tag-picker-clear {
    margin-left: auto !important;
    flex: 0 0 auto !important;
}

.question-tag-search-summary__row {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 0.75rem !important;
    width: 100% !important;
    margin-top: 0 !important;
}

.question-tag-search-summary__chips {
    display: flex !important;
    align-items: flex-start !important;
    align-content: flex-start !important;
    flex-wrap: wrap !important;
    gap: 0.5rem !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

.question-tag-search-summary__clear {
    margin-left: auto !important;
    flex: 0 0 auto !important;
    align-self: flex-start !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
}

.question-tag-picker-toolbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) clamp(184px, 24vw, 280px) !important;
    align-items: center !important;
    gap: clamp(0.5rem, 1vw, 0.9rem) !important;
    min-width: 0 !important;
}

.question-tag-picker-modal .question-tag-picker-content {
    margin: auto !important;
    opacity: 0 !important;
    transition: opacity 0.2s ease !important;
    will-change: auto !important;
}

.question-tag-picker-modal.active .question-tag-picker-content {
    opacity: 1 !important;
    margin: auto !important;
}

.question-tag-picker-modal .modal-overlay {
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
}

.question-tag-picker-search {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    align-items: center !important;
    gap: 0.7rem !important;
    min-width: 0 !important;
    width: 100% !important;
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 0.85rem !important;
    border-radius: 12px !important;
    border: 1px solid rgba(15, 23, 42, 0.10) !important;
    background: rgba(255, 255, 255, 0.92) !important;
    box-shadow: none !important;
}

.question-tag-picker-search i {
    font-size: 1rem !important;
    color: rgba(15, 23, 42, 0.78) !important;
}

.question-tag-picker-search input {
    width: 100% !important;
    min-width: 0 !important;
    min-height: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 0.98rem !important;
    color: #182235 !important;
    caret-color: currentColor !important;
}

.question-tag-picker-search input::placeholder {
    color: rgba(24, 34, 53, 0.42) !important;
}

body.dark-mode .question-tag-picker-search,
[data-theme="dark"] .question-tag-picker-search {
    border-color: rgba(255, 255, 255, 0.12) !important;
    background: rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .question-tag-picker-search i,
[data-theme="dark"] .question-tag-picker-search i {
    color: rgba(255, 255, 255, 0.78) !important;
}

body.dark-mode .question-tag-picker-search input,
[data-theme="dark"] .question-tag-picker-search input {
    color: rgba(255, 255, 255, 0.92) !important;
}

body.dark-mode .question-tag-picker-search input::placeholder,
[data-theme="dark"] .question-tag-picker-search input::placeholder {
    color: rgba(255, 255, 255, 0.44) !important;
}

.question-tag-picker-tabs {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 0.4rem !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

.question-tag-picker-tab {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 clamp(0.42rem, 0.85vw, 1rem) !important;
    font-size: clamp(0.88rem, 0.96vw, 1rem) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

@media (max-width: 900px) {
    .question-tag-picker-content {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        max-height: calc(100dvh - 20px) !important;
    }

    .question-tag-picker-toolbar {
        grid-template-columns: minmax(0, 1fr) clamp(160px, 24vw, 228px) !important;
        gap: 0.45rem !important;
    }

    .question-tag-picker-search {
        min-height: 40px !important;
        height: 40px !important;
        padding: 0 0.7rem !important;
    }

    .question-tag-picker-tabs {
        gap: 0.28rem !important;
    }

    .question-tag-picker-tab {
        min-height: 38px !important;
        height: 38px !important;
        padding: 0 0.5rem !important;
        font-size: 0.84rem !important;
    }
}

@media (max-width: 640px) {
    .question-tag-picker-content {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        max-height: calc(100dvh - 12px) !important;
        border-radius: 16px !important;
    }

    .question-tag-picker-modal .modal-header,
    .question-tag-picker-modal .modal-body,
    .question-tag-picker-modal .modal-footer {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .question-tag-picker-toolbar {
        grid-template-columns: minmax(0, 1fr) 150px !important;
        gap: 0.34rem !important;
    }

    .question-tag-picker-section__chips,
    .question-tag-picker-selected__chips {
        gap: 0.42rem !important;
    }

    .question-tag-picker-tab {
        min-height: 34px !important;
        height: 34px !important;
        padding: 0 0.32rem !important;
        font-size: 0.74rem !important;
    }

    .question-tag-picker-search {
        min-height: 36px !important;
        height: 36px !important;
        padding: 0 0.6rem !important;
        border-radius: 9px !important;
    }

    .question-tag-picker-search input {
        font-size: 0.9rem !important;
    }

    .question-tag-picker-modal .modal-footer {
        display: flex !important;
        gap: 0.65rem !important;
    }

    .question-tag-picker-modal .modal-footer .btn {
        flex: 1 1 0 !important;
        min-height: 42px !important;
    }
}

@media (max-width: 480px) {
    .question-tag-picker-modal {
        padding: 4px !important;
    }

    .question-tag-picker-content {
        width: calc(100vw - 8px) !important;
        max-width: calc(100vw - 8px) !important;
        max-height: calc(100dvh - 8px) !important;
        border-radius: 14px !important;
    }

    .question-tag-picker-toolbar {
        grid-template-columns: minmax(0, 1fr) 140px !important;
        gap: 0.28rem !important;
    }

    .question-tag-picker-tabs {
        gap: 0.2rem !important;
    }

    .question-tag-picker-search {
        min-height: 34px !important;
        height: 34px !important;
        padding: 0 0.52rem !important;
        border-radius: 9px !important;
    }

    .question-tag-picker-search input {
        font-size: 0.86rem !important;
    }

    .question-tag-picker-tab {
        min-height: 30px !important;
        height: 30px !important;
        padding: 0 0.24rem !important;
        font-size: 0.68rem !important;
    }
}

/* Final dark-theme harmonization for upload/edit question pages */
body.dark-mode .editor-card,
body.dark-mode .editor-wrapper .card.editor-card,
[data-theme="dark"] .editor-card,
[data-theme="dark"] .editor-wrapper .card.editor-card {
    background: rgba(15, 21, 33, 0.92) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.18) !important;
}

body.dark-mode .editor-hero-sub,
body.dark-mode .editor-card .question-tag-field__hint,
body.dark-mode .editor-card .question-tag-summary__empty,
[data-theme="dark"] .editor-hero-sub,
[data-theme="dark"] .editor-card .question-tag-field__hint,
[data-theme="dark"] .editor-card .question-tag-summary__empty {
    color: rgba(226, 232, 240, 0.70) !important;
}

body.dark-mode .editor-card .form-group input[type="text"],
body.dark-mode .editor-card .form-group input[type="number"],
body.dark-mode .editor-card .form-group textarea,
body.dark-mode .editor-card .form-group select,
[data-theme="dark"] .editor-card .form-group input[type="text"],
[data-theme="dark"] .editor-card .form-group input[type="number"],
[data-theme="dark"] .editor-card .form-group textarea,
[data-theme="dark"] .editor-card .form-group select {
    background: #161d2c !important;
    border-color: rgba(133, 149, 183, 0.22) !important;
    color: #eef4ff !important;
    box-shadow: none !important;
}

body.dark-mode .editor-card .form-group input::placeholder,
body.dark-mode .editor-card .form-group textarea::placeholder,
[data-theme="dark"] .editor-card .form-group input::placeholder,
[data-theme="dark"] .editor-card .form-group textarea::placeholder {
    color: rgba(238, 244, 255, 0.46) !important;
}

body.dark-mode .editor-card .form-group input:focus,
body.dark-mode .editor-card .form-group textarea:focus,
body.dark-mode .editor-card .form-group select:focus,
[data-theme="dark"] .editor-card .form-group input:focus,
[data-theme="dark"] .editor-card .form-group textarea:focus,
[data-theme="dark"] .editor-card .form-group select:focus {
    background: #1a2335 !important;
    border-color: rgba(91, 141, 239, 0.42) !important;
    box-shadow: 0 0 0 3px rgba(91, 141, 239, 0.12) !important;
}

body.dark-mode .editor-wrapper .btn-secondary,
body.dark-mode .editor-wrapper a.btn-secondary,
[data-theme="dark"] .editor-wrapper .btn-secondary,
[data-theme="dark"] .editor-wrapper a.btn-secondary {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

body.dark-mode .editor-wrapper .btn-secondary:hover,
body.dark-mode .editor-wrapper .btn-secondary:active,
body.dark-mode .editor-wrapper a.btn-secondary:hover,
body.dark-mode .editor-wrapper a.btn-secondary:active,
[data-theme="dark"] .editor-wrapper .btn-secondary:hover,
[data-theme="dark"] .editor-wrapper .btn-secondary:active,
[data-theme="dark"] .editor-wrapper a.btn-secondary:hover,
[data-theme="dark"] .editor-wrapper a.btn-secondary:active {
    background: rgba(255, 255, 255, 0.10) !important;
    border-color: rgba(255, 255, 255, 0.16) !important;
    color: #ffffff !important;
}

body.dark-mode .editor-wrapper .editor-actions .btn-primary,
[data-theme="dark"] .editor-wrapper .editor-actions .btn-primary {
    background: #5b8def !important;
    border-color: #5b8def !important;
    color: #ffffff !important;
}

body.dark-mode .editor-wrapper .editor-actions .btn-primary:hover,
body.dark-mode .editor-wrapper .editor-actions .btn-primary:active,
[data-theme="dark"] .editor-wrapper .editor-actions .btn-primary:hover,
[data-theme="dark"] .editor-wrapper .editor-actions .btn-primary:active {
    background: #6b9af3 !important;
    border-color: #6b9af3 !important;
    color: #ffffff !important;
}

body.dark-mode button.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger,
[data-theme="dark"] button.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger {
    background: rgba(22, 29, 44, 0.92) !important;
    border-color: rgba(133, 149, 183, 0.22) !important;
    color: #eef4ff !important;
}

body.dark-mode button.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger.has-selection,
[data-theme="dark"] button.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger.question-tag-field__trigger.has-selection {
    background: rgba(91, 141, 239, 0.18) !important;
    border-color: rgba(91, 141, 239, 0.38) !important;
    color: #eef4ff !important;
}

body.dark-mode .editor-card .md-editor,
[data-theme="dark"] .editor-card .md-editor {
    background: rgba(15, 21, 33, 0.96) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

body.dark-mode .editor-card .md-toolbar,
body.dark-mode .editor-card .md-tabs,
[data-theme="dark"] .editor-card .md-toolbar,
[data-theme="dark"] .editor-card .md-tabs {
    background: rgba(20, 28, 43, 0.96) !important;
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .editor-card .md-body,
[data-theme="dark"] .editor-card .md-body {
    background: rgba(15, 21, 33, 0.96) !important;
}

body.dark-mode .editor-card .md-btn,
body.dark-mode .editor-card .md-tab,
[data-theme="dark"] .editor-card .md-btn,
[data-theme="dark"] .editor-card .md-tab {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: rgba(236, 242, 255, 0.88) !important;
    box-shadow: none !important;
}

body.dark-mode .editor-card .md-btn:hover,
body.dark-mode .editor-card .md-btn:focus-visible,
body.dark-mode .editor-card .md-tab:hover,
body.dark-mode .editor-card .md-tab:focus-visible,
[data-theme="dark"] .editor-card .md-btn:hover,
[data-theme="dark"] .editor-card .md-btn:focus-visible,
[data-theme="dark"] .editor-card .md-tab:hover,
[data-theme="dark"] .editor-card .md-tab:focus-visible {
    background: rgba(91, 141, 239, 0.14) !important;
    border-color: rgba(91, 141, 239, 0.28) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

body.dark-mode .editor-card .md-tab.active,
[data-theme="dark"] .editor-card .md-tab.active {
    background: rgba(91, 141, 239, 0.20) !important;
    border-color: rgba(91, 141, 239, 0.38) !important;
    color: #ffffff !important;
}

body.dark-mode .editor-card .md-btn i,
body.dark-mode .editor-card .md-glyph,
body.dark-mode .editor-card .md-hint,
[data-theme="dark"] .editor-card .md-btn i,
[data-theme="dark"] .editor-card .md-glyph,
[data-theme="dark"] .editor-card .md-hint {
    color: inherit !important;
}

body.dark-mode .editor-card .md-sep,
[data-theme="dark"] .editor-card .md-sep {
    background: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .editor-card .md-textarea,
body.dark-mode .editor-card .md-preview,
[data-theme="dark"] .editor-card .md-textarea,
[data-theme="dark"] .editor-card .md-preview {
    background: #161d2c !important;
    border: 1px solid rgba(133, 149, 183, 0.22) !important;
    color: #eef4ff !important;
    box-shadow: none !important;
}

body.dark-mode .editor-card .md-textarea::placeholder,
[data-theme="dark"] .editor-card .md-textarea::placeholder {
    color: rgba(238, 244, 255, 0.46) !important;
}

body.dark-mode .editor-card .md-preview pre,
[data-theme="dark"] .editor-card .md-preview pre {
    background: rgba(8, 11, 19, 0.72) !important;
    border: 1px solid rgba(133, 149, 183, 0.16) !important;
}

body.dark-mode .editor-card .md-preview code,
[data-theme="dark"] .editor-card .md-preview code {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #eef4ff !important;
}

.questions-container #questionFilterBtn,
.questions-container #uploadQuestionBtn,
.question-tag-picker-clear,
.question-tag-picker-tab,
.question-tag-picker-modal .modal-close,
.editor-card .question-tag-field__trigger,
.editor-card .md-btn,
.editor-card .md-tab,
.editor-actions .btn,
.editor-hero-right .btn {
    border-radius: 9999px !important;
}

/* Final question-tag normalization for question pages */
.question-tag-inline,
.question-topic-tag,
.question-tag-chip,
.question-tag-choice,
.question-tag-chip--selected,
.question-tag-summary .question-tag-inline,
.question-tag-search-summary__chips .question-tag-inline,
.question-tag-picker-selected__chips .question-tag-chip,
body.dark-mode .question-tag-inline,
body.dark-mode .question-topic-tag,
body.dark-mode .question-tag-chip,
body.dark-mode .question-tag-choice,
body.dark-mode .question-tag-chip--selected,
[data-theme="dark"] .question-tag-inline,
[data-theme="dark"] .question-topic-tag,
[data-theme="dark"] .question-tag-chip,
[data-theme="dark"] .question-tag-choice,
[data-theme="dark"] .question-tag-chip--selected {
    border-radius: 2px !important;
    box-shadow: none !important;
    background-image: none !important;
}

button.question-tag-remove.question-tag-remove.question-tag-remove.question-tag-remove.question-tag-remove,
.question-tag-inline > button.question-tag-remove.question-tag-remove.question-tag-remove.question-tag-remove,
.question-tag-chip > button.question-tag-remove.question-tag-remove.question-tag-remove.question-tag-remove,
.question-tag-search-summary__chips button.question-tag-remove.question-tag-remove.question-tag-remove.question-tag-remove,
.question-tag-summary button.question-tag-remove.question-tag-remove.question-tag-remove.question-tag-remove,
.question-tag-picker-selected__chips button.question-tag-remove.question-tag-remove.question-tag-remove.question-tag-remove,
body.dark-mode button.question-tag-remove.question-tag-remove.question-tag-remove.question-tag-remove,
[data-theme="dark"] button.question-tag-remove.question-tag-remove.question-tag-remove.question-tag-remove,
.question-tag-remove,
button.question-tag-remove,
.question-tag-inline > .question-tag-remove,
.question-tag-chip > .question-tag-remove,
.question-tag-search-summary__chips .question-tag-remove,
.question-tag-summary .question-tag-remove,
.question-tag-picker-selected__chips .question-tag-remove,
body.dark-mode .question-tag-remove,
body.dark-mode button.question-tag-remove,
[data-theme="dark"] .question-tag-remove,
[data-theme="dark"] button.question-tag-remove {
    all: unset !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 0 0 0.08rem !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    outline: none !important;
    color: inherit !important;
    font: inherit !important;
    line-height: 1 !important;
    cursor: pointer !important;
    transform: none !important;
}

.question-tag-remove:hover,
.question-tag-remove:focus,
.question-tag-remove:focus-visible,
button.question-tag-remove:hover,
button.question-tag-remove:focus,
button.question-tag-remove:focus-visible {
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    outline: none !important;
    opacity: 0.78 !important;
}

.question-tag-close,
.question-tag-remove.question-tag-remove.question-tag-remove .question-tag-close,
.question-tag-remove .question-tag-close {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 0.84rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    color: inherit !important;
    vertical-align: middle !important;
    transform: none !important;
}

/* Final restore for question-tag picker controls and colorful question tags */
.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab,
.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear,
.question-tag-picker-modal .modal-footer .btn.btn-secondary,
.question-tag-picker-modal .modal-footer .btn.btn-primary {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 0 1rem !important;
    border-radius: 9999px !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    background-image: none !important;
    color: #182235 !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab:hover,
.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab:focus-visible,
.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear:hover,
.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear:focus-visible,
.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear:active,
.question-tag-picker-modal .modal-footer .btn.btn-secondary:hover,
.question-tag-picker-modal .modal-footer .btn.btn-secondary:focus-visible,
.question-tag-picker-modal .modal-footer .btn.btn-secondary:active {
    background: #000000 !important;
    border-color: #000000 !important;
    color: #ffffff !important;
}

.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.is-active,
.question-tag-picker-modal .modal-footer .btn.btn-primary {
    background: #182235 !important;
    border-color: #182235 !important;
    color: #ffffff !important;
}

.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.is-active:hover,
.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.is-active:focus-visible,
.question-tag-picker-modal .modal-footer .btn.btn-primary:hover,
.question-tag-picker-modal .modal-footer .btn.btn-primary:focus-visible,
.question-tag-picker-modal .modal-footer .btn.btn-primary:active {
    background: #ffffff !important;
    border-color: #000000 !important;
    color: #000000 !important;
}

body.dark-mode .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab,
body.dark-mode .question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear,
body.dark-mode .question-tag-picker-modal .modal-footer .btn.btn-secondary,
body.dark-mode .question-tag-picker-modal .modal-footer .btn.btn-primary,
[data-theme="dark"] .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab,
[data-theme="dark"] .question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear,
[data-theme="dark"] .question-tag-picker-modal .modal-footer .btn.btn-secondary,
[data-theme="dark"] .question-tag-picker-modal .modal-footer .btn.btn-primary {
    border-color: rgba(255, 255, 255, 0.14) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    background-image: none !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

body.dark-mode .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab:hover,
body.dark-mode .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab:focus-visible,
body.dark-mode .question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear:hover,
body.dark-mode .question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear:focus-visible,
body.dark-mode .question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear:active,
body.dark-mode .question-tag-picker-modal .modal-footer .btn.btn-secondary:hover,
body.dark-mode .question-tag-picker-modal .modal-footer .btn.btn-secondary:focus-visible,
body.dark-mode .question-tag-picker-modal .modal-footer .btn.btn-secondary:active,
[data-theme="dark"] .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab:hover,
[data-theme="dark"] .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab:focus-visible,
[data-theme="dark"] .question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear:hover,
[data-theme="dark"] .question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear:focus-visible,
[data-theme="dark"] .question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear.question-tag-picker-clear:active,
[data-theme="dark"] .question-tag-picker-modal .modal-footer .btn.btn-secondary:hover,
[data-theme="dark"] .question-tag-picker-modal .modal-footer .btn.btn-secondary:focus-visible,
[data-theme="dark"] .question-tag-picker-modal .modal-footer .btn.btn-secondary:active {
    background: #ffffff !important;
    border-color: #ffffff !important;
    color: #0f172a !important;
}

body.dark-mode .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.is-active,
body.dark-mode .question-tag-picker-modal .modal-footer .btn.btn-primary,
[data-theme="dark"] .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.is-active,
[data-theme="dark"] .question-tag-picker-modal .modal-footer .btn.btn-primary {
    background: #ffffff !important;
    border-color: #ffffff !important;
    color: #0f172a !important;
}

body.dark-mode .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.is-active:hover,
body.dark-mode .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.is-active:focus-visible,
body.dark-mode .question-tag-picker-modal .modal-footer .btn.btn-primary:hover,
body.dark-mode .question-tag-picker-modal .modal-footer .btn.btn-primary:focus-visible,
body.dark-mode .question-tag-picker-modal .modal-footer .btn.btn-primary:active,
[data-theme="dark"] .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.is-active:hover,
[data-theme="dark"] .question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.question-tag-picker-tab.is-active:focus-visible,
[data-theme="dark"] .question-tag-picker-modal .modal-footer .btn.btn-primary:hover,
[data-theme="dark"] .question-tag-picker-modal .modal-footer .btn.btn-primary:focus-visible,
[data-theme="dark"] .question-tag-picker-modal .modal-footer .btn.btn-primary:active {
    background: #000000 !important;
    border-color: #000000 !important;
    color: #ffffff !important;
}

body.dark-mode button.question-tag-chip.question-tag-chip.question-tag-chip.question-tag-chip.question-tag-chip,
body.dark-mode button.question-tag-choice.question-tag-choice.question-tag-choice.question-tag-choice.question-tag-choice,
body.dark-mode .question-tag-chip.question-tag-chip.question-tag-chip.question-tag-chip,
body.dark-mode .question-tag-choice.question-tag-choice.question-tag-choice.question-tag-choice,
[data-theme="dark"] button.question-tag-chip.question-tag-chip.question-tag-chip.question-tag-chip.question-tag-chip,
[data-theme="dark"] button.question-tag-choice.question-tag-choice.question-tag-choice.question-tag-choice.question-tag-choice,
[data-theme="dark"] .question-tag-chip.question-tag-chip.question-tag-chip.question-tag-chip,
[data-theme="dark"] .question-tag-choice.question-tag-choice.question-tag-choice.question-tag-choice {
    background: var(--tag-tone-bg, var(--question-tag-bg)) !important;
    background-color: var(--tag-tone-bg, var(--question-tag-bg)) !important;
    background-image: none !important;
    border: 1px solid var(--tag-tone-border, var(--question-tag-border)) !important;
    color: var(--tag-tone-text, var(--question-tag-text)) !important;
}

.questions-container #questionFilterBtn i,
.questions-container #uploadQuestionBtn i {
    color: inherit !important;
    font-size: 1rem !important;
    line-height: 1 !important;
}

/* ============================================================
 * 统一题目相关页面顶部留白（与数学题库一致）
 * ============================================================ */

.question-upload-page .main-container,
.question-edit-page .main-container,
.question-detail-page .main-container,
.questions-page .main-container {
    padding: 32px 0 64px !important;
    margin: 0 auto !important;
}

/* 确保 editor-wrapper 不增加额外间距 */
.question-upload-page .editor-wrapper,
.question-edit-page .editor-wrapper {
    margin: 0 !important;
    padding: 0 !important;
}

/* 确保 question-detail-container 不增加额外间距 */
.question-detail-page .question-detail-container {
    margin: 0 !important;
    padding: 0 !important;
}