/* Screenshot-matched annotation task management layout */
.annotation-page { background: #eef5fb; color: #174c82; }
.annotation-titlebar { border-bottom: 1px solid #d9e8f5; background: linear-gradient(90deg, #edf7ff, #f8fcff 53%, #edf7ff); }
.annotation-titlebar-inner { display: flex; align-items: center; justify-content: center; min-height: 79px; padding-top: 8px; padding-bottom: 8px; }
.annotation-title-copy { min-width: 0; text-align: center; }
.annotation-title-copy h1 { display: flex; align-items: center; justify-content: center; margin: 0; color: #074a99; font: 700 30px "STKaiti", "KaiTi", serif; letter-spacing: 2px; }
.annotation-title-copy h1 > span { display: inline-block; width: 6px; height: 53px; margin-right: 15px; border-radius: 3px; background: #1479e8; }
.annotation-content-grid { display: grid; grid-template-columns: minmax(0, 1fr) 337px; gap: 13px; align-items: start; padding-top: 10px; padding-bottom: 14px; }
.annotation-main-column, .annotation-right-column { display: grid; gap: 11px; min-width: 0; }
.annotation-filter-card, .annotation-task-list-card, .annotation-preview-card, .annotation-process-card, .annotation-statistics-card, .annotation-overview-card, .annotation-doc-card { min-width: 0; overflow: hidden; border: 1px solid #dceaf7; border-radius: 8px; background: #fff; box-shadow: 0 3px 11px rgba(34, 106, 171, .08); }
.annotation-filter-card { padding: 8px 12px 9px; }
.annotation-filter-row { display: grid; grid-template-columns: 91px minmax(0,1fr); align-items: start; gap: 10px; min-height: 39px; padding: 4px 0; border-bottom: 1px solid #edf3f9; }
.annotation-filter-row > strong { padding-top: 6px; color: #0955a5; font-size: 14px; white-space: nowrap; }
.annotation-domain-row { grid-template-columns: 91px minmax(0,1fr) 20px; min-height: 111px; }
.annotation-chip-scroll { height: 104px; overflow-y: auto; padding-right: 4px; scrollbar-color: #8a8e91 #e9edf1; scrollbar-width: thin; }
.annotation-chip-list { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 7px 10px; }
.annotation-chip-list button { min-height: 30px; padding: 0 16px; border-radius: 16px; color: #536f8e; background: #eef4fb; font-size: 13px; white-space: nowrap; }
.annotation-chip-list button:hover, .annotation-chip-list button.selected { color: #075ebd; background: #dcecff; box-shadow: inset 0 0 0 1px #b3d6fa; }
.annotation-scroll-mark { display: grid; grid-template-rows: 18px 1fr 18px; align-items: center; justify-items: center; height: 104px; color: #969a9e; font-size: 10px; }
.annotation-scroll-mark i { width: 12px; height: 18px; border-radius: 7px; background: #8e9295; }
.annotation-filter-actions { display: flex; justify-content: flex-end; gap: 13px; padding-top: 8px; }
.annotation-filter-actions button { width: 142px; height: 34px; border: 1px solid #8bbdf3; border-radius: 4px; color: #0868d5; background: #fff; font-size: 13px; }
.annotation-filter-actions button.primary { color: #fff; border-color: #0869dc; background: linear-gradient(135deg, #218cf1, #0969d5); }
.annotation-filter-actions button:hover { transform: translateY(-1px); }
.annotation-section-heading { display: flex; align-items: center; justify-content: space-between; min-height: 45px; padding: 0 13px; border-bottom: 1px solid #dbe9f6; }
.annotation-section-heading > div { display: flex; align-items: center; min-width: 0; }
.annotation-section-heading h2 { margin: 0; color: #0756a4; font-size: 17px; }
.annotation-section-heading > button { padding: 0; color: #0b69ca; background: transparent; font-size: 12px; }
.annotation-heading-icon { display: grid; place-items: center; width: 22px; height: 22px; margin-right: 8px; border-radius: 3px; color: #0c6bd1; background: #eef6ff; font-size: 17px; }
.annotation-heading-icon.preview { background: transparent; font-size: 18px; }.annotation-heading-icon.people { background: transparent; font-size: 19px; }.annotation-heading-icon.stats { background: #f1f6fb; font-size: 16px; }
.annotation-table-wrap { overflow-x: auto; }
.annotation-table-wrap table { width: 100%; border-collapse: collapse; color: #275b90; font-size: 12px; }
.annotation-table-wrap th { height: 32px; padding: 0 12px; color: #54779b; background: #eaf3fc; font-weight: 400; text-align: left; white-space: nowrap; }
.annotation-table-wrap td { height: 39px; padding: 0 12px; border-bottom: 1px solid #e5eef7; white-space: nowrap; }
.annotation-table-wrap tr:last-child td { border-bottom: 0; }.annotation-table-wrap td:first-child { color: #1e5b96; }.annotation-table-wrap td:last-child { padding-right: 10px; }
.task-name-mark { margin-right: 6px; color: #376992; font-size: 10px; }.annotation-corpus-label { display: block; margin: 3px 0 0 16px; color: #7f9bb5; font-size: 10px; }.annotation-tag { display: inline-block; padding: 4px 10px; border-radius: 12px; color: #176dc1; background: #e8f3ff; font-size: 11px; }
.annotation-progress { display: inline-flex; align-items: center; gap: 6px; }.annotation-progress b { display: inline-block; width: 112px; height: 8px; overflow: hidden; border-radius: 8px; background: #e4edf6; }.annotation-progress b i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#0e70e4,#65aaf1); }.annotation-progress em { color: #28618f; font-size: 11px; font-style: normal; }
.annotation-status { display: inline-block; padding: 4px 11px; border-radius: 12px; font-size: 11px; font-style: normal; }.annotation-status.doing { color: #1d9d6b; background: #def8ec; }.annotation-status.review { color: #e38632; background: #fff0db; }.annotation-status.pending { color: #667f9d; background: #edf2f6; }
.annotation-table-wrap td button { min-width: 79px; height: 27px; padding: 0 9px; border: 1px solid #6eaff1; border-radius: 4px; color: #0969d3; background: #fff; font-size: 12px; }.annotation-table-wrap td button:hover { background: #eff7ff; }.annotation-table-empty { padding: 32px 12px; color: #7894af; text-align: center; font-size: 13px; }
.annotation-preview-heading { min-height: 45px; }.annotation-preview-current { color: #4d79a2; font-size: 12px; }.annotation-preview-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 11px; padding: 10px 12px; }.annotation-description-panel, .annotation-operation-panel { min-width: 0; border: 1px solid #cfe1f3; border-radius: 5px; }.annotation-description-panel h3, .annotation-operation-panel h3 { margin: 0; padding: 8px 12px; border-bottom: 1px solid #cfe1f3; color: #21598c; background: #eaf4fd; font-size: 14px; }.annotation-description-panel p { min-height: 36px; margin: 0; padding: 9px 12px 3px; color: #325f8c; font-size: 13px; line-height: 1.55; }.annotation-description-panel p + p { padding-top: 2px; padding-bottom: 11px; }.annotation-description-panel strong { color: #086ada; font-size: 14px; }.annotation-operation-status { display: flex; align-items: center; gap: 8px; padding: 9px 12px 5px; color: #406d96; font-size: 12px; }.annotation-operation-buttons { display: flex; gap: 8px; padding: 0 12px 10px; }.annotation-operation-buttons button { height: 29px; padding: 0 13px; border: 1px solid #6eaef0; border-radius: 4px; color: #0869d3; background: #fff; font-size: 12px; }.annotation-operation-buttons button.primary { color: #fff; border-color: #096bdc; background: #0870dd; }.annotation-mini-stats { display: grid; grid-template-columns: repeat(3,1fr); padding: 8px 10px; background: #eaf3fc; }.annotation-mini-stats div { display: grid; gap: 3px; text-align: center; }.annotation-mini-stats div + div { border-left: 1px solid #d1e1f0; }.annotation-mini-stats span { color: #6684a4; font-size: 10px; }.annotation-mini-stats strong { color: #0869d6; font-size: 16px; }
.annotation-bottom-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 11px; }.annotation-process { display: flex; align-items: center; justify-content: space-around; min-height: 67px; padding: 8px 13px; }.annotation-process > div { display: grid; justify-items: center; gap: 5px; color: #33638f; font-size: 11px; white-space: nowrap; }.annotation-process b { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; color: #0869d5; background: #e8f3ff; font-size: 13px; font-weight: 400; }.annotation-process > i { color: #78a0c6; font-size: 18px; font-style: normal; }.annotation-statistics { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; padding: 9px 11px; }.annotation-statistics div { display: grid; gap: 4px; min-height: 45px; place-items: center; padding: 5px 2px; background: #edf5fc; }.annotation-statistics span { color: #567694; font-size: 10px; }.annotation-statistics strong { color: #096bdd; font-size: 18px; }
.annotation-overview-card, .annotation-doc-card { overflow: hidden; }.annotation-overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; padding: 10px; }.annotation-overview-grid > div { display: flex; align-items: center; gap: 8px; min-height: 63px; padding: 8px 10px; background: #edf5fc; }.overview-icon { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; color: #fff; background: #1d83e4; font-size: 18px; }.overview-icon.people { background: transparent; color: #0c79dc; font-size: 25px; }.annotation-overview-grid p { display: grid; gap: 2px; margin: 0; color: #5d7c9d; font-size: 11px; }.annotation-overview-grid strong { color: #0869dc; font-size: 19px; line-height: 1; }.annotation-overview-grid strong.enabled { font-size: 14px; }
.annotation-doc-list { display: grid; gap: 0; padding: 4px 10px 7px; }.annotation-doc-list button { display: grid; grid-template-columns: 34px minmax(0,1fr) 14px; align-items: center; gap: 8px; width: 100%; min-height: 55px; padding: 7px 0; border-bottom: 1px dashed #e0ebf5; color: #2b628f; background: transparent; text-align: left; }.annotation-doc-list button:last-child { border-bottom: 0; }.annotation-doc-list button:hover { background: #f5faff; }.annotation-doc-icon { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 5px; color: #fff; background: #e44f5e; font-size: 8px; font-weight: 700; }.annotation-doc-icon.blue { background: #2789df; }.annotation-doc-icon.orange { background: #e58a2c; }.annotation-doc-list button > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; }.annotation-doc-list strong { overflow: hidden; color: #1b5d9b; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.annotation-doc-list small { margin-top: 3px; overflow: hidden; color: #7c96ae; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.annotation-doc-list b { color: #1673c8; font-size: 17px; font-weight: 400; }

@media (max-width: 1180px) {
  .annotation-content-grid { grid-template-columns: minmax(0,1fr) 290px; }.annotation-chip-list button { padding: 0 12px; }.annotation-table-wrap table { min-width: 940px; }
}
@media (max-width: 900px) {
  .annotation-content-grid { grid-template-columns: 1fr; }.annotation-right-column { grid-template-columns: repeat(2,minmax(0,1fr)); }.annotation-doc-card { min-height: 150px; }
}
@media (max-width: 680px) {
  .annotation-titlebar-inner { min-height: 67px; padding-top: 10px; padding-bottom: 10px; }.annotation-title-copy h1 { font-size: 28px; }.annotation-filter-row, .annotation-domain-row { grid-template-columns: 1fr; gap: 4px; }.annotation-filter-row > strong { padding-top: 0; }.annotation-domain-row { min-height: 0; }.annotation-chip-scroll { height: 89px; }.annotation-scroll-mark { display: none; }.annotation-filter-actions { justify-content: stretch; }.annotation-filter-actions button { flex: 1; width: auto; }.annotation-preview-grid, .annotation-bottom-grid { grid-template-columns: 1fr; }.annotation-right-column { grid-template-columns: 1fr; }.annotation-preview-current { display: none; }.annotation-process { overflow-x: auto; justify-content: flex-start; gap: 10px; }.annotation-process > i { flex: 0 0 auto; }.annotation-statistics { grid-template-columns: repeat(2,1fr); }.annotation-section-heading h2 { font-size: 15px; }
}
@media (max-width: 420px) {
  .annotation-title-copy h1 { font-size: 27px; }.annotation-title-copy h1 > span { height: 45px; margin-right: 11px; }.annotation-chip-list button { min-height: 28px; padding: 0 11px; font-size: 12px; }.annotation-filter-actions { gap: 8px; }.annotation-filter-actions button { height: 32px; }.annotation-preview-grid { padding: 8px; }.annotation-description-panel p { font-size: 12px; }.annotation-statistics { gap: 5px; }
}