#classicQuestionnaireExport { gap: 14px; }
        #exportQuestionnaireWordBtn { min-height: 44px; flex-shrink: 0; }
        @media (max-width: 720px) {
            #classicQuestionnaireExport { align-items: stretch !important; }
            #classicQuestionnaireExport > div, #exportQuestionnaireWordBtn { width: 100%; }
        }

/* Keep the classic workspace visually consistent on wide/high-DPI screens.
   Chromium stores page zoom per hostname, so the same 1600px fixed canvas can
   look about 20% smaller after switching between Shanghai, Chongqing and the
   overseas hostname.  A viewport-relative canvas and root scale preserve the
   original overseas presentation without changing any business controls. */
@media (min-width: 1600px) {
    html { font-size: clamp(16px, 0.7142857vw, 20px); }
    body:not(.desktop-mode) .main-container,
    body:not(.desktop-mode) .site-footer {
        width: 70vw;
        max-width: 2200px;
    }
}

/* A narrow desktop window is still a supported viewport. Preserve the original
   desktop view state machine, but turn its sidebar into a compact bottom rail. */
@media (max-width: 720px) {
    body.desktop-mode .navbar { left: 0 !important; width: 100% !important; }
    body.desktop-mode .navbar-brand { max-width: 100%; font-size: 18px; min-width: 0; }
    body.desktop-mode .navbar-brand small,
    body.desktop-mode .desktop-version-badge { display: none !important; }
    body.desktop-mode .main-container { margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; max-width: 100% !important; padding: 12px 12px calc(90px + env(safe-area-inset-bottom, 0px)) !important; }
    body.desktop-mode #desktopSidebar { top: auto; bottom: 0; left: 0; width: 100%; height: auto; min-height: 56px; flex-direction: row; padding: 0 0 env(safe-area-inset-bottom, 0px); border-top: 1px solid #dce4f1; border-right: 0; z-index: 1030; }
    body.desktop-mode .desktop-sidebar-nav { display: flex; flex: 1; gap: 3px; padding: 4px; }
    body.desktop-mode .sidebar-bottom { padding: 4px; border: 0; margin: 0; }
    body.desktop-mode .sidebar-item { flex: 1; min-height: 48px; margin: 0; padding: 8px; gap: 5px; justify-content: center; white-space: nowrap; font-size: 13px; }
    body.desktop-mode .desktop-statusbar { display: none !important; }
    body.desktop-mode .form-control, body.desktop-mode .form-select { font-size: 16px; min-height: 44px; }
    body.desktop-mode .card-body { min-width: 0; }
}

/* Region entrances and the existing controls need full-width tap targets on phones. */
@media (max-width: 600px) {
    body:not(.desktop-mode) .navbar .container-fluid { grid-template-columns: 1fr !important; }
    body:not(.desktop-mode) .navbar .nav-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        width: 100%;
    }
    body:not(.desktop-mode) .navbar .nav-actions > .btn {
        width: 100%;
        min-width: 0;
        min-height: 42px;
        padding: 8px 4px;
        white-space: nowrap;
        word-break: keep-all;
        font-size: 12px;
    }
}

/* Canonical three-region polish. This override is shipped with the same
   fingerprint on Shanghai, Chongqing and overseas so the configuration modal
   cannot silently fall back to a dull/stale presentation on one region. */
#ratioConfigModal .modal-content {
    border: 1px solid rgba(37, 99, 235, .18);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .22);
}
#ratioConfigModal .modal-header {
    background: linear-gradient(115deg, #173f9d 0%, #2563d9 52%, #3b82f6 100%);
    color: #fff;
    border-bottom: 0;
    min-height: 58px;
}
#ratioConfigModal .modal-header .btn-close { filter: brightness(0) invert(1); opacity: .9; }
#ratioConfigModal .nav-tabs { background: #f8fbff; border-bottom-color: #dbeafe; }
#ratioConfigModal .nav-tabs .nav-link.active { color: #1d4ed8; font-weight: 700; border-top-color: #60a5fa; }
#ratioConfigModal .question-config-card,
#ratioConfigModal .question-item,
#ratioConfigModal .accordion-item { border-color: #dbeafe; }
.whole-text-generation-actions {
    display: inline-flex;
    flex: 0 1 460px;
    max-width: 460px;
    min-width: 260px;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}
.whole-text-generation-button { width: auto !important; min-width: 0; white-space: nowrap; box-shadow: 0 5px 14px rgba(37, 99, 235, .18); }
.whole-text-generation-actions #wholeTextGenerationHelp { line-height: 1.35; }
.whole-text-generation-status { font-weight: 600; line-height: 1.35; }
.text-pool-direct-action { display: inline-flex; align-items: flex-start; flex: 0 0 auto; }
#textAnswerBatchButton { white-space: nowrap; }
@media (max-width: 767.98px) {
    .whole-text-generation-actions { flex: 1 1 100%; max-width: 100%; min-width: 0; }
    .whole-text-generation-button, .text-pool-direct-action, #textAnswerBatchButton { width: 100% !important; }
    .text-pool-direct-action { flex-basis: 100%; }
}