:root {
  color-scheme: light;
  font-family: Pretendard, "Noto Sans KR", system-ui, sans-serif;
  line-height: 1.55;
  color: #172033;
  background: #eef2f7;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
button, select, input, textarea { font: inherit; }
button, .file-button, .button-link { min-height: 42px; }
button:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid #76a9ff;
  outline-offset: 2px;
}

.app-header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 2rem;
  padding: 1.5rem clamp(1rem, 4vw, 3rem);
  color: white;
  background: linear-gradient(125deg, #13213c, #214b80);
}
.app-header h1 { margin: .2rem 0 0; font-size: clamp(1.5rem, 3vw, 2.2rem); line-height: 1.2; }
.header-status { display: grid; justify-items: end; gap: .5rem; width: min(30rem, 50%); flex: none; min-width: 0; }
.header-status:has(#global-status:empty)::after { content: ""; height: 1.55em; }
.session-controls { display: flex; align-items: center; justify-content: end; gap: .65rem; width: 100%; }
.session-controls > :not(#current-user) { flex: none; }
.session-controls #current-user { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.session-controls .secondary:not([hidden]) { min-height: 34px; padding: .3rem .65rem; }
.eyebrow, .step { margin: 0; color: #82b7ff; font-size: .76rem; font-weight: 800; letter-spacing: .12em; }
.status { max-width: 30rem; margin: 0; text-align: right; color: #dbeafe; }
#global-status { min-height: 1.55em; }
#global-status:empty { display: none; }
.app-starting .session-controls, .app-starting main { visibility: hidden; }
.app-starting main { opacity: 0; }
#startup-notice { margin: 0; padding: 1.4rem clamp(1rem, 4vw, 3rem); }
#screen-notice { margin-bottom: 1rem; padding: .75rem 1rem; border-radius: 8px; background: #eef4fc; }
/* A screen that is still loading shows a spinner and a placeholder of the panel instead of a lone line on white. */
#screen-notice.loading { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .9rem; min-height: 16rem;
  padding: 2.5rem 1rem; border: 1px solid #d7dee8; background: linear-gradient(#f6f8fb, #eef2f7); color: #33415a; font-weight: 700; }
#screen-notice.loading[hidden] { display: none; }
#screen-notice.loading::before { content: ""; width: 2.25rem; height: 2.25rem; border: 4px solid #c9d6e6; border-top-color: #1769d2; border-radius: 50%; animation: screen-spin .8s linear infinite; }
@keyframes screen-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { #screen-notice.loading::before { animation-duration: 2.4s; } }

.tab-nav {
  display: flex;
  overflow-x: auto;
  gap: .35rem;
  padding: .8rem clamp(1rem, 4vw, 3rem) 0;
  background: white;
  border-bottom: 1px solid #ccd5e2;
}
.tab-button { padding: .7rem .65rem; white-space: nowrap; border: 0; border-bottom: 3px solid transparent; background: transparent; color: #5b6678; cursor: pointer; font-weight: 800; }
.tab-button.active { color: #164d92; border-color: #2b72d6; }
/* 필사 확인 is a side screen, not a numbered step: a divider sets it apart, its '?' says when to use it and a badge
   shows the work its list last reported. */
.tab-button-side { position: relative; margin-left: 1.1rem; }
.tab-button-side::before { content: ""; position: absolute; left: -.75rem; top: 25%; bottom: 25%; border-left: 1px solid #ccd5e2; }
.tab-nav .tab-help { align-self: center; flex: none; }
#edb-review-tab[hidden] + .tab-help { display: none; }
.tab-count { display: inline-block; min-width: 1.4em; margin-left: .35rem; padding: 0 .4em; border-radius: 999px; background: #b45309; color: white; font-size: .78rem; line-height: 1.4; text-align: center; }
.tab-count[hidden] { display: none; }

main { position: relative; max-width: 1500px; margin: auto; padding: 1.4rem clamp(1rem, 4vw, 3rem) 4rem; }
.tab-panel { background: white; border: 1px solid #d7dee8; border-radius: 14px; box-shadow: 0 12px 30px #26364a14; padding: clamp(1rem, 3vw, 2rem); }
.tab-panel.inactive { position: fixed; left: -100000px; top: 0; width: min(1400px, 100vw); visibility: hidden; pointer-events: none; }
.qbank-main:has(> #worksheet-panel.active) { padding-block: 0; }
#worksheet-panel { padding: 0; background: #f5f5f5; }
.worksheet-demo { margin: 0; padding: 4px 24px; font-size: 12px; line-height: 20px; color: #707070; }
.worksheet-frame-slot { min-height: 612px; }
.worksheet-frame-slot iframe { display: block; width: 100%; height: 612px; border: 0; }
.panel-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1.25rem; }
.panel-heading h2 { margin: .15rem 0 0; font-size: 1.55rem; }
.panel-heading > p { margin: 0; color: #596579; }

.filter-grid, .paper-toolbar { display: flex; flex-wrap: wrap; gap: .8rem; align-items: end; padding: 1rem; border: 1px solid #dce3ec; border-radius: 10px; background: #f8fafc; }
.question-browser { display: grid; grid-template-columns: 18rem minmax(0, 1fr); gap: 1rem; align-items: start; }
.filter-sidebar { position: sticky; top: .5rem; max-height: calc(100vh - 1rem); overflow-y: auto; }
.filter-sidebar .filter-grid { display: grid; align-items: stretch; margin-top: .8rem; }
.selection-summary-header { position: sticky; top: 0; z-index: 2; display: grid; gap: .6rem; padding: 1rem; border: 1px solid #c8d3e0; border-radius: 10px; background: #f8fafc; box-shadow: 0 5px 18px #2f3f5522; }
.selection-summary-header p { margin: 0; color: #49566a; }
.selection-summary-header strong { margin-right: .2rem; color: #164d92; font-size: 1.4rem; }
.selection-summary-header button { width: 100%; }
.selected-books { display: grid; gap: .7rem; padding-top: .7rem; }
.selected-book { padding: .75rem; border: 1px solid #dce3ec; border-radius: 10px; background: white; }
.selected-book h3 { margin: 0 0 .65rem; overflow-wrap: anywhere; font-size: .9rem; }
.selection-tag-group + .selection-tag-group { margin-top: .65rem; }
.selection-tag-group h4 { margin: 0 0 .35rem; color: #596579; font-size: .76rem; }
.selection-tags { display: flex; flex-wrap: wrap; gap: .35rem; }
.selection-tag { display: inline-flex; max-width: 100%; align-items: center; gap: .2rem; padding: .2rem .25rem .2rem .5rem; border-radius: 999px; background: #e8edf4; color: #35435a; font-size: .74rem; font-weight: 800; }
.selection-tag > span { min-width: 0; overflow-wrap: anywhere; }
.selection-tag button { min-width: 24px; min-height: 24px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #35435a; }
@media (hover: hover) {
  .selection-tag button { opacity: 0; pointer-events: none; }
  .selection-tag:hover button, .selection-tag:focus-within button { opacity: 1; pointer-events: auto; }
  .solution-view-button { opacity: 0; pointer-events: none; }
  .correction-edit-button { opacity: 0; pointer-events: none; }
  .question-card:hover .solution-view-button, .question-card:hover .correction-edit-button,
  .question-card:focus-within .solution-view-button,
  .question-card:focus-within .correction-edit-button { opacity: 1; pointer-events: auto; }
  .exam-question .card-controls, .answer-card .card-controls { opacity: 0; pointer-events: none; }
  .exam-question:hover .card-controls, .exam-question:focus-within .card-controls,
  .answer-card:hover .card-controls, .answer-card:focus-within .card-controls { opacity: 1; pointer-events: auto; }
}
.question-results { min-width: 0; }
.book-summary { padding: 1rem; border: 1px solid #c8d3e0; border-radius: 10px; background: #f8fafc; }
.book-summary summary { cursor: pointer; }
.book-summary summary span { display: block; color: #596579; font-size: .78rem; font-weight: 800; }
.book-summary summary strong { display: block; margin-top: .15rem; overflow-wrap: anywhere; color: #172033; font-size: 1.1rem; }
.book-summary details > p, .book-summary [data-summary-content] > p { margin: .8rem 0 0; color: #596579; font-size: .78rem; font-weight: 800; }
.book-summary dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; margin: 0; }
.book-summary dl div { padding: .65rem .75rem; border-radius: 8px; background: white; }
.book-summary dt { color: #596579; font-size: .76rem; font-weight: 700; }
.book-summary dd { margin: .1rem 0 0; color: #164d92; font-size: 1.3rem; font-weight: 900; }
.book-summary .book-summary-detail { margin-top: .35rem; color: #596579; font-size: .7rem; line-height: 1.4; font-weight: 700; }
.book-summary summary .edb-backfill-hint:not([hidden]) { display: inline-block; margin-top: .3rem; padding: .1rem .5rem; border-radius: 999px; background: #e3edf9; color: #164d92; font-size: .76rem; font-weight: 800; }
.edb-backfill { margin-top: .9rem; padding-top: .8rem; border-top: 1px solid #c8d3e0; }
.edb-backfill p { margin: 0 0 .6rem; color: #3b475a; font-size: .9rem; line-height: 1.5; overflow-wrap: anywhere; }
.edb-backfill-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.edb-backfill-actions button, #edb-backfill-dialog .dialog-actions button, #figure-trace-dialog .dialog-actions button { min-height: 44px; min-width: 44px; }
.edb-backfill progress { display: block; width: 100%; height: 12px; margin-top: .6rem; }
.edb-backfill [role="status"] { margin: .5rem 0 0; font-weight: 700; }
#edb-backfill-dialog, #figure-trace-dialog { width: min(34rem, calc(100vw - 2rem)); max-height: 90dvh; overflow: auto; }
#edb-backfill-lines, #figure-trace-lines { margin: 0; padding-left: 1.2rem; font-size: 1rem; line-height: 1.6; overflow-wrap: anywhere; }
#edb-backfill-lines li + li, #figure-trace-lines li + li { margin-top: .35rem; }
.book-summary [data-summary-content] > .book-summary-note { margin-top: .7rem; font-weight: 600; }
label { display: grid; gap: .3rem; color: #49566a; font-size: .84rem; font-weight: 700; }
input, select, textarea { min-height: 42px; padding: .55rem .7rem; border: 1px solid #aeb9c7; border-radius: 7px; background: white; color: #172033; }
#book-search, #book-select, #book-subject { width: 100%; }
.book-search-field { min-width: 0; }
.book-search-field label { margin-bottom: .35rem; }
#book-suggestions { list-style: none; margin: .25rem 0 0; padding: 0; max-height: 16rem; overflow-y: auto; border: 1px solid #aebcd0; border-radius: 6px; background: white; }
#book-suggestions button { padding: .6rem; cursor: pointer; overflow-wrap: anywhere; }
#book-suggestions button:hover, #book-suggestions [aria-pressed="true"] { background: #e4edf9; color: #172e50; }
#book-search-empty { font-size: .8rem; margin: .4rem 0 0; }
.subject-editor select { min-width: 6rem; margin-right: .4rem; }
button, .file-button, .button-link:not([hidden]) { display: inline-flex; align-items: center; justify-content: center; padding: .55rem .9rem; border: 1px solid transparent; border-radius: 7px; cursor: pointer; font-weight: 750; }
.button-link { text-decoration: none; }
button:disabled { cursor: not-allowed; opacity: .5; }
.primary { color: white; background: #1e63bd; border-color: #1e63bd; }
.primary:hover:not(:disabled) { background: #154e97; }
.secondary { color: #24344e; background: white; border-color: #aeb9c7; }
.secondary:hover:not(:disabled) { background: #edf3fa; }
.file-button input { display: none; }
.taxonomy-tree { margin-top: .8rem; padding: .75rem; overflow-x: auto; border: 1px solid #dce3ec; border-radius: 10px; background: #f8fafc; }
.taxonomy-tree ul { margin: 0; padding: 0; list-style: none; }
.taxonomy-tree ul ul { margin-left: .65rem; padding-left: .9rem; border-left: 1px solid #aeb9c7; }
.taxonomy-tree ul ul > li { position: relative; padding: .2rem 0; }
.taxonomy-tree ul ul > li::before { content: ""; position: absolute; top: 1.25rem; left: -.9rem; width: .7rem; border-top: 1px solid #aeb9c7; }
.taxonomy-node { box-sizing: border-box; width: 100%; min-height: 34px; justify-content: flex-start; padding: .4rem .55rem; border: 1px solid transparent; border-radius: 7px; background: transparent; color: #35435a; cursor: pointer; font-weight: 750; text-align: left; overflow-wrap: anywhere; }
.taxonomy-node:hover { background: #e8eef6; }
.taxonomy-node[aria-pressed="true"] { border-color: #7ca6db; background: #dcecff; color: #164d92; }

.notice { margin: 1rem 0; padding: .8rem 1rem; border: 1px solid #d4a72c; border-radius: 8px; background: #fff8dc; color: #6d4b00; white-space: pre-wrap; }
.notice.error { border-color: #d05252; background: #fff0f0; color: #8c2525; }
.render-error-details { margin-top: .6rem; white-space: normal; }
.render-error-details summary { cursor: pointer; }
.render-error-details p { white-space: pre-wrap; overflow-wrap: anywhere; }
.question-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 24rem), 1fr)); gap: 1rem; align-items: start; margin-top: 1rem; }
.question-card { display: grid; height: 32rem; padding: 1rem; border: 1px solid #dce3ec; border-radius: 10px; background: white; cursor: pointer; }
.question-card:has(.question-check:checked) { border-color: #3880df; box-shadow: 0 0 0 2px #3880df22; }
.question-card:focus-within { outline: 3px solid #76a9ff; outline-offset: 2px; }
.question-check { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.question-card-body { display: grid; grid-template-rows: auto minmax(0, 1fr); min-width: 0; min-height: 0; }
.question-card-body > .question-content { overflow: auto; padding-right: .25rem; }
.question-meta { display: flex; flex-wrap: wrap; gap: .4rem .8rem; align-items: center; margin-bottom: .6rem; color: #5b6678; font-size: .84rem; }
.question-meta strong { color: #18243a; font-size: 1rem; }
.solution-view-button, .correction-edit-button { min-height: 34px; margin-left: auto; padding: .3rem .65rem; }
.solution-view-button + .correction-edit-button { margin-left: 0; }
.mask-reset-button { min-height: 34px; margin-left: auto; padding: .3rem .65rem; }
.mask-reset-button + .solution-view-button { margin-left: 0; }
.badge { padding: .16rem .45rem; border-radius: 999px; background: #e8edf4; color: #4c5a70; font-size: .74rem; font-weight: 800; }
.badge.warning { background: #ffedc2; color: #7b4c00; }
.badge.error { background: #ffe0e0; color: #992f2f; }
.solution-section h4 { margin: .7rem 0 .3rem; color: #35435a; font-family: system-ui, sans-serif; font-size: .82rem; }
dialog { max-width: min(34rem, calc(100vw - 2rem)); padding: 1.25rem; border: 1px solid #aeb9c7; border-radius: 12px; color: #172033; }
dialog::backdrop { background: #14213d88; }
dialog h2 { margin-top: 0; }
.dialog-actions { display: flex; flex-wrap: wrap; justify-content: end; gap: .6rem; margin-top: 1rem; }
#solution-dialog { position: fixed; width: min(48rem, calc(100vw - 2rem)); max-width: calc(100vw - 2rem); max-height: calc(100vh - 2rem); overflow: hidden; }
#solution-dialog[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.solution-dialog-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }
.solution-dialog-heading h2 { margin: 0; }
#solution-dialog-content { min-height: 0; max-height: calc(100vh - 8rem); overflow: auto; padding-right: .25rem; }
#question-editor-dialog { width: min(960px, calc(100vw - 32px)); max-width: calc(100vw - 32px); max-height: 85dvh; padding: 16px; overflow: hidden; }
#question-editor-dialog[open] { display: flex; flex-direction: column; gap: 10px; }
#question-editor-dialog [hidden] { display: none !important; }
.question-editor-heading, .editor-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex: none; }
.question-editor-heading h2 { margin: 0; font-size: 1.15rem; }
.editor-section-heading h3 { margin: 0 0 8px; font-size: 1rem; }
.editor-tabs { display: flex; gap: 4px; border-bottom: 1px solid #c8d3e0; flex: none; }
.editor-tab { min-height: 36px; padding: 6px 12px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: transparent; color: #596579; }
.editor-tab[aria-pressed="true"] { border-color: #1e63bd; color: #164d92; }
.question-editor-panels { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; }
.question-editor-panel { min-width: 0; }
.editor-canvas { min-width: 0; }
.document-editor { position: relative; border: 1px solid #aeb9c7; border-radius: 7px; background: white; }
.document-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 6px 8px; border-bottom: 1px solid #e1e6ed; background: #f8fafc; }
.document-toolbar button, .document-toolbar select, .math-edit-actions button { width: auto; min-height: 32px; padding: 3px 8px; font-size: 13px; }
.document-content { min-height: 180px; padding: 14px 16px; outline: none; font-size: 16px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.document-content:focus { box-shadow: inset 0 0 0 2px #76a9ff; }
.document-content p { margin: 0 0 .5em; }
.document-content p:last-child { margin-bottom: 0; }
.document-content .document-list { display: block; margin: .65em 0; padding: 0; width: auto; min-width: 0; }
.document-list-given { border: 1px solid #aeb9c7; padding: 8px 10px !important; border-radius: 4px; }
.document-list-box { border: 1px solid #677284; padding: 8px 10px !important; }
.document-list-title { font-weight: 700; margin-bottom: .35em; }
.document-list-item { margin: .3em 0; }
.document-item-label { display: inline; margin-right: .55em; font-weight: 600; }
.document-content figure { margin: .6em 0; }
.document-content img { display: block; max-width: 100%; height: auto; margin: auto; }
.document-content .ProseMirror-selectednode { outline: 2px solid #76a9ff; }
.question-content .katex, .document-content .katex, .math-edit-preview .katex { font-size: 1em; }
.document-content .katex-display { overflow: auto; }
.document-content .katex-error { color: #9e2525; overflow-wrap: anywhere; }
.math-edit-panel { margin: 8px; padding: 10px; max-width: 440px; border: 1px solid #9bb7dc; border-radius: 6px; background: #f1f6fc; }
.math-edit-panel label { font-size: 13px; }
.math-edit-panel textarea { width: 100%; min-height: 54px; padding: 6px 8px; resize: vertical; max-height: 110px; font-family: monospace; font-size: 14px; }
.math-edit-panel label:has(input) { display: flex; align-items: center; gap: 5px; margin-top: 6px; }
.math-edit-panel input { width: auto; min-height: 0; }
.math-edit-preview { padding: 8px 0; overflow: auto; }
.math-edit-actions { display: flex; gap: 5px; justify-content: end; }
.editor-validation { margin: 6px 10px; color: #9e2525; font-size: 13px; }
.editor-footer { flex: none; border-top: 1px solid #e1e6ed; padding-top: 8px; }
.editor-footer .dialog-actions { margin-top: 6px; }
.solution-editor-section + .solution-editor-section { margin-top: 14px; }
#solution-answer-editor .document-content { min-height: 64px; }
.editor-empty { margin: 0; padding: 8px; color: #596579; }
.source-page-tabs { display: flex; flex-wrap: wrap; gap: 4px; }
.source-page-tabs button { min-height: 32px; padding: 3px 8px; }
.source-tools { margin-top: 10px; padding: .6rem; border: 1px solid #dce3ec; border-radius: 8px; background: #f8fafc; }
.source-tools > summary { cursor: pointer; font-weight: 800; }
.source-tools[open] > summary { margin-bottom: .75rem; }
.source-stage { position: relative; width: 100%; min-height: 12rem; overflow: auto; border: 1px solid #aeb9c7; background: #dfe5ed; touch-action: none; }
.source-stage img { display: block; width: 100%; height: auto; user-select: none; -webkit-user-drag: none; }
.source-stage img:not([src]) { visibility: hidden; }
.source-overlay { position: absolute; inset: 0; pointer-events: none; }
.source-highlight, .source-selection { position: absolute; border: 2px solid #f59e0b; background: #fbbf2433; }
.source-selection { border-color: #1769d2; background: #60a5fa44; }
.crop-controls { display: grid; grid-template-columns: 10rem minmax(0, 1fr) auto; gap: .6rem; align-items: end; margin-top: .7rem; }
.source-page-tabs button[aria-pressed="true"] { color: white; background: #1e63bd; border-color: #1e63bd; }
.issue-confirmation { display: flex; font-size: 13px; align-items: start; gap: .6rem; padding: .7rem; border: 1px solid #d4a72c; border-radius: 8px; background: #fff8dc; }
.issue-confirmation input { min-height: 0; margin-top: .25rem; }
.question-content { min-width: 0; font-size: 11pt; font-family: "Noto Serif KR", "Times New Roman", serif; line-height: 1.7; }
.question-png-content { line-height: 0; }
.question-png-image { display: block; max-width: 100%; height: auto; }
.question-png-surface { position: relative; max-width: 100%; line-height: 0; }
.question-png-surface > .question-png-image { width: 100% !important; }
/* A lazy image is given its src only near the viewport; until then Chrome would draw it as a broken image with its alt text. */
/* While an automatic retry is pending the failed image would also show as broken. */
.question-png-image:not([src]), .question-png-image[data-retries], .question-png-surface.asset-error > .question-png-image { visibility: hidden; }
html.ux-0-4 .question-list.is-refreshing { opacity: .72; }
html.ux-0-4 .question-loading-status { margin: 0 0 .5rem; color: #596579; font-weight: 700; }
html.ux-0-4 .question-skeleton { cursor: default; }
html.ux-0-4 .question-image-placeholder,
html.ux-0-4 .question-png-image:not([src]) { visibility: visible; min-height: 18rem; border-radius: 8px; background: #e7edf4; }
html.ux-0-4 tr.table-skeleton .skeleton-block { height: 1rem; border-radius: 6px; background: #e7edf4; }
/* A list image that failed for good collapses instead of keeping its full height, so the retry button (first child) stays in view. */
.question-png-content.image-failed .question-png-image, .question-png-content.image-failed .shared-band { display: none; }
.question-png-content.image-failed .asset-error { outline: none; }
.question-image-retry { display: block; min-height: 44px; margin: .5rem 0; padding: .25rem .75rem; font: .85rem/1.4 system-ui, sans-serif; }
.question-png-content.png-pending { line-height: 1.7; }
.badge.shared { background: #e3ecfb; color: #2b5fae; }
.question-png-content.has-shared { position: relative; }
.shared-band { position: absolute; left: 0; right: 0; pointer-events: none; background: #3880df14; border-left: 3px solid #3880df; }
.shared-band > span { position: absolute; top: .2rem; left: .35rem; font: 800 .7rem system-ui, sans-serif; color: #2b5fae; background: #fff; padding: 0 .3rem; border-radius: 4px; }
.shared-context[hidden] { display: none; }
.shared-context-label { font: 800 9.5pt system-ui, sans-serif; margin-bottom: 1mm; line-height: 1.2; }
.exam-question .shared-context { border: .3mm solid #333; border-radius: 1mm; padding: 1.5mm 2mm 2mm; margin-bottom: 2mm; }
.exam-question .question-png-content.has-shared > .question-png-image { margin-top: 2mm; }
.exam-question .question-png-content.has-shared > .question-png-surface { margin-top: 2mm; }
@font-face { font-family: "Qbank PNG Serif"; font-weight: 400; font-display: block; src: url("/vendor/rhwp-0.8.6-qbank-5/studio/fonts/NanumMyeongjo-Regular.woff2") format("woff2"); }
@font-face { font-family: "Qbank PNG Serif"; font-weight: 700; font-display: block; src: url("/vendor/rhwp-0.8.6-qbank-5/studio/fonts/NanumMyeongjo-Bold.woff2") format("woff2"); }
.qpng-capture-root .question-content { font-family: "Qbank PNG Serif", serif; }
.qpng-capture-root { position: absolute; left: -100000px; top: 0; box-sizing: border-box; padding: 2pt; background: white; color: #111827; }
.qpng-capture-root .choices .text-block { white-space: pre-wrap; overflow-wrap: anywhere; }
.qpng-capture-root .math-block, .qpng-capture-root .choices-viewport { overflow: visible; }
.text-block { margin: .45rem 0; white-space: pre-wrap; }
.math-block { max-width: 100%; overflow-x: auto; font-size: 1em; }
.math-display { margin: .55rem 0; }
.math-display > .katex-display { margin: 0; }
.math-display > .katex-display > .katex, .document-content .katex-display > .katex { text-align: left; }
.math-error { color: #9e2525; white-space: pre-wrap; }
.asset-block { margin: .8rem 0; text-align: center; }
.asset-block img { display: inline-block; max-width: 100%; height: auto; }
.asset-error { outline: 2px solid #d05252; }
.given { margin: .8rem 0; padding: .7rem 1rem; border: 1px solid #677284; }
.given h4 { margin: 0 0 .5rem; text-align: center; }
.given ol, .choices { display: grid; gap: .45rem; margin: .4rem 0; padding: 0; list-style: none; }
.choices-viewport { overflow-x: auto; }
.choices { width: max-content; min-width: 100%; grid-template-columns: repeat(var(--choice-columns), max-content); justify-content: space-between; gap: .45rem 1rem; }
.given li, .choices li { display: grid; gap: .45rem; align-items: start; }
.given li { grid-template-columns: max-content minmax(0, 1fr); }
.boxed-content ol { margin: 0; }
.boxed-content li { display: block; }
.choices li { grid-template-columns: max-content max-content; }
.choices .text-block { white-space: pre; }
.item-label { font-weight: 800; }
.item-blocks > :first-child { margin-top: 0; }
.item-blocks > :last-child { margin-bottom: 0; }
.pagination { display: flex; justify-content: center; align-items: center; gap: .8rem; margin-top: 1rem; }
.question-results-toolbar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .75rem; }
.question-results-toolbar .pagination { margin: 0; }
@media (max-width: 760px) {
  .question-results-toolbar { grid-template-columns: 1fr; }
}

.paper-toolbar { position: sticky; top: .5rem; z-index: 5; margin-bottom: 1rem; box-shadow: 0 5px 18px #2f3f5522; }
.document-previews { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: stretch; }
.document-preview { display: grid; min-width: 0; grid-template-rows: auto minmax(0, 1fr); }
.preview-title { margin: 0 0 .5rem; font-size: 1.1rem; }
.document-preview:has(.paper-slides) { grid-template-rows: auto auto minmax(0, 1fr); }
#answer-preview-document { grid-template-rows: auto auto minmax(0, 1fr); }
.paper-slides { grid-row: 3; min-width: 0; display: grid; align-content: start; gap: 16px; padding: 12px; background: #f0f0f0; border-radius: 10px; }
.paper-print-stage { position: fixed; left: -100000px; top: 0; width: max-content; pointer-events: none; }
.composition-slide { min-width: 0; background: white; border: 1px solid #cbd3df; border-radius: 6px; position: relative; }
.slide-heading { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 8px 12px; border-bottom: 1px solid #cbd3df; }
.slide-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.slide-controls button { min-height: 32px; padding: 4px 8px; }
.slide-frames { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.slide-frames > section { min-width: 0; display: flex; flex-direction: column; }
.slide-frames h4 { margin: 0; padding: 8px 12px; font-size: 14px; border-bottom: 1px solid #dfe3eb; }
.slide-frames h4 button { margin-left: 8px; padding: 3px 8px; font-size: 12px; }
.slide-frames:has([data-slide-action="question-info"]) h4 { min-height: 52px; box-sizing: border-box; display: flex; align-items: center; }
.slide-question-info { position: absolute; display: block; }
.question-info-dialog { width: min(680px, calc(100vw - 32px)); max-height: 85vh; overflow: auto; }
.question-info-dialog input[type="radio"] { width: 16px; height: 16px; min-height: 0; padding: 0; margin: 0; }
.question-info-choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin: 12px 0; }
.question-info-choices .cover-choice img { display: block; width: 100%; height: 100px; object-fit: contain; }
.question-info-choices label { overflow-wrap: anywhere; }
.slide-problem { border-left: 1px solid #cbd3df; }
.slide-passage-body { position: relative; }
.slide-question-space { position: absolute; }
.slide-question-space .question-png-content { width: 100%; max-width: 100%; }
.slide-question-space .question-png-surface { width: 100% !important; }
.slide-question-space .question-png-image { width: 100% !important; max-width: 100%; height: auto; display: block; }
.slide-question-space .asset-error { font-size: 12px; overflow-wrap: anywhere; }
.slide-image-retry { position: absolute; top: 0; left: 0; max-width: 100%; font-size: 12px; padding: 4px; }
.slide-problem-body { position: relative; flex: 1; min-height: 0; }
.slide-template { position: absolute; background-image: var(--problem-template, none); background-position: center; background-repeat: no-repeat; background-size: contain; }
.slide-problem[aria-disabled="true"] { background: #f4f6fa; }
.slide-disabled { position: absolute; inset: 0; padding: 12px; margin: 0; color: #465875; font-size: 12px; overflow-wrap: anywhere; }
.orzo-image-frame { position: relative; width: 100%; background: white; }
.orzo-image-part { position: absolute; display: block; max-width: none; }
.language-question { position: relative; border-bottom: 1px solid #dfe3eb; }
.language-question .slide-controls { padding: 8px; }
.language-question > .question-resize-handle { right: 0; bottom: 28px; }
.language-question.dragging { opacity: .4; }
.language-question.slide-drop-before { border-top: 4px solid #1769d2; }
.language-question.slide-drop-after { border-bottom: 4px solid #1769d2; }
.slide-without-passage { grid-template-columns: minmax(0, 1fr); }
.slide-without-passage .slide-problem { border-left: 0; }
.orzo-mode-controls { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0; padding: 8px 12px; border: 1px solid #cbd3df; border-radius: 6px; }
.orzo-mode-controls label { display: flex; align-items: center; gap: 6px; }
.orzo-mode-controls input { width: auto; }
#orzo-language-priority { flex: 1; min-width: 0; }
.orzo-passage-priority { margin: 0 12px 12px; }
.orzo-priority-option { flex: 1 1 210px; min-width: 0; }
.orzo-priority-option p { margin: 4px 0 0; font-size: 13px; line-height: 1.5; }
.slide-source { display: block; width: 100%; min-height: 28px; padding: 4px 8px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; border: 0; border-top: 1px solid #dfe3eb; border-radius: 0; color: #465875; background: #f4f6fa; font-size: 11px; text-align: left; }
.composition-slide.dragging { opacity: .4; }
.composition-slide.slide-drop-before { border-top: 4px solid #1769d2; }
.composition-slide.slide-drop-after { border-bottom: 4px solid #1769d2; }
.composition-slide > .question-resize-handle { right: 50%; bottom: 28px; }
.template-settings-preview { display: block; max-width: min(100%, 400px); max-height: 350px; object-fit: contain; margin: 12px 0; }
.template-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.quick-answer-group { position: relative; width: 100%; font-size: 11pt; }
.quick-answer-group h4 { margin: 0 0 8px; font-size: 12pt; }
.quick-answer-group table { border-collapse: collapse; width: 100%; table-layout: fixed; background: white; }
.quick-answer-group th, .quick-answer-group td { border: 1px solid #8593a6; padding: 5px 3px; text-align: center; vertical-align: middle; white-space: pre-wrap; overflow-wrap: anywhere; }
.quick-answer-group th { width: 3em; color: #1769d2; }
.quick-answer-group td { min-height: 1em; color: #000000; }
.quick-answer-help { margin: 0 0 .5rem; font-size: .85rem; color: #596579; }
.quick-answer-edit, .quick-answer-edit:hover { position: absolute; inset: 0; width: 100%; min-height: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
.quick-answer-edit:focus-visible { outline: 3px solid #1769d2; outline-offset: 2px; }
#quick-answer-dialog { width: min(48rem, calc(100vw - 2rem)); max-width: none; max-height: 90dvh; overflow: hidden; }
#quick-answer-dialog[open] { display: flex; flex-direction: column; gap: 1rem; min-height: 0; }
.quick-answer-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; flex: none; }
.quick-answer-heading h2 { margin: 0; min-width: 0; }
.quick-answer-heading .dialog-actions { flex: none; flex-wrap: nowrap; margin: 0; }
#quick-answer-notice { flex: none; margin: 0; }
.quick-answer-body { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; }
#quick-answer-description { margin-top: 0; }
#quick-answer-fields { border: 0; padding: 0; margin: 0; min-width: 0; }
#quick-answer-content input { width: 100%; min-width: 0; text-align: center; }
#quick-answer-content .quick-answer-controls { display: flex; gap: .25rem; margin-top: .25rem; }
#quick-answer-content select { flex: 1; width: 0; min-width: 0; min-height: 28px; padding: .2rem; font-size: .75rem; }
#quick-answer-content button { flex: none; min-height: 28px; padding: .2rem; font-size: .75rem; white-space: nowrap; }
#quick-answer-content small { display: block; color: #902f2f; }
.paper-pages { display: grid; align-content: start; gap: 1.4rem; justify-items: center; overflow-x: auto; padding: 1rem; background: #dfe5ed; border-radius: 10px; }
.preview-empty { margin: 0; padding: 2rem 1rem; color: #596579; text-align: center; }
.preview-empty.error { color: #8c2525; }
.page-wrap { min-width: max-content; }
.page-controls { display: flex; min-height: calc(34px + .9rem); align-items: center; gap: .5rem; margin-bottom: .45rem; padding: .45rem .6rem; border-radius: 7px; background: #202d42; color: white; }
.answer-preview-spacer { visibility: hidden; pointer-events: none; }
.page-controls label { display: flex; align-items: center; gap: .4rem; color: white; }
.page-controls select { min-height: 34px; padding: .25rem .45rem; }
.page-controls button { min-height: 34px; padding: .3rem .6rem; }
.page-label { margin-right: auto; font-weight: 800; }
.paper-page { position: relative; width: 210mm; height: 297mm; padding: 12mm; display: grid; grid-template-columns: repeat(var(--column-count), minmax(0, 1fr)); grid-template-rows: minmax(0, 1fr); gap: 8mm; overflow: hidden; background: white; color: #111827; box-shadow: 0 5px 20px #1c273743; font-size: 11pt; }
@media screen {
  .paper-pages .paper-page { zoom: var(--preview-scale, 1); }
}
.paper-divider { position: absolute; top: 12mm; bottom: 12mm; left: 50%; width: var(--divider-width, .25mm); background: #111; transform: translateX(-50%); pointer-events: none; z-index: 1; }
.paper-column { display: flex; flex-direction: column; gap: 4mm; min-width: 0; min-height: 0; height: 100%; overflow: hidden; outline: 1px dashed transparent; outline-offset: 2mm; }
.paper-toolbar .auto-flow-setting { display: flex; flex-direction: row; align-items: center; gap: .4rem; }
.auto-flow-setting input { width: auto; min-height: auto; }
#auto-flow-help { color: #596579; font-size: .85rem; }
.paper-column.drag-over { outline-color: #4388df; background: #f5f9ff; }
.question-overflow-frame { position: absolute; inset: 0; border: 2px solid #d53d3d; background: #d53d3d0a; pointer-events: none; }
.card-overflow-label { color: #a92121; font-weight: 700; font-size: .8rem; }
.card-fit-label { color: #465875; font-size: .8rem; }
#question-overflow-notice { margin: 1rem 0; padding: .75rem; border: 1px solid #d53d3d; border-radius: 8px; background: #fff4f4; }
#question-overflow-status { margin: 0 0 .5rem; color: #a92121; font-weight: 700; }
#question-overflow-list { max-height: 14rem; overflow: auto; list-style: none; margin: 0; padding: .2rem; }
.question-overflow-row { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: .4rem 0; }
.question-overflow-row > span { flex: 1 1 18rem; }
.question-overflow-row button { padding: .35rem .65rem; }
.exam-question { flex: none; align-self: flex-start; position: relative; width: var(--scaled-source-width, var(--source-width, 100%)); max-width: 100%; border: 1px solid transparent; break-inside: avoid; }
.exam-question-printable { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: .35em; width: var(--source-width, 100%); max-width: 100%; zoom: var(--question-scale, 1); }
.exam-question[draggable="true"] { cursor: grab; }
.exam-question.resizing { cursor: nwse-resize; }
.exam-question.dragging { opacity: .35; cursor: grabbing; }
.exam-question:hover, .exam-question:focus-within { border-color: #b5c1d0; }
.exam-number { font-family: system-ui, sans-serif; font-weight: 900; white-space: nowrap; }
.exam-question .question-content { font-size: 11pt; }
.exam-question .asset-block { margin: 2mm 0; }
.paper-page .choices-viewport, .paper-page .math-block { overflow: visible; }
.paper-page .choices { width: 100%; min-width: 0; grid-template-columns: repeat(var(--choice-columns), minmax(0, 1fr)); }
.paper-page .choices li { min-width: 0; grid-template-columns: max-content minmax(0, 1fr); }
.paper-page .choices .text-block { white-space: pre-wrap; }
.exam-question .choices .item-blocks { min-width: 0; }
.exam-question .choices .text-block { overflow-wrap: anywhere; }
.card-controls { position: absolute; top: 0; right: 0; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; gap: .2rem; padding: .25rem; border-radius: 5px; background: #edf2f7; }
.card-controls button { min-width: 30px; min-height: 28px; padding: .1rem .35rem; border: 1px solid #b7c2d0; background: white; color: #223047; }
.card-scale-value { min-width: 3rem; color: #35435a; font-family: system-ui, sans-serif; font-size: .78rem; font-weight: 800; text-align: center; }
.question-resize-handle { position: absolute; right: -.25rem; bottom: -.25rem; width: .75rem; height: .75rem; border: 1px solid #1769d2; border-radius: 2px; background: linear-gradient(135deg, transparent 35%, #1769d2 35% 50%, transparent 50% 65%, #1769d2 65%); cursor: nwse-resize; touch-action: none; }
.drop-indicator { flex: none; align-self: stretch; height: 4px; border-radius: 999px; background: #1769d2; box-shadow: 0 0 0 2px #d7e8ff; }
.placeholder { padding: .7rem; border: 2px dashed #cc4e4e; background: #fff1f1; color: #902f2f; }
.export-root { position: fixed; left: 0; top: 0; z-index: -1; pointer-events: none; background: white; }
.export-root .paper-page { box-shadow: none; }
.export-root .exam-question { border-color: transparent; }
.orzo-cover { margin: .75rem 0; }
.orzo-cover p { margin: .4rem 0; }
.cover-settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 1rem; }
.cover-settings-card { min-width: 0; padding: 1rem; border: 1px solid var(--border); border-radius: 8px; }
.cover-settings-card h2 { font-size: 1rem; }
.cover-settings-card input[type="file"] { max-width: 100%; }
.cover-settings-card .template-settings-preview { max-width: 100%; height: 160px; }
.cover-choices, .cover-slots { display: flex; flex-wrap: wrap; gap: .6rem; align-items: stretch; }
.cover-slots > div { display: flex; flex-direction: column; gap: .4rem; max-width: 145px; }
.cover-choice { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .4rem; border: 2px solid var(--border, #aaa); border-radius: 8px; padding: .6rem; cursor: pointer; }
.cover-choice:has(input:checked) { border-color: #167864; background: #e4f5f1; }
.cover-choice:focus-within { outline: 2px solid #167864; outline-offset: 2px; }
.cover-choice img { width: 90px; height: 127px; object-fit: contain; }
.cover-choice-name { max-width: 115px; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cover-name-input { width: 100%; min-width: 0; box-sizing: border-box; }
.cover-name-count { display: block; margin-bottom: .6rem; }
.cover-settings-card h2 { overflow-wrap: anywhere; }
#orzo-cover-status { overflow-wrap: anywhere; }
#orzo-dialog { width: min(840px, 94vw); max-height: 90dvh; }
.orzo-heading, .orzo-pending-row { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
.orzo-heading { justify-content: space-between; }
#orzo-fields { border: 0; padding: 0; min-width: 0; }
#orzo-fields > label { display: flex; flex-direction: column; gap: .35rem; margin: .75rem 0; }
.orzo-grade-table { max-height: 40dvh; overflow: auto; }
.orzo-grade-table table { width: 100%; border-collapse: collapse; }
.orzo-grade-table th, .orzo-grade-table td { padding: .35rem; text-align: left; }
.orzo-grade-table th:first-child { white-space: nowrap; }
.orzo-grade-table tfoot th, .orzo-grade-table tfoot td { position: sticky; bottom: 0; background: #f4f7f9; border-top: 2px solid var(--border, #ddd); }
#orzo-total { display: block; min-width: 90px; font-weight: 700; }
#orzo-total.orzo-invalid { color: #a52323; }
.orzo-grade-table input { width: 100%; min-width: 70px; box-sizing: border-box; }
.orzo-grade-table select { min-width: 100px; }
@media (max-width: 500px) {
  .orzo-grade-table th, .orzo-grade-table td { padding: .25rem; }
  .orzo-grade-table select { min-width: 85px; }
  .orzo-grade-table input { min-width: 50px; }
  #orzo-total { min-width: 100px; }
}
.orzo-grade-table tr.orzo-invalid th, .orzo-grade-table tr.orzo-invalid td { background: #fdecec; }
#orzo-fields .orzo-review { flex-direction: row; align-items: center; }
#orzo-options label { display: flex; flex-direction: column; gap: .35rem; margin: .75rem 0; }
#orzo-options input[type="text"] { width: 100%; min-width: 0; box-sizing: border-box; }
#orzo-timing input[type="datetime-local"], #orzo-timing input[type="number"] { width: 100%; min-width: 0; box-sizing: border-box; }
.orzo-tag-buttons { display: flex; flex-wrap: wrap; gap: .5rem; }
.orzo-tag-buttons [aria-pressed="true"] { border-color: #3552c7; background: #eef2ff; color: #164d92; }
#orzo-refresh { margin-top: 1rem; }
.orzo-pending-row { border-top: 1px solid var(--border, #ddd); padding: .75rem 0; gap: .5rem; }
.orzo-pending-row > span { flex: 1 1 250px; overflow-wrap: anywhere; }
.answer-build-root { position: fixed; left: 0; top: 0; z-index: -1; pointer-events: none; background: white; }
.answer-page { font-family: "Noto Serif KR", "Times New Roman", serif; }
.answer-column { display: flex; flex-direction: column; gap: 3mm; width: 100%; height: 100%; overflow: hidden; outline: 1px dashed transparent; outline-offset: 2mm; }
.answer-column.overflow { outline-color: #d53d3d; background: #fff4f4; }
.answer-chunk { flex: none; max-width: 100%; break-inside: avoid; zoom: var(--auto-scale, 1); }
.answer-card { position: relative; flex: none; width: calc(var(--answer-width) * var(--auto-scale, 1)); }
.answer-card > .answer-chunk { width: var(--answer-width); max-width: none; }
.answer-entry { display: flex; flex-direction: column; gap: 3mm; }
.answer-entry > .answer-chunk { zoom: 1; }
.answer-entry .text-block { white-space: break-spaces; }
.answer-card:hover, .answer-card:focus-within, .answer-card.resizing { outline: 1px solid #b5c1d0; }
.answer-card .card-controls { right: auto; left: 0; flex-wrap: nowrap; }
.answer-card .question-resize-handle { right: 0; bottom: 0; }
.answer-native + .answer-native-continuation { margin-top: -3mm; }
.answer-heading { display: grid; grid-template-columns: 6rem minmax(0, 1fr); gap: .7rem; padding-bottom: 2mm; border-bottom: 1px solid #aeb9c7; }
.answer-heading strong { font-family: system-ui, sans-serif; font-weight: 900; }
.answer-paragraph { white-space: pre-wrap; }
.answer-placeholder { padding: 3mm; border: 2px dashed #cc4e4e; color: #902f2f; }
.answer-chunk .asset-block { margin: 1mm 0; }
body.busy { cursor: wait; }
body.busy button, body.busy input, body.busy select { pointer-events: none; }
body.busy :is(.tab-button, #book-search, #book-subject, #book-select, #book-suggestions button,
  #previous-page, #next-page, #taxonomy-tree button) { pointer-events: auto; }
body.busy #solution-preflight-dialog button { pointer-events: auto; }

@media (hover: hover) and (pointer: fine) and (min-width: 761px) {
  #solution-dialog { min-width: 20rem; min-height: 12rem; resize: both; }
  .solution-dialog-heading { cursor: grab; user-select: none; }
  .solution-dialog-heading.dragging { cursor: grabbing; }
}

@media (max-width: 760px) {
  .app-header, .panel-heading { align-items: start; flex-direction: column; }
  .header-status { width: 100%; justify-items: start; }
  .session-controls { justify-content: start; }
  .status { text-align: left; }
  .question-browser { grid-template-columns: 1fr; }
  .document-previews { grid-template-columns: 1fr; }
  .filter-sidebar { position: static; max-height: none; overflow: visible; }
  .selection-summary-header { position: static; }
  #question-editor-dialog { width: calc(100vw - 16px); max-width: calc(100vw - 16px); max-height: calc(100dvh - 16px); padding: 10px; }
  .document-toolbar button, .document-toolbar select, .math-edit-actions button { min-height: 40px; }
  .document-content { padding: 12px; }
  .editor-section-heading { align-items: start; flex-direction: column; }
  .crop-controls { grid-template-columns: 1fr; }
}

@media (max-width: 1000px) {
  .book-summary dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 480px) {
  .book-summary dl { grid-template-columns: 1fr; }
}

#my-papers-dialog { width: min(42rem, calc(100vw - 24px)); max-width: none; max-height: 85dvh; padding: 1rem; overflow: hidden; }
#my-papers-dialog[open] { display: flex; flex-direction: column; }
#my-papers-dialog h2 { margin: 0 0 .5rem; }
#my-papers-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: .75rem; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: .3rem; margin: .75rem 0; }
#my-papers-list > p { grid-column: 1 / -1; }
#my-papers-controls, #my-papers-dialog h2, #my-papers-dialog-notice { flex: none; }
#my-papers-controls .dialog-actions { flex-wrap: wrap; margin-top: .75rem; }
.my-paper-card { position: relative; min-width: 0; }
.my-paper-choice { display: flex; flex-direction: column; align-items: center; gap: .4rem; width: 100%; height: 100%; padding: .75rem; border: 2px solid #dbe2ed; border-radius: 8px; background: #f8fafc; color: #172033; text-align: left; cursor: pointer; }
.my-paper-choice[aria-pressed="true"] { border-color: #3552c7; background: #eef2ff; }
.my-paper-thumbnail { display: flex; align-items: center; justify-content: center; width: 140px; max-width: 100%; height: 198px; color: #526174; font-size: .8rem; text-align: center; }
.my-paper-thumbnail img { max-width: 140px; max-height: 198px; width: auto; height: auto; object-fit: contain; box-shadow: 0 1px 5px #26364a25; }
.my-paper-name { width: 100%; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; font-weight: 700; }
.my-paper-choice small { width: 100%; color: #526174; font-size: .72rem; font-weight: 400; overflow-wrap: anywhere; }
.delete-my-paper { position: absolute; top: 4px; right: 4px; display: grid; place-items: center; width: 28px; min-height: 28px; padding: 0; border: 0; border-radius: 50%; background: white; color: #c52222; font-size: 18px; line-height: 1; opacity: 0; pointer-events: none; cursor: pointer; }
.my-paper-card:hover .delete-my-paper, .my-paper-card:focus-within .delete-my-paper { opacity: 1; pointer-events: auto; }
@media (hover: none), (pointer: coarse) {
  .delete-my-paper { opacity: 1; pointer-events: auto; width: 40px; min-height: 40px; }
}
.source-label-layer { position: absolute; inset: 0; pointer-events: none; z-index: 2; }
.source-label { display: block; position: absolute; pointer-events: auto; min-height: 0; height: 3mm; line-height: 3mm; padding: 0 1mm; border: 0; border-radius: 1mm; background: #edf2f7; color: #46526b; font: 7pt/3mm system-ui, sans-serif; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.source-label:focus-visible { outline: 2px solid #1769d2; }
#source-dialog-content { max-width: 36rem; overflow-wrap: anywhere; white-space: pre-wrap; }
body.paper-operation main { pointer-events: none; }
body.paper-operation #my-papers-dialog { pointer-events: auto; }

[hidden] { display: none !important; }

/* Manual labeling uses the same original image rectangle for every overlay. */
[data-mode], #label-dashboard-open { font-size: 14px; height: 42px; }
.labeling-pane-heading [data-mode][aria-pressed="true"] { background: #09552d; color: white; box-shadow: inset 0 0 0 2px #032e17; }
.labeling-box-types { position: absolute; left: -2px; top: 0; z-index: 3; display: flex; gap: 2px; visibility: hidden; }
.labeling-box-types button { min-height: 28px; padding: 3px 7px; font-size: 12px; line-height: 1.2; white-space: nowrap; background: white; color: #09552d; border: 1px solid #09552d; }
.labeling-box-types button[aria-pressed="true"] { background: #09552d; color: white; }
.labeling-stage.drawing .labeling-box:hover .labeling-box-types, .labeling-stage.drawing .labeling-box:focus-within .labeling-box-types { visibility: visible; }
.labeling-box:has(.labeling-box-types):hover, .labeling-box:has(.labeling-box-types):focus-within { z-index: 4; }
@media (hover: none) { .labeling-stage.drawing .labeling-box-types { visibility: visible; } }
.labeling-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: .6rem; }
/* The order of work in one line and the keyboard shortcuts, beside 문제은행 업로드. */
.labeling-guide-row { align-items: center; }
.labeling-steps { flex: 1 1 24rem; margin: 0; color: #4c5a70; font-size: .9rem; font-weight: 600; }
.labeling-shortcut-help { position: relative; }
.labeling-shortcut-help > summary { display: inline-flex; align-items: center; min-height: 36px; padding: 6px 12px; border: 1px solid var(--ui-control-border, #767676); border-radius: var(--ui-radius, 8px); background: white; font-size: 14px; font-weight: 600; cursor: pointer; list-style: none; }
.labeling-shortcut-help > summary::-webkit-details-marker { display: none; }
.labeling-shortcut-help > summary::before { content: "⌨"; margin-right: .35rem; }
.labeling-shortcut-help[open] > summary { border-color: var(--ui-focus, #0e7490); background: var(--ui-selected, #ecfeff); }
.labeling-shortcut-panel { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; width: min(26rem, 80vw); padding: .8rem 1rem; border: 1px solid #c8d3e0; border-radius: 10px; background: white; box-shadow: 0 10px 28px rgb(0 0 0 / .14); font-size: .9rem; }
.labeling-shortcut-panel p { margin: 0 0 .5rem; color: #4c5a70; }
.labeling-shortcut-panel dl { display: grid; grid-template-columns: max-content 1fr; gap: .35rem .8rem; margin: 0; }
.labeling-shortcut-panel dt { font-weight: 800; white-space: nowrap; }
.labeling-shortcut-panel dd { margin: 0; }
/* The latest line of a running automatic analysis beside its button, also with the dialog closed. */
.auto-launch-status { align-self: center; max-width: 28rem; overflow: hidden; color: #0e5a6e; font-size: .85rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.auto-launch-status[hidden] { display: none; }
.labeling-toolbar label { display: grid; gap: .25rem; font-size: .85rem; }
.labeling-toolbar input { max-width: 260px; }
.labeling-toolbar select { max-width: 280px; }
.labeling-projects { margin-bottom: 1rem; }
.labeling-projects .labeling-toolbar { align-items: end; }
.labeling-projects .labeling-toolbar > label { flex: 1 1 280px; min-width: 0; }
.labeling-projects select { width: 100%; max-width: 100%; min-width: 0; }
.labeling-projects p { overflow-wrap: anywhere; }
.labeling-projects p:empty { display: none; }
.labeling-notice { min-height: 1.5em; padding: .65rem; border-radius: 6px; background: #edf4f1; overflow-wrap: anywhere; }
.labeling-notice.error, .labeling-item .error { color: #9d2727; background: #fff1ed; }
/* Background registration status stays visible on every tab until the job settles. */
.labeling-background { position: fixed; right: 16px; bottom: 16px; z-index: 1000; max-width: min(420px, calc(100vw - 32px)); margin: 0; padding: .7rem .9rem; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-surface); color: var(--ui-ink); box-shadow: 0 6px 24px rgb(0 0 0 / .12); overflow-wrap: anywhere; white-space: pre-line; }
.labeling-background.error { color: #9d2727; background: #fff1ed; }
.labeling-workspace { min-width: 0; }
.labeling-viewers { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .75rem; }
.labeling-pane { min-width: 0; border: 1px solid #cad6d0; border-radius: 8px; overflow: hidden; background: #f2f5f3; }
.labeling-pane-heading { display: grid; padding: .65rem; gap: 8px; }
.labeling-pane-disabled .labeling-frame { opacity: .45; }
.labeling-pane-actions [data-no-solution][aria-pressed="true"] { background: #174ea6; color: white; border-color: #174ea6; }
.labeling-pane-actions { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; min-width: 0; }
.labeling-pane-heading button { font-size: 14px; width: auto; min-height: 44px; padding: 8px 12px; flex: none; max-width: 100%; white-space: normal; }
.labeling-source-name { font-size: .76rem; margin: 0; padding: 0 .65rem .4rem; min-height: 2.5em; overflow-wrap: anywhere; }
.labeling-page-controls { padding: .4rem; display: flex; flex-wrap: wrap; gap: .4rem; align-items: end; font-size: 14px; }
.labeling-page-controls label { display: grid; gap: 4px; font-size: 14px; }
.labeling-page-controls [data-total] { height: 42px; display: flex; align-items: center; }
.labeling-page-controls input, .labeling-page-controls select, .labeling-page-controls button { width: 88px; height: 42px; min-height: 42px; margin: 0; padding: 0 8px; font-size: 14px; line-height: normal; }
.labeling-frame { position: relative; }
.labeling-scroll { height: min(72vh, 880px); min-height: 320px; overflow: auto; background: #dde3e0; }
.labeling-stage { position: relative; width: 100%; line-height: 0; min-height: 1px; }
.labeling-stage > img, .labeling-stage > canvas { display: block; width: 100%; height: auto; max-width: none; user-select: none; }
.labeling-overlay { position: absolute; inset: 0; }
.labeling-stage.drawing .labeling-overlay { cursor: crosshair; touch-action: none; }
.labeling-box { position: absolute; display: block; margin: 0; padding: 2px; min-width: 0; min-height: 0; border: 2px solid #32965d; border-radius: 2px; background: #84e3a631; color: #094e2b; text-align: left; font-size: 12px; line-height: 1.2; font-weight: bold; cursor: pointer; overflow: visible; }
.labeling-stage.drawing .labeling-box { cursor: move; }
.labeling-box:hover, .labeling-box.active { border-color: #096c39; background: #80efab45; }
.labeling-box:focus-within { outline: 3px solid #163eaa; outline-offset: 2px; }
.labeling-box.multi-selected { border-color: #163eaa; background: #bfdbfe66; outline: 2px solid #163eaa; outline-offset: 2px; }
.labeling-shortcuts, .labeling-selection { margin: 3px 0; font-size: 12px; }
.labeling-selection { color: #163eaa; max-height: 4em; overflow: auto; }
.labeling-box-select { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; border: 0; border-radius: 0; margin: 0; padding: 2px; background: transparent; color: inherit; text-align: left; font-size: 12px; line-height: 1.2; display: flex; align-items: start; cursor: inherit; }
.labeling-box-select:hover { background: transparent; }
.labeling-box-number { flex: none; padding: 2px 7px; border-radius: 4px; background: #09552d; color: white; font-size: 20px; line-height: 1.2; font-weight: 800; pointer-events: none; transform: translateY(-100%); }
.labeling-box[data-queued] > .labeling-box-number { position: absolute; top: 0; left: 0; }
.labeling-box-save-status { position: absolute; top: 0; right: 0; padding: 2px 4px; background: #fff; color: #09552d; font-size: 12px; pointer-events: none; }
.labeling-box-delete { position: absolute; right: 0; top: 0; z-index: 2; width: 24px; height: 24px; min-height: 24px; margin: 0; padding: 0; border: 0; border-radius: 2px; font-size: 20px; line-height: 1; color: white; background: #a52b2b; visibility: hidden; }
.labeling-stage.drawing .labeling-box:hover .labeling-box-delete, .labeling-stage.drawing .labeling-box:focus-within .labeling-box-delete { visibility: visible; }
.labeling-box-handle { display: none; }
.labeling-stage.drawing .labeling-box-handle { display: block; }
.labeling-box-handle { position: absolute; width: 12px; height: 12px; right: -5px; bottom: -5px; background: #1e8c4b; cursor: nwse-resize; }
.labeling-box.unsaved { border-color: #b92929; color: #b92929; pointer-events: none; }
.labeling-drag { pointer-events: none; }
.labeling-page-edge { position: absolute; z-index: 3; top: 45%; opacity: 0; width: 32px; height: 64px; padding: 0; background: #174d35d9; color: white; font-size: 2rem; transition: opacity .15s; }
.labeling-page-edge.previous { left: 0; }
.labeling-page-edge.next { right: 0; }
.labeling-frame:hover .labeling-page-edge, .labeling-frame:focus-within .labeling-page-edge { opacity: 1; }
.labeling-page-edge:disabled { opacity: 0 !important; pointer-events: none; }
.labeling-dashboard { width: 94vw; height: 92dvh; max-width: none; max-height: 92dvh; overflow: hidden; }
.labeling-dashboard[open] { display: grid; grid-template-rows: auto auto minmax(0, 1fr); gap: .75rem; }
.labeling-dialog-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.labeling-dialog-heading h3, .labeling-dialog-heading p { margin: 0; }
/* Beside the disabled register button, so the reason sits where the teacher looks. */
.labeling-publish-hint { align-self: center; max-width: 30rem; color: #9d2727; font-size: .9rem; font-weight: 600; }
#label-dashboard-details { min-width: 0; }
#label-dashboard-details > summary { padding: .65rem .75rem; border: 1px solid #cad6d0; border-radius: 6px; cursor: pointer; font-size: 14px; font-weight: 600; }
#label-dashboard-details > summary:focus-visible { outline: 2px solid #1769d2; outline-offset: 2px; }
#label-dashboard-details[open] > summary { margin-bottom: .5rem; }
#label-dashboard-details[open] .labeling-expand, #label-dashboard-details:not([open]) .labeling-collapse { display: none; }
.labeling-dashboard-tools { display: grid; gap: .4rem; max-height: 44dvh; overflow: auto; }
.labeling-dashboard-tools p { margin: 0; overflow-wrap: anywhere; }
.labeling-dashboard select { max-width: 100%; font-size: 14px; }
#label-items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; overflow: auto; align-content: start; padding: 3px; }
.labeling-item { min-width: 0; padding: .8rem; border: 1px solid #cbd5cf; border-radius: 8px; background: white; }
.labeling-item.selected { border: 2px solid #228856; padding: calc(.8rem - 1px); }
.labeling-item-heading { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.labeling-pair-crops { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto 1fr auto; gap: .5rem .75rem; margin: .6rem 0; }
.labeling-role { min-width: 0; display: grid; grid-template-rows: subgrid; grid-row: span 3; }
.labeling-crops { min-width: 0; display: flex; flex-direction: column; gap: .35rem; }
.labeling-thumbnail { flex: 1; display: flex; flex-direction: column; justify-content: center; width: 100%; min-width: 0; padding: 6px; margin: 0; border: 1px solid #d6ddd9; background: white; color: #172033; font-size: 13px; }
.labeling-thumbnail img { display: block; width: 100%; height: 180px; object-fit: contain; }
.labeling-item .muted { font-size: 13px; margin: 0; overflow-wrap: anywhere; }
.labeling-dialog { width: min(700px, 90vw); border: 1px solid #a9c3b4; border-radius: 10px; }
.labeling-dialog label { display: grid; gap: .35rem; margin: 1rem 0; }
.labeling-answer-table { max-height: 50vh; overflow: auto; margin-top: .75rem; }
.labeling-answer-table table { border-collapse: collapse; width: 100%; }
.labeling-answer-table th, .labeling-answer-table td { padding: .2rem .5rem; text-align: left; border-bottom: 1px solid #e3ece6; }
.labeling-answer-table input { width: min(24rem, 100%); }
.labeling-dialog select { width: 100%; }
.labeling-drop-zone { display: block; width: 100%; min-height: 180px; padding: 24px; border: 2px dashed #739e87; background: #f2f8f4; color: #174d35; font-size: 16px; }
.labeling-drop-zone.drag-over { border-color: #096c39; background: #d9f1e2; }
.labeling-drop-zone small { font-size: 14px; }
.labeling-dialog [hidden] { display: none !important; }
.labeling-dialog::backdrop { background: #17203366; }
.labeling-result-pane { display: flex; flex-direction: column; min-width: 0; min-height: 0; border: 1px solid #cad6d0; border-radius: 6px; overflow: hidden; }
.labeling-result-pane > h4 { flex: none; margin: 0; padding: .5rem .75rem; background: #edf4f1; }
.labeling-result-scroll { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: .6rem; }
.hangul-dialog { position: fixed; inset: 2dvh 2vw auto; width: 96vw; height: 96dvh; max-height: none; margin: 0; padding: 12px; }
.hangul-dialog[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 8px; }
.hangul-dialog::backdrop { background: #17203399; }
.hangul-dialog .labeling-dialog-heading { min-width: 0; }
.hangul-dialog .labeling-dialog-heading h3 { margin: 0; font-size: 1rem; overflow-wrap: anywhere; }
.hangul-dialog .labeling-dialog-heading button { flex: none; }
.hangul-dialog-body { display: grid; grid-template-columns: minmax(200px, .7fr) minmax(0, 1.3fr); min-height: 0; gap: 10px; }
#label-hangul-original { min-width: 0; min-height: 0; overflow: hidden; }
#label-hangul-original[open] { display: flex; flex-direction: column; }
#label-hangul-original > summary { flex: none; cursor: pointer; padding: 4px; }
#label-hangul-original > .labeling-result-pane { flex: 1; }
#label-hangul-original .labeling-result-pane > h4 { display: none; }
.hangul-dialog-main { display: flex; flex-direction: column; gap: 6px; min-width: 0; min-height: 0; }
#label-hangul-meta { flex: none; }
#label-hangul-meta label { display: flex; align-items: center; gap: 8px; font-size: 13px; }
#label-hangul-meta input { min-width: 0; width: 10em; }
.hangul-dialog footer p { max-height: 3.2em; overflow: auto; }
.hangul-editor { display: flex; flex-direction: column; flex: 1; min-height: 0; gap: .4rem; }
.hangul-editor .labeling-toolbar { flex-wrap: wrap; flex: none; }
.hangul-editor select { max-width: 100%; min-width: 0; flex: 1; }
.hangul-editor p { margin: 0; font-size: 13px; }
.hangul-editor-surface { min-height: 0; flex: 1; border: 1px solid #b4bfc9; border-radius: 4px; overflow: hidden; }
.hangul-editor-surface iframe { display: block; }
.hangul-editor > select { flex: none; width: 100%; }
.hangul-editor > p { flex: none; max-height: 3.2em; overflow: auto; }
.hangul-editor p:empty { display: none; }
.editor-tabs { display: flex; gap: .3rem; flex: none; }
.editor-tabs [aria-pressed="true"] { color: #fff; background: #176443; border-color: #176443; }
.image-capture-tools { flex: none; flex-wrap: wrap; padding: .4rem; }
.image-capture-surface { position: relative; line-height: 0; }
.image-capture-surface img { display: block; width: 100%; }
.image-capture-enabled .image-capture-surface { cursor: crosshair; touch-action: none; user-select: none; }
.image-capture-box { position: absolute; pointer-events: none; border: 2px solid #1467b1; background: #3189d433; box-sizing: border-box; }
#label-image-description-field { padding: .4rem; font-size: 13px; }
#label-image-description { width: 100%; box-sizing: border-box; }
#label-editor-content > section > h4 { display: flex; align-items: center; justify-content: space-between; gap: .4rem; }
@media (max-width: 800px) {
  .hangul-dialog { padding: 8px; }
  .hangul-dialog-body { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); gap: 6px; }
  #label-hangul-original[open] { height: min(24dvh, 180px); }
  .hangul-editor > .help { display: none; }
  .hangul-dialog button { padding: 4px 8px; font-size: 13px; }
}
#labeling-root [hidden] { display: none !important; }
#label-publish-excluded { max-height: 30dvh; overflow: auto; }
#label-publish-dialog { max-height: 85dvh; overflow-y: auto; }
#label-publish-name, #label-publish-bar { width: 100%; min-width: 0; }
#label-publish-bar { height: 1rem; }
#label-publish-status, #label-publish-summary { overflow-wrap: anywhere; }
@media (hover: none) {
  .labeling-page-edge { opacity: 1; }
  .labeling-stage.drawing .labeling-box-delete { visibility: visible; }
}
@media (max-width: 1199px) {
  #label-items { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 650px) {
  .labeling-result-body { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); }
  .labeling-viewers { grid-template-columns: minmax(0, 1fr); }
  .labeling-scroll { height: 65vh; }
}

.mypage-main { margin-inline: auto; }
.private-source-grid { align-items: stretch; margin-bottom: 1rem; }
.private-source-grid > p { grid-column: 1 / -1; }
.private-source-card { display: flex; flex-direction: column; gap: .75rem; min-width: 0; padding: 1rem; border: 1px solid #dce3ec; border-radius: 10px; background: white; }
.private-source-card h4 { margin: 0; font-size: 1rem; overflow-wrap: anywhere; }
.private-source-card p { margin: 0; color: #596579; font-size: .84rem; overflow-wrap: anywhere; }
.private-source-thumbnail { width: 100%; height: 240px; flex: none; padding: .5rem; border: 1px solid #dce3ec; background: #f8fafc; color: #596579; }
.private-source-thumbnail img { width: 100%; height: 100%; object-fit: contain; }
.private-source-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin-top: auto; }
#session-status:empty { display: none; }

/* Image placement is confined to its semantic paragraph, including overlay height. */
.image-paragraph { display: grid; grid-template-columns: minmax(0, 1fr); isolation: isolate; min-width: 0; break-inside: avoid; }
.image-paragraph-text { display: flow-root; position: relative; min-width: 0; min-height: 1.7em; }
.placed-image { max-width: 100%; padding: 0; }
.placed-image img { display: block; width: 100%; height: auto; }
.placed-image.placed-inline { display: inline-block; vertical-align: middle; margin: 0; }
.placed-image.placed-row { clear: both; margin-top: .4em; margin-bottom: .4em; }
.placed-image.placed-left { margin-left: 0; margin-right: auto; justify-self: start; }
.placed-image.placed-center { margin-left: auto; margin-right: auto; justify-self: center; }
.placed-image.placed-right { margin-left: auto; margin-right: 0; justify-self: end; }
.placed-wrap.placed-left { float: left; margin: 0 .5em .3em 0; }
.placed-wrap.placed-right { float: right; margin: 0 0 .3em .5em; }
.placed-image.placed-behind, .placed-image.placed-front { align-self: start; margin-top: 0; margin-bottom: 0; }
/* Step 3 cart: the chosen questions only, in composition order, three per row on wide screens. */
.cart-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; margin-bottom: 1rem; }
/* The next step is the one big button; 모두 비우기 keeps a little distance from the others. */
.cart-toolbar #cart-continue, .cart-window #cart-continue { min-height: 44px; padding-inline: 1.25rem; font-size: 15px; font-weight: 800; }
.cart-toolbar #cart-clear { margin-inline-end: .6rem; }
.cart-help { flex: 1 1 18rem; margin: 0; color: #596579; }
.cart-edb-status { flex: 1 1 100%; margin: 0; color: #17406a; font-size: .92rem; }
.cart-edb-status:empty { display: none; }
.cart-edb-quality { flex: 1 1 100%; margin: 0; color: #6b4a00; font-size: .92rem; }
.cart-edb-quality:empty { display: none; }
.cart-quality { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: .25rem 0; }
.cart-quality-badge { padding: .1rem .5rem; border: 1px solid #c58b00; border-radius: 999px; background: #fff6dc; color: #6b4a00; font-size: .82rem; }
.cart-quality-badge.excluded { border-color: #8a94a3; background: #eef1f5; color: #3d4757; }
.cart-quality-badge.transcribed { border-color: #2f6f4e; background: #e7f6ee; color: #1f4d35; }
.edb-quality-dialog { width: min(980px, calc(100vw - 2rem)); max-width: calc(100vw - 2rem); max-height: calc(100vh - 2rem); overflow: auto; }
.edb-quality-figures { display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: 1rem; }
.edb-quality-figure { margin: 0; }
.edb-quality-figure.board { padding: .5rem; background: rgb(42, 74, 59); }
.edb-quality-figure.board figcaption { color: #fff; }
.edb-quality-frame { position: relative; width: 100%; }
.edb-quality-frame img { display: block; width: 100%; height: auto; }
.edb-quality-crop { position: absolute; border: 2px dashed #17406a; pointer-events: none; }
.edb-quality-mark { position: absolute; border: 2px solid #d97706; background: #d9770622; pointer-events: none; }
.edb-quality-action { display: grid; gap: .2rem; max-width: 20rem; }
.edb-quality-help { margin: 0; color: #4a5568; font-size: .85rem; }
.cart-count { font-weight: 700; color: #172033; }
.cart-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; padding: 12px; background: #f0f0f0; border-radius: 10px; min-height: 8rem; }
.cart-card { min-width: 0; display: flex; flex-direction: column; gap: .5rem; padding: .75rem; background: white; border: 1px solid #cbd3df; border-radius: 8px; cursor: grab; }
.cart-card.dragging { opacity: .4; }
.cart-card.cart-drop-before { box-shadow: inset 5px 0 0 #1769d2; }
.cart-card.cart-drop-after { box-shadow: inset -5px 0 0 #1769d2; }
.cart-card-heading { display: flex; align-items: baseline; gap: .5rem; min-width: 0; }
.cart-number { flex: none; min-width: 1.8rem; padding: .05rem .45rem; border-radius: 999px; background: #1769d2; color: white; text-align: center; }
/* The whole source line wraps instead of being cut off at desktop card widths. */
.cart-source { min-width: 0; overflow-wrap: anywhere; color: #596579; font-size: .85rem; line-height: 1.35; }
.cart-image { max-height: 28rem; overflow: auto; border: 1px solid #edf0f4; border-radius: 4px; }
.cart-image img { display: block; width: 100%; height: auto; pointer-events: none; }
.cart-controls { display: flex; flex-wrap: wrap; gap: .4rem; }
.cart-controls button { flex: 1 1 auto; min-height: 36px; padding: .25rem .5rem; }
.cart-empty { grid-column: 1 / -1; margin: 2rem 0; text-align: center; color: #596579; }
.cart-window-body { margin: 0; background: #eef2f7; }
.cart-window { padding: 16px clamp(12px, 3vw, 24px); }
.cart-window-title { margin: .15rem 0 0; font-size: 1.4rem; }
@media (max-width: 1100px) { .cart-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .cart-grid { grid-template-columns: minmax(0, 1fr); } }

.orzo-submit-reason { margin: .4rem 0 0; color: #9d2727; font-size: .9rem; }
/* Orzo uploads and automatic analysis lines, bottom-right so they never cover the step menu, the filter sidebar or
   the left-hand controls. The labeling registration line (.labeling-background) stacks just above them. New lines
   open above a 32px round button for a few seconds, then fold into it (orzo-upload.js). The button stays in the
   right margin: question and cart card controls end at least 40px before the window edge at desktop widths. Only the
   lines and the button take clicks, not the empty corner beside them. */
.orzo-background { position: fixed; right: 5px; bottom: 16px; z-index: 1000; display: grid; justify-items: end; gap: 6px; pointer-events: none; }
.orzo-background[hidden], .orzo-background-lines[hidden] { display: none; }
.orzo-background > * { pointer-events: auto; }
.orzo-background-lines { display: grid; gap: 6px; width: max-content; max-width: min(380px, calc(100vw - 32px)); margin-right: 11px; }
.orzo-background .orzo-background-toggle { order: 1; position: relative; display: grid; place-items: center; width: 32px; height: 32px; min-height: 0; padding: 0; border: 1px solid var(--ui-control-border, #767676); border-radius: 50%; background: var(--ui-surface, white); color: #33415a; box-shadow: 0 4px 14px rgb(0 0 0 / .18); }
.orzo-background .orzo-background-toggle::before { content: ""; width: 16px; height: 16px; background: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 22a2.5 2.5 0 0 0 2.45-2h-4.9A2.5 2.5 0 0 0 12 22zm7-6v-5a7 7 0 0 0-5-6.71V3.5a2 2 0 0 0-4 0v.79A7 7 0 0 0 5 11v5l-2 2v1h18v-1z'/%3E%3C/svg%3E") center / contain no-repeat; }
.orzo-background.open .orzo-background-toggle { border-color: var(--ui-focus, #0e7490); background: var(--ui-selected, #ecfeff); }
.orzo-background-count { position: absolute; top: -6px; right: -4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: #1769d2; color: white; font-size: 11px; font-weight: 800; line-height: 16px; text-align: center; }
.orzo-background.error .orzo-background-toggle { border-color: #c56262; color: #9d2727; }
.orzo-background.error .orzo-background-count { background: #c62828; }
.orzo-background-live { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.orzo-background p { display: flex; align-items: start; gap: .5rem; margin: 0; padding: .6rem .8rem; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-surface); color: var(--ui-ink); box-shadow: 0 6px 24px rgb(0 0 0 / .12); overflow-wrap: anywhere; }
.orzo-background p.error { color: #9d2727; background: #fff1ed; }
.orzo-background p > span { flex: 1; }
.orzo-background button { flex: none; min-height: 24px; padding: 0 6px; }
/* While the tray shows, orzo-upload.js keeps its height plus its 16px offset in --background-tray-space. The page ends
   that much higher, so the controls under the tray can scroll clear of it, and anything the browser scrolls into view
   (keyboard focus, scrollIntoView) stops 8px above the tray. */
:root { scroll-padding-bottom: calc(var(--background-tray-space, 0px) + min(8px, var(--background-tray-space, 0px))); }
.qbank-main::after { content: ""; display: block; height: var(--background-tray-space, 0px); }
.labeling-background { bottom: calc(16px + var(--background-tray-space, 0px)); }

/* Automatic card analysis (contract 8.1-8.4): standard filter, card badges, similar questions and the admin section. */
/* The standard filter is folded under 더 자세히 고르기 and disappears with it when the feature is off for this view. */
.card-filter-more { margin: .8rem 0 0; }
.card-filter-more:has(> #card-filter[hidden]) { display: none; }
.card-filter-more > summary { padding: .45rem .2rem; font-weight: 700; cursor: pointer; }
.card-filter-more > summary small { margin-left: .3rem; color: var(--ui-muted, #626976); font-weight: 600; }
.card-filter-more > .card-filter { margin-top: .3rem; }
.card-filter { display: grid; gap: .6rem; min-width: 0; margin: .8rem 0 0; padding: 1rem; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-surface); }
.card-filter legend { padding: 0 .3rem; font-weight: 700; color: var(--ui-ink); }
.card-filter select { width: 100%; }
.card-filter .card-search-all { display: flex; align-items: center; gap: .45rem; }
.card-filter .card-search-all input { width: 18px; height: 18px; min-height: 0; margin: 0; padding: 0; }
.card-filter p { margin: 0; font-size: .84rem; line-height: 1.45; }
/* ui-foundation.css loads after this file and greys every .badge:not(.warning):not(.error); the same :not() pair puts
   these state colours ahead of it. */
.badge.card-state-verified:not(.warning):not(.error) { background: #dcfce7; color: #14532d; }
.badge.card-state-candidate:not(.warning):not(.error) { background: var(--ui-selected); color: var(--ui-primary-ink); }
.badge.card-state-held:not(.warning):not(.error), .badge.card-state-stale:not(.warning):not(.error) { background: #ffedc2; color: #7b4c00; }
.badge.card-state-failed:not(.warning):not(.error) { background: #ffe0e0; color: #992f2f; }
.badge.card-stale { opacity: .55; }
.card-report { min-height: 30px; padding: .2rem .6rem; font-size: .8rem; }
.similar-panel { display: grid; gap: .8rem; margin-top: 1rem; padding: 1rem; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-surface); }
.similar-panel .panel-heading { align-items: center; margin: 0; }
.similar-panel h3 { margin: 0; font-size: 1.15rem; }
.similar-panel p { margin: 0; }
.similar-panel > label { justify-self: start; min-width: min(16rem, 100%); }
#similar-status:empty { display: none; }
.similar-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr)); gap: 12px; align-items: start; min-width: 0; }
.similar-list[aria-busy="true"] { opacity: .6; }
.similar-candidate { display: grid; gap: .45rem; min-width: 0; padding: .75rem; border: 1px solid #cbd3df; border-radius: var(--ui-radius); background: white; }
.similar-candidate:has(.similar-check:checked) { border-color: var(--ui-focus); box-shadow: inset 0 0 0 1px var(--ui-focus); }
.similar-candidate.unavailable { border-style: dashed; background: var(--ui-page); color: var(--ui-muted); }
.similar-candidate.unavailable .similar-badges { opacity: .7; }
.similar-pick { display: flex; align-items: center; gap: .45rem; }
.similar-pick input { width: 20px; height: 20px; min-height: 0; margin: 0; padding: 0; }
.similar-image { max-height: 18rem; overflow: auto; border: 1px solid #edf0f4; border-radius: 4px; }
.similar-image img { display: block; max-width: 100%; height: auto; }
.similar-source { overflow-wrap: anywhere; font-weight: 700; font-size: .9rem; }
.similar-badges { display: flex; flex-wrap: wrap; gap: .3rem; }
.similar-badges .badge { max-width: 100%; overflow-wrap: anywhere; }
.similar-reasons { color: var(--ui-muted); font-size: .84rem; }
.similar-missing { font-weight: 700; color: var(--ui-muted); }
.similar-actions { display: flex; flex-wrap: wrap; justify-content: end; gap: .6rem; }
#card-report-dialog, #card-analysis-extra-dialog, #card-backfill-dialog, #card-config-dialog { width: min(30rem, calc(100vw - 32px)); }
#card-report-resolve-dialog { width: min(40rem, calc(100vw - 32px)); }
#card-report-dialog form, #card-report-resolve-dialog form { display: grid; gap: .8rem; }
#card-report-dialog h2, #card-report-dialog p, #card-report-resolve-dialog h2, #card-report-resolve-dialog p { margin: 0; }
#card-report-reason, #card-report-resolve-note { width: 100%; min-height: 6rem; resize: vertical; }
#card-report-resolve-concepts { min-height: 8rem; }
#card-analysis-alert { margin: 0 0 1rem; padding: .75rem 1rem; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); background: var(--ui-page); color: var(--ui-ink); }
#card-analysis-alert.error { border-color: #e2abab; background: #fff2f2; color: #8c2525; }
#card-analysis-summary { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: .35rem 1rem; margin: 0 0 1rem; }
#card-analysis-summary dt { color: var(--ui-muted); font-weight: 700; }
#card-analysis-summary dd { margin: 0; overflow-wrap: anywhere; }
#provider-spend-summary { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: .35rem 1rem; margin: 0 0 .5rem; }
#provider-spend-summary dt { color: var(--ui-muted); font-weight: 700; }
#provider-spend-summary dd { margin: 0; overflow-wrap: anywhere; }
#provider-spend-summary dd.warning { color: #7b4c00; font-weight: 700; }
#provider-spend-summary dd.error { color: #8c2525; font-weight: 700; }
#card-analysis-settings { grid-template-columns: repeat(auto-fill, minmax(min(12rem, 100%), 1fr)); align-items: end; margin-bottom: 1rem; }
#card-analysis-settings select, #card-analysis-settings input:not([type="checkbox"]) { width: 100%; }
.card-analysis-actions { grid-column: 1 / -1; justify-content: start; margin: 0; }
.card-analysis-check { display: flex; align-items: center; gap: .45rem; }
.card-analysis-check input { width: 18px; height: 18px; min-height: 0; margin: 0; padding: 0; }
#card-analysis h4 { margin: 1.25rem 0 .6rem; font-size: 1rem; }
#card-analysis-exam-summary, #card-analysis-sync-status { margin: 0 0 .6rem; }
#card-analysis-sync-status:empty, #card-reports-status:empty { display: none; }
.card-analysis-table { min-width: 60rem; }
.card-analysis-table th, .card-analysis-table td { padding: .65rem .6rem; word-break: keep-all; overflow-wrap: break-word; }
.card-analysis-table td:first-child { min-width: 10rem; }
.card-analysis-table td.error { color: #8c2525; }
/* The shared admin rule makes action cells flex boxes; here they stay table cells so the row lines meet. */
.card-analysis-table td.user-actions { display: table-cell; }
.card-analysis-table td.user-actions button { display: flex; width: 100%; margin: .2rem 0; white-space: nowrap; }
.card-book-actions { display: contents; }
/* The materials table's 작업 column also holds the three card buttons. Korean words and button labels stay whole, the
   book name keeps a readable width, and a narrow window scrolls the table inside its own frame. */
#books td { word-break: keep-all; overflow-wrap: break-word; }
#books td:first-child { min-width: 8rem; }
#books td.user-actions { min-width: 13rem; }
#books button { white-space: nowrap; }
#card-reports-more { margin-top: .75rem; }
@media (max-width: 760px) {
  .similar-actions { justify-content: stretch; }
  .similar-actions button { flex: 1 1 auto; }
  #card-analysis-summary, #provider-spend-summary { grid-template-columns: minmax(0, 1fr); }
  #card-analysis-summary dd { margin-bottom: .4rem; }
}

/* 필사 확인 (EDB transcription review): tablet first, 44px touch targets, side by side from 900px. */
#edb-review-panel button { min-height: 44px; }
/* The '?' term help keeps its 24px circle here too; its own ::before already gives it a 44px touch area. */
#edb-review-panel button.term-help { min-height: 24px; }
.edb-review-intro { margin: .25rem 0 1rem; color: #4c5a70; }
.edb-review-status:empty { display: none; }
.edb-review-status.error { color: #992f2f; }
/* The counters switch the list, so they read as one segmented tab bar with hover, focus and pressed states. */
.edb-review-filters { display: inline-flex; flex-wrap: wrap; gap: 0; margin-bottom: 1rem; border: 1px solid #b8c4d4; border-radius: 10px; overflow: hidden; background: #f4f7fb; }
.edb-review-filters button { margin: 0; border: 0; border-right: 1px solid #b8c4d4; border-radius: 0; background: transparent; color: #33415a; font-weight: 700; }
.edb-review-filters button:last-child { border-right: 0; }
.edb-review-filters button:hover:not([aria-pressed="true"]) { background: #e3eaf3; }
.edb-review-filters button:focus-visible { position: relative; z-index: 1; outline-offset: -3px; }
.edb-review-filters button[aria-pressed="true"], .edb-review-filters button[aria-pressed="true"]:hover { background: var(--ui-primary, #06b6d4); color: var(--ui-primary-ink, #083344); box-shadow: inset 0 -3px 0 rgb(0 0 0 / .18); }
.edb-review-status button { margin-left: .4rem; }
.edb-review-book { margin: 0 0 1.25rem; }
.edb-review-book h3 { margin: 0 0 .5rem; font-size: 1rem; }
.edb-review-book-counts { color: #626976; font-size: .85rem; font-weight: 500; }
.edb-review-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: .5rem; margin: 0; padding: 0; list-style: none; }
.edb-review-item { width: 100%; flex-wrap: wrap; justify-content: space-between; gap: .35rem .5rem; }
.edb-review-item-label, .edb-review-item .badge { white-space: nowrap; }
.edb-review-detail-head { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.edb-review-detail-head h3 { margin: 0; font-size: 1.05rem; }
.edb-review-nav { display: flex; gap: .5rem; margin-left: auto; }
.edb-review-compare { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.edb-review-original, .edb-review-transcription { min-width: 0; margin: 0; padding: .75rem; border: 1px solid #d7dee8; border-radius: 10px; background: white; }
.edb-review-original img { display: block; max-width: 100%; height: auto; }
.edb-review-original figcaption, .edb-review-transcription h4 { margin: 0 0 .5rem; font-size: .95rem; font-weight: 750; }
.edb-review-rendered .question-content { font-family: "Qbank PNG Serif", serif; }
.edb-review-rendered img { max-width: 100%; height: auto; }
.edb-review-note { color: #7b4c00; }
.edb-review-checks { margin-top: 1rem; }
.edb-review-checks h4, .edb-review-figures h4 { margin: 0 0 .5rem; }
.edb-review-differences li { margin: .25rem 0; overflow-wrap: anywhere; }
.edb-review-figures { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; margin-top: 1rem; }
.edb-review-figures > h4, .edb-review-figures > p { margin: 0; }
.edb-figure-progress:empty { display: none; }
.edb-review-figure { min-width: 0; padding: .6rem; border: 1px solid #d7dee8; border-radius: 10px; }
.edb-review-figure h5 { margin: 0 0 .4rem; font-size: .9rem; }
.edb-review-figure figure { margin: 0; }
.edb-review-figure img { display: block; max-width: 100%; height: auto; }
.edb-review-figure figcaption { color: #626976; font-size: .8rem; }
.edb-review-figure-candidates:empty { display: none; }
/* Original and traced candidate side by side at the same width (same padded box, so the same scale); 2× doubles both
   and scrolls; the browser's pinch zoom stays available. */
.edb-figure-compare { display: flex; gap: .75rem; overflow-x: auto; scroll-snap-type: x proximity; touch-action: pan-x pan-y pinch-zoom; }
.edb-figure-compare > * { flex: 1 1 0; min-width: 0; scroll-snap-align: start; }
.edb-figure-compare:has(> .edb-review-figure-candidates:empty) > .edb-review-figure-original { flex: 0 1 50%; }
.edb-figure-compare.zoomed > * { flex: 0 0 calc(100% - .75rem); }
.edb-figure-frame { margin: 0; }
.edb-figure-box { position: relative; border: 1px solid #e3e8ef; background: white; }
.edb-figure-box img { width: 100%; max-width: none; }
.edb-figure-marker { position: absolute; width: 1.4rem; height: 1.4rem; margin: -.7rem 0 0 -.7rem; border: 2px solid #d97706;
  border-radius: 50%; box-shadow: 0 0 0 2px rgba(255, 255, 255, .8); pointer-events: none; }
.edb-figure-empty { margin: 0; padding: .75rem; border: 1px dashed #c8d0da; border-radius: 8px; color: #4c5a70; }
.edb-figure-summary { margin-top: .5rem; }
.edb-figure-summary p, .edb-figure-reasons { margin: .25rem 0; }
.edb-figure-reasons { padding-left: 1.2rem; }
.edb-figure-check.ok { background: #e7f6ec; color: #1c5d33; }
.edb-figure-facts { color: #4c5a70; font-size: .9rem; }
.edb-figure-decision { margin: .4rem 0; font-weight: 700; }
.edb-figure-decision.approved { color: #1c5d33; }
.edb-figure-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.edb-figure-actions button { min-width: 6.5rem; }
.edb-review-actions { position: sticky; bottom: 0; display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; padding: .75rem 0; border-top: 1px solid #ededed; background: white; }
.edb-review-actions button { min-width: 6.5rem; }
.edb-edit-list { display: grid; gap: .5rem; }
.edb-edit-block { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .4rem; align-items: start; }
.edb-edit-block textarea, .edb-edit-block input[type="text"], .edb-edit-label { box-sizing: border-box; width: 100%; min-height: 44px; font-size: 16px; }
.edb-edit-block.math input { font-family: ui-monospace, Menlo, monospace; }
.edb-edit-preview { grid-column: 1 / -1; min-height: 1.6rem; padding: .2rem .4rem; overflow-x: auto; border-radius: 6px; background: #f6f8fb; }
.edb-edit-block.asset, .edb-edit-block.item_group { grid-template-columns: minmax(0, 1fr); }
.edb-edit-block.asset img { max-width: 12rem; max-height: 8rem; }
.edb-edit-fixed { color: #626976; font-weight: 700; }
.edb-edit-group { display: grid; gap: .5rem; margin: 0; padding: .5rem; border: 1px solid #d7dee8; border-radius: 8px; }
.edb-edit-add { display: flex; flex-wrap: wrap; gap: .5rem; }
/* 그림 트레이싱 (book view): a card per figure, original | traced at the same width; 1 column below 760px. */
.edb-trace-head { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-bottom: .5rem; }
.edb-trace-picker { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; font-weight: 700; }
.edb-trace-picker select { min-height: 44px; max-width: min(28rem, 100%); font-size: 16px; }
.edb-trace-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.edb-trace-tools { flex: 1 1 100%; }
.edb-trace-tools .edb-trace-actions { margin-bottom: .25rem; }
.edb-trace-tool-status:empty { display: none; }
.edb-trace-tool-status { font-weight: 700; overflow-wrap: anywhere; }
.edb-trace-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); gap: .75rem; margin: 0 0 1rem; padding: 0; list-style: none; }
.edb-trace-card { min-width: 0; padding: .6rem; border: 1px solid #d7dee8; border-radius: 10px; background: white; }
.edb-trace-card h4 { margin: 0 0 .4rem; font-size: .95rem; overflow-wrap: anywhere; }
.edb-trace-card figcaption { color: #626976; font-size: .8rem; }
.edb-trace-card .edb-figure-box img { display: block; height: auto; }
.edb-trace-crop { position: relative; overflow: hidden; width: 100%; }
.edb-trace-crop img { position: absolute; width: auto; max-width: none; max-height: none; }
.edb-trace-unknown { padding: .6rem .8rem; border: 1px dashed #c8d0da; border-radius: 8px; }
.edb-trace-dialog { width: min(34rem, calc(100vw - 2rem)); max-height: 90dvh; overflow: auto; }
.edb-trace-dialog ul { margin: 0; padding-left: 1.2rem; line-height: 1.6; overflow-wrap: anywhere; }
.edb-trace-dialog li + li { margin-top: .35rem; }
.edb-trace-dialog .dialog-actions button { min-height: 44px; min-width: 44px; }
@media (max-width: 900px) {
  .edb-review-compare { grid-template-columns: minmax(0, 1fr); }
  .edb-review-nav { margin-left: 0; }
}