:root {
  --bg: #f3f4ef;
  --panel: #fffef8;
  --line: #ddd8c8;
  --ink: #1f2d38;
  --muted: #5a6673;
  --primary: #1d6f5d;
  --accent: #2f4f9d;
  --warn: #b97812;
  --danger: #b33a2f;
  --ok: #257a44;
  --panel-shadow: 0 10px 28px rgba(26, 36, 50, 0.08);
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  color: var(--ink);
  font-family: "Noto Serif SC", "Source Han Serif SC", "Microsoft YaHei", serif;
  background:
    radial-gradient(1600px 500px at 10% -10%, rgba(72, 130, 255, 0.16), transparent 56%),
    radial-gradient(1300px 450px at 90% -20%, rgba(36, 126, 94, 0.12), transparent 58%),
    var(--bg);
  overflow-y: auto;
}

input,
textarea,
button {
  font: inherit;
}

.hidden {
  display: none !important;
}

.paper-picker-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(18, 24, 33, 0.38);
}

.paper-picker-panel {
  width: min(860px, 96vw);
  max-height: min(78vh, 720px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 20px 52px rgba(13, 23, 36, 0.26);
  padding: 14px;
}

.paper-picker-head h3 {
  margin: 0 0 4px;
}

.paper-picker-head p {
  margin: 0;
}

.paper-picker-list {
  overflow: auto;
  border: 1px solid #e2decd;
  border-radius: 10px;
  background: #fff;
}

.paper-picker-item {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 8px;
  align-items: start;
  padding: 10px 12px;
  border-bottom: 1px dashed #e6e2d3;
  cursor: pointer;
}

.paper-picker-item:last-child {
  border-bottom: none;
}

.paper-picker-item:hover {
  background: #faf7ef;
}

.paper-picker-item input[type="radio"] {
  margin: 3px 0 0;
}

.paper-picker-meta {
  min-width: 0;
}

.paper-picker-meta .muted {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.paper-picker-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.muted {
  color: var(--muted);
  font-size: 13px;
}

.app-shell {
  min-height: 100vh;
  padding: 16px;
}

.boot-view {
  min-height: calc(100vh - 32px);
  display: grid;
  place-items: center;
}

.boot-card {
  min-width: 260px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #d9d2bd;
  border-radius: 12px;
  background: #fffdf6;
  box-shadow: var(--panel-shadow);
  padding: 14px 18px;
  color: #3f5166;
}

.auth-view {
  min-height: calc(100vh - 32px);
  display: grid;
  place-items: center;
}

.auth-card {
  width: min(980px, 94vw);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 24px;
  box-shadow: var(--panel-shadow);
}

.auth-card h1 {
  margin: 0 0 6px;
}

.auth-guide {
  margin-top: 14px;
  border: 1px solid #d9e4f2;
  border-radius: 12px;
  background: #f7fbff;
  color: #22364d;
}

.auth-guide summary {
  cursor: pointer;
  padding: 11px 13px;
  font-weight: 800;
  color: #173b65;
}

.auth-guide-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 0 13px 12px;
}

.auth-guide section {
  min-width: 0;
  border-top: 1px solid rgba(87, 119, 156, 0.22);
  padding-top: 9px;
}

.auth-guide h3 {
  margin: 0 0 5px;
  font-size: 15px;
  color: #173b65;
}

.auth-guide p {
  margin: 0;
  color: #486079;
  font-size: 13px;
  line-height: 1.58;
}

.auth-guide-note {
  margin: 0 13px 13px;
  padding: 9px 10px;
  border-left: 4px solid #2878b8;
  border-radius: 6px;
  background: #eef6ff;
}

.auth-grid {
  margin-top: 14px;
  display: grid;
  grid-template-columns: 1.1fr 1.1fr 0.8fr;
  gap: 12px;
}

.auth-grid.auth-grid-admin {
  grid-template-columns: minmax(320px, 560px);
  justify-content: center;
}

.auth-block {
  border: 1px solid #e6e2d3;
  border-radius: 12px;
  background: #fff;
  padding: 12px;
}

.auth-block h2 {
  margin: 0 0 10px;
  font-size: 18px;
}

input,
textarea {
  width: 100%;
  border: 1px solid #cbc9bf;
  border-radius: 8px;
  background: #fff;
  padding: 8px 10px;
  margin-bottom: 8px;
}

.password-strength-hint {
  margin: -2px 0 8px;
  padding: 7px 9px;
  border: 1px solid #d9d2bd;
  border-radius: 8px;
  background: #fffaf0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
  pointer-events: none;
  user-select: none;
}

.password-strength-hint.is-invalid {
  border-color: rgba(179, 58, 47, 0.38);
  background: #fff3f1;
  color: var(--danger);
}

.password-strength-hint.is-valid {
  border-color: rgba(37, 122, 68, 0.38);
  background: #effaf2;
  color: var(--ok);
}

textarea {
  resize: vertical;
}

button {
  border: none;
  border-radius: 8px;
  padding: 8px 12px;
  color: #fff;
  background: var(--primary);
  cursor: pointer;
}

button:disabled {
  opacity: 0.56;
  cursor: not-allowed;
}

.access-request-paused-control {
  position: relative;
}

.access-request-paused-control[aria-disabled="true"] {
  opacity: 0.56;
  cursor: not-allowed;
}

.access-request-paused-control:hover::after {
  content: attr(data-access-lock-reason);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: calc(100% + 8px);
  z-index: 2200;
  min-width: 220px;
  max-width: min(420px, 82vw);
  padding: 8px 10px;
  border-radius: 8px;
  background: #1f2f3f;
  color: #fff;
  font-size: 12px;
  line-height: 1.45;
  box-shadow: 0 10px 24px rgba(15, 25, 38, 0.28);
  white-space: normal;
  pointer-events: none;
}

button.alt {
  background: var(--accent);
}

button.warn {
  background: var(--warn);
}

button.ok {
  background: var(--ok);
}

button.danger {
  background: var(--danger);
}

.main-view {
  min-height: calc(100vh - 32px);
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 10px;
}

.topbar,
.control-strip {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 12px;
  box-shadow: var(--panel-shadow);
}

.top-left {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.divider {
  width: 1px;
  height: 14px;
  background: #ccc6b6;
}

.control-strip {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.control-box {
  border: 1px dashed #bcb8a8;
  border-radius: 10px;
  padding: 10px;
  min-height: 180px;
  background: #fff;
}

.control-box > label {
  display: block;
  margin-bottom: 8px;
  font-weight: 700;
  color: #34495f;
}

.dataset-flow-tip {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
  margin-bottom: 8px;
  padding: 8px;
  border: 1px solid #d8d2bf;
  border-radius: 8px;
  background: linear-gradient(180deg, #fcfbf6, #f7f4ea);
}

.dataset-step {
  font-size: 12px;
  color: #4f5e6e;
}

.dataset-selection-hint {
  margin: 0 0 8px;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid #d9d3c1;
  background: #fbfaf6;
}

.upload-row {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 8px;
}

.upload-row input {
  margin: 0;
}

.dataset-create-row button,
.dataset-upload-row button {
  white-space: nowrap;
}

.dataset-upload-tip {
  margin-top: 2px;
}

.plan-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.precheck-panel {
  margin: 10px 0 12px;
  padding: 10px;
  border: 1px solid #d9d3c1;
  border-radius: 10px;
  background: #fffdf7;
}

.precheck-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
  gap: 8px;
}

.precheck-center-link {
  font-size: 12px;
}

.precheck-status {
  font-weight: 700;
  margin-bottom: 4px;
}

.precheck-detail {
  margin-bottom: 8px;
}

.precheck-run-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 8px;
}

.precheck-run-row button {
  min-width: 96px;
}

.precheck-warn-box {
  border: 1px solid #cbd6ea;
  background: #f7fbff;
  color: #2d3a4a;
  border-radius: 8px;
  padding: 8px 10px;
  margin-bottom: 8px;
}

.precheck-warn-title {
  font-weight: 700;
  margin: 8px 0;
}

.precheck-table-wrap {
  overflow: auto;
  margin: 6px 0 10px;
}

.precheck-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.precheck-table th,
.precheck-table td {
  border: 1px solid #dbe4f2;
  padding: 4px 6px;
  text-align: left;
  vertical-align: top;
}

.precheck-dist-list {
  display: grid;
  gap: 8px;
}

.precheck-dist-col {
  border: 1px solid #dbe4f2;
  border-radius: 8px;
  background: #fff;
  padding: 4px 8px 6px;
}

.precheck-dist-col summary {
  cursor: pointer;
  font-weight: 600;
  outline: none;
}

.plan-actions button[disabled] {
  pointer-events: auto;
}

.options-wrap {
  max-height: none;
  overflow-y: visible;
  overflow-x: hidden;
  border: 1px solid #cbc7b8;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  margin-bottom: 8px;
}

.option-item {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 12px;
  border: 1px solid #e3decd;
  border-radius: 10px;
  background: #fffdf8;
  padding: 10px;
  margin-bottom: 10px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.option-item:last-child {
  margin-bottom: 0;
}

.option-item-selected {
  border-color: #9ab3dc;
  box-shadow: 0 3px 10px rgba(38, 74, 139, 0.1);
  background: #f7fbff;
}

.option-select-side {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}

.option-order-label {
  font-size: 14px;
  font-weight: 700;
  color: #2d4d78;
}

.option-order-hint {
  margin-bottom: 10px;
  color: #5c6470;
  font-size: 13px;
  line-height: 1.5;
}

.option-auto-switch-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 4px;
  color: #26384c;
  font-size: 13px;
  font-weight: 700;
}

.option-auto-switch-toggle input {
  width: 16px;
  height: 16px;
  accent-color: var(--primary);
}

.option-auto-switch-disabled {
  color: #8a929d;
}

.option-auto-switch-note {
  margin: 0 0 12px;
  color: #687482;
  font-size: 12px;
  line-height: 1.45;
}

.option-order-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.option-order-btn {
  border: 1px solid #d6dce8;
  background: #fff;
  color: #44546a;
  border-radius: 6px;
  padding: 6px 8px;
  font-size: 12px;
  cursor: pointer;
}

.option-order-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.option-select-btn {
  border: 1px solid #9cb2d7;
  background: #eff4ff;
  color: #234979;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  line-height: 1.25;
}

.option-select-btn:hover {
  background: #e6eefb;
}

.option-select-btn-selected {
  border-color: #2b5ea8;
  background: #2b5ea8;
  color: #fff;
}

.option-content {
  min-width: 0;
}

.option-panel {
  border: 1px solid #dde2eb;
  border-radius: 8px;
  background: #fbfcff;
  min-width: 0;
}

.option-panel-title {
  padding: 8px 10px;
  border-bottom: 1px solid #e4e8f1;
  font-size: 12px;
  font-weight: 700;
  color: #405066;
  background: #f4f7fd;
  border-radius: 8px 8px 0 0;
}

.option-summary-md {
  padding: 10px;
  max-height: none;
  overflow: visible;
  color: #222b38;
  font-size: 14px;
  line-height: 1.65;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.option-summary-md h1,
.option-summary-md h2,
.option-summary-md h3,
.option-summary-md h4,
.option-summary-md h5,
.option-summary-md h6 {
  margin: 0 0 10px;
  font-size: 15px;
  line-height: 1.45;
}

.option-summary-md p {
  margin: 0 0 10px;
}

.option-summary-md ul,
.option-summary-md ol {
  margin: 0 0 10px 18px;
  padding: 0;
}

.option-summary-md li {
  margin: 0 0 8px;
}

.option-summary-md strong {
  font-weight: 700;
}

.options-loading {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid #cfcab9;
  background: #fff;
}

.spinner {
  width: 16px;
  height: 16px;
  border: 2px solid #d5d0c2;
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

.workspace {
  min-height: 0;
  display: grid;
  grid-template-columns: 0.95fr 1.15fr 0.95fr;
  grid-auto-rows: minmax(0, calc(100vh - 180px));
  gap: 10px;
  align-items: stretch;
}

.panel {
  min-height: 0;
  height: 100%;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--panel-shadow);
  padding: 10px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.panel-left {
  gap: 0;
}

.panel-left-scroll {
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.task-overview-panel {
  gap: 8px;
}

.task-progress-section {
  margin-top: 4px;
  border: 1px solid #d7d2c3;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
}

.task-progress-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.task-progress-head h3 {
  margin: 0;
}

.task-progress-head span {
  color: #2f4f9d;
  font-weight: 700;
  font-size: 13px;
}

.task-progress-message {
  border: 1px solid #e0dbc9;
  border-radius: 8px;
  background: #fbfaf6;
  color: #3f5166;
  padding: 7px 8px;
  margin-bottom: 8px;
  font-size: 13px;
  line-height: 1.45;
}

.task-progress-message.is-backtracking {
  border-color: #dfc488;
  background: #fff8e8;
  color: #765211;
}

.task-progress-message.is-blocked {
  border-color: #c7d5ef;
  background: #f2f7ff;
  color: #294d82;
}

.task-progress-flow {
  min-height: 260px;
}

.task-flow-list {
  display: flex;
  flex-direction: column;
}

.task-flow-step {
  position: relative;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  border: 1px solid #e1dccd;
  border-radius: 8px;
  background: #fffefb;
  padding: 8px;
}

.task-flow-step-dot {
  width: 14px;
  height: 14px;
  margin-top: 3px;
  border-radius: 50%;
  border: 2px solid #b9c1cc;
  background: #fff;
}

.task-flow-step-body {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.task-flow-step-body strong {
  color: #26384f;
  font-size: 13px;
  line-height: 1.35;
}

.task-flow-step-body span {
  color: #687482;
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.task-flow-step-body .task-flow-live {
  margin-top: 3px;
  color: #2d4d7e;
  font-weight: 600;
}

.task-flow-step.is-done .task-flow-step-dot {
  border-color: var(--ok);
  background: var(--ok);
}

.task-flow-step.is-running {
  border-color: #93a8d8;
  background: #f7faff;
  animation: task-step-pulse 1.6s ease-in-out infinite;
}

.task-flow-step.is-running .task-flow-step-dot {
  border-color: var(--accent);
  background: var(--accent);
}

.task-flow-step.is-backtracking {
  border-color: #d6b66f;
  background: #fff8e8;
  animation: task-step-pulse 1.2s ease-in-out infinite;
}

.task-flow-step.is-backtracking .task-flow-step-dot {
  border-color: var(--warn);
  background: var(--warn);
}

.task-flow-step.is-blocked {
  border-color: #8aa6d8;
  background: #f4f8ff;
}

.task-flow-step.is-failed {
  border-color: #d7a29c;
  background: #fff7f6;
}

.task-flow-step.is-failed .task-flow-step-dot {
  border-color: var(--danger);
  background: var(--danger);
}

.task-flow-step.is-pending,
.task-flow-step.is-skipped {
  opacity: 0.72;
}

.task-flow-edge {
  position: relative;
  width: 2px;
  height: 18px;
  margin-left: 19px;
  background: #d9d5c8;
  overflow: hidden;
}

.task-flow-edge.is-done {
  background: #8db69b;
}

.task-flow-edge.is-active::after {
  content: "";
  position: absolute;
  inset: -18px 0 0;
  background: linear-gradient(180deg, transparent, var(--accent), transparent);
  animation: task-edge-flow 1s linear infinite;
}

.task-flow-edge.is-skipped {
  background: repeating-linear-gradient(180deg, #d9d5c8 0 4px, transparent 4px 8px);
}

.task-backtrack-banner {
  display: grid;
  gap: 3px;
  margin-bottom: 8px;
  border: 1px solid #dec27d;
  border-radius: 8px;
  background: #fff8e8;
  padding: 8px;
  color: #765211;
  font-size: 12px;
  line-height: 1.4;
}

.task-flow-backtrack-note {
  display: grid;
  gap: 4px;
  margin-top: 8px;
  color: #765211;
  font-size: 12px;
}

.task-graph-meta {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  color: #2b3c55;
  font-size: 12px;
  line-height: 1.35;
}

.task-graph-meta strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.task-graph-meta span {
  flex: 0 0 auto;
  border: 1px solid #d7d2c3;
  border-radius: 999px;
  padding: 1px 7px;
  background: #fbfaf6;
  color: #55616f;
  font-weight: 700;
}

.task-graph-canvas {
  position: relative;
  min-height: 280px;
  padding: 2px 0 8px;
}

.task-graph-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: visible;
  z-index: 0;
}

.task-graph-node-list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 18px;
}

.task-graph-node {
  position: relative;
  width: calc(100% - 18px);
  margin-left: 18px;
  border: 1px solid #d9d4c6;
  border-radius: 8px;
  background: rgba(255, 254, 251, 0.98);
  padding: 8px 9px;
  box-shadow: 0 1px 2px rgba(42, 50, 62, 0.04);
}

.task-graph-node.is-script,
.task-graph-node.is-script_plan {
  width: calc(100% - 42px);
  margin-left: 42px;
  background: #fbfcff;
  border-color: #ccd7ec;
}

.task-graph-node.is-backtrack {
  width: calc(100% - 30px);
  margin-left: 30px;
  border-color: #d8b96f;
  background: #fff8e8;
}

.task-graph-node.is-running,
.task-graph-node.is-backtracking {
  border-color: #7595d8;
  box-shadow: 0 0 0 2px rgba(47, 79, 157, 0.08);
  animation: task-step-pulse 1.5s ease-in-out infinite;
}

.task-graph-node.is-done {
  border-color: #9fbea8;
  background: #fbfffc;
}

.task-graph-node.is-failed {
  border-color: #d7a29c;
  background: #fff7f6;
}

.task-graph-node.is-partial {
  border-color: #d5c07e;
  background: #fffaf0;
}

.task-graph-node.is-pending {
  opacity: 0.78;
}

.task-graph-node-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 5px;
}

.task-graph-type,
.task-graph-status {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  border-radius: 999px;
  padding: 1px 7px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
}

.task-graph-type {
  background: #eef2f7;
  color: #3c4e63;
}

.task-graph-status {
  background: #f1efe8;
  color: #5e6772;
}

.task-graph-node.is-running .task-graph-status {
  background: #e8f0ff;
  color: #2f4f9d;
}

.task-graph-node.is-done .task-graph-status {
  background: #e9f6ec;
  color: #237342;
}

.task-graph-node.is-failed .task-graph-status {
  background: #fff0ee;
  color: #a23a2e;
}

.task-graph-node.is-backtracking .task-graph-status,
.task-graph-node.is-backtrack .task-graph-status {
  background: #fff0cc;
  color: #79540d;
}

.task-graph-node h4 {
  margin: 0;
  color: #25364d;
  font-size: 13px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.task-graph-subtitle,
.task-graph-desc {
  margin: 3px 0 0;
  color: #5c6a78;
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.task-graph-desc {
  color: #6f7883;
}

.task-graph-live {
  display: grid;
  gap: 3px;
  margin-top: 5px;
}

.task-graph-live span {
  border: 1px solid #d8e2f5;
  border-radius: 6px;
  background: #f6f9ff;
  color: #2d4d7e;
  padding: 3px 6px;
  font-size: 12px;
  line-height: 1.35;
}

.task-graph-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}

.task-graph-metrics span {
  min-width: 0;
  max-width: 100%;
  border: 1px solid #d7dce7;
  border-radius: 999px;
  background: #f6f8fb;
  color: #48566a;
  padding: 1px 6px;
  font-size: 11px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.task-graph-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
  color: #697482;
  font-size: 11px;
}

.task-graph-edge {
  fill: none;
  stroke: #cfc9ba;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.task-graph-edge.is-done {
  stroke: #78a886;
}

.task-graph-edge.is-active,
.task-graph-edge.is-running,
.task-graph-edge.is-backtracking {
  stroke: #2f4f9d;
  stroke-dasharray: 6 6;
  animation: task-graph-edge-flow 0.9s linear infinite;
}

.task-graph-edge.is-backtrack,
.task-graph-edge.is-backtrack_rule {
  stroke: #b9801f;
  stroke-dasharray: 5 5;
}

.task-graph-edge.is-rule {
  stroke: #d0b374;
  stroke-width: 1.5;
  opacity: 0.75;
}

.task-graph-arrow-head {
  fill: currentColor;
  color: #8c95a1;
}

.task-graph-edge-text {
  fill: #765211;
  font-size: 10px;
  paint-order: stroke;
  stroke: #fffaf0;
  stroke-width: 3px;
}

@keyframes task-step-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(47, 79, 157, 0.14);
  }
  50% {
    box-shadow: 0 0 0 5px rgba(47, 79, 157, 0.08);
  }
}

@keyframes task-edge-flow {
  to {
    transform: translateY(30px);
  }
}

@keyframes task-graph-edge-flow {
  to {
    stroke-dashoffset: -24;
  }
}

.panel-middle {
  gap: 0;
}

.panel-right {
  gap: 0;
}

.panel h2 {
  margin: 0 0 8px;
  font-size: 17px;
}

.panel h3 {
  margin: 10px 0 6px;
  font-size: 14px;
  color: #3d5168;
}

.status-line {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  border: 1px solid #ded8c9;
  border-radius: 8px;
  padding: 6px 8px;
  margin-bottom: 6px;
  background: #fff;
  font-size: 13px;
}

.status-line > div:first-child {
  white-space: nowrap;
  padding-right: 8px;
}

.status-line > div:last-child {
  max-width: 72%;
  text-align: right;
}

.status-line-selected > div:last-child {
  max-width: 72%;
  text-align: left;
  white-space: normal;
  line-height: 1.35;
  max-height: 88px;
  overflow-y: auto;
  word-break: break-word;
}

.scroll-box {
  min-height: 0;
  overflow-y: auto;
  border: 1px solid #d7d2c3;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
}

.dataset-list {
  min-height: 160px;
  max-height: min(46vh, 320px);
  overflow-y: auto;
  scrollbar-gutter: stable;
  margin-bottom: 8px;
  background: linear-gradient(180deg, #fff, #fbfaf6);
}

.dataset-item {
  border: 1px solid #e2dece;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
  margin-bottom: 10px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.dataset-item:last-child {
  margin-bottom: 0;
}

.dataset-item.selected {
  border-color: #96afdd;
  background: linear-gradient(180deg, #f6f9ff, #fdfefe);
  box-shadow: 0 3px 10px rgba(38, 74, 139, 0.08);
}

.dataset-item-header {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 8px;
  margin: 0;
}

.dataset-radio-wrap {
  display: inline-flex;
  align-items: center;
}

.dataset-item-title {
  font-weight: 700;
  color: #26384f;
  line-height: 1.3;
}

.dataset-status-chip {
  border-radius: 999px;
  padding: 2px 10px;
  font-size: 11px;
  border: 1px solid transparent;
  white-space: nowrap;
}

.dataset-status-chip.done {
  color: #1f6b3a;
  background: #ebf8f0;
  border-color: #b8e1c6;
}

.dataset-status-chip.pending {
  color: #5d6672;
  background: #f4f5f7;
  border-color: #d8dbe0;
}

.dataset-id-row {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.dataset-id-pill,
.dataset-source-pill,
.dataset-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 2px 10px;
  font-size: 11px;
  line-height: 1.4;
}

.dataset-id-pill {
  border: 1px solid #cdd8ec;
  background: #edf2fb;
  color: #2b4b84;
}

.dataset-source-pill {
  border: 1px solid #d8d0b7;
  background: #faf6e7;
  color: #6f5c2d;
}

.dataset-badges {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.dataset-badge {
  border: 1px solid #d9d5c6;
  background: #f8f6ef;
  color: #4e5c6b;
}

.dataset-file-map {
  margin-top: 10px;
  border: 1px solid #dfd9c9;
  border-radius: 8px;
  background: #fcfbf7;
  padding: 8px;
}

.dataset-file-map-title {
  font-size: 12px;
  color: #3e5268;
  font-weight: 700;
  margin-bottom: 6px;
}

.dataset-file-map-empty {
  color: #7b8795;
  font-size: 12px;
}

.dataset-file-map-list {
  display: grid;
  gap: 6px;
  max-height: 180px;
  overflow-y: auto;
  padding-right: 2px;
}

.dataset-file-row {
  border: 1px solid #e5dfd1;
  border-radius: 6px;
  background: #fff;
  padding: 6px;
}

.dataset-file-row-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}

.dataset-file-index {
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #e8eefb;
  color: #2c4d87;
  font-size: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.dataset-file-role {
  font-size: 11px;
  color: #516072;
  border: 1px solid #d9d4c6;
  background: #f9f6ec;
  border-radius: 999px;
  padding: 1px 8px;
}

.dataset-file-size {
  margin-left: auto;
  font-size: 11px;
  color: #708091;
}

.dataset-file-path {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 6px;
  align-items: start;
  font-size: 12px;
  line-height: 1.35;
}

.dataset-file-label {
  color: #6f7f8f;
}

.dataset-file-name {
  color: #2b3d52;
  word-break: break-all;
}

.dataset-empty {
  border: 1px dashed #c7c1ad;
  border-radius: 10px;
  background: linear-gradient(180deg, #fffef9, #f8f5ea);
  padding: 16px 12px;
  text-align: center;
}

.dataset-empty-title {
  font-size: 14px;
  font-weight: 700;
  color: #3e5065;
}

.dataset-empty-desc {
  margin-top: 6px;
  font-size: 12px;
  color: #617083;
}

.dataset-meta,
.dataset-status {
  margin-top: 4px;
  font-size: 12px;
}

.dataset-status.done {
  color: var(--ok);
}

.dataset-status.pending {
  color: #5d6874;
}

.metric-list {
  min-height: 120px;
  max-height: 280px;
}

.llm-box {
  min-height: 120px;
  max-height: 320px;
}

.log-box {
  min-height: 180px;
  flex: 1;
  max-height: 640px;
  overflow-y: auto;
}

.metric-item {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  border-bottom: 1px solid #f0ece0;
  padding: 6px;
}

.metric-item:last-child {
  border-bottom: none;
}

.metric-name {
  min-width: 0;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tag {
  border-radius: 10px;
  padding: 1px 7px;
  color: #fff;
  font-size: 12px;
}

.tag.done {
  background: var(--ok);
}

.tag.ok {
  background: var(--ok);
}

.tag.pending {
  background: #7a8594;
}

.tag.current,
.tag.running {
  background: var(--accent);
}

.tag.dropped {
  background: #7a6538;
}

.tag.failed {
  background: var(--danger);
}

.metric-chip-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.metric-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 2px 10px;
  color: #fff;
  font-size: 12px;
}

.metric-chip.running {
  background: var(--accent);
}

.log-item {
  border-bottom: 1px solid #f0ece0;
  padding: 6px 2px;
}

.log-item:last-child {
  border-bottom: none;
}

.log-meta {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  color: #738191;
}

.log-message {
  margin-top: 2px;
  font-size: 13px;
}

.log-item.error .log-message {
  color: var(--danger);
}

.log-detail {
  margin-top: 4px;
}

.log-detail summary {
  cursor: pointer;
  color: #496078;
  font-size: 12px;
}

.log-detail pre {
  margin: 6px 0 0;
  white-space: pre-wrap;
  word-break: break-word;
  background: #f7f6f1;
  border: 1px solid #ebe7da;
  border-radius: 6px;
  padding: 6px;
  font-size: 12px;
}

.task-detail-float {
  position: fixed;
  left: 0;
  top: 42%;
  z-index: 1250;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 36px;
  max-width: 36px;
  height: 44px;
  overflow: hidden;
  border-radius: 0 8px 8px 0;
  border: 1px solid #cbd7ee;
  border-left: none;
  background: #fff;
  color: #274b80;
  box-shadow: 0 8px 22px rgba(18, 28, 42, 0.16);
  padding: 0 9px;
  transition: max-width 0.18s ease, background 0.18s ease;
}

.task-detail-float:hover,
.task-detail-float[aria-expanded="true"] {
  max-width: 98px;
  background: #f4f8ff;
}

.task-detail-float.is-running .task-detail-logo {
  animation: task-step-pulse 1.2s ease-in-out infinite;
}

.task-detail-float.is-failed {
  border-color: #d7a29c;
  color: #9d2f25;
}

.task-detail-float.is-failed .task-detail-logo {
  background: var(--danger);
}

.task-detail-float.is-failed .task-detail-label {
  color: #9d2f25;
}

.task-detail-logo {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}

.task-detail-label {
  white-space: nowrap;
  color: #274b80;
  font-size: 13px;
  font-weight: 700;
}

.task-detail-overlay {
  position: fixed;
  inset: 0;
  z-index: 1240;
  background: rgba(20, 28, 38, 0.28);
}

.task-detail-drawer {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 1260;
  width: min(960px, 108vw);
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-right: 1px solid #d6d1c2;
  background: var(--panel);
  box-shadow: 18px 0 42px rgba(18, 28, 42, 0.22);
  padding: 12px;
  overflow: hidden;
}

.task-detail-drawer-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.task-detail-drawer-head h3 {
  margin: 0;
  font-size: 17px;
}

.task-detail-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.task-detail-tab {
  min-width: 0;
  border: 1px solid #d8d3c5;
  border-radius: 7px;
  background: #fff;
  color: #40566c;
  padding: 6px 4px;
  font-size: 12px;
}

.task-detail-tab.active {
  border-color: #91a9d8;
  background: #edf4ff;
  color: #254c85;
  font-weight: 700;
}

.task-detail-pane {
  display: none;
  min-height: 0;
  flex: 1;
  overflow: hidden;
}

.task-detail-pane.active {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#task-detail-pane-status.active {
  overflow-y: auto;
}

.task-detail-status-extra {
  display: grid;
  gap: 6px;
  min-height: 0;
  overflow-y: auto;
}

.task-detail-kv {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 8px;
  border: 1px solid #e0dbc9;
  border-radius: 8px;
  background: #fff;
  padding: 7px 8px;
  font-size: 13px;
}

.task-detail-kv span {
  color: #697887;
}

.task-detail-kv strong {
  min-width: 0;
  color: #26384f;
  overflow-wrap: anywhere;
}

.task-detail-current strong {
  max-height: 150px;
  overflow: auto;
  white-space: pre-wrap;
}

.task-detail-section-title {
  margin: 4px 0 2px;
  color: #26384f;
  font-size: 13px;
  font-weight: 700;
}

.task-detail-option-summaries {
  display: grid;
  gap: 6px;
  min-height: 0;
}

.task-option-summary-strip {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(280px, 86%);
  gap: 8px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  padding: 2px 2px 8px;
  scroll-snap-type: none;
}

.task-option-summary-card {
  scroll-snap-align: none;
  border: 1px solid #e0dbc9;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  min-height: 180px;
  max-height: 260px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.task-option-summary-card.is-active {
  border-color: #91a9d8;
  box-shadow: 0 0 0 2px rgba(47, 79, 157, 0.09);
}

.task-option-summary-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.task-option-summary-head strong {
  color: #26384f;
  font-size: 13px;
}

.task-option-summary-head span {
  color: #738191;
  font-size: 12px;
}

.task-option-summary-body {
  color: #3f5166;
  font-size: 12px;
  line-height: 1.45;
}

.task-option-summary-body p,
.task-option-summary-body ul,
.task-option-summary-body ol {
  margin: 0 0 6px;
}

.task-detail-drawer .llm-box,
.task-detail-drawer .log-box {
  flex: 1;
  max-height: none;
}

.task-backtrack-list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  display: grid;
  gap: 8px;
}

.task-backtrack-item {
  border: 1px solid #e0dbc9;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
}

.task-backtrack-item.is-running {
  border-color: #dec27d;
  background: #fff8e8;
}

.task-backtrack-title {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  margin-bottom: 4px;
}

.task-backtrack-title strong {
  color: #31475d;
  font-size: 13px;
}

.task-backtrack-title span {
  border-radius: 999px;
  background: #edf2fb;
  color: #2b4b84;
  padding: 1px 8px;
  font-size: 12px;
}

.task-backtrack-item p {
  margin: 0 0 6px;
  color: #3f5166;
  font-size: 13px;
  line-height: 1.45;
}

.task-backtrack-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  color: #6c7a89;
  font-size: 12px;
}

.llm-call-meta {
  color: #4a6077;
  font-size: 12px;
  margin-bottom: 6px;
}

.llm-stream-text {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: Consolas, "Courier New", monospace;
  font-size: 12px;
  line-height: 1.5;
}

.panel-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  margin-bottom: 8px;
}

.scripts-box {
  background: #faf9f3;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.script-card {
  border: 1px solid #d7d1bd;
  border-radius: 8px;
  background: #fff;
  margin-bottom: 10px;
  overflow: hidden;
}

.script-card:last-child {
  margin-bottom: 0;
}

.script-head {
  background: #f5f1e5;
  border-bottom: 1px solid #e1dac7;
  padding: 8px;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.script-meta {
  font-size: 12px;
  color: #5e6a78;
  margin-top: 2px;
}

.script-actions {
  display: flex;
  gap: 6px;
}

.script-actions button {
  padding: 4px 8px;
  font-size: 12px;
}

.script-code-wrap {
  border-bottom: 1px dashed #ece6d5;
  padding: 0 0 2px;
  max-height: 340px;
  overflow: auto;
  background: #fbfaf7;
}

.script-code-lines {
  margin: 0;
  min-width: max-content;
}

.code-line {
  display: grid;
  grid-template-columns: 56px 1fr;
  align-items: baseline;
}

.line-no {
  padding: 0 8px 0 0;
  text-align: right;
  color: #8491a0;
  border-right: 1px solid #ece8dc;
  user-select: none;
  font-family: Consolas, "Courier New", monospace;
  font-size: 12px;
  line-height: 1.5;
}

.line-text {
  padding: 0 10px;
  white-space: pre;
  overflow-x: auto;
  font-family: Consolas, "Courier New", monospace;
  font-size: 12px;
  line-height: 1.5;
}

.code-line.line-focus {
  background: rgba(47, 79, 157, 0.14);
  animation: line-pulse 1.8s ease;
}

@keyframes line-pulse {
  0% {
    background: rgba(47, 79, 157, 0.24);
  }
  100% {
    background: rgba(47, 79, 157, 0.02);
  }
}

.script-output {
  padding: 8px;
  font-size: 12px;
  max-height: 320px;
  overflow-y: auto;
}

.script-output pre {
  margin: 0 0 8px;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 160px;
  overflow-y: auto;
}

.artifact-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.script-files {
  margin-top: 2px;
  padding-top: 6px;
  border-top: 1px dashed #e5dfcf;
}

.script-files-title {
  margin-bottom: 6px;
  color: #4b5f74;
  font-size: 12px;
}

.script-files-empty {
  font-size: 12px;
}

.artifact-link {
  display: inline-block;
  border: 1px solid #b7c7e8;
  color: #194795;
  background: #ecf2ff;
  border-radius: 12px;
  font-size: 12px;
  padding: 2px 8px;
  cursor: pointer;
}

.script-highlight {
  animation: script-focus 1.8s ease;
}

@keyframes script-focus {
  0% {
    box-shadow: 0 0 0 0 rgba(47, 79, 157, 0.28);
    transform: translateY(0);
  }
  50% {
    box-shadow: 0 0 0 6px rgba(47, 79, 157, 0.16);
    transform: translateY(-2px);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(47, 79, 157, 0);
    transform: translateY(0);
  }
}

.paper-box {
  background: #fff;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

/* --- Right Panel Tabs --- */
.right-panel-tabs {
  display: flex;
  gap: 0;
  border-bottom: 2px solid #e0ddd4;
  margin-bottom: 8px;
}
.right-panel-tabs .tab-btn {
  padding: 6px 14px;
  border: none;
  background: transparent;
  color: #888;
  font-size: 13px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: color 0.2s, border-color 0.2s;
}
.right-panel-tabs .tab-btn:hover {
  color: #2f4f9d;
}
.right-panel-tabs .tab-btn.active {
  color: #2f4f9d;
  border-bottom-color: #2f4f9d;
  font-weight: 600;
}

/* --- Tab Panes --- */
.tab-pane {
  display: none;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
.tab-pane.active {
  display: flex;
  flex-direction: column;
}

/* --- Analysis Flow Diagram --- */
.flow-diagram-box {
  background: #fff;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  scrollbar-gutter: stable;
  padding: 12px;
}
.flow-diagram-box .mermaid {
  width: 100%;
}
.flow-diagram-empty {
  text-align: center;
  padding: 40px 20px;
  color: #aaa;
  font-size: 14px;
}

/* --- Flow Step Detail --- */
.flow-step-detail {
  background: #f9f8f4;
  border: 1px solid #e0ddd4;
  border-radius: 6px;
  padding: 10px 14px;
  margin-top: 8px;
  font-size: 13px;
  color: #40586f;
  max-height: 200px;
  overflow-y: auto;
}
.flow-step-detail.hidden {
  display: none;
}
.flow-step-detail h4 {
  margin: 0 0 6px;
  font-size: 14px;
  color: #2f4f9d;
}
.flow-step-detail dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 10px;
  margin: 0;
}
.flow-step-detail dt {
  font-weight: 600;
  color: #1d6f5d;
}
.flow-step-detail dd {
  margin: 0;
}

/* --- Flow Actions --- */
.flow-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px solid #e0ddd4;
}
.flow-actions button {
  padding: 4px 10px;
  border: 1px solid #d7d2c3;
  border-radius: 4px;
  background: #f9f8f4;
  color: #40586f;
  font-size: 12px;
  cursor: pointer;
}
.flow-actions button:hover:not(:disabled) {
  background: #2f4f9d;
  color: #fff;
}
.flow-actions button:disabled {
  opacity: 0.5;
  cursor: default;
}

.paper-loading {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
  padding: 8px 10px;
  border: 1px solid #d7d2c3;
  border-radius: 8px;
  background: #fff;
  color: #40586f;
  font-size: 13px;
}

.paper-loading-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2f4f9d, #1d6f5d);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  animation: spin 1s linear infinite;
}

.paper-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.paper-refine-entry {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #ddd2bc;
  border-radius: 10px;
  background: #fffdf7;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.paper-refine-entry.has-summary {
  flex: 0 0 30%;
  min-height: 136px;
  max-height: 36%;
  overflow: hidden;
}

.paper-refine-entry-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.paper-publish-status {
  border: 1px dashed #dccfb8;
  border-radius: 8px;
  padding: 6px 8px;
  background: #fff;
  color: #4b5f70;
  font-size: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.paper-publish-status a {
  color: #1f578b;
  text-decoration: underline;
}

.paper-refine-entry.is-disabled {
  opacity: 0.72;
}

.paper-refine-summary-card {
  margin-top: 0;
  padding: 8px 10px;
  border: 1px solid #e6dcc8;
  border-radius: 8px;
  background: #fff;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.paper-refine-summary-card-title {
  margin-bottom: 6px;
  color: #31495f;
  font-weight: 700;
  font-size: 13px;
}

.paper-refine-summary-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 6px;
}

.paper-refine-summary-card-text {
  flex: 1;
  min-height: 0;
  color: #4b5e70;
  font-size: 13px;
  line-height: 1.45;
  max-height: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding-right: 4px;
  white-space: pre-wrap;
  word-break: break-word;
}

.paper-refine-modal {
  position: fixed;
  inset: 0;
  z-index: 1400;
  display: grid;
  place-items: center;
  padding: 10px;
  background: rgba(16, 24, 32, 0.48);
  overflow: hidden;
}

.paper-refine-panel {
  width: min(1320px, calc(100vw - 20px));
  height: min(92vh, 980px);
  max-height: calc(100vh - 20px);
  border: 1px solid #d8ccb5;
  border-radius: 14px;
  background: #fffdf7;
  box-shadow: 0 26px 64px rgba(16, 28, 41, 0.38);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.paper-refine-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid #e6dbc7;
  background: linear-gradient(180deg, #fffaf0, #fffef9);
}

.paper-refine-head h3 {
  margin: 0;
  font-size: 18px;
}

.paper-refine-head-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.paper-refine-review {
  border-bottom: 1px solid #ece3d1;
  background: #fffaf1;
  padding: 10px 12px;
}

.paper-refine-review-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(200px, 1fr));
  gap: 4px 10px;
  margin-bottom: 8px;
  font-size: 12px;
  color: #5a6a78;
}

.paper-refine-review-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.paper-refine-review-col {
  border: 1px solid #e6dcc8;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  min-height: 0;
}

.paper-refine-review-col h4 {
  margin: 0 0 6px;
  color: #3b4f62;
  font-size: 13px;
}

.paper-refine-review-body {
  min-height: 0;
}

.paper-refine-review-body pre {
  margin: 0;
  max-height: 200px;
  overflow: auto;
  border: 1px solid #e9dfcc;
  border-radius: 8px;
  background: #fffcf7;
  padding: 8px;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 12px;
  line-height: 1.45;
  color: #32485a;
}

.paper-refine-review-visuals {
  margin-top: 8px;
  margin-bottom: 8px;
  border: 1px solid #eadfca;
  border-radius: 8px;
  background: #fffefb;
  padding: 8px;
}

.paper-refine-review-visual-title {
  font-size: 12px;
  color: #4c6073;
  margin-bottom: 6px;
}

.paper-refine-review-figure-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.paper-refine-review-figure {
  margin: 0;
  border: 1px solid #e7dcc7;
  border-radius: 8px;
  padding: 6px;
  background: #fff;
}

.paper-refine-review-figure img {
  width: 100%;
  max-height: 170px;
  object-fit: contain;
  border-radius: 6px;
  border: 1px solid #efe4cf;
  background: #fffdf8;
}

.paper-refine-review-figure figcaption {
  margin-top: 4px;
  font-size: 12px;
  color: #4d6175;
  word-break: break-all;
}

.paper-refine-review-figure-missing {
  border: 1px dashed #e2d5bd;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  font-size: 12px;
  color: #6b7886;
}

.paper-refine-review-table-grid {
  margin-top: 8px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.paper-refine-review-table-card {
  border: 1px solid #e8ddc8;
  border-radius: 8px;
  background: #fff;
  padding: 6px;
}

.paper-refine-review-table-card h5 {
  margin: 0 0 6px;
  font-size: 12px;
  color: #4e6175;
  word-break: break-all;
}

.paper-refine-review-table .paper-table-wrap {
  max-height: 180px;
  overflow: auto;
}

.paper-refine-compare-table-title {
  margin-top: 8px;
  margin-bottom: 4px;
  font-size: 12px;
  color: #516174;
}

.paper-refine-compare-table-wrap {
  max-height: 170px;
  overflow: auto;
  border: 1px solid #e9dfcb;
  border-radius: 8px;
  background: #fffdf8;
}

.paper-refine-compare-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 12px;
}

.paper-refine-compare-table thead th {
  position: sticky;
  top: 0;
  background: #f5efe0;
  color: #40576b;
  border-bottom: 1px solid #dfd3bd;
  z-index: 1;
}

.paper-refine-compare-table th,
.paper-refine-compare-table td {
  padding: 4px 6px;
  border-bottom: 1px solid #efe7d5;
  text-align: left;
  vertical-align: top;
  word-break: break-all;
}

.paper-refine-compare-table tbody tr:last-child td {
  border-bottom: none;
}

.paper-refine-body {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.1fr) minmax(0, 0.8fr);
  gap: 10px;
  padding: 10px;
  overflow: hidden;
}

.paper-refine-col {
  min-height: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid #e3d9c5;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
}

.paper-refine-col-plan {
  min-width: 0;
}

.paper-refine-col h4 {
  margin: 0 0 8px;
  color: #3a4f64;
}

.paper-refine-history {
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid #e8deca;
  border-radius: 8px;
  background: #fffcf7;
  padding: 8px;
  margin-bottom: 8px;
}

.refine-msg {
  border: 1px solid #e4ddcc;
  border-radius: 8px;
  padding: 7px 8px;
  margin-bottom: 7px;
  background: #fff;
}

.refine-msg:last-child {
  margin-bottom: 0;
}

.refine-msg.user {
  border-left: 3px solid #1d6b6c;
}

.refine-msg.assistant {
  border-left: 3px solid #a6452d;
  background: #fff9f3;
}

.refine-msg.streaming {
  animation: refine-pulse 1s ease infinite;
}

@keyframes refine-pulse {
  0% { opacity: 0.72; }
  100% { opacity: 1; }
}

.refine-msg-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: #6a7784;
  font-size: 12px;
  margin-bottom: 4px;
}

.refine-msg-content {
  word-break: break-word;
  line-height: 1.55;
  font-size: 13px;
}

.refine-msg-content p {
  margin: 0 0 8px;
}

.refine-msg-content p:last-child {
  margin-bottom: 0;
}

.refine-msg-content ul,
.refine-msg-content ol {
  margin: 0 0 8px 20px;
  padding: 0;
}

.refine-msg-content li {
  margin: 2px 0;
}

.refine-msg-content code {
  padding: 1px 5px;
  border-radius: 4px;
  background: #f5ead8;
  border: 1px solid #eadac2;
}

.refine-msg-content pre {
  white-space: pre-wrap;
  margin: 8px 0;
  padding: 8px;
  border-radius: 6px;
  background: #fff6ea;
  border: 1px solid #ecdcc4;
}

.paper-refine-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 6px;
}

.refine-ask-link-list {
  border: 1px solid #e7dcc7;
  border-radius: 8px;
  background: #fffdf8;
  min-height: 38px;
  max-height: 120px;
  overflow: auto;
  padding: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.refine-ask-actions {
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.refine-ask-link-tools {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.refine-ask-link-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.refine-ask-link-icon {
  position: relative;
  width: 14px;
  height: 14px;
  display: inline-block;
}

.refine-ask-link-icon::before,
.refine-ask-link-icon::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 5px;
  border: 2px solid #4f6478;
  border-radius: 7px;
  transform: rotate(-25deg);
}

.refine-ask-link-icon::before {
  left: -1px;
  top: 3px;
}

.refine-ask-link-icon::after {
  right: -1px;
  top: 3px;
}

.refine-ask-link-counter {
  font-size: 12px;
  color: #5f7282;
}

.refine-ask-link-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #dbcdb4;
  border-radius: 999px;
  padding: 2px 8px;
  background: #fff9ea;
  max-width: 100%;
}

.refine-ask-link-chip a {
  color: #30567a;
  text-decoration: none;
  font-size: 12px;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 220px;
}

.refine-ask-link-chip a:hover {
  text-decoration: underline;
}

.refine-ask-link-status {
  font-size: 12px;
  line-height: 1.3;
  white-space: nowrap;
}

.refine-ask-link-status.extracting {
  color: #526b85;
}

.refine-ask-link-status.ready {
  color: #1e6b46;
}

.refine-ask-link-status.failed {
  color: #9b3c2f;
}

.refine-ask-link-remove {
  border: none;
  background: transparent;
  color: #7a5b44;
  cursor: pointer;
  padding: 0;
  line-height: 1;
  font-size: 14px;
}

.refine-ask-link-remove:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.paper-refine-point-selection {
  margin-top: 8px;
  border: 1px solid #e6dcc8;
  border-radius: 8px;
  background: #fffdf9;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: min(22vh, 220px);
  overflow: auto;
  overscroll-behavior: contain;
}

.refine-strategy-status {
  margin-top: 8px;
  border: 1px solid #e6dcc8;
  border-radius: 8px;
  background: #fffdf9;
  padding: 6px 7px;
  color: #3d5368;
  font-size: 11px;
  line-height: 1.35;
  max-height: min(16vh, 132px);
  overflow-y: auto;
  overflow-x: hidden;
  word-break: break-word;
}

.refine-strategy-status.is-change {
  border-color: #e7b882;
  background: #fff5e9;
  color: #7a4618;
}

.refine-strategy-status.is-keep {
  border-color: #b9d9c3;
  background: #f4fcf6;
  color: #1f5d36;
}

.refine-strategy-status .line {
  margin-top: 2px;
}

.refine-strategy-status .line span {
  color: #6f7f90;
  margin-right: 4px;
}

.refine-strategy-status::-webkit-scrollbar {
  width: 6px;
}

.refine-strategy-status::-webkit-scrollbar-thumb {
  background: #c6b89f;
  border-radius: 999px;
}

.refine-strategy-status::-webkit-scrollbar-track {
  background: transparent;
}

.refine-point-selection-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.refine-point-selection-conflict {
  border: 1px solid #efcf91;
  background: #fff5e0;
  color: #7a4a1f;
  border-radius: 8px;
  padding: 6px 8px;
  font-size: 12px;
  line-height: 1.45;
}

.refine-point-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.refine-point-item {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 8px;
  border: 1px solid #e7ddc8;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
}

.refine-point-item input[type="checkbox"] {
  margin-top: 3px;
}

.refine-point-item-body {
  min-width: 0;
}

.refine-point-item-head {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-bottom: 5px;
}

.refine-point-item-head strong {
  color: #2f4557;
}

.refine-point-item-line {
  font-size: 12px;
  color: #40586d;
  line-height: 1.45;
  margin-top: 2px;
  word-break: break-word;
}

.refine-point-item-line span {
  color: #6a7a87;
  margin-right: 4px;
}

.refine-point-selection-excluded {
  border-top: 1px dashed #e7dcc7;
  padding-top: 6px;
}

.refine-point-selection-subtitle {
  font-size: 12px;
  color: #5d6f7f;
  margin-bottom: 4px;
}

.refine-point-selection-excluded ul {
  margin: 0 0 0 18px;
  padding: 0;
  color: #5a6c7e;
  font-size: 12px;
  line-height: 1.45;
}

.refine-point-selection-excluded li {
  margin: 3px 0;
}

.refine-final-actions {
  flex-wrap: wrap;
  justify-content: flex-start;
}

.paper-refine-plan-list {
  border: 1px solid #e6dcc8;
  border-radius: 8px;
  background: #fffdf9;
  overflow: auto;
  overscroll-behavior: contain;
  max-height: min(18vh, 180px);
  margin-top: 8px;
}

.paper-refine-plan-detail {
  margin-top: 8px;
  border: 1px solid #e3d9c4;
  border-radius: 8px;
  background: #f8f5ed;
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 8px;
}

.paper-refine-plan-detail-head {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-bottom: 8px;
}

.paper-refine-plan-detail-meta {
  display: grid;
  gap: 4px;
  margin-bottom: 8px;
  font-size: 12px;
  color: #5a6b7b;
  line-height: 1.4;
}

.paper-refine-plan-detail-content {
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 13px;
  line-height: 1.5;
  color: #304759;
}


.refine-compare-modal {
  position: fixed;
  inset: 0;
  z-index: 1450;
  display: grid;
  place-items: center;
  padding: 8px;
  background: rgba(16, 24, 32, 0.56);
}

.refine-compare-panel {
  width: min(1580px, 99vw);
  max-height: 97vh;
  border: 1px solid #d8ccb5;
  border-radius: 14px;
  background: #fffdf7;
  box-shadow: 0 26px 64px rgba(16, 28, 41, 0.38);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.refine-compare-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid #e6dbc7;
  background: linear-gradient(180deg, #fffaf0, #fffef9);
}

.refine-compare-head h3 {
  margin: 0;
  font-size: 18px;
}

.refine-compare-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.refine-compare-loading {
  margin: 10px 12px 0;
  padding: 8px 10px;
  border: 1px dashed #d8ccb5;
  border-radius: 8px;
  background: #fff8ea;
  color: #6c4f2b;
  font-size: 14px;
  font-weight: 600;
}

.refine-compare-commentary {
  margin: 10px 12px 0;
  padding: 10px 12px;
  border: 1px solid #e3d9c4;
  border-radius: 8px;
  background: #fffaf0;
  color: #2f465a;
  line-height: 1.55;
  max-height: 200px;
  overflow: auto;
}

.refine-compare-commentary h1,
.refine-compare-commentary h2,
.refine-compare-commentary h3 {
  margin: 0 0 8px;
  font-size: 16px;
}

.refine-compare-commentary p {
  margin: 0 0 8px;
}

.refine-compare-commentary p:last-child {
  margin-bottom: 0;
}

.refine-compare-commentary .commentary-danger {
  color: #b42318 !important;
}

.refine-compare-commentary .commentary-danger-heading {
  margin: 8px -6px 8px;
  padding: 7px 9px;
  border-left: 4px solid #d92d20;
  border-radius: 6px;
  background: #fff1f0;
  color: #9f1f17;
}

.refine-compare-commentary .commentary-danger-item {
  margin: 6px 0;
  padding: 6px 8px;
  border-left: 4px solid #d92d20;
  border-radius: 4px;
  background: #fff1f0;
  color: #9f1f17 !important;
  font-weight: 700;
}

.refine-compare-commentary ol.commentary-danger,
.refine-compare-commentary ul.commentary-danger,
.refine-compare-commentary ol.commentary-danger-list,
.refine-compare-commentary ul.commentary-danger-list {
  padding-left: 24px;
}

.refine-compare-commentary .commentary-danger strong,
.refine-compare-commentary .commentary-danger li::marker,
.refine-compare-commentary .commentary-danger-list li::marker {
  color: #9f1f17 !important;
  font-weight: 800;
}

.refine-compare-grid {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 10px;
}

.refine-compare-col {
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  border: 1px solid #e6dcc8;
  border-radius: 10px;
  background: #fff;
  padding: 8px;
}

.refine-compare-col h4 {
  margin: 0;
  color: #3b4f62;
  font-size: 13px;
}

.refine-compare-col iframe {
  width: 100%;
  flex: 1;
  min-height: 620px;
  border: 1px solid #e9dfcb;
  border-radius: 8px;
  background: #fff;
}

.refine-compare-actions {
  border-top: 1px solid #e6dbc7;
  padding: 10px 12px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.refine-compare-export {
  color: #1f2d38;
}

.refine-compare-export h1 {
  margin: 0 0 10px;
  font-size: 22px;
}

.refine-compare-export-paper {
  margin: 0;
}

.refine-compare-export-text {
  margin: 0;
  border: 1px solid #e9dfcc;
  border-radius: 8px;
  background: #fffcf7;
  padding: 10px;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 13px;
  line-height: 1.55;
}

.refine-plan-item {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 8px;
  padding: 8px;
  border-bottom: 1px dashed #e8dfcc;
  cursor: pointer;
}

.refine-plan-item:last-child {
  border-bottom: none;
}

.refine-plan-item.active {
  background: linear-gradient(100deg, rgba(29, 107, 108, 0.08), rgba(255, 255, 255, 0.75));
}

.refine-plan-item input[type="radio"] {
  margin-top: 4px;
}

.refine-plan-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-bottom: 4px;
}

.refine-plan-desc {
  color: #4b5e70;
  font-size: 12px;
  line-height: 1.45;
  word-break: break-word;
}

.paper-box h1,
.paper-box h2,
.paper-box h3,
.paper-box h4 {
  margin: 12px 0 8px;
  color: #25384a;
}

.paper-box .commentary-danger {
  color: #b42318 !important;
}

.paper-box .commentary-danger-heading {
  margin: 14px -2px 10px;
  padding: 8px 10px;
  border-left: 5px solid #d92d20;
  border-radius: 6px;
  background: #fff1f0;
  color: #9f1f17 !important;
}

.paper-box .commentary-danger-item {
  margin: 6px 0;
  padding: 6px 8px;
  border-left: 4px solid #d92d20;
  border-radius: 4px;
  background: #fff1f0;
  color: #9f1f17 !important;
  font-weight: 700;
}

.paper-box ol.commentary-danger,
.paper-box ul.commentary-danger,
.paper-box ol.commentary-danger-list,
.paper-box ul.commentary-danger-list {
  padding-left: 28px;
}

.paper-box .commentary-danger li::marker,
.paper-box .commentary-danger-list li::marker,
.paper-box .commentary-danger strong {
  color: #9f1f17 !important;
  font-weight: 800;
}

.paper-box p {
  margin: 8px 0;
  line-height: 1.7;
}

.paper-box table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0 14px;
  font-size: 13px;
}

.paper-box table thead tr:first-child th {
  border-top: 2px solid #4f5f6f;
}

.paper-box table thead th {
  border-bottom: 1px solid #4f5f6f;
  padding: 6px 8px;
  text-align: left;
}

.paper-box table tbody td {
  border-bottom: 1px solid #d7dbe1;
  padding: 6px 8px;
}

.paper-box table tbody tr:last-child td {
  border-bottom: 2px solid #4f5f6f;
}

.paper-box figure {
  margin: 14px 0;
}

.paper-box figure img {
  max-width: 100%;
  border: 1px solid #d8d4c6;
  border-radius: 6px;
  display: block;
}

.paper-box figure figcaption {
  margin-top: 6px;
  color: #516476;
  font-size: 12px;
}

.paper-source-value,
.paper-source-marker,
.paper-fig-source-btn {
  border: 1px solid #b8caeb;
  background: #edf3ff;
  color: #1d4d98;
  border-radius: 5px;
  padding: 0 5px;
  font-size: 11px;
  cursor: pointer;
}

.paper-source-value {
  padding: 1px 6px;
  margin: 0 1px;
  font-size: 12px;
  font-weight: 600;
}

.paper-source-value:hover,
.paper-source-marker:hover,
.paper-fig-source-btn:hover {
  background: #dce9ff;
}

.paper-fig-tools {
  display: inline-flex;
  gap: 4px;
  margin-left: 6px;
}

.paper-editor {
  width: 100%;
  min-height: 520px;
  border: 1px solid #ccd3df;
  border-radius: 8px;
  padding: 10px;
  font-family: Consolas, "Courier New", monospace;
  font-size: 13px;
  line-height: 1.6;
  resize: vertical;
}

.paper-slot-anchor {
  margin: 10px 0 14px;
}

.paper-slot-caption {
  margin: 8px 0;
  color: #425a72;
  font-size: 13px;
}

.paper-slot-tools {
  display: inline-flex;
  gap: 4px;
  margin-left: 6px;
}

.paper-table-source-btn {
  border: 1px solid #b8caeb;
  background: #edf3ff;
  color: #1d4d98;
  border-radius: 5px;
  padding: 0 5px;
  font-size: 11px;
  cursor: pointer;
}

.paper-table-source-btn:hover {
  background: #dce9ff;
}

.paper-slot-missing {
  border: 1px dashed #c4cddd;
  border-radius: 8px;
  background: #fbfcff;
  padding: 10px;
}

.paper-slot-figure img {
  max-width: 100%;
}

.paper-figure-fallback p {
  margin: 8px 0;
}

.empty {
  color: #788492;
  font-size: 13px;
  padding: 6px 2px;
}

@media (max-width: 1460px) {
  .workspace {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-rows: minmax(520px, auto);
  }

  .control-strip {
    grid-template-columns: 1fr;
  }

  .auth-grid {
    grid-template-columns: 1fr;
  }

  .auth-guide-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 860px) {
  .task-detail-drawer {
    width: 100vw;
    max-width: 100vw;
  }

  .task-detail-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .task-detail-float {
    top: auto;
    bottom: 18px;
  }

  .dataset-list {
    max-height: 260px;
  }

  .upload-row {
    flex-direction: column;
    align-items: stretch;
  }

  .dataset-item-header {
    grid-template-columns: auto 1fr;
  }

  .dataset-status-chip {
    grid-column: 1 / -1;
    justify-self: start;
  }
}

/* --------- 2026 UI refactor: three-page workflow experience --------- */

:root {
  --bg: #eef2e7;
  --panel: #fffcf4;
  --line: #d6ccb4;
  --ink: #1d2a2f;
  --muted: #58666e;
  --primary: #1d6b6c;
  --accent: #a6452d;
  --warn: #a96d17;
  --danger: #b33a2f;
}

body {
  background:
    radial-gradient(960px 320px at -8% -5%, rgba(29, 107, 108, 0.18), transparent 65%),
    radial-gradient(920px 320px at 108% -10%, rgba(166, 69, 45, 0.16), transparent 60%),
    linear-gradient(165deg, #f5f7f0, #ecece0 55%, #f9f4e8);
}

.app-shell {
  padding: clamp(12px, 1.6vw, 22px);
}

.auth-card {
  border-radius: 22px;
  border: 1px solid #d8ccb5;
  box-shadow: 0 20px 56px rgba(30, 42, 47, 0.16);
  background: linear-gradient(165deg, #fffdf8, #fff7e8);
}

.auth-card h1 {
  font-size: clamp(28px, 4vw, 40px);
  letter-spacing: 0.03em;
}

.main-view {
  grid-template-rows: auto 1fr;
  gap: 14px;
  min-height: calc(100vh - 34px);
}

.workflow-header {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px;
  background: linear-gradient(110deg, rgba(255, 252, 244, 0.96), rgba(251, 245, 232, 0.92));
  box-shadow: 0 14px 36px rgba(33, 42, 51, 0.11);
  animation: rise-in 0.42s ease both;
}

.workflow-header-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.top-left {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.top-right {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding-right: 6px;
  justify-self: end;
  flex: 0 0 auto;
}

#btn-open-notify-profile {
  border-radius: 999px;
  padding: 7px 14px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  background: linear-gradient(120deg, #ab4e34, #b05a2f);
  box-shadow: 0 6px 16px rgba(160, 78, 47, 0.2);
}

#btn-logout {
  border-radius: 999px;
  padding: 7px 14px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  background: linear-gradient(120deg, #9d2d25, #ba3f2f);
  box-shadow: 0 6px 16px rgba(157, 45, 37, 0.22);
}

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid #d8ccb5;
  background: #fffef9;
  font-size: 13px;
}

#dataset-id-view {
  display: inline-block;
  max-width: min(42vw, 420px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}

.workflow-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.step-badge {
  text-align: center;
  border: 1px dashed #c8bca5;
  border-radius: 999px;
  padding: 7px 10px;
  font-size: 12px;
  color: #566169;
  background: rgba(255, 255, 255, 0.66);
  transition: all 0.22s ease;
}

.step-badge.is-done {
  color: #2a6556;
  border-color: #9bcfb7;
  background: #e6f6ee;
}

.step-badge.is-active {
  color: #fff;
  border-style: solid;
  border-color: var(--primary);
  background: linear-gradient(120deg, #2c8b8c, var(--primary));
  box-shadow: 0 8px 24px rgba(29, 107, 108, 0.28);
}

.global-message {
  margin: 10px 2px 0;
  padding: 7px 10px;
  border-radius: 8px;
  border: 1px solid #d4ccb7;
  background: #fff9ee;
  min-height: 19px;
}

.workflow-page {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255, 253, 247, 0.96), rgba(255, 250, 241, 0.92));
  box-shadow: 0 16px 42px rgba(26, 38, 51, 0.1);
  padding: 14px;
  min-height: 0;
  animation: rise-in 0.3s ease both;
}

.page-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 10px;
}

.page-head h2 {
  margin: 0;
  font-size: clamp(20px, 2.4vw, 28px);
}

.page-title-with-status {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.job-title-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  border-radius: 999px;
  border: 1px solid #cbd7ee;
  background: #fff;
  color: #274b80;
  padding: 3px 9px;
  font-size: 12px;
  font-weight: 700;
  vertical-align: middle;
}

.job-title-status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
}

.job-title-status.is-running .job-title-status-dot {
  animation: task-step-pulse 1.2s ease-in-out infinite;
}

.job-title-status.is-failed {
  border-color: #d7a29c;
  background: #fff7f6;
  color: #9d2f25;
}

.job-title-status.is-failed .job-title-status-dot {
  background: var(--danger);
}

.page-head p {
  margin: 4px 0 0;
}

.page-head.with-back {
  margin-bottom: 12px;
}

.page-head-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: flex-start;
}

.dataset-page-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.dataset-space-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.dataset-space-card {
  border: 1px solid #ddd3bd;
  border-radius: 12px;
  background: #fffef9;
  padding: 10px;
}

.dataset-space-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.dataset-space-card-head-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.dataset-space-card-head h3 {
  margin: 0;
  font-size: 15px;
  letter-spacing: 0.02em;
}

.my-space-archive-toggle-wrap {
  display: flex;
  justify-content: flex-start;
}

.my-space-archive-toggle-btn {
  min-height: 30px;
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 12px;
  line-height: 1.2;
}

.my-space-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}

.my-space-tab-btn {
  border: 1px solid #d7cab3;
  background: #fff9ee;
  color: #5c4a28;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 13px;
  cursor: pointer;
}

.my-space-tab-btn.active {
  background: #1d6f5d;
  border-color: #1d6f5d;
  color: #fff;
}

.paper-review-workbench {
  display: grid;
  gap: 10px;
}

.paper-review-upload-bar {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  flex-wrap: wrap;
  border: 1px solid #e6dac1;
  border-radius: 10px;
  background: #fffaf1;
  padding: 10px;
}

.paper-review-upload-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.paper-review-upload-copy h4 {
  margin: 0;
  font-size: 14px;
  color: #324b5e;
}

.paper-review-upload-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.paper-review-file-name {
  min-width: 0;
  max-width: min(320px, 38vw);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

.paper-review-file-label {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  border: 1px solid #cfc2a8;
  border-radius: 8px;
  background: #fff;
  color: #3b4f62;
  padding: 6px 10px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  overflow: hidden;
}

.paper-review-file-label input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.paper-review-table {
  min-width: 1460px;
}

.paper-review-table td {
  text-align: left;
}

.paper-review-table .dataset-row-actions {
  justify-content: flex-start;
}

.paper-review-title {
  font-weight: 700;
  color: #273f52;
  margin-bottom: 6px;
  word-break: break-word;
}

.paper-review-meta,
.paper-review-contract-stats,
.paper-review-task-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.paper-review-meta {
  margin-bottom: 6px;
}

.paper-review-contract-stats {
  margin-bottom: 6px;
}

.paper-review-contract-summary,
.paper-review-validation-hint,
.paper-review-summary,
.paper-review-blocking,
.paper-review-run-detail,
.paper-review-issue-evidence,
.paper-review-issue-suggestion {
  font-size: 12px;
  line-height: 1.5;
  color: #50606f;
  word-break: break-word;
}

.paper-review-run-detail {
  margin-top: 8px;
  display: grid;
  gap: 4px;
}

.paper-review-run-error {
  color: #9a3d33;
  border: 1px solid #ecd3c9;
  background: #fff6f3;
  border-radius: 6px;
  padding: 4px 6px;
}

.paper-review-detail-sections {
  display: grid;
  gap: 10px;
}

.paper-review-detail-section {
  border: 1px solid #e8dcc7;
  border-radius: 8px;
  background: #fffefb;
  padding: 8px;
  display: grid;
  gap: 6px;
}

.paper-review-detail-section h4 {
  margin: 0;
  color: #324b5e;
}

.paper-review-issue-list {
  display: grid;
  gap: 6px;
}

.paper-review-issues {
  display: grid;
  gap: 6px;
}

.paper-review-issue {
  border: 1px solid #ebdfca;
  border-radius: 8px;
  background: #fffefb;
  padding: 6px 8px;
  display: grid;
  gap: 4px;
}

.paper-review-issue-head {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  font-size: 12px;
  color: #385062;
}

.paper-review-issue-evidence {
  color: #6b7580;
}

.paper-review-issue-suggestion {
  color: #2f5c3f;
}

.paper-review-dataset-select-wrap select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.paper-review-row-running {
  background: #f7fbff;
}

.paper-review-status-stack {
  display: grid;
  gap: 6px;
}

.access-requests-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 0 0 8px;
}

.access-requests-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.access-requests-col {
  border: 1px solid #e5dac4;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
}

.access-requests-col h4 {
  margin: 0 0 8px;
  font-size: 14px;
  color: #324b5e;
}

.access-request-list {
  display: grid;
  gap: 8px;
  max-height: min(48vh, 460px);
  overflow: auto;
}

.access-request-item {
  border: 1px solid #e8ddc8;
  border-radius: 8px;
  background: #fffdf8;
  padding: 8px;
  display: grid;
  gap: 6px;
}

.access-request-item-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.access-request-item-head strong {
  color: #27445a;
  font-size: 13px;
}

.access-request-item-meta,
.access-request-item-time,
.access-request-item-text {
  color: #4d6172;
  font-size: 12px;
  line-height: 1.5;
  word-break: break-word;
}

.access-request-item-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.access-request-item-actions button,
.access-request-item-actions a {
  padding: 6px 10px;
  font-size: 12px;
  min-height: 32px;
}

.access-request-lock-tip {
  margin: 0 0 8px;
  border: 1px solid #efc6bd;
  border-radius: 8px;
  background: #fff3f2;
  color: #7a3028;
  padding: 8px 10px;
  font-size: 12px;
}

.dataset-table-wrap {
  border: 1px solid #e5dac4;
  border-radius: 10px;
  overflow: auto;
  max-height: min(54vh, 540px);
  background: #fff;
}

.dataset-space-list-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 100%;
  table-layout: fixed;
  font-size: 13px;
}

.dataset-space-list-table th,
.dataset-space-list-table td {
  border-bottom: 1px solid #ece2cf;
  padding: 8px 10px;
  vertical-align: top;
  text-align: center;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.dataset-space-list-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f6f0e2;
  color: #3f4f5a;
  font-weight: 700;
  white-space: nowrap;
}

.table-sort-btn {
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 700;
  width: 100%;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  cursor: pointer;
}

.table-sort-btn:hover {
  text-decoration: underline;
}

.table-sort-btn:focus-visible {
  outline: 2px solid #2a6f9d;
  outline-offset: 2px;
  border-radius: 6px;
}

.table-sort-btn.active {
  color: #185784;
}

.table-sort-marker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1em;
  font-size: 11px;
  color: #8594a0;
}

.table-sort-btn.active .table-sort-marker {
  color: #185784;
}

.dataset-row-selected {
  background: linear-gradient(95deg, rgba(29, 107, 108, 0.08), rgba(255, 255, 255, 0.8));
}

.dataset-link-btn {
  border: none;
  padding: 0;
  color: #22577d;
  background: none;
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  width: 100%;
  text-align: center;
  font-weight: 700;
}

.dataset-link-btn:hover {
  text-decoration: underline;
}

.dataset-row-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: center;
}

.dataset-row-actions button {
  padding: 5px 8px;
  font-size: 12px;
}

.dataset-collection-members {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.dataset-delete-btn {
  padding: 5px 8px;
  font-size: 12px;
}

.dataset-table-empty {
  color: #6d7d88;
  text-align: center;
  padding: 20px 10px;
}

.points-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}

.points-summary-card {
  border: 1px solid #e5dac4;
  border-radius: 10px;
  background: #fff;
  padding: 10px 12px;
}

.points-summary-label {
  color: #6b6f77;
  font-size: 12px;
  margin-bottom: 6px;
}

.points-summary-value {
  color: #26323f;
  font-size: 22px;
  font-weight: 700;
}

.points-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.points-toolbar-left,
.points-toolbar-right {
  display: flex;
  gap: 8px;
  align-items: center;
}

.points-delta-plus {
  color: #127354;
  font-weight: 700;
}

.points-delta-minus {
  color: #ae2e24;
  font-weight: 700;
}

.points-delta-zero {
  color: #6d7d88;
  font-weight: 700;
}

.my-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.my-profile-card {
  border: 1px solid #e5dac4;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
  display: grid;
  gap: 8px;
  align-content: start;
}

.my-profile-card h4 {
  margin: 0;
  color: #30485a;
}

.my-profile-card label {
  display: grid;
  gap: 4px;
  font-size: 13px;
  color: #4f5b67;
}

.my-profile-header-row {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.my-profile-avatar-panel {
  display: grid;
  gap: 8px;
}

.my-profile-avatar-preview {
  width: 88px;
  height: 88px;
  border-radius: 999px;
  border: 1px solid #d9cdb7;
  background: linear-gradient(145deg, #f7efe4, #fff);
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.my-profile-avatar-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.my-profile-avatar-preview span {
  color: #7d6240;
  font-size: 30px;
  font-weight: 700;
}

.my-profile-avatar-uploader {
  display: grid;
  gap: 4px;
  font-size: 12px;
  color: #516273;
}

.my-profile-avatar-uploader input[type="file"] {
  width: 100%;
  font-size: 12px;
  border: 1px dashed #d8cbb4;
  background: #fffefb;
  padding: 6px;
}

.my-profile-avatar-upload-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.my-profile-avatar-upload-actions button {
  min-height: 34px;
  padding: 6px 10px;
  font-size: 12px;
}

.my-profile-identity-panel {
  display: grid;
  gap: 8px;
}

.my-profile-inline-field {
  display: grid;
  gap: 4px;
}

.my-profile-user-metrics {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.my-profile-metric-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

.my-profile-metric-pill.points {
  color: #1a6a41;
  background: #e7f5ec;
  border: 1px solid #b8dfc8;
}

.my-profile-metric-pill.level {
  color: #8a4123;
  background: #fbe8df;
  border: 1px solid #efc2ad;
}

.my-profile-card input,
.my-profile-card textarea {
  width: 100%;
  border: 1px solid #dacdb8;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 13px;
  box-sizing: border-box;
}

.my-profile-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.dataset-importing-cell {
  color: #6f5712;
  background: #fff6df;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.dataset-selection-hint {
  margin-top: 10px;
  border: 1px solid #d8ccb5;
  background: #fffef8;
}

.legacy-controls {
  margin-top: 8px;
}

.page-card {
  min-height: calc(100vh - 280px);
  border-style: solid;
  border-width: 1px;
}

.workspace {
  grid-template-columns: 0.96fr 1.12fr 0.92fr;
  grid-template-rows: none;
  grid-auto-rows: minmax(0, calc(100vh - 130px));
}

@media (max-width: 1320px) {
  .paper-refine-modal {
    align-items: start;
    padding: 8px;
  }

  .paper-refine-panel {
    width: calc(100vw - 16px);
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px);
  }

  .paper-refine-body {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .paper-refine-col {
    min-height: auto;
  }

  .paper-refine-history {
    flex: 0 0 auto;
    min-height: 124px;
    max-height: min(28vh, 260px);
  }

  .paper-refine-point-selection,
  .paper-refine-plan-list,
  .paper-refine-plan-detail {
    flex: 0 0 auto;
    max-height: min(34vh, 320px);
  }
}

.overlay-modal {
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(18, 27, 33, 0.44);
}

.overlay-card {
  width: min(940px, 96vw);
  max-height: min(88vh, 860px);
  display: flex;
  flex-direction: column;
  border: 1px solid #d8ccb5;
  border-radius: 14px;
  background: #fffdf7;
  box-shadow: 0 22px 58px rgba(17, 27, 40, 0.36);
  overflow: hidden;
}

.overlay-head {
  padding: 12px 14px;
  border-bottom: 1px solid #e5d9c3;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.overlay-head h3 {
  margin: 0;
  font-size: 18px;
}

.overlay-body {
  padding: 12px 14px;
  overflow: auto;
}

.option-switch-card {
  width: min(760px, 96vw);
  max-height: min(88vh, 780px);
  border-color: #d7dfec;
  background: #fbfdff;
}

.option-switch-body {
  display: grid;
  gap: 10px;
}

.option-switch-body p {
  margin: 0;
  color: #37465a;
  line-height: 1.55;
}

.option-switch-detail {
  margin: 0;
  padding: 12px;
  max-height: 52vh;
  overflow: auto;
  border: 1px solid #d9e2ef;
  border-radius: 8px;
  background: #f5f8fc;
  color: #1f2d38;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
}

.option-switch-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 12px 14px;
  border-top: 1px solid #d9e2ef;
  background: #fff;
}

.option-switch-actions .ghost {
  border: 1px solid #cfd8e5;
  background: #fff;
  color: #3f5066;
}

.paper-reproduce-card {
  width: min(920px, 96vw);
}

.paper-reproduce-body {
  display: grid;
  gap: 12px;
}

.paper-reproduce-section {
  border: 1px solid #e6dcc8;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
  display: grid;
  gap: 8px;
}

.paper-reproduce-section-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.paper-reproduce-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

#reproduce-dataset-select {
  margin-bottom: 0;
}

.paper-reproduce-standard,
.paper-reproduce-validation {
  border: 1px solid #e6dcc8;
  border-radius: 8px;
  background: #f9f6ee;
  padding: 10px;
  color: #2c4355;
  font-size: 13px;
  line-height: 1.55;
  word-break: break-word;
}

.paper-reproduce-standard {
  max-height: 38vh;
  overflow: auto;
}

.paper-reproduce-standard details {
  margin-top: 6px;
}

.paper-reproduce-standard summary {
  cursor: pointer;
  font-weight: 700;
}

.paper-reproduce-table-wrap {
  margin-top: 6px;
  border: 1px solid #e6dcc8;
  border-radius: 6px;
  background: #fff;
  max-height: 240px;
  overflow: auto;
}

.paper-reproduce-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.paper-reproduce-table th,
.paper-reproduce-table td {
  border-bottom: 1px solid #efe5d6;
  padding: 6px 8px;
  text-align: left;
  vertical-align: top;
  word-break: break-word;
}

.paper-reproduce-table thead th {
  position: sticky;
  top: 0;
  background: #f8f2e5;
  z-index: 1;
}

.paper-reproduce-table tbody tr:last-child td {
  border-bottom: none;
}

.paper-reproduce-validation.ok {
  border-color: #b9d8c0;
  background: #f1fbf4;
  color: #1f5632;
}

.paper-reproduce-validation.failed {
  border-color: #ebc2bf;
  background: #fff3f2;
  color: #7a3028;
}

.overlay-body label {
  display: block;
  margin-bottom: 6px;
  color: #40515d;
  font-weight: 700;
}

.overlay-foot {
  border-top: 1px solid #e5d9c3;
  padding: 10px 14px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.access-request-notice-modal,
.access-request-force-lock {
  position: fixed;
  inset: 0;
  z-index: 1600;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(16, 24, 34, 0.46);
}

.access-request-notice-card,
.access-request-force-card {
  width: min(520px, 94vw);
  border: 1px solid #dacdb7;
  border-radius: 14px;
  background: #fffdf8;
  box-shadow: 0 20px 52px rgba(15, 24, 35, 0.34);
  padding: 16px;
  display: grid;
  gap: 10px;
}

.access-request-notice-card h3,
.access-request-force-card h3 {
  margin: 0;
  font-size: 21px;
  color: #2d4557;
}

.access-request-notice-text,
.access-request-force-text {
  margin: 0;
  color: #42586a;
  line-height: 1.6;
}

.access-request-notice-actions,
.access-request-force-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.dataset-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.dataset-detail-grid > div {
  border: 1px solid #e6dcc8;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
  display: grid;
  gap: 4px;
}

.dataset-detail-grid strong {
  font-size: 12px;
  color: #63707d;
}

.dataset-detail-grid span {
  color: #2f434f;
  word-break: break-all;
}

.dataset-detail-links {
  margin: 2px 0 10px;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.dataset-detail-links .dataset-detail-open-btn {
  min-height: 34px;
}

.dataset-detail-mappings h4 {
  margin: 0 0 8px;
}

.dataset-comments {
  margin-top: 14px;
  border-top: 1px solid #e6dcc8;
  padding-top: 14px;
  display: grid;
  gap: 14px;
}

.dataset-comments-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.dataset-comments-head h4 {
  margin: 0;
}

.dataset-comment-status {
  display: none;
}

.dataset-comment-status.ok {
  color: #1d7b45;
}

.dataset-comment-status.error {
  color: #b33125;
}

.dataset-comment-list {
  display: grid;
  gap: 10px;
  max-height: 340px;
  min-height: 54px;
  overflow: auto;
}

.dataset-comment-item,
.dataset-comment-empty {
  border: 1px solid #e6dcc8;
  border-radius: 8px;
  background: #fff;
  padding: 12px 14px;
}

.dataset-comment-empty {
  color: #687987;
  font-size: 15px;
}

.dataset-comment-empty.error {
  color: transparent;
  background: #fff5f3;
  border-color: #e6dcc8;
  font-size: 0;
}

.dataset-comment-empty.error::before {
  content: "暂无评论";
  color: #687987;
  font-size: 15px;
}

.dataset-comment-meta {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
  color: #607080;
  font-size: 14px;
}

.dataset-comment-meta strong {
  color: #20394d;
}

.dataset-comment-content {
  color: #263d4f;
  line-height: 1.7;
  font-size: 15px;
  white-space: pre-wrap;
  word-break: break-word;
}

.dataset-comment-form {
  display: grid;
  gap: 10px;
  width: 100%;
}

.dataset-comment-form textarea {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-height: 128px;
  resize: vertical;
  padding: 12px 14px;
  font-size: 15px;
  line-height: 1.6;
}

.dataset-comment-form-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.dataset-comment-submit-btn {
  min-width: 120px;
  min-height: 42px;
  font-size: 15px;
}

@keyframes rise-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 1380px) {
  .dataset-space-grid {
    grid-template-columns: 1fr;
  }

  .my-profile-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workspace {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-rows: minmax(520px, auto);
  }
}

@media (max-width: 920px) {
  .top-right {
    justify-self: end;
  }

  #btn-open-notify-profile {
    padding: 6px 12px;
  }

  #btn-logout {
    padding: 6px 12px;
  }

  .workflow-steps {
    grid-template-columns: 1fr;
  }

  .dataset-page-actions,
  .page-head-actions,
  .page-head {
    flex-direction: column;
    align-items: stretch;
  }

  .option-item {
    grid-template-columns: 1fr;
  }

  .option-select-side {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .option-select-btn {
    width: auto;
  }

  .dataset-detail-grid {
    grid-template-columns: 1fr;
  }

  .access-requests-grid {
    grid-template-columns: 1fr;
  }

  .points-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .my-profile-grid {
    grid-template-columns: 1fr;
  }

  .my-profile-header-row {
    grid-template-columns: 1fr;
  }

  .access-request-notice-actions,
  .access-request-force-actions {
    justify-content: stretch;
  }

  .access-request-notice-actions button,
  .access-request-force-actions button {
    flex: 1;
  }

  .paper-refine-panel {
    width: min(98vw, 98vw);
    max-height: 96vh;
  }

  .paper-refine-body {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    overflow-y: auto;
  }

  .paper-refine-review-meta,
  .paper-refine-review-grid {
    grid-template-columns: 1fr;
  }

  .paper-refine-history {
    max-height: 260px;
  }

  .paper-refine-point-selection {
    max-height: 280px;
  }

  .refine-strategy-status {
    max-height: 104px;
  }

  .paper-refine-entry-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .refine-ask-actions {
    align-items: stretch;
  }

  .refine-ask-link-tools {
    width: 100%;
    justify-content: space-between;
  }

  .refine-ask-link-chip a {
    max-width: 180px;
  }

  .paper-refine-summary-card-text {
    max-height: 120px;
  }

  .refine-compare-panel {
    width: min(98vw, 98vw);
    max-height: 96vh;
  }

  .refine-compare-grid {
    grid-template-columns: 1fr;
  }

  .refine-compare-col iframe {
    min-height: 360px;
  }

  .paper-reproduce-section-head {
    flex-direction: column;
    align-items: stretch;
  }

  .paper-reproduce-actions {
    justify-content: stretch;
  }

  .paper-reproduce-actions button {
    flex: 1;
  }

  .paper-reproduce-standard {
    max-height: 30vh;
  }
}

.job-notify-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  min-height: 36px;
  padding: 8px 14px;
  border: 1px solid #d6c8ac;
  border-radius: 8px;
  background: #fff9ef;
  color: #32495f;
  font-size: 14px;
  line-height: 1.2;
  cursor: pointer;
  user-select: none;
}

.job-notify-toggle input {
  width: auto;
  margin: 0;
}

.job-notify-hover-tip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 1px solid #9fb0bf;
  color: #4c647b;
  font-size: 11px;
  line-height: 1;
}

#btn-cleanup,
#btn-back-to-plan {
  align-self: flex-start;
  min-height: 36px;
  padding: 8px 14px;
  font-size: 14px;
  line-height: 1.2;
}

.overlay-card-compact {
  width: min(560px, 96vw);
}

.notify-checkbox {
  margin-top: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #dfd2bb;
  border-radius: 8px;
  background: #fffbf2;
}

.notify-checkbox input {
  width: auto;
  margin: 0;
}

.notify-checkbox span {
  color: #405b70;
  font-size: 13px;
  line-height: 1.5;
}

.my-profile-card label.notify-checkbox {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}

.my-profile-card label.notify-checkbox input {
  justify-self: center;
  margin: 0;
}

.dataset-active-job-meta {
  margin-top: 4px;
  font-size: 12px;
  color: #2b5f84;
}

.dataset-row-actions .dataset-resume-btn {
  background: #2a7449;
}

@media (max-width: 920px) {
  .job-notify-toggle {
    flex-wrap: wrap;
  }
}

/* ═══════════════════════════════════════════════════════════════
   Reproduce Compare — New Browser Page Styles
   ═══════════════════════════════════════════════════════════════ */

.rc-page {
  max-width: 100%;
  margin: 0 auto;
  padding: 20px 16px;
  background: #f7f8fa;
  min-height: 100vh;
}

.rc-page-loading {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 60vh;
  gap: 12px;
}

.rc-page-loading .spinner {
  width: 40px;
  height: 40px;
  border: 4px solid #ccc;
  border-top-color: #4a90d9;
  border-radius: 50%;
  animation: rc-spin 0.8s linear infinite;
}

@keyframes rc-spin {
  to { transform: rotate(360deg); }
}

.rc-error {
  text-align: center;
  padding: 40px 20px;
  color: #c0392b;
}

.rc-error h3 { margin-bottom: 12px; }

.rc-section-title {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 20px 0 12px 0;
  padding-bottom: 8px;
  border-bottom: 2px solid #4a90d9;
  color: #2c3e50;
}

/* ─── Summary section ─── */
.rc-summary {
  margin-bottom: 24px;
}

.rc-summary-content {
  background: #fff;
  border-radius: 8px;
  padding: 16px 20px;
  border: 1px solid #e0e4ea;
  line-height: 1.6;
}

.rc-summary-content h1,
.rc-summary-content h2,
.rc-summary-content h3 {
  margin-top: 12px;
  margin-bottom: 6px;
}

/* ─── Three-column comparison ─── */
.rc-compare {
  margin-bottom: 24px;
}

.rc-compare-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  min-height: 300px;
}

/* ─── Bottom panel: flow + diff ─── */
.rc-bottom-panel {
  margin-bottom: 24px;
}

.rc-bottom-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  min-height: 300px;
}

.rc-bottom-card {
  background: #fff;
  border-radius: 8px;
  padding: 16px;
  border: 1px solid #e0e4ea;
  overflow-y: auto;
}

.rc-bottom-left {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.rc-bottom-right {
  display: flex;
  flex-direction: column;
  max-height: 80vh;
}

.rc-bottom-card-title {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 12px 0;
  color: #34495e;
  text-align: center;
  padding-bottom: 6px;
  border-bottom: 1px solid #eee;
}

.rc-col {
  background: #fff;
  border-radius: 8px;
  padding: 16px;
  border: 1px solid #e0e4ea;
  overflow-y: auto;
  max-height: 80vh;
}

.rc-col-flow {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.rc-col-title {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 12px 0;
  color: #34495e;
  text-align: center;
  padding-bottom: 6px;
  border-bottom: 1px solid #eee;
}

.rc-col-before .rc-col-title { color: #2980b9; }
.rc-col-flow .rc-col-title { color: #27ae60; }
.rc-col-after .rc-col-title { color: #e67e22; }

/* ─── PDF iframe container ─── */
.rc-pdf-container {
  position: relative;
  width: 100%;
  height: 70vh;
  min-height: 500px;
}

.rc-paper-iframe {
  width: 100%;
  height: 100%;
  border: none;
  border-radius: 4px;
  background: #f5f5f5;
}

.rc-pdf-loading {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  background: rgba(255, 255, 255, 0.85);
  z-index: 10;
}

.rc-pdf-loading .spinner {
  width: 32px;
  height: 32px;
  border: 3px solid #ccc;
  border-top-color: #4a90d9;
  border-radius: 50%;
  animation: rc-spin 0.8s linear infinite;
}

.rc-paper-fallback {
  font-size: 0.92rem;
  line-height: 1.55;
  max-height: 70vh;
  overflow-y: auto;
  padding: 12px;
}

.rc-flow-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  position: sticky;
  top: 0;
  z-index: 3;
  background: #fff;
  padding: 4px 0;
}

.rc-flow-toolbar button {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.2;
}

.rc-flow-toolbar .muted {
  margin-left: auto;
}

.rc-flow-stage-card {
  flex: 1 1 auto;
  min-height: 500px;
  border: 1px solid #dce4ef;
  border-radius: 12px;
  background: linear-gradient(180deg, #fcfdff 0%, #f2f6fc 100%);
  padding: 8px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.rc-flow-stage-viewport {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 484px;
  border: 1px solid #e4ebf5;
  border-radius: 10px;
  overflow: hidden;
  background: #f8fbff;
}

.rc-inline-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 120px;
  color: #4d6277;
}

.rc-flow-content {
  flex: 1 1 auto;
  min-height: 100%;
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-align: left;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 10px;
  cursor: grab;
  position: relative;
  contain: layout paint;
}

.rc-flow-content.has-svg {
  overflow: hidden;
  isolation: isolate;
}

.rc-flow-content.is-dragging {
  cursor: grabbing;
}

.rc-flow-content .mermaid {
  display: inline-block;
  margin: 0;
  position: relative;
  z-index: 0;
}

.rc-flow-content .mermaid-src-fallback {
  background: #f9f9f9;
  border: 1px solid #ddd;
  padding: 12px;
  border-radius: 4px;
  font-size: 0.85rem;
  white-space: pre-wrap;
  max-height: 400px;
  overflow-y: auto;
}

.rc-flow-content svg {
  display: block;
  max-width: none !important;
}

body.rc-no-select,
body.rc-no-select * {
  user-select: none !important;
}

/* ─── Node diff analysis ─── */
.rc-node-diffs {
  margin-bottom: 32px;
}

.rc-node-diffs-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.rc-node-diff-item {
  background: #fff;
  border-radius: 8px;
  padding: 16px 20px;
  border: 1px solid #e0e4ea;
  transition: border-color 0.2s;
}

.rc-node-diff-item[data-severity="moderate"] {
  border-color: #f0ad4e;
}

.rc-node-diff-item[data-severity="major"] {
  border-color: #d9534f;
}

.rc-node-diff-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.rc-node-diff-step-name {
  font-weight: 600;
  font-size: 1rem;
  color: #2c3e50;
}

.rc-node-diff-method {
  font-size: 0.9rem;
  color: #7f8c8d;
}

.rc-severity-badge {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  text-transform: uppercase;
}

.rc-severity-minor {
  background: #dff0d8;
  color: #3c763d;
}

.rc-severity-moderate {
  background: #fcf8e3;
  color: #8a6d3b;
}

.rc-severity-major {
  background: #f2dede;
  color: #a94442;
}

.rc-node-diff-commentary {
  font-size: 0.92rem;
  line-height: 1.6;
  color: #444;
  padding: 8px 12px;
  background: #f8f4fc;
  border-radius: 4px;
  border-left: 3px solid #8e44ad;
}

.rc-node-diff-desc {
  font-size: 0.85rem;
  color: #888;
  margin-top: 4px;
}

.rc-node-diff-empty {
  text-align: center;
  padding: 40px 20px;
  color: #666;
}

.spinner-small {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 3px solid #ccc;
  border-top-color: #4a90d9;
  border-radius: 50%;
  animation: rc-spin 0.8s linear infinite;
  margin-bottom: 8px;
}

.rc-refresh-btn {
  margin-top: 12px;
}

/* ─── Responsive ─── */
@media (max-width: 1024px) {
  .rc-compare-grid {
    grid-template-columns: 1fr;
    max-height: none;
  }
  .rc-bottom-grid {
    grid-template-columns: 1fr;
  }
  .rc-col {
    max-height: none;
  }
  .rc-bottom-card {
    max-height: none;
  }
  .rc-flow-stage-card {
    min-height: 360px;
  }
  .rc-flow-stage-viewport {
    min-height: 344px;
  }
  .rc-flow-content {
    min-height: 100%;
  }
  .rc-flow-toolbar {
    flex-wrap: wrap;
  }
  .rc-node-diff-body {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 1025px) and (max-width: 1400px) {
  .rc-compare-grid {
    grid-template-columns: 1fr 1fr;
  }
  .rc-bottom-grid {
    grid-template-columns: 0.8fr 1fr;
  }
}

.hidden { display: none !important; }