.zm-math-app {
    display: grid;
    grid-template-columns: 306px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
    color: #42495a;
}

.zm-math-settings,
.zm-math-workspace {
    min-width: 0;
    border: 1px solid #e7eaf1;
    border-radius: 19px;
    background: #fff;
    box-shadow: 0 15px 40px rgba(43, 51, 82, .065);
}

.zm-math-settings {
    position: sticky;
    top: 18px;
    padding: 22px 20px 20px;
    background:
        radial-gradient(circle at 100% 0, rgba(224, 214, 255, .62), transparent 32%),
        #fff;
}

.zm-math-section-heading {
    display: flex;
    align-items: center;
    gap: 12px;
}

.zm-math-section-heading > span {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    border-radius: 13px;
    color: #5f63e7;
    background: #eef0ff;
    font-size: 17px;
}

.zm-math-section-heading h2,
.zm-math-workspace-header h2 {
    margin: 0;
    color: #272d3b;
    font-size: 20px;
    line-height: 1.35;
    font-weight: 760;
}

.zm-math-section-heading p,
.zm-math-workspace-header p {
    margin: 3px 0 0;
    color: #8a91a1;
    font-size: 12px;
    line-height: 1.6;
}

.zm-math-fieldset {
    min-width: 0;
    margin: 21px 0 0;
    padding: 0;
    border: 0;
}

.zm-math-fieldset legend,
.zm-math-field > span {
    margin-bottom: 8px;
    display: block;
    color: #555d6e;
    font-size: 12px;
    line-height: 1.4;
    font-weight: 700;
}

.zm-grade-tabs {
    padding: 4px;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 3px;
    border: 1px solid #e1e4ed;
    border-radius: 12px;
    background: #f5f6fa;
}

.zm-grade-tabs button {
    min-height: 36px !important;
    padding: 0;
    border: 0;
    border-radius: 9px !important;
    color: #697183;
    background: transparent;
    cursor: pointer;
    font-size: 13px !important;
    font-weight: 700;
    transition: color .16s ease, background .16s ease, box-shadow .16s ease;
}

.zm-grade-tabs button:hover { color: #4f5fe5; background: #f0f2ff; }
.zm-grade-tabs button.is-active {
    color: #fff;
    background: linear-gradient(130deg, #5669f2, #785ee9);
    box-shadow: 0 5px 12px rgba(86, 105, 242, .22);
}

.zm-math-form-grid {
    margin-top: 17px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 10px;
}

.zm-math-field { min-width: 0; }
.zm-math-field select {
    width: 100%;
    min-width: 0;
    height: 42px;
    padding: 8px 27px 8px 10px !important;
    color: #3e4555;
    background-color: rgba(255, 255, 255, .94);
    font-size: 12px !important;
}

.zm-math-options {
    margin-top: 17px;
    padding: 12px 13px;
    display: grid;
    gap: 9px;
    border: 1px solid #eceef4;
    border-radius: 12px;
    background: rgba(249, 250, 253, .9);
}

.zm-math-options label {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #626a7a;
    cursor: pointer;
    font-size: 12px;
    line-height: 1.45;
}

.zm-math-options input {
    width: 16px;
    height: 16px;
    min-height: 0 !important;
    margin: 0;
    padding: 0 !important;
    accent-color: #5b69ec;
}

.zm-math-options label.is-disabled { opacity: .45; cursor: not-allowed; }

.zm-math-primary {
    width: 100%;
    min-height: 48px !important;
    margin-top: 17px;
    border: 0;
    border-radius: 12px !important;
    color: #fff;
    background: linear-gradient(125deg, #5268f2, #765ee9) !important;
    box-shadow: 0 11px 23px rgba(82, 104, 242, .24);
    cursor: pointer;
    font-size: 14px !important;
    font-weight: 750;
    transition: transform .17s ease, box-shadow .17s ease;
}

.zm-math-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(82, 104, 242, .29); }
.zm-math-primary i { margin-right: 7px; }

.zm-math-templates {
    margin-top: 19px;
    padding-top: 16px;
    border-top: 1px solid #eceef4;
}

.zm-math-templates strong { color: #555d6e; font-size: 12px; }
.zm-math-templates > div { margin-top: 9px; display: flex; flex-wrap: wrap; gap: 6px; }
.zm-math-templates button {
    min-height: 31px !important;
    padding: 5px 9px;
    border: 1px solid #e2e5ed;
    border-radius: 9px !important;
    color: #677083;
    background: #fff;
    cursor: pointer;
    font-size: 11px !important;
    transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.zm-math-templates button:hover { color: #5061e5; border-color: #cfd5ff; background: #f5f6ff; }

.zm-math-workspace { overflow: hidden; }
.zm-math-workspace-header {
    padding: 21px 23px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid #eceef4;
}

.zm-math-actions { display: flex; align-items: center; gap: 7px; }
.zm-math-actions button {
    min-height: 38px !important;
    padding: 7px 10px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #e0e3eb;
    border-radius: 10px !important;
    color: #667082;
    background: #fff;
    cursor: pointer;
    font-size: 12px !important;
}
.zm-math-actions button:hover,
.zm-math-actions button[aria-pressed="true"] { color: #5264e9; border-color: #cfd5ff; background: #f3f5ff; }

.zm-math-progress {
    padding: 13px 23px;
    display: grid;
    grid-template-columns: repeat(3, auto) minmax(100px, 1fr);
    align-items: center;
    gap: 24px;
    border-bottom: 1px solid #eceef4;
    background: #fafbfe;
}

.zm-math-progress > div:not(.zm-math-progress-track) { display: flex; align-items: baseline; gap: 5px; }
.zm-math-progress span { color: #969cab; font-size: 11px; }
.zm-math-progress strong { color: #3c4354; font-size: 18px; line-height: 1; }
.zm-math-progress small { color: #a5aab6; font-size: 10px; }
.zm-math-progress-track { height: 6px; overflow: hidden; border-radius: 999px; background: #e9ecf3; }
.zm-math-progress-track span { width: 0; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, #586bf1, #8064e9); transition: width .25s ease; }

.zm-math-paper { padding: 22px 23px 20px; }
.zm-math-print-heading { display: none; }
.zm-math-question-list {
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    list-style: none;
    counter-reset: math-question;
}

.zm-math-question {
    min-width: 0;
    min-height: 58px;
    padding: 9px 11px;
    display: grid;
    grid-template-columns: 25px minmax(0, 1fr) 86px 18px;
    align-items: center;
    gap: 8px;
    border: 1px solid #e7eaf1;
    border-radius: 12px;
    background: #fff;
    counter-increment: math-question;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.zm-math-question::before {
    content: counter(math-question) ".";
    color: #a0a6b3;
    font-size: 11px;
}

.zm-math-expression {
    min-width: 0;
    color: #303746;
    font-size: 17px;
    line-height: 1.3;
    font-weight: 700;
    white-space: nowrap;
}

.zm-math-question input {
    width: 86px;
    height: 38px;
    min-height: 38px;
    padding: 6px 8px !important;
    border-radius: 9px !important;
    text-align: center;
    font-size: 15px !important;
    font-weight: 700;
}

.zm-math-question .zm-question-status { width: 18px; color: #a8adba; font-size: 15px; text-align: center; }
.zm-math-question.is-correct { border-color: #bde9dc; background: #f4fcf9; }
.zm-math-question.is-correct .zm-question-status { color: #22a77f; }
.zm-math-question.is-wrong { border-color: #f2c3ce; background: #fff7f9; }
.zm-math-question.is-wrong .zm-question-status { color: #dc637e; }
.zm-math-question.is-empty { border-color: #f3d69f; background: #fffaf1; }

.zm-math-answer {
    grid-column: 2 / -1;
    margin-top: -3px;
    display: none;
    color: #7e8493;
    font-size: 11px;
    line-height: 1.4;
}
.zm-math-question.show-answer .zm-math-answer,
.zm-math-question.is-wrong .zm-math-answer { display: block; }

.zm-math-result {
    margin: 0 23px 18px;
    padding: 13px 15px;
    border: 1px solid #dfe4ff;
    border-radius: 12px;
    color: #59627a;
    background: linear-gradient(120deg, #f2f5ff, #faf7ff);
    font-size: 13px;
    line-height: 1.65;
}
.zm-math-result[hidden] { display: none; }
.zm-math-result strong { color: #4859df; }

.zm-math-submit-bar {
    padding: 15px 23px;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid #eceef4;
    background: #fafbfe;
}
.zm-math-submit-bar p { margin: 0; color: #9298a7; font-size: 11px; }
.zm-math-submit-bar p i { margin-right: 6px; }
.zm-math-submit-bar button {
    min-width: 132px;
    min-height: 42px !important;
    padding: 8px 16px;
    border: 0;
    border-radius: 11px !important;
    color: #fff;
    background: linear-gradient(125deg, #5268f2, #735de8) !important;
    box-shadow: 0 8px 18px rgba(82, 104, 242, .2);
    cursor: pointer;
    font-size: 13px !important;
    font-weight: 750;
}
.zm-math-submit-bar button i { margin-right: 7px; }

@media (max-width: 1060px) {
    .zm-math-app { grid-template-columns: 278px minmax(0, 1fr); }
    .zm-math-question-list { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
    .zm-math-app { grid-template-columns: 1fr; }
    .zm-math-settings { position: static; }
    .zm-math-question-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
    .zm-math-app { gap: 14px; }
    .zm-math-settings { padding: 19px 16px; border-radius: 17px; }
    .zm-math-workspace { border-radius: 17px; }
    .zm-math-workspace-header { padding: 18px 16px 15px; align-items: flex-start; flex-direction: column; }
    .zm-math-actions { width: 100%; }
    .zm-math-actions button { flex: 1; justify-content: center; }
    .zm-math-progress { padding: 12px 16px; grid-template-columns: repeat(3, 1fr); gap: 10px; }
    .zm-math-progress > div:not(.zm-math-progress-track) { display: grid; gap: 2px; text-align: center; }
    .zm-math-progress-track { grid-column: 1 / -1; }
    .zm-math-paper { padding: 16px; }
    .zm-math-question-list { grid-template-columns: 1fr; }
    .zm-math-question { grid-template-columns: 23px minmax(0, 1fr) 80px 17px; }
    .zm-math-question input { width: 80px; }
    .zm-math-submit-bar { padding: 14px 16px; align-items: stretch; flex-direction: column; }
    .zm-math-submit-bar p { text-align: center; }
    .zm-math-submit-bar button { width: 100%; }
}

@media (max-width: 390px) {
    .zm-math-form-grid { grid-template-columns: 1fr; }
}

@media print {
    body { background: #fff !important; }
    .zm-common-module,
    .zm-breadcrumb,
    .zm-tool-header,
    .zm-math-settings,
    .zm-math-workspace-header,
    .zm-math-progress,
    .zm-math-result,
    .zm-math-submit-bar,
    .zm-use-guide,
    .zm-unified-footer { display: none !important; }
    .zm-subsite-main { margin: 0 !important; }
    .zm-tool-module,
    .zm-tool-body { margin: 0 !important; padding: 0 !important; overflow: visible !important; border: 0 !important; }
    .zm-math-app { display: block; }
    .zm-math-workspace { border: 0; border-radius: 0; box-shadow: none; }
    .zm-math-paper { padding: 0; }
    .zm-math-print-heading { margin-bottom: 22px; display: flex; align-items: flex-end; justify-content: space-between; border-bottom: 2px solid #303646; padding-bottom: 12px; }
    .zm-math-print-heading strong { color: #202634; font-size: 22px; }
    .zm-math-print-heading span { color: #4f5666; font-size: 12px; }
    .zm-math-question-list { grid-template-columns: repeat(2, 1fr); gap: 13px 28px; }
    .zm-math-question { min-height: 50px; padding: 7px 0; grid-template-columns: 25px 1fr 90px; border: 0; border-bottom: 1px solid #d8dbe2; border-radius: 0; break-inside: avoid; }
    .zm-math-question input { border: 0 !important; border-bottom: 1px solid #59606f !important; border-radius: 0 !important; }
    .zm-question-status,
    .zm-math-answer { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .zm-math-app *, .zm-math-app *::before, .zm-math-app *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}