/* 页面骨架、间距、卡片和滚动由原提炼助手样式控制。
   仅补齐扫码权限差异、国际化及独立页面弹窗。 */
.language-picker { position:relative; display:inline-flex; align-items:center; margin:0; flex-shrink:0; }
.custom-select-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 9px;
  font-size: 12px;
  font-weight: 500;
  color: var(--ceramic-text-main);
  background: var(--ceramic-card);
  border: 1px solid var(--ceramic-border);
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease;
  user-select: none;
}
.custom-select-trigger:hover, .custom-select-trigger.is-open {
  border-color: var(--ceramic-border-strong, #cbd5e1);
  background: var(--ceramic-subtle, #f8fafc);
  box-shadow: 0 1px 3px rgba(15,23,42,0.06);
}
.custom-select-trigger .current-lang-text {
  line-height: 1;
}
.custom-select-trigger .chevron-icon {
  color: var(--ceramic-text-muted);
  display: inline-flex;
  align-items: center;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.custom-select-trigger.is-open .chevron-icon {
  transform: rotate(180deg);
}
.custom-select-menu {
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  min-width: 105px;
  padding: 4px;
  background: var(--ceramic-card);
  border: 1px solid var(--ceramic-border);
  border-radius: 10px;
  box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.12), 0 8px 10px -6px rgba(15, 23, 42, 0.08);
  display: flex;
  flex-direction: column;
  gap: 2px;
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px) scale(0.98);
  transform-origin: top right;
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
}
.custom-select-menu.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.custom-select-option {
  padding: 6px 10px;
  font-size: 12px;
  border-radius: 6px;
  color: var(--ceramic-text-main);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  transition: background 0.12s ease, color 0.12s ease;
  user-select: none;
  background: transparent;
  border: none;
  text-align: left;
  width: 100%;
}
.custom-select-option:hover {
  background: var(--ceramic-subtle, #f1f5f9);
}
.custom-select-option.is-selected {
  font-weight: 600;
  color: var(--accent-600, #4f46e5);
  background: rgba(99, 102, 241, 0.08);
}
.custom-select-option .check-icon {
  color: var(--accent-600, #4f46e5);
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}
.user-name { display:flex; align-items:center; gap:7px; font-size:12px; color:var(--status-green); }
.queue-heading { display:flex; align-items:center; gap:10px; min-width:210px; }
.queue-description { max-width:300px; }
.task-toolbar { margin-left:auto; }
.tabs { width:max-content; max-width:100%; position:relative; isolation:isolate; }
.tabs button { position:relative; z-index:2; background:transparent; border-color:transparent; box-shadow:none; }
.tabs button.active { background:transparent; border-color:transparent; box-shadow:none; }
.tabs-glider {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 9px;
  background: var(--ceramic-card);
  border: 1px solid var(--ceramic-border);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
  pointer-events: none;
  z-index: 1;
  transform-origin: 0 0;
  will-change: transform, width, height;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1),
      width 0.28s cubic-bezier(0.16, 1, 0.3, 1),
      height 0.28s cubic-bezier(0.16, 1, 0.3, 1),
      opacity 0.18s ease;
}
.dark .tabs-glider {
  background: var(--ceramic-card);
  border-color: var(--ceramic-border);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}
.task-grid { transition: opacity 0.18s ease; }
.task-grid.tab-transitioning { opacity: 0.35; }
.queue-note { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.task-number { flex-shrink:0; }
.qr-open { padding:0; width:100%; height:100%; display:block; position:relative; }
.qr-placeholder { color:#6366f1; }
.qr-title { gap:4px; }
.qr-expire-tag { flex-shrink:0; }
.qr-pay-flow-text { min-width:0; }
.qr-pay-flow-num { flex-shrink:0; }
.progress-WAITING { width:60%; }
.progress-CLAIMED { width:80%; }
.progress-VERIFYING { width:95%; }
.progress-SUCCEEDED { width:100%; background:var(--status-green); }
.progress-REVIEW,.progress-EXPIRED { width:75%; background:var(--status-red); }
.scan-reason { margin-top:8px; }
.scan-readonly { display:flex; align-items:center; gap:10px; border:1px solid var(--ceramic-border); border-radius:10px; padding:12px; font-size:12px; color:var(--ceramic-text-muted); background:var(--ceramic-subtle); }
.scan-readonly>span { overflow-wrap:anywhere; }
.scan-verified { padding:3px 8px; border:1px solid var(--status-green-border); border-radius:8px; font-size:10px; color:var(--status-green); background:var(--status-green-bg); }
.scan-enabled { display:flex; align-items:center; flex-shrink:0; width:36px; height:20px; padding:3px; margin-left:auto; border-radius:20px; background:var(--accent-600); }
.scan-enabled i { display:block; width:14px; height:14px; margin-left:auto; border-radius:50%; background:#fff; }
.scan-rule { display:flex; justify-content:space-between; gap:10px; padding:12px 0; margin:10px 0; border-top:1px solid var(--ceramic-border); border-bottom:1px solid var(--ceramic-border); font-size:11px; color:var(--ceramic-text-muted); }
.scan-rule strong { color:var(--ceramic-text-main); font-size:10px; text-align:right; }
.full { width:100%; justify-content:center; }
.auto-state { color:var(--ceramic-text-subtle); font-size:10px; }
.auto-title { display:flex; align-items:center; gap:7px; }
label { display:grid; gap:8px; margin:16px 0; color:var(--ceramic-text-main); font-size:12px; font-weight:500; }
.label-line label { margin:0; }
.people-section { margin-top:20px; padding-top:20px; border-top:1px solid var(--ceramic-border); }
.people-section h3 { font-size:12px; }
.person-row { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--ceramic-border); }
.person-row strong { font-size:12px; }
.person-row small { display:block; font-size:10px; color:var(--ceramic-text-muted); margin-top:3px; }
.person-row>div:last-child { display:flex; gap:6px; }
.pagination { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:11px; color:var(--ceramic-text-muted); padding:8px 0 10px; flex-shrink:0; }
.pagination>div { display:flex; align-items:center; gap:8px; }
.empty { grid-column:1/-1; min-height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border:1px dashed var(--ceramic-border); border-radius:16px; padding:30px; color:var(--ceramic-text-muted); }
.empty>span { color:var(--ceramic-text-subtle); margin-bottom:18px; }
.empty h2 { font-size:14px; margin-bottom:8px; }
.empty p { font-size:12px; }
.login-layout { flex:1; overflow:auto; display:grid; place-items:center; padding:24px; }
.login-box { width:100%; max-width:430px; padding:28px; }
.login-box h1 { margin:18px 0 5px; }
.login-brand { display:grid; place-items:center; width:44px; height:44px; color:var(--accent-600); background:var(--accent-50); border:1px solid var(--accent-100); border-radius:12px; }
.login-box .submit-button { width:100%; margin-top:14px; }
.form-error { color:var(--status-red); min-height:17px; font-size:12px; margin:12px 0; }
.captcha-row { display:flex; align-items:center; gap:8px; }
.captcha-row input { flex:1; min-width:0; text-transform:uppercase; letter-spacing:2px; font-weight:600; }
.captcha-img-btn { display:inline-flex; align-items:center; gap:6px; padding:3px 8px; background:var(--ceramic-subtle,#f8fafc); border:1px solid var(--ceramic-border); border-radius:8px; cursor:pointer; flex-shrink:0; transition:all 0.15s ease; }
.captcha-img-btn:hover { border-color:var(--accent-600,#4f46e5); background:#fff; box-shadow:0 1px 3px rgba(15,23,42,.08); }
.captcha-img-btn:hover svg:last-child { transform:rotate(90deg); transition:transform 0.25s ease; }
#captcha-svg-container { display:flex; align-items:center; }
#captcha-svg-container svg { display:block; border-radius:4px; }
dialog.scan-modal { border:1px solid var(--ceramic-border); border-radius:18px; padding:24px; width:min(460px,94vw); max-height:92dvh; overflow:auto; color:var(--ceramic-text-main); background:var(--ceramic-card); box-shadow:var(--shadow-card-hover); }
dialog::backdrop { background:rgba(15,23,42,.4); backdrop-filter:blur(4px); }
.scan-modal-heading { display:flex; gap:12px; align-items:center; justify-content:space-between; }
.scan-modal h2 { font-size:14px; }
.scan-modal p { font-size:12px; color:var(--ceramic-text-muted); line-height:1.7; margin:12px 0; text-align:center; }
.scan-modal #qr-account { font-weight:600; color:var(--ceramic-text-main); overflow-wrap:anywhere; }
.scan-modal img { display:block; width:100%; aspect-ratio:1; margin:12px 0; }
.scan-modal footer { font-size:11px; text-align:center; border-top:1px solid var(--ceramic-border); padding-top:14px; color:var(--ceramic-text-muted); }
.actions { display:flex; justify-content:flex-end; gap:8px; }
#toast { position:fixed; top:80px; left:50%; transform:translateX(-50%); border:1px solid var(--ceramic-border); color:var(--ceramic-text-main); background:var(--ceramic-card); box-shadow:var(--shadow-toast); border-radius:8px; padding:12px 18px; font-size:12px; max-width:90vw; z-index:100; }
[hidden] { display:none!important; }
html:not([lang="zh-CN"]) .qr-title { flex-wrap:wrap; white-space:normal; overflow-wrap:anywhere; }
html:not([lang="zh-CN"]) .qr-pay-flow-text { white-space:normal; line-height:1.4; }
html:not([lang="zh-CN"]) .qr-btn { white-space:normal; height:auto; min-height:24px; padding:4px; line-height:1.4; }
@media(max-width:1100px) { .header-provider-link { max-width:180px; font-size:10px; } .header-stats-group .stat-pill:first-child { display:none; } .panel-heading { flex-wrap:wrap; } }
@media(max-width:768px) { .header .user-name { display:none; } .header-right .header-provider-link { max-width:none; width:100%; } .language-picker { margin:0; } .header .header-stats-group { margin:0; } .scan-main .workspace { height:auto; } .pagination { flex-wrap:wrap; } .person-row { flex-wrap:wrap; } .queue-heading { min-width:0; } }
.scan-main .workspace.worker-workspace { grid-template-columns:minmax(0,1fr); gap:0; }
