:root {
  --ink: #111111;
  --line: #111111;
  --muted: #6b6b6b;
  --soft: #f4f4f4;
  --soft-line: #dcdcdc;
  --ok: #1a7f37;
  --warn: #b45309;
  --err: #b42318;
  --accent: #111111;
  /* Figma 108-1941 申请信息页：选中态用深森林绿，与已有"成功绿" --ok 区分 */
  --teal: #0e3a2a;
  --teal-soft: #e8f1ed;
  --radius: 20px;
  --radius-sm: 10px;
  --shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: #e9e9ec;
  color: var(--ink);
  /* 缺陷 #36：中文走系统黑体（macOS PingFang SC / Win 微软雅黑），拉丁走
   自托管 Inter；系统字体不含拉丁品牌字形，Inter 必须排在前面。*/
  font-family: "Inter", "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.frame {
  width: 100%;
  max-width: 1312px;
  min-height: 100vh;
  margin: 0 auto;
  background: #ffffff;
  position: relative;
  display: flex;
  flex-direction: column;
}

/* ---------- Top bar (Figma 102-1692) ---------- */
.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 64px;
  height: 64px;
  border-bottom: 1px solid #bec9c4;
  background: #fff;
}

.brand {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  user-select: none;
}
.brand .brand-shield { font-size: 22px; line-height: 1; }
.brand .logo {
  font-family: "Plus Jakarta Sans", "Inter", sans-serif;
  font-weight: 600;
  font-size: 24px;
  letter-spacing: -0.6px;
  color: #181d1a;
}
.brand .spark { font-size: 22px; } /* legacy, unused after rebrand */

.topbar-actions { display: flex; align-items: center; gap: 8px; }

.icon-btn {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--ink);
  font-size: 13px;
  padding: 4px 8px;
  border-radius: var(--radius-sm);
}
.icon-btn:hover { background: var(--soft); }
.icon-btn .ico { font-size: 20px; }

/* Figma 102-1692 顶栏右侧的 40x40 边框按钮 */
.icon-square {
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid #bec9c4;
  border-radius: 4px;
  background: #fff;
  color: #181d1a;
  font-size: 18px;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}
.icon-square:hover { background: var(--soft); }

/* ---------- Page scaffold ---------- */
.page {
  flex: 1;
  padding: 24px 28px 48px;
  display: flex;
  flex-direction: column;
  animation: fade 0.28s ease;
}
@keyframes fade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

.page-title {
  font-size: 24px;
  font-weight: 700;
  margin: 4px 0 18px;
}
.page-sub { color: var(--muted); font-size: 15px; margin: -10px 0 20px; }

/* ---------- Buttons ---------- */
.btn {
  font-family: inherit;
  font-size: 16px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  border-radius: var(--radius);
  padding: 14px 30px;
  cursor: pointer;
  transition: transform 0.08s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.btn:hover { background: var(--soft); }
.btn:active { transform: translateY(1px); }
.btn.primary { background: var(--ink); color: #fff; }
.btn.primary:hover { background: #333; }
.btn.ghost { border-color: var(--soft-line); }
.btn.sm { padding: 8px 18px; font-size: 14px; border-radius: 12px; }
.btn.block { width: 100%; }
.btn-row { display: flex; gap: 14px; flex-wrap: wrap; }

/* ---------- Home (Figma 102-1692) ---------- */
.home-figma {
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 64px 24px 80px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.home-figma .hf-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  margin-bottom: 48px;
}
.home-figma .hf-title {
  margin: 0;
  font-size: 48px;
  font-weight: 500;
  line-height: 56px;
  letter-spacing: -1.2px;
  color: #181d1a;
}
.home-figma .hf-sub {
  margin: 0;
  font-size: 18px;
  line-height: 28px;
  color: #3f4945;
}
.home-figma .hf-picker-wrap {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  max-width: 512px;
}
.home-figma .hf-picker {
  width: 100%;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
  border: 1px solid #bec9c4;
  border-radius: 8px;
  background: #fff;
  color: #181d1a;
  font-size: 16px;
  font-family: inherit;
  cursor: pointer;
  text-align: left;
}
.home-figma .hf-picker:hover { border-color: #6b6b6b; }
.home-figma .hf-picker .hf-chev { color: #6b6b6b; font-size: 14px; }
.home-figma .hf-menu {
  border: 1px solid #bec9c4;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  margin-top: -16px; /* 紧贴 picker */
}
.home-figma .hf-menu button {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  background: #fff;
  border: none;
  border-bottom: 1px solid #bec9c4;
  font-size: 16px;
  color: #181d1a;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
}
.home-figma .hf-menu button:last-child { border-bottom: none; }
.home-figma .hf-menu button:hover { background: #f4f4f4; }
.home-figma .hf-menu .hf-menu-tag { font-size: 12px; color: #6b6b6b; }
.home-figma .hf-submit {
  width: 100%;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  background: #004336;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.14px;
  cursor: pointer;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  transition: background 0.15s ease;
}
.home-figma .hf-submit:hover { background: #003428; }
.home-figma .hf-submit .hf-arrow { font-size: 18px; line-height: 1; }

@media (max-width: 720px) {
  .home-figma .hf-title { font-size: 32px; line-height: 40px; }
  .home-figma .hf-sub { font-size: 16px; }
  .topbar { padding: 0 20px; }
}

/* ---------- Overview cards ---------- */
.overview-card {
  border: 1px solid var(--soft-line);
  border-radius: var(--radius);
  padding: 30px 36px;
  box-shadow: var(--shadow);
}
.metric-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 26px 40px;
}
.metric {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.metric .ico {
  width: 46px; height: 46px; flex: none;
  border-radius: 14px; background: var(--soft);
  display: flex; align-items: center; justify-content: center; font-size: 22px;
}
.metric .m-title { font-size: 18px; font-weight: 500; }
.metric .m-desc { color: var(--muted); font-size: 14px; margin-top: 4px; line-height: 1.5; }

/* ---------- Form ---------- */
.form-card {
  border: 1px solid var(--soft-line);
  border-radius: var(--radius);
  padding: 30px 36px;
  box-shadow: var(--shadow);
}
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px 40px;
}
.field { display: flex; flex-direction: column; gap: 8px; }
.field label { font-size: 15px; font-weight: 500; }
.field label .req { color: var(--err); margin-right: 4px; }
.field input, .field select {
  font-family: inherit;
  font-size: 15px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 11px 14px;
  background: #fff;
  color: var(--ink);
}
.field input:focus, .field select:focus { outline: 2px solid #1112; }
.chip-group { display: flex; gap: 10px; flex-wrap: wrap; }
.chip {
  border: 1px solid var(--soft-line);
  border-radius: 12px;
  padding: 9px 18px;
  font-size: 14px;
  cursor: pointer;
  background: #fff;
}
.chip.active { border-color: var(--line); background: var(--ink); color: #fff; }

/* ---------- Material grid ---------- */
.mat-section-head {
  display: flex; align-items: center; justify-content: space-between;
  margin: 26px 0 14px;
}
.mat-section-head h3 { font-size: 18px; margin: 0; }
.mat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 18px;
}
.mat-card {
  border: 1px solid var(--soft-line);
  border-radius: var(--radius);
  padding: 18px 14px;
  text-align: center;
  cursor: pointer;
  transition: box-shadow 0.15s ease, transform 0.08s ease;
  position: relative;
}
.mat-card:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.mat-card .thumb {
  width: 70px; height: 70px; margin: 0 auto 12px;
  border-radius: 16px; background: var(--soft);
  display: flex; align-items: center; justify-content: center; font-size: 30px;
}
.mat-card .name { font-size: 15px; font-weight: 500; }
.mat-card .req-star { color: var(--err); }
.mat-card .state {
  margin-top: 8px; font-size: 12px; display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 10px; border-radius: 999px;
}
.state.todo { background: #f4f4f4; color: var(--muted); }
.state.uploaded { background: #eaf6ee; color: var(--ok); }
.state.checking { background: #fff4e5; color: var(--warn); }
.state.missing { background: #fdeceb; color: var(--err); }
.state.failed { background: #fdeceb; color: #d72020; }

/* ---------- Materials page (Figma 123-2161) ----------
   重构后的材料校验页：4 步 stepper + 标题行 + 必备/附加两区
   + 验证/失败/校验中/待上传 4 态卡片 + 底部 NEXT STEP 警告条。 */
.verify-stepper {
  display: flex; align-items: center; gap: 0;
  margin: 6px 0 28px;
  padding: 0 8px;
}
.vs-step {
  display: flex; align-items: center; gap: 12px;
  flex-shrink: 0;
}
.vs-icon {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: #d9d9d9;
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}
.vs-step.done .vs-icon { background: var(--ink); }
.vs-step.active .vs-icon { background: #0c1410; border-radius: 8px; }
.vs-text { display: flex; flex-direction: column; line-height: 1.3; }
.vs-name { font-size: 14px; color: var(--muted); }
.vs-sub { font-size: 12px; color: var(--muted); }
.vs-step.active .vs-name { color: var(--ink); font-weight: 500; }
.vs-step.active .vs-sub { color: var(--ink); }
.vs-line {
  flex: 1; height: 1px; background: #d9d9d9;
  margin: 0 16px;
  min-width: 24px;
}
.vs-line.done { background: var(--ink); }
/* 已完成步骤可点击返回（材料页顶部 stepper 的「上一步」入口） */
.vs-step.is-link { cursor: pointer; }
.vs-step.is-link:hover .vs-name { text-decoration: underline; }

.verify-title-row {
  display: flex; justify-content: space-between; align-items: flex-end;
  gap: 24px; flex-wrap: wrap;
  margin: 4px 0 22px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 18px;
}
/* 缺陷 #25 面 D：上传前的材料去向告知。不用红色 error 样式（它不是错误，
   是事实告知），用中性偏警示的琥珀色，且必须在材料清单**之上**。 */
.mat-dest-notice {
  margin: -8px 0 20px;
  padding: 12px 14px;
  border: 1px solid #e7d3a8;
  border-left: 3px solid #b9822f;
  border-radius: 8px;
  background: #fdf8ee;
  color: #6b5326;
  font-size: 13px;
  line-height: 1.7;
}
.mat-dest-notice b { color: #8a5a13; font-weight: 600; }
.mat-dest-notice a { color: #b9822f; margin-left: 4px; }

.verify-title {
  margin: 0; font-size: 32px; font-weight: 500; color: var(--ink);
  font-family: "Plus Jakarta Sans", "Inter", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  line-height: 1.2;
}
.verify-title-en {
  font-size: 16px; color: var(--muted);
  font-family: "Plus Jakarta Sans", "Inter", sans-serif;
  font-weight: 500; letter-spacing: 1px;
  margin-left: 8px;
}
.verify-progress { margin-top: 12px; }
.verify-progress-text {
  font-size: 14px; color: var(--ink);
  margin-bottom: 6px;
}
.verify-progress-bar {
  width: 220px; height: 6px;
  background: #e5e8e6; border-radius: 999px;
  overflow: hidden;
}
.verify-progress-fill {
  height: 100%; background: var(--ink);
  transition: width 0.25s ease;
}
.btn-batch {
  font-family: inherit; cursor: pointer;
  font-size: 15px; padding: 10px 22px; border-radius: 8px;
  background: #fff; color: var(--ink);
  border: 1px solid var(--ink);
  display: inline-flex; align-items: center; gap: 8px;
}
.btn-batch:hover { background: var(--soft); }
.batch-ico { font-size: 16px; }

.verify-section-head {
  display: flex; align-items: baseline; gap: 12px;
  margin: 28px 0 14px;
}
.verify-section-title {
  margin: 0; font-size: 20px; font-weight: 500; color: var(--ink);
}
.verify-section-title .req-star { color: #d72020; margin-left: 4px; }
.verify-section-hint {
  font-size: 13px; color: var(--muted);
  font-family: "Plus Jakarta Sans", "Inter", sans-serif;
  letter-spacing: 1px;
}

.verify-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 18px;
}
.verify-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px 20px;
  cursor: pointer;
  display: flex; flex-direction: column;
  min-height: 130px;
  position: relative;
  transition: box-shadow 0.15s ease, transform 0.08s ease, border-color 0.15s ease;
}
.verify-card:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.verify-card.v-optional { border-style: dashed; border-color: #c9d8cd; background: #f5f9f6; }
.verify-card.v-failed {
  border: 1px solid #d72020;
  background: #fcf3f3;
}
.verify-card.v-checking {
  border: 1.5px solid #1a8754;
  border-style: dashed;
  animation: vc-checking-pulse 1.4s ease-in-out infinite;
}
@keyframes vc-checking-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(26, 135, 84, 0); }
  50% { box-shadow: 0 0 0 4px rgba(26, 135, 84, 0.15); }
}
.vc-head { flex: 1; }
.vc-name-row {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 12px;
}
.vc-name {
  font-size: 18px; font-weight: 500; color: var(--ink);
  line-height: 1.3;
}
/* #86：recommended 级别材料（官方仅建议提供，如行程单）的卡面标记。
   不阻断、不进必备区，但「建议」必须可见——副标题会盖掉 meta 标签。 */
.vc-level-chip {
  display: inline-block; margin-left: 8px;
  font-size: 11px; font-weight: 500; vertical-align: 2px;
  padding: 2px 8px; border-radius: 999px;
  color: #b45309; background: #f59e0b1a;
  white-space: nowrap;
}
.vc-subtitle {
  font-size: 13px; color: var(--muted);
  margin-top: 6px; line-height: 1.5;
}
.vc-status-pill {
  font-size: 12px; padding: 3px 10px; border-radius: 999px;
  display: inline-flex; align-items: center; gap: 5px;
  white-space: nowrap; flex-shrink: 0;
}
.vc-status-pill::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: currentColor;
}
.vc-status-pill.v-uploaded, .vc-status-pill.v-ok {
  background: #eaf6ee; color: var(--ok);
}
.vc-status-pill.v-failed {
  background: #fff; color: #d72020;
  border: 1px solid #d72020;
}
.vc-status-pill.v-checking {
  background: #fff; color: #1a8754;
  border: 1px solid #1a8754;
}
.vc-status-pill.v-todo, .vc-status-pill.v-missing {
  background: #fff; color: var(--muted);
  border: 1px solid var(--line);
}
.vc-checking-pipe {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; color: var(--muted);
  margin-top: 12px; flex-wrap: wrap;
}
.vc-checking-pipe .arrow { color: #c4c4c4; }
.vc-checking-pipe .ai { color: #1a8754; font-weight: 500; }
.vc-sep {
  height: 1px; background: var(--line);
  margin: 12px -20px 0;
}
.verify-card.v-optional .vc-sep { background: #c9d8cd; }
.vc-action {
  display: flex; justify-content: flex-end;
  padding-top: 10px;
}
.vc-act {
  background: none; border: none; cursor: pointer;
  font-family: inherit;
  font-size: 13px; letter-spacing: 0.5px;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 6px; border-radius: 4px;
}
.vc-act:disabled { cursor: default; opacity: 0.7; }
.vc-act-view { color: var(--ok); }
.vc-act-view:hover { background: #eaf6ee; }
.vc-act-reup { color: #d72020; }
.vc-act-reup:hover { background: #fcf3f3; }
.vc-act-upload { color: #1a8754; }
.vc-act-upload:hover { background: #eaf6ee; }
.vc-act-process { color: var(--muted); }

.verify-bottom-bar {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 40px; padding: 18px 24px;
  border-top: 1px solid var(--line);
  position: sticky; bottom: 0; background: #fff;
  z-index: 2;
}
.verify-bottom-warn {
  display: flex; align-items: center; gap: 8px;
  font-size: 14px; font-family: "Inter", "Plus Jakarta Sans", sans-serif;
}
.verify-bottom-warn .vb-icon { color: #d72020; font-size: 18px; }
.verify-bottom-warn .vb-icon.ok { color: var(--ok); }
.verify-bottom-bar.is-clear .verify-bottom-warn { color: var(--ok); }
.verify-bottom-bar.is-attn .verify-bottom-warn { color: #d72020; }
.btn-next-step {
  font-family: "Plus Jakarta Sans", "Inter", sans-serif;
  font-size: 14px; font-weight: 600; letter-spacing: 1.5px;
  padding: 12px 28px; border-radius: 8px;
  border: 1px solid #d9d9d9;
  background: #f4f4f4; color: #b0b0b0;
  cursor: not-allowed;
}
.btn-next-step:not(:disabled) {
  background: var(--ink); color: #fff;
  border-color: var(--ink); cursor: pointer;
}
.btn-next-step:not(:disabled):hover { background: #0c1410; }

@media (max-width: 720px) {
  .verify-stepper { flex-wrap: wrap; }
  .vs-line { display: none; }
  .verify-grid { grid-template-columns: 1fr; }
  .verify-title-row { flex-direction: column; align-items: flex-start; }
}

/* ---------- Doc detail ---------- */
.back-link { background: none; border: none; cursor: pointer; font-size: 15px; color: var(--ink); padding: 0; margin-bottom: 8px; }
.detail-tabs { display: flex; gap: 30px; border-bottom: 1px solid var(--soft-line); margin: 16px 0 0; }
.detail-tabs button {
  background: none; border: none; padding: 12px 2px; font-size: 16px; cursor: pointer;
  color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.detail-tabs button.active { color: var(--ink); border-bottom-color: var(--ink); font-weight: 500; }
.dropzone {
  border: 1.5px dashed var(--soft-line);
  border-radius: var(--radius);
  padding: 34px;
  text-align: center;
  color: var(--muted);
  cursor: pointer;
  margin-top: 18px;
}
.dropzone:hover { border-color: var(--line); color: var(--ink); }
.dropzone .plus { font-size: 30px; }
.example-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; margin-top: 16px;
}
.example-thumb {
  aspect-ratio: 1; border: 1px solid var(--soft-line); border-radius: 14px;
  display: flex; align-items: center; justify-content: center; color: var(--muted); font-size: 14px;
  background: repeating-linear-gradient(45deg, #fafafa, #fafafa 10px, #f2f2f2 10px, #f2f2f2 20px);
}
.steps-list { margin-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.step-item { display: flex; gap: 12px; font-size: 15px; line-height: 1.6; }
.step-item .n {
  width: 24px; height: 24px; flex: none; border-radius: 50%;
  border: 1px solid var(--line); display: flex; align-items: center; justify-content: center; font-size: 13px;
}

/* ---------- Doc detail (Figma 42-536 / 69-1580) ----------
   资料说明及上传单页版：顶部 5 步 stepper，下方三张圆角卡片。
   ① 上传区 / 已上传态 ② 示例|要求 双列 ③ 详细说明 6 步 + 没搜到 helper。
*/
.doc-stepper {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin: 6px 0 24px;
  position: relative;
  padding: 0 28px 0 8px;
}
.doc-stepper .ds-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  flex: 1;
  position: relative;
}
.doc-stepper .ds-num {
  width: 36px; height: 36px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 22px;
  background: #c4c4c4;
  color: #fff;
  z-index: 1;
}
.doc-stepper .ds-step.current .ds-num { background: var(--ink); }
.doc-stepper .ds-lbl {
  font-size: 22px;
  color: #111;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.doc-stepper .ds-ai-tag {
  display: inline-flex;
  align-items: center; justify-content: center;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: var(--ink);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  font-family: "Inter", sans-serif;
  line-height: 1;
}
.doc-stepper .ds-next {
  position: absolute;
  right: -4px; top: 6px;
  width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  color: var(--ink);
  font-size: 24px;
  cursor: pointer;
  user-select: none;
}

.doc-card {
  border: 1px solid var(--ink);
  border-radius: var(--radius);
  padding: 22px 32px;
  margin-bottom: 18px;
  background: #fff;
  position: relative;
}

/* ① 上传 / 已上传 卡片 */
.upload-card { padding: 18px 32px; }
.upload-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  cursor: pointer;
}
.upload-empty.disabled { cursor: default; }
.upload-empty .upload-plus {
  width: 124px; height: 41px;
  background: #d9d9d9;
  border-radius: 20px;
  display: flex; align-items: center; justify-content: center;
  font-size: 32px;
  color: var(--ink);
  line-height: 1;
}
.upload-empty .upload-label { font-size: 22px; color: var(--ink); }
.upload-done {
  display: grid;
  grid-template-columns: minmax(220px, 280px) 1fr;
  gap: 28px;
  align-items: start;
  padding: 6px 0;
}
.upload-done .preview {
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-items: center;
}
.upload-done .encrypted-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 18px; color: var(--ink);
}
.upload-done .encrypted-badge .lock {
  width: 22px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 14px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 5px;
}
.upload-done .preview-thumb {
  width: 166px; height: 166px;
  border: 1px solid var(--ink);
  border-radius: 14px;
  background: var(--soft);
  display: flex; align-items: center; justify-content: center;
  font-size: 56px;
  color: var(--ink);
}
.upload-done .file-name {
  font-size: 22px;
  color: var(--ink);
  word-break: break-all;
  text-align: center;
}
.upload-done .reupload-btn {
  font-family: inherit;
  font-size: 20px;
  background: #d9d9d9;
  color: var(--ink);
  border: none;
  border-radius: 20px;
  padding: 6px 28px;
  cursor: pointer;
  margin-top: 2px;
}
.upload-done .reupload-btn:hover { background: #c4c4c4; }
.upload-done .extracted { padding-top: 6px; }
.upload-done .extracted-title { font-size: 20px; margin: 0 0 12px; }
.upload-done .extracted-list {
  list-style: none;
  margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
  font-size: 20px; line-height: 1.6;
}
.upload-done .extracted-list li.empty { color: var(--muted); font-size: 16px; }

/* ② 示例|要求 双列卡片 */
.example-req {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 24px;
  align-items: start;
  padding: 8px 0 4px;
}
.example-req .ex-side {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.example-req .ex-side .ex-label,
.example-req .req-side .req-label {
  font-size: 22px;
  text-align: center;
  font-weight: 500;
}
.example-req .ex-side .ex-thumb {
  width: 166px; height: 166px;
  border: 1px solid var(--ink);
  border-radius: 14px;
  background: var(--soft);
  display: flex; align-items: center; justify-content: center;
  font-size: 56px;
}
.example-req .req-side .req-list { margin: 0; font-size: 20px; line-height: 1.7; }
.example-req .req-side .req-list > div { margin-top: 8px; }
.example-req .req-side .req-list > div:first-child { margin-top: 0; }
.example-req .req-side .req-list ul {
  list-style: disc;
  margin: 4px 0 0;
  padding-left: 24px;
}

/* ③ 详细说明 卡片 */
.detail-steps-card .detail-card-title {
  font-size: 22px;
  margin: 0 0 18px;
  font-weight: 500;
}
.detail-step {
  position: relative;
  margin-bottom: 26px;
}
.detail-step:last-child { margin-bottom: 4px; }
.detail-step .step-text {
  font-size: 20px;
  line-height: 1.6;
  margin: 0 0 12px;
}
.detail-step .step-thumbs {
  display: flex; flex-wrap: wrap; gap: 18px;
  padding-left: 0;
}
.detail-step .step-thumb {
  width: 200px; height: 200px;
  border: 1px solid var(--ink);
  border-radius: 14px;
  background: repeating-linear-gradient(45deg, #fafafa, #fafafa 10px, #f2f2f2 10px, #f2f2f2 20px);
  display: flex; align-items: flex-end; justify-content: center;
  font-size: 14px;
  color: var(--ink);
  padding-bottom: 8px;
}
.not-found-helper {
  position: absolute;
  right: 0;
  top: 0;
  display: flex; align-items: center; gap: 10px;
  font-size: 22px;
  color: var(--ink);
  cursor: pointer;
  user-select: none;
}
.not-found-helper .help-icon {
  width: 50px; height: 50px;
  display: flex; align-items: center; justify-content: center;
  font-size: 36px;
  transform: rotate(-15deg);
}
.not-found-helper:hover { color: #555; }

/* ---------- Bank statement detail page (Figma 156-2601 / 157-2863 / 156-2729) ----------
   银行流水（bank_statement）走 3 态布局：未上传 / 验证失败 / 已验证。其它材料
   仍用上方的 .doc-card / .doc-stepper 旧布局。 */
.bs-back {
  background: #fff; border: 1px solid #c4c4c4; border-radius: 8px;
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; color: var(--ink); cursor: pointer;
  margin-bottom: 14px;
}
.bs-back:hover { background: var(--soft); }

.bs-status {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 8px;
}
.bs-dot {
  width: 10px; height: 10px; border-radius: 50%;
  display: inline-block;
}
.bs-dot.st-fail { background: #d72020; }
.bs-dot.st-pass { background: #1a8754; }
.bs-dot.st-checking { background: #c89c2c; animation: blink 1.1s ease infinite; }
.bs-status-text { font-size: 16px; }
.bs-status-text.st-fail { color: #d72020; }
.bs-status-text.st-pass { color: #1a8754; }
.bs-status-text.st-checking { color: #c89c2c; }

.bs-title-row {
  display: flex; justify-content: space-between; align-items: flex-end;
  gap: 24px; flex-wrap: wrap;
  margin-bottom: 10px;
}
.bs-title {
  margin: 0; font-size: 44px; font-weight: 500; color: var(--ink);
  font-family: "Plus Jakarta Sans", "Inter", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  line-height: 1.15;
}
.bs-title-en {
  font-size: 20px; font-weight: 400; color: var(--muted);
  font-family: "Plus Jakarta Sans", "Inter", sans-serif;
  margin-left: 4px;
}
.bs-btn {
  font-family: inherit; cursor: pointer;
  font-size: 18px; padding: 12px 28px; border-radius: 8px;
  border: 1px solid transparent;
  min-width: 200px;
}
.bs-btn-primary {
  background: #004336; color: #fff;
}
.bs-btn-primary:hover { background: #01332a; }
.bs-btn-primary:disabled { background: #6a6a6a; cursor: default; }
.bs-btn-outline {
  background: #fff; color: var(--ink);
  border-color: var(--ink);
}
.bs-btn-outline:hover { background: var(--soft); }

.bs-meta {
  display: flex; align-items: center; gap: 12px;
  font-size: 15px; color: var(--ink);
  padding: 6px 0 4px;
  margin-bottom: 28px;
  flex-wrap: wrap;
}
.bs-meta strong { font-weight: 500; }
.bs-meta-sep { color: #9aa6a0; }

.bs-content { position: relative; }

/* 验证失败态：3 张并排卡片 */
.bs-info-row {
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  gap: 18px; margin-bottom: 18px;
}
.bs-info-card {
  border: 1px solid var(--ink);
  border-radius: 10px;
  padding: 18px 20px;
  background: #f3f6f4;
  min-height: 110px;
  display: flex; flex-direction: column; gap: 8px;
}
.bs-info-card.is-failed {
  border-color: #d72020;
  background: #fcf3f3;
}
.bs-info-label {
  font-size: 14px; color: var(--muted);
}
.bs-info-value-row {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.bs-info-value {
  font-size: 20px; color: var(--ink); font-weight: 500;
}
.bs-info-warn {
  width: 28px; height: 28px; border-radius: 50%;
  background: #d72020; color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
}
.bs-info-hint {
  font-size: 13px; color: #d72020; line-height: 1.4;
}

/* 校验异常 banner */
.bs-error-banner {
  display: flex; align-items: center; gap: 10px;
  border: 1px solid #d72020; background: #fff5f5;
  color: #6e1414; padding: 14px 18px;
  border-radius: 8px; font-size: 16px; line-height: 1.5;
  margin-bottom: 28px;
}
.bs-error-icon {
  width: 28px; height: 28px; border-radius: 50%;
  background: #d72020; color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; flex-shrink: 0;
}

/* 空态 / 失败态：参考与要求 双列 */
.bs-req {
  display: grid; grid-template-columns: 1fr 1.4fr;
  gap: 28px; padding: 24px 0;
  border-top: 1px solid var(--line);
  position: relative;
}
.bs-req-col-title {
  font-size: 18px; color: var(--muted);
  letter-spacing: 0.5px; margin-bottom: 18px;
}
.bs-req-item { font-size: 16px; line-height: 1.7; margin-bottom: 18px; }
.bs-req-tick {
  color: #1a8754; margin-right: 6px; font-weight: 700;
}
.bs-req-sub { color: var(--ink); font-size: 15px; line-height: 1.6; }
.bs-req-guide-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 22px 28px;
}
.bs-req-guide-item {
  display: flex; flex-direction: column; gap: 4px;
}
.bs-req-guide-num {
  font-size: 16px; color: var(--ink); font-weight: 500;
}
.bs-req-guide-text { font-size: 14px; color: var(--muted); line-height: 1.5; }

/* 空态：样例与标注 */
.bs-sample { padding: 8px 0 24px; }
.bs-sample-title {
  font-size: 16px; color: var(--muted); margin-bottom: 12px;
}
.bs-sample-stage {
  position: relative; padding: 24px 60px;
  background: #f6f9f7; border-radius: 10px;
  display: flex; justify-content: center;
}
.bs-sample-frame {
  width: 380px; max-width: 100%;
}
.bs-sample-svg { width: 100%; height: auto; display: block; }
.bs-sample-callout {
  position: absolute; display: flex; align-items: center; gap: 8px;
}
.bs-sample-callout-left { flex-direction: row-reverse; }
.bs-sample-dot {
  width: 8px; height: 8px; border-radius: 50%; background: #1a8754;
}
.bs-sample-pill {
  background: #fff; border: 1px solid #1a8754; color: #1a8754;
  border-radius: 999px; padding: 4px 10px; font-size: 13px;
  white-space: nowrap;
}

/* 已验证态：左 文件预览 + 右 提取信息 */
.bs-twocol {
  display: grid; grid-template-columns: 1.2fr 1fr;
  gap: 28px; margin-bottom: 28px;
}
.bs-preview {
  border: 1px solid var(--ink); border-radius: 10px;
  padding: 18px; background: #f3f6f4;
  display: flex; flex-direction: column; gap: 12px;
}
.bs-preview-head {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; font-size: 15px;
}
.bs-preview-title { font-weight: 500; color: var(--ink); }
.bs-preview-name { color: var(--muted); font-size: 13px; }
.bs-preview-thumb {
  background: #fff; border-radius: 8px; padding: 12px;
  border: 1px solid var(--line);
}

/* 已上传文件真实预览（照片 / PDF） */
.bs-preview-real {
  display: flex; flex-direction: column; gap: 12px;
}
.bs-preview-img {
  width: 100%; height: auto; max-height: 380px;
  object-fit: contain; border-radius: 6px; background: #fafafa;
  display: block;
}
.bs-preview-pdf {
  width: 100%; height: 420px; border: none; border-radius: 6px; background: #fafafa;
}
.bs-preview-fallback { margin: 0; }

/* 无法内嵌预览时的诚实占位（替代原来那张合成的银行流水 SVG）。
   刻意做得像一条说明、不像一份文件 —— 在「文件预览」标题下面，任何画得
   像模像样的东西都会被读成"这就是我传的文件"。 */
.bs-nopreview {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 32px 20px; text-align: center;
  background: #fafafa; border: 1px dashed var(--line); border-radius: 8px;
}
.bs-nopreview-ico { font-size: 30px; line-height: 1; opacity: 0.5; }
.bs-nopreview-why { font-size: 14px; color: var(--ink); font-weight: 500; }
.bs-nopreview-name {
  font-size: 13px; color: var(--muted);
  word-break: break-all; max-width: 100%;
}
.bs-nopreview-note { font-size: 12px; color: var(--muted); margin-top: 4px; }

.bs-info { padding: 6px 4px; }
.bs-info-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 18px;
}
.bs-info-title {
  font-size: 18px; font-weight: 500; color: var(--ink);
}
.bs-info-edit {
  width: 32px; height: 32px; border-radius: 50%;
  border: 1px solid var(--line); background: #fff;
  cursor: pointer; font-size: 18px; color: var(--ink);
  display: flex; align-items: center; justify-content: center;
}
.bs-info-edit:hover { background: var(--soft); }
.bs-info-rows { display: flex; flex-direction: column; }
.bs-info-row-item {
  display: flex; flex-direction: column; gap: 4px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
.bs-info-row-item:last-child { border-bottom: none; }
.bs-info-row-label { font-size: 14px; color: var(--muted); }
.bs-info-row-value { font-size: 18px; color: var(--ink); }

/* 已验证态：参考与要求 */
.bs-ref { padding: 18px 0 32px; border-top: 1px solid var(--line); }
.bs-ref-title {
  margin: 0 0 18px; font-size: 18px; font-weight: 500; color: var(--ink);
}
.bs-ref-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.bs-ref-col-title {
  font-size: 14px; color: var(--muted); margin-bottom: 10px;
}
.bs-ref-col-body { display: flex; flex-direction: column; gap: 14px; }
.bs-ref-item { font-size: 15px; line-height: 1.5; }
.bs-ref-tick { color: #1a8754; margin-right: 4px; }
.bs-ref-num { color: var(--ink); font-weight: 600; margin-right: 4px; }
.bs-ref-sub { color: var(--muted); font-size: 14px; }

/* 隐私提示 */
.bs-privacy {
  display: flex; align-items: center; gap: 10px;
  border: 1px solid #cfd9d3; background: #f6f9f7;
  border-radius: 8px; padding: 12px 18px;
  font-size: 14px; color: var(--ink);
  margin-top: 18px;
}
.bs-privacy-icon { font-size: 18px; }

/* 校验中态 */
.bs-checking {
  display: flex; flex-direction: column; align-items: center;
  gap: 14px; padding: 60px 0;
}
.bs-checking-spinner {
  font-size: 40px; color: var(--muted);
  animation: spin 1.4s linear infinite; display: inline-block;
}
.bs-checking-text { font-size: 18px; color: var(--muted); }

/* 侧边 SEC-DOC-XXX 竖排标签 */
.bs-side-label {
  position: fixed; left: 18px; top: 50%;
  transform: translateY(-50%) rotate(180deg);
  writing-mode: vertical-rl;
  font-size: 12px; letter-spacing: 2px;
  color: #c4c4c4; font-family: "Plus Jakarta Sans", "Inter", monospace;
  user-select: none; pointer-events: none;
  z-index: 1;
}

@media (max-width: 720px) {
  .doc-stepper { padding: 0; }
  .doc-stepper .ds-lbl { font-size: 14px; }
  .doc-stepper .ds-num { width: 30px; height: 30px; font-size: 18px; }
  .upload-done { grid-template-columns: 1fr; }
  .example-req { grid-template-columns: 1fr; }
  .detail-step .step-thumb { width: 140px; height: 140px; }
  .not-found-helper { position: static; margin-top: 8px; }
  .bs-title { font-size: 32px; }
  .bs-info-row { grid-template-columns: 1fr; }
  .bs-req { grid-template-columns: 1fr; }
  .bs-req-guide-grid { grid-template-columns: 1fr; }
  .bs-twocol { grid-template-columns: 1fr; }
  .bs-ref-cols { grid-template-columns: 1fr; }
  .bs-side-label { display: none; }
}

/* ---------- Task console (AI running) ---------- */
.console { border: 1px solid var(--soft-line); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
.console-tabs {
  display: flex; gap: 8px; padding: 16px 20px 0; border-bottom: 1px solid var(--soft-line);
}
.console-tabs .ctab {
  padding: 8px 16px; border-radius: 12px 12px 0 0; cursor: pointer; font-size: 14px; color: var(--muted);
  border: 1px solid transparent; border-bottom: none;
}
.console-tabs .ctab.active { color: var(--ink); border-color: var(--soft-line); background: #fff; font-weight: 500; }
.screen-canvas {
  margin: 20px; height: 340px; border-radius: var(--radius); position: relative; overflow: hidden;
  background: linear-gradient(135deg, #1d1d22, #2b2b33);
  color: #eaeaea; display: flex; align-items: center; justify-content: center; text-align: center;
}
.screen-canvas .boot { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.spinner {
  width: 34px; height: 34px; border-radius: 50%;
  border: 3px solid rgba(255,255,255,0.25); border-top-color: #fff;
  animation: spin 0.9s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.rec-dot { width: 8px; height: 8px; border-radius: 50%; background: #ff5a5a; animation: blink 1.1s ease infinite; }
@keyframes blink { 50% { opacity: 0.25; } }
.canvas-badge {
  position: absolute; top: 12px; right: 12px;
  background: rgba(0,0,0,0.5); border-radius: 10px; padding: 6px 10px; font-size: 12px;
  display: flex; align-items: center; gap: 6px;
}

/* ---------- slice 5: live browser preview + ask_user modal ---------- */
/* daemon 端每 1.5s 写一张 jpg 到 automation/screenshots/<task_id>.jpg，前端
   轮询 <img id="live-screen"> 显示。让 .boot 容器变成铺满状态。 */
.screen-canvas .boot { width: 100%; height: 100%; }
.screen-canvas .boot img#live-screen {
  width: 100%; height: 100%; object-fit: contain;
  background: #1d1d22; display: block; border-radius: 0;
}

/* 后端离线时的 run 页诚实面板（替代原 RUN_TIMELINE 模拟推进）。
   .boot 是 flex column + align-items:center，直接塞长文本会被挤成窄条，
   所以这里自己撑开宽度并靠左排版，长句才读得下去。 */
.screen-canvas .boot .run-offline {
  align-self: stretch; max-width: 520px; margin: auto;
  text-align: left; padding: 18px 20px;
  background: rgba(0,0,0,0.28); border-radius: 12px;
  border: 1px solid rgba(255,193,120,0.35);
}
.screen-canvas .boot .run-offline .assess-h { margin: 0; font-size: 15px; font-weight: 600; }

/* 暂停 → 用户输入 modal。覆盖整个屏幕，但只允许一个 modal。 */
/* 缺陷 #28：backdrop 铺满全屏（inset:0）+ z-index:1000，原先整层吃掉指针事件，
   于是 z-index:5 的「↗ 拉前台」「✋ 我来接管」全点不动（实测 elementFromPoint
   在 modal 弹出后返回 modal-backdrop、page.click 超时）——而那两个按钮是 agent
   停在真实草稿中间时用户唯一能做的事。
   改 pointer-events 而不是压 z-index：z-index 是个两边都能改的军备竞赛，
   「backdrop 自己不接收指针事件」才是与数值无关的不变式。卡片必须显式收回
   pointer-events，否则输入框和「提交」按钮跟着一起点不动。 */
.modal-backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,0.55);
  display: flex; align-items: center; justify-content: center;
  z-index: 1000; padding: 24px;
  pointer-events: none;
}
.modal-card {
  pointer-events: auto;
  background: #fff; color: var(--ink);
  border-radius: var(--radius); box-shadow: 0 10px 40px rgba(0,0,0,0.4);
  width: 100%; max-width: 420px; padding: 22px 24px 20px;
  display: flex; flex-direction: column; gap: 14px;
}
.modal-card:has([data-testid="passport-supplement"]) { max-width: 620px; max-height: min(90vh, 820px); }
.modal-card:has([data-testid="passport-supplement"]) .modal-body { overflow-y: auto; min-height: 0; }
[data-testid="passport-supplement"] .confirmation-row { padding: 10px 0; margin: 0; border: 0; border-bottom: 1px solid var(--line); }
[data-testid="passport-supplement"] .confirmation-row label { display: block; font-size: 13px; font-weight: 600; }
[data-testid="passport-supplement"] .confirmation-row input,
[data-testid="passport-supplement"] .confirmation-row select,
[data-testid="passport-supplement"] .confirmation-row textarea { box-sizing: border-box; width: 100%; margin-top: 6px; padding: 9px; border: 1px solid var(--line); border-radius: 8px; font: inherit; }
[data-testid="passport-supplement"] .confirmation-row small { display: block; color: var(--muted); margin-top: 4px; }
.modal-title { font-size: 16px; font-weight: 600; }
.modal-body { display: flex; flex-direction: column; gap: 10px; }
.modal-question { font-size: 14px; line-height: 1.5; color: #333; }
.modal-input {
  padding: 10px 12px; border: 1px solid var(--line);
  border-radius: 10px; font-size: 14px; outline: none;
}
.modal-input:focus { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(0,0,0,0.05); }
.modal-hint { font-size: 12px; color: #888; }
.modal-actions { display: flex; gap: 10px; justify-content: flex-end; }
.status-bar {
  display: flex; align-items: center; gap: 14px; padding: 0 24px 24px; margin-top: -4px;
}
.status-bar .status-ico {
  width: 44px; height: 44px; flex: none; border-radius: 12px; background: var(--soft);
  display: flex; align-items: center; justify-content: center; font-size: 20px;
}
.status-bar .status-txt { flex: 1; font-size: 16px; }
.status-bar.attn { padding-top: 4px; }
.attn-banner {
  margin: 0 24px 16px; border: 1px solid var(--warn); background: #fff8ee;
  border-radius: 14px; padding: 12px 16px; display: flex; gap: 10px; align-items: center;
  font-size: 15px; animation: pulse 1.6s ease infinite;
}
@keyframes pulse { 50% { background: #fff2dd; } }

/* interaction input (verification code / question) */
.interaction-row { display: flex; gap: 10px; padding: 0 24px 24px; align-items: center; }
.interaction-row input {
  flex: 1; font-family: inherit; font-size: 15px; border: 1px solid var(--line);
  border-radius: 12px; padding: 11px 14px;
}

/* ---------- Stepper (progress query) —— 已删除 ----------
   原「进度查询」页那个 6 段 stepper（选择类型/材料准备/官网申请/支付费用/
   进度查询/结果，前 4 段写死打勾）随 P0-B.3 第十个缺陷一起删掉：它把用户
   的位置写死在"进度查询"，而真实情况是他大概率还没付款递交。整套 .stepper
   规则已无使用者（申请页用的是另一套 .apply-stepper）。 */

/* ---------- Settings / task table ---------- */
.tabs { display: flex; gap: 30px; border-bottom: 1px solid var(--soft-line); margin-bottom: 20px; }
.tabs button {
  background: none; border: none; padding: 12px 2px; font-size: 18px; cursor: pointer;
  color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.tabs button.active { color: var(--ink); border-bottom-color: var(--ink); font-weight: 500; }
.notification-settings { max-width:720px; padding:24px; border:1px solid var(--soft-line); border-radius:16px; background:#fff; }
.notification-settings h1 { margin:0 0 18px; font-size:20px; }
.notification-setting-row { display:flex; align-items:center; justify-content:space-between; gap:24px; cursor:pointer; }
.notification-setting-row span { display:grid; gap:6px; }
.notification-setting-row small { color:var(--muted); line-height:1.5; }
.notification-setting-row input { width:22px; height:22px; accent-color:var(--teal); cursor:pointer; flex:none; }
.notification-settings p { margin:18px 0 0; color:var(--muted); font-size:13px; line-height:1.6; }
.notification-settings button { margin-top:14px; }
/* table.tasks 的样式已随 SAMPLE_TASKS 表格一起删除（见 app.js 注释）。
   .badge 的 pay / miss 两个变体也只被那张假表用过，一并删掉；
   run / done 由任务卡的「准备材料中 / 材料就绪」在用。 */
.badge {
  display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px;
}
.badge.run { background: #eaf1fb; color: #1d4ed8; }
.badge.done { background: #eaf6ee; color: var(--ok); }
/* warn：未成年申请人「暂不支持」—— 不能用 done 的绿色，那是"就绪"的语义 */
.badge.warn { background: #fdf3e7; color: #b54708; }
/* 任务管理 tab：只展示当前这一次真实申请，或如实说没有。
   原来这里是一张 SAMPLE_TASKS 表（四个编造的人），见 app.js 注释。 */
.tasks-empty, .tasks-current { padding: 20px; }
.tasks-empty .assess-proc, .tasks-current .assess-proc { margin-top: 8px; }
.tasks-acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.tasks-cur-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tasks-cur-flag { font-size: 22px; }
.tasks-cur-title { font-size: 16px; font-weight: 600; }
.beta-box {
  border: 1px solid var(--soft-line); border-radius: var(--radius); padding: 30px 36px; box-shadow: var(--shadow);
  display: flex; flex-direction: column; gap: 14px; max-width: 620px;
}
.beta-h { font-size: 16px; font-weight: 600; }
.beta-acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
.beta-gate { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: var(--soft); }
.beta-gate-card { width: min(100%, 460px); padding: 36px; border-radius: var(--radius);
  background: #fff; border: 1px solid var(--soft-line); box-shadow: var(--shadow); }
.beta-gate-eyebrow { color: var(--muted); font-size: 14px; margin-bottom: 16px; }
.beta-gate-card h1 { font-size: 28px; margin: 0 0 12px; }
.beta-gate-card p { line-height: 1.6; color: var(--muted); }
.beta-gate form, .beta-change-form { display: grid; gap: 10px; margin-top: 22px; }
.beta-gate input, .beta-change-form input { width: 100%; padding: 12px 14px; border: 1px solid var(--line);
  border-radius: 10px; font: inherit; }
.beta-gate form button, .beta-change-form button { justify-self: start; }
.beta-feedback { min-height: 22px; color: #9a392e; font-size: 14px; }
.beta-code-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.beta-code-row code { padding: 10px 14px; border-radius: 8px; background: var(--soft);
  font-size: 15px; letter-spacing: .03em; overflow-wrap: anywhere; }
.beta-code-note { margin: 0; color: var(--muted); font-size: 14px; }
.beta-copy-fallback {
  font-size: 14px; color: var(--muted); word-break: break-all;
  padding: 12px 14px; background: var(--soft); border-radius: 12px;
  user-select: all;
}

/* ---------- Footer ---------- */
.footer {
  padding: 20px 40px 28px; text-align: right; color: var(--muted); font-size: 14px;
}
.footer a { color: var(--ink); text-decoration: underline; }

/* ---------- Nav (bottom of steps) ---------- */
.wizard-nav { display: flex; justify-content: space-between; margin-top: 28px; }

/* ---------- Progress rail (wizard) ---------- */
.rail { display: flex; align-items: center; gap: 6px; padding: 14px 40px 0; }
.rail .seg { flex: 1; height: 4px; border-radius: 4px; background: var(--soft-line); }
.rail .seg.on { background: var(--ink); }

/* ---------- Toast ---------- */
/* 缺陷 #26：停止/接管失败的留痕行。刻意做成不会自动消失的块级提示，
   紧贴在触发它的按钮下方，直到用户再次操作。 */
.stop-failure-notice {
  margin: 10px 0 0;
  padding: 11px 13px;
  border: 1px solid #e3b7b7;
  border-left: 3px solid #c0392b;
  border-radius: 8px;
  background: #fdf3f2;
  color: #7d2c22;
  font-size: 13px;
  line-height: 1.7;
  text-align: left;
}
.stop-failure-notice b { color: #a3271b; font-weight: 600; }

/* 缺陷 #35：live 画面浮动「拉前台」失败的持久条。浮在画面按钮**下方**，
   pointer-events:none —— 绝不能挡住隔壁「我来接管」（那是用户此刻唯一能
   停住 agent 的入口，#28 在这屏立过同一条原则）。 */
.live-bring-failure-notice {
  position: absolute;
  top: 48px;
  right: 10px;
  z-index: 5;
  width: 320px;
  max-width: calc(100% - 20px);
  pointer-events: none;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28);
}

/* 缺陷 #27：取消排队任务成功后的持久确认。做成常驻块而不是 toast，因为
   「我到底拦住它了吗」是用户抬头时最需要能重新确认的一件事（#26 的尺子）。 */
.queued-cancel-notice {
  margin: 10px 0 0;
  padding: 11px 13px;
  border: 1px solid #5f7a52;
  border-left: 3px solid #7fae63;
  border-radius: 8px;
  background: #1f2a1c;
  color: #cfe3c2;
  font-size: 13px;
  line-height: 1.7;
  text-align: left;
}
.queued-cancel-notice b { color: #a8d68c; font-weight: 600; }


.toast {
  position: fixed; bottom: 26px; left: 50%; transform: translateX(-50%);
  background: var(--ink); color: #fff; padding: 12px 22px; border-radius: 999px;
  font-size: 14px; z-index: 50; box-shadow: var(--shadow);
}

/* ---------- Result banner —— 已删除 ----------
   .result-hero / .btn-row 只被编造的「🎉 签证已通过，电子签证文件已下载」
   完成态用过，该页随 P0-B.3 第十一个缺陷整页删除（详见 app.js 注释）。 */

/* ---------- 递交后页（诚实版，替代原「进度查询」模拟页） ---------- */
.post-lodge { text-align: left; }
.post-lodge + .post-lodge { margin-top: 14px; }
.post-lodge-acts { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.post-lodge-acts .btn { text-decoration: none; }
.post-lodge .gf-src { margin-top: 10px; }

@media (max-width: 720px) {
  .topbar, .page, .footer, .rail { padding-left: 20px; padding-right: 20px; }
  .form-grid, .metric-grid { grid-template-columns: 1fr; }
  .stepper .lbl { font-size: 11px; }
  .assess-score { flex-direction: column; text-align: center; }
}

/* ---------- Visa assessment ---------- */
/* 材料页顶部评估摘要卡（assess 页的浓缩版） */
.assess-mini { display: flex; align-items: center; gap: 24px; padding: 18px 22px; margin-bottom: 20px; }
.am-gauge {
  flex: none; width: 92px; height: 92px; border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: conic-gradient(var(--band) 0 var(--band-pct, 70%), #eef1f5 var(--band-pct, 70%) 100%);
  position: relative;
}
.am-gauge::after { content: ""; position: absolute; inset: 9px; border-radius: 50%; background: #fff; }
.am-score { font-size: 28px; font-weight: 700; z-index: 1; line-height: 1; }
.am-cap { font-size: 10px; color: var(--muted); z-index: 1; margin-top: 3px; }
.am-body { flex: 1; min-width: 0; }
.am-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.am-badge { display: inline-block; padding: 5px 12px; border-radius: 999px; font-size: 13px; font-weight: 500; }
.am-risks { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.am-risk { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #b45309; }
.am-risk-dot { width: 7px; height: 7px; border-radius: 50%; background: #f59e0b; flex: none; }
.am-risk-more { font-size: 12px; color: var(--muted); }
.am-ok { font-size: 13.5px; color: #16a34a; }
.am-link {
  margin-top: 10px; background: none; border: none; padding: 0;
  color: var(--teal); font-size: 13px; cursor: pointer; font-family: inherit;
}
.am-link:hover { text-decoration: underline; }
@media (max-width: 720px) {
  .assess-mini { flex-direction: column; text-align: center; }
  .am-badges, .am-risks { justify-content: center; }
}
.assess-score {
  display: flex; align-items: center; gap: 32px; margin-bottom: 22px;
}
.assess-gauge {
  flex: none; width: 140px; height: 140px; border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: conic-gradient(var(--band) 0 var(--band-pct, 70%), #eef1f5 var(--band-pct, 70%) 100%);
  position: relative;
}
.assess-gauge::after {
  content: ""; position: absolute; inset: 12px; border-radius: 50%; background: #fff;
}
.assess-score-num { font-size: 44px; font-weight: 700; z-index: 1; line-height: 1; }
.assess-score-cap { font-size: 12px; color: var(--muted); z-index: 1; margin-top: 4px; }
.assess-score-meta { display: flex; flex-direction: column; gap: 10px; }
.assess-badge { display: inline-block; padding: 8px 14px; border-radius: 999px; font-size: 15px; font-weight: 500; width: fit-content; }
.assess-visa { color: var(--muted); font-size: 14px; }
.assess-section { margin-top: 22px; }
.assess-h { font-size: 16px; font-weight: 600; margin-bottom: 12px; }
.assess-risk {
  border: 1px solid var(--soft-line); border-left: 4px solid #f59e0b;
  border-radius: 12px; padding: 12px 16px; margin-bottom: 10px; background: var(--soft);
}
.assess-risk-label { font-weight: 600; margin-bottom: 4px; }
.assess-risk-detail { color: var(--muted); font-size: 14px; line-height: 1.5; }
.assess-ok { color: #16a34a; font-size: 15px; }
.assess-doc-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.assess-doc {
  border: 1px solid var(--soft-line); border-radius: 12px; padding: 12px 16px;
  background: #fff; font-size: 15px;
}
.assess-proc { color: var(--muted); font-size: 14px; line-height: 1.6; }
.assess-proc-alert {
  margin-top: 10px; padding: 12px 16px; border-radius: 12px;
  background: #fff7ed; color: #b45309; font-size: 14px;
}
.assess-disclaimer { margin-top: 22px; color: var(--muted); font-size: 12px; text-align: center; }
/* 评估「正在算」/「算不出来」两态：绝不显示编造的分数，见 app.js assessUnavailablePanel */
.assess-loading { padding: 28px 20px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.assess-loading .assess-proc { text-align: center; }
.assess-unavailable { padding: 20px; }
.assess-unavailable .assess-proc { margin-top: 8px; }
.assess-unavailable-acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
@media (max-width: 720px) {
  .assess-doc-list { grid-template-columns: 1fr; }
}

/* ==== 签证办理全流程指南 ==== */
.guide-meta { padding: 16px 20px; }
.guide-meta-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.guide-tag {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 5px 12px; border-radius: 999px; font-size: 12px; font-weight: 600;
  background: var(--soft); color: var(--ink); border: 1px solid var(--soft-line);
}
.guide-tag.on { background: #ecfdf3; color: #1a7f37; border-color: #abefc6; }
.guide-tag.off { background: #fff7ed; color: #b45309; border-color: #fed7aa; }
.guide-meta-official { margin-top: 10px; font-size: 12px; color: var(--muted); word-break: break-all; }
.guide-meta-official a { color: var(--ink); }

.guide-facts {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 18px;
}
.guide-fact {
  display: flex; gap: 12px; padding: 16px; border: 1px solid var(--soft-line);
  border-radius: var(--radius-sm); background: #fff;
}
.gf-ico { font-size: 22px; line-height: 1; }
.gf-label { font-size: 12px; color: var(--muted); }
.gf-value { font-size: 16px; font-weight: 700; margin-top: 2px; }
.gf-note { font-size: 12px; color: var(--muted); margin-top: 6px; line-height: 1.5; }
.gf-src { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 11px; color: var(--muted); }
.gf-src a { color: var(--ink); text-decoration: none; }
.gf-src a:hover { text-decoration: underline; }
.gf-asof { padding: 2px 8px; background: var(--soft); border-radius: 999px; }

/* 「这个数我们没有」的事实卡：视觉上不能和有出处的事实长得一样重。 */
.guide-fact.unknown { background: var(--soft); border-style: dashed; }
.guide-fact.unknown .gf-value.muted { color: var(--muted); font-weight: 600; }

.guide-timeline { margin-top: 26px; }
.guide-stage { display: flex; gap: 16px; }
.gs-rail { display: flex; flex-direction: column; align-items: center; }
.gs-no {
  width: 30px; height: 30px; flex: none; border-radius: 50%;
  background: var(--ink); color: #fff; font-size: 13px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.gs-rail::after {
  content: ""; flex: 1; width: 2px; background: var(--soft-line); margin: 6px 0;
}
.guide-stage:last-child .gs-rail::after { display: none; }
.gs-card {
  flex: 1; margin-bottom: 20px; padding: 16px 18px;
  border: 1px solid var(--soft-line); border-radius: var(--radius-sm); background: #fff;
}
.gs-head { display: flex; align-items: center; gap: 8px; }
.gs-ico { font-size: 18px; }
.gs-title { font-size: 16px; font-weight: 700; }
.gs-summary { margin-top: 6px; font-size: 13px; color: var(--muted); line-height: 1.6; }
.gs-items { margin: 12px 0 0; padding-left: 20px; }
.gs-items li { font-size: 13px; line-height: 1.7; margin-bottom: 4px; }
.gs-footnote {
  margin-top: 10px; padding: 8px 12px; border-radius: 8px;
  background: #fff7ed; color: #b45309; font-size: 12px; line-height: 1.5;
}
.gs-src {
  margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--soft-line);
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font-size: 11px; color: var(--muted);
}
.gs-src a { color: var(--ink); text-decoration: none; }
.gs-src a:hover { text-decoration: underline; }
.gs-asof { padding: 2px 8px; background: var(--soft); border-radius: 999px; }

/* ---------- Apply Info (Figma 108-1941) ----------
   5 段编号卡片：1. 签证类型 → 2. 入境次数与有效期 → 3. 申请人身份 →
   4. 计划行程 → 5. 联系方式。
   关键：第 1 段填好之前，第 2-5 段隐藏（reveal pattern），避免用户被一堆
   还没法决定的问题淹没。 */
.apply-stepper {
  display: flex;
  align-items: center;
  gap: 0;
  border: 1px solid var(--soft-line);
  border-radius: var(--radius);
  background: #fff;
  padding: 22px 36px;
  box-shadow: var(--shadow);
  margin-bottom: 28px;
  overflow-x: auto;
}
.apply-step {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
}
.apply-step .dot {
  width: 36px; height: 36px; flex: none;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--soft); color: var(--muted); font-size: 14px;
  border: 1px solid transparent;
}
.apply-step.done .dot { background: var(--teal); color: #fff; }
.apply-step.done .dot::before { content: "✓"; }
.apply-step.done .dot .num { display: none; }
.apply-step.active .dot { background: var(--teal); color: #fff; }
.apply-step.active .dot::before { content: "✎"; }
.apply-step.active .dot .num { display: none; }
.apply-step .meta { display: flex; flex-direction: column; min-width: 0; }
.apply-step .name { font-size: 15px; font-weight: 500; color: var(--ink); }
.apply-step .name.muted { color: var(--muted); font-weight: 400; }
.apply-step .asof { font-size: 11px; color: var(--muted); margin-top: 2px; }
/* 已完成步骤可点击返回（申请页顶部 stepper 的「上一步」入口） */
.apply-step.is-link { cursor: pointer; }
.apply-step.is-link:hover .name { text-decoration: underline; }
.apply-step-divider {
  flex: none;
  height: 1px;
  background: var(--soft-line);
  width: 28px;
  margin: 0 8px;
}

.apply-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 18px;
  padding: 10px 22px 18px;
  background: #fff;
  border-bottom: 1px solid #edf1ee;
}
.apply-header .h-left { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.apply-header .step-tag {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 500;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--teal-soft);
  color: var(--teal);
  width: max-content;
}
.apply-header .step-tag .dot-sm {
  width: 6px; height: 6px; border-radius: 50%; background: var(--teal);
}
.apply-header h2 { margin: 4px 0 0; font-size: 27px; font-weight: 650; letter-spacing: -0.4px; }
.apply-header .sub { font-size: 14px; color: var(--muted); }
.apply-section {
  background: #fff;
  border: 1px solid var(--soft-line);
  border-radius: var(--radius);
  padding: 26px;
  box-shadow: none;
  margin-bottom: 20px;
}
.nz-quick-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 18px 0 22px;
}
.nz-quick-nav span { margin-right: 4px; color: var(--muted); font-size: 14px; }
.nz-quick-nav button {
  border: 1px solid var(--teal);
  border-radius: 999px;
  background: #fff;
  color: var(--teal);
  padding: 9px 15px;
  font: inherit;
  cursor: pointer;
}
.nz-quick-nav button:hover { background: var(--teal-soft); }
.nz-quick-nav button:focus-visible { outline: 3px solid var(--teal); outline-offset: 2px; }
[data-testid="nz-primary-preparation"] > .apply-input-grid select {
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}
[data-testid="nz-primary-preparation"] > .apply-input-grid select:focus-visible {
  outline: 2px solid var(--teal-soft);
  border-color: var(--teal);
}
[data-testid="nz-primary-preparation"] > .apply-input-grid select:disabled {
  background: var(--soft);
  color: var(--muted);
}
.apply-section .sec-head {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 22px;
}
.apply-section .sec-ico {
  width: 32px; height: 32px; flex: none;
  border-radius: 10px;
  background: var(--soft);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; color: var(--ink);
}
.apply-section .sec-title { font-size: 18px; font-weight: 650; flex: 1; }
.apply-section .sec-number {
  color: var(--teal); font-size: 13px; font-weight: 700; letter-spacing: .4px;
  min-width: 24px;
}
.apply-section .sec-status {
  font-size: 12px; color: var(--muted);
  padding: 3px 10px; border-radius: 999px;
  background: var(--soft);
}
/* 段 1 已经填了 → 状态变绿色提示 */
.apply-section[data-sec="visa-type"] .sec-status:not(:empty) {
  color: #15803d; background: #dcfce7;
}

/* 申请目的：与 Figma 一致使用轻量胶囊，而不是占满一行的大图标卡。 */
.apply-field-label {
  margin: 0 0 10px;
  color: var(--ink); font-size: 14px; font-weight: 600;
}
.apply-purpose-row { display: flex; flex-wrap: wrap; gap: 10px; }
.apply-purpose {
  border: 1px solid var(--soft-line); border-radius: 999px; padding: 8px 18px;
  background: #fff; color: var(--ink); font: inherit; font-size: 13px; cursor: pointer;
}
.apply-purpose:hover { border-color: var(--line); }
.apply-purpose.active { border-color: var(--teal); background: var(--teal-soft); color: var(--teal); font-weight: 600; }
/* 说明保留政策边界，但视觉上退为来源性文字。 */
.apply-scope-note { margin-top: 12px; font-size: 12.5px; line-height: 1.65; color: var(--muted); }
/* 3 大选项卡（入境次数与有效期） */
.apply-option-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.apply-option {
  position: relative;
  border: 1px solid var(--soft-line);
  border-radius: 14px;
  padding: 22px 18px;
  background: #fff;
  cursor: pointer;
  text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  transition: border-color 0.15s ease, background 0.15s ease;
  font-family: inherit; color: var(--ink);
}
.apply-option:hover { border-color: var(--line); }
.apply-option .primary { font-size: 15px; font-weight: 500; }
.apply-option .secondary { font-size: 12px; color: var(--muted); }
.apply-option.active {
  border: 1.5px solid var(--teal);
  background: var(--teal-soft);
}
.apply-option.active::after {
  content: "✓";
  position: absolute; top: 8px; right: 10px;
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--teal); color: #fff;
  font-size: 11px; line-height: 18px; text-align: center;
}

/* 5 芯片（申请人身份） */
.apply-chip-row {
  display: flex; flex-wrap: wrap; gap: 10px;
}
.apply-chip {
  border: 1px solid var(--soft-line);
  border-radius: 999px;
  padding: 10px 22px;
  font-size: 14px;
  background: #fff;
  cursor: pointer;
  font-family: inherit; color: var(--ink);
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.apply-chip:hover { border-color: var(--line); }
.apply-chip.active {
  border: 1.5px solid var(--teal);
  background: var(--teal-soft);
  color: var(--teal); font-weight: 500;
}
/* 段 3 次级字段（拒签史/家庭同行/常住地）：chip 略小、带字段说明 */
/* 申请页字段行内校验提示（段 4 日期 / 段 5 联系方式） */
.apply-hint-row { margin-top: 10px; display: flex; flex-direction: column; gap: 4px; }
.apply-hint-row .ah-err { color: #d92d20; font-size: 13px; line-height: 1.4; }
.apply-hint-row .ah-warn { color: #b54708; font-size: 13px; line-height: 1.4; }

.apply-subfield { margin-top: 14px; }
.apply-subfield-first { margin-top: 0; }
.apply-subfield > label {
  display: block; font-size: 12.5px; color: var(--muted, #6b7a72);
  margin-bottom: 6px;
}
.apply-subfield .apply-chip { padding: 7px 16px; font-size: 13px; }


/* “关于你”按 Figma 的两列信息层级组织；额外字段仅在需要时展开。 */
.apply-about-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px 42px; margin-top: 20px; padding-top: 20px; border-top: 1px solid #edf1ee;
}
.apply-about-grid .apply-subfield { margin: 0; min-width: 0; }
.apply-about-grid select {
  width: 100%; box-sizing: border-box; appearance: auto; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: 9px; background: #fff;
  color: var(--ink); font: inherit; font-size: 14px;
}
.apply-about-grid select:focus { outline: 2px solid var(--teal-soft); border-color: var(--teal); }
.apply-about-grid .hint { display: block; margin-top: 7px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.apply-conditional-field { margin-top: 24px; color: var(--muted); }
.apply-conditional-field summary { width: max-content; max-width: 100%; cursor: pointer; color: var(--teal); font-size: 13px; }
.apply-conditional-field[open] summary { margin-bottom: 12px; }
.apply-conditional-field label { display: block; margin-bottom: 7px; color: var(--muted); font-size: 12.5px; }
.apply-conditional-field input {
  width: min(420px, 100%); box-sizing: border-box; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: 9px; color: var(--ink); font: inherit;
}
.apply-conditional-field input:focus { outline: 2px solid var(--teal-soft); border-color: var(--teal); }

/* 4 计划行程 / 5 联系方式（两列输入） */
.apply-input-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 28px;
}
.apply-input-grid .col { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.apply-input-grid label { font-size: 14px; font-weight: 500; }
.apply-input-grid .hint { font-size: 12px; color: var(--muted); }
.apply-input-grid input,
.apply-input-grid input[type="date"] {
  font-family: inherit; font-size: 15px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 13px 16px;
  background: #fff;
  color: var(--ink);
  width: 100%;
  box-sizing: border-box;
}
.apply-input-grid input::placeholder { color: var(--muted); }
.apply-input-grid input:focus { outline: 2px solid var(--teal-soft); border-color: var(--teal); }

/* 预计出行时间：详细政策只在用户主动打开问号后呈现。 */
.trip-help-trigger {
  width: 21px; height: 21px; padding: 0; border-radius: 50%;
  border: 1px solid #81928a; background: #fff; color: #42564c;
  font: 700 13px/1 inherit; cursor: pointer; flex: none;
}
.trip-help-trigger:hover, .trip-help-trigger:focus-visible {
  border-color: var(--teal); color: var(--teal); outline: 2px solid var(--teal-soft); outline-offset: 2px;
}
.trip-help-dialog {
  width: min(560px, calc(100vw - 32px)); max-height: min(720px, calc(100vh - 40px));
  border: 1px solid var(--soft-line); border-radius: 16px; padding: 0; color: var(--ink);
  box-shadow: 0 22px 60px rgba(20, 40, 30, .22);
}
.trip-help-dialog::backdrop { background: rgba(18, 34, 26, .34); }
.trip-help-dialog-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 22px 14px; border-bottom: 1px solid var(--soft-line); }
.trip-help-dialog-head h3 { margin: 0; font-size: 18px; font-weight: 650; }
.trip-help-close { width: 30px; height: 30px; border: 0; border-radius: 50%; background: var(--soft); color: var(--ink); font-size: 22px; line-height: 1; cursor: pointer; }
.trip-help-close:hover { background: #e6eeea; }
.trip-help-content { padding: 6px 22px 2px; overflow: auto; max-height: calc(min(720px, 100vh - 40px) - 150px); }
.trip-help-section { padding: 14px 0; border-bottom: 1px solid #edf1ee; }
.trip-help-section:last-child { border-bottom: 0; }
.trip-help-section h4 { margin: 0 0 8px; font-size: 15px; }
.trip-help-section p, .trip-help-section li { font-size: 14px; line-height: 1.7; }
.trip-help-section p { margin: 0 0 8px; }
.trip-help-section p:last-child { margin-bottom: 0; }
.trip-help-section ul { margin: 8px 0 0; padding-left: 20px; }
.trip-help-emphasis { color: var(--teal); font-weight: 650; }
.trip-help-source { display: inline-block; margin: 16px 22px 2px; color: var(--teal); font-size: 13px; font-weight: 600; }
.trip-help-asof { margin: 4px 22px 18px; color: var(--muted); font-size: 12px; }

/* 入境次数 / 身份等 reveal pattern：未填好时整段隐藏 */
.apply-section-pending { display: none; }
.apply-section-pending.is-locked-hint {
  display: block;
  background: var(--soft);
  border: 1px dashed var(--soft-line);
  box-shadow: none;
  color: var(--muted);
}
.apply-section-pending.is-locked-hint .sec-head { margin-bottom: 0; }
.apply-section-pending.is-locked-hint .lock-hint {
  font-size: 13px; line-height: 1.6;
}

/* reveal 动画 */
@keyframes apply-reveal {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.apply-section.is-revealed { animation: apply-reveal 0.25s ease-out both; }

/* 已移除本页完成概览；内容量小，继续按钮只根据门禁状态显示。 */
.apply-progress {
  margin: 24px 6px 0;
  display: flex; flex-direction: column; gap: 8px;
}
.apply-progress .bar {
  width: 100%; height: 6px;
  background: var(--soft-line); border-radius: 3px;
  overflow: hidden;
}
.apply-progress .bar-fill {
  height: 100%; background: var(--teal);
  transition: width 0.3s ease;
}
.apply-progress .label {
  font-size: 12px; color: var(--muted);
  text-align: right;
}

.apply-nav {
  display: flex; justify-content: flex-end; gap: 12px;
  margin-top: 26px;
  padding: 0 6px;
}
.apply-nav .btn.primary { background: var(--teal); }
.apply-nav .btn.primary:hover { background: #0a2a1f; }
.apply-nav .btn.primary:disabled {
  background: var(--soft); color: var(--muted); cursor: not-allowed;
}

@media (max-width: 720px) {
  .apply-option-grid { grid-template-columns: 1fr; }
  .apply-input-grid, .apply-about-grid { grid-template-columns: 1fr; }
  .apply-stepper { padding: 16px 18px; }
  .apply-step-divider { display: none; }
}

@media (max-width: 720px) {
  .assess-doc-list { grid-template-columns: 1fr; }
  .guide-facts { grid-template-columns: 1fr; }
}

/* Application frame 8:3: measured from the current Figma document. Scoped so
   this screen's canvas and spacing cannot change material or runner screens. */
.application-frame {
  --ink: #131917;
  --line: #b2bdb8;
  --muted: #57615c;
  --soft-line: #dbe3de;
  --teal: #094a3b;
  --teal-soft: #ebf5f0;
  max-width: 1440px;
  background: #eef4f0;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
}
body:has(.application-frame) { background: #eef4f0; }
.application-frame .topbar { height: 72px; flex-shrink: 0; border-bottom: 0; padding: 0 64px; }
.application-frame .brand-shield { display: none; }
.application-frame .brand .logo { font-family: inherit; font-size: 22px; font-weight: 700; letter-spacing: 0; color: var(--ink); }
.application-frame .apply-my-entry { height: 35px; padding: 0 14px; border: 1px solid var(--soft-line); border-radius: 10px; background: #fff; font: inherit; font-size: 13px; color: var(--ink); cursor: pointer; }
.application-frame .page.application-page {
  width: calc(100% - 128px); max-width: 1312px; margin: 0 auto;
  padding: 28px 0 48px; background: #f7f9f8;
  display: flex; flex-direction: column; gap: 24px;
  animation: none;
}
.application-page [data-testid="apply-sections"] { display: flex; flex-direction: column; gap: 24px; }
.application-page [data-testid="minor-slot"]:empty { display: none; }
.application-page .apply-stepper { height: 84px; min-height: 84px; margin: 0; padding: 0 24px; border-radius: 16px; box-shadow: none; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 10px; overflow: visible; }
.application-page .apply-step { flex: 0 1 auto; gap: 12px; }
.application-page .apply-step-divider { display: none; }
.application-page .apply-step .dot { width: 34px; height: 34px; background: #f0f2f1; color: #808a85; font-size: 13px; }
.application-page .apply-step.done .dot, .application-page .apply-step.active .dot { background: var(--teal); color: #fff; }
.application-page .apply-step.active .dot::before { content: none; }
.application-page .apply-step.active .num { display: inline; }
.application-page .apply-step .name { font-size: 14px; }
.application-page .apply-step .name.muted { color: #808a85; }
.application-page .apply-step .asof { margin: 1px 0 0; font-size: 11px; line-height: 13px; color: var(--muted); }
.application-page .apply-step.todo .asof { color: #808a85; }
.application-page .apply-header { min-height: 88px; padding: 14px 23px; align-items: center; border: 0; }
.application-page .apply-header h2 { margin: 0; font-size: 30px; font-weight: 700; letter-spacing: 0; line-height: 36px; }
.application-page .apply-header .h-left { gap: 8px; }
.application-page .apply-header .sub { font-size: 13px; line-height: 16px; }
.application-page .apply-autosave { border-radius: 999px; padding: 6px 12px; background: #f4f8f6; color: #398c73; font-size: 12px; white-space: nowrap; }
.application-page .apply-section { margin: 0; padding: 26px 28px; border-radius: 18px; box-shadow: none; }
.application-page .apply-section .sec-head { gap: 12px; margin-bottom: 20px; min-height: 24px; }
.application-page .apply-section .sec-number { min-width: 16px; width: 16px; letter-spacing: 0; }
.application-page .apply-section .sec-title { flex: none; font-size: 20px; font-weight: 700; line-height: 24px; }
.application-page .apply-field-label, .application-page .apply-subfield > label,
.application-page .apply-input-grid label, .application-page .apply-repeat-visit > label {
  display: block; color: var(--ink); font-size: 13px; font-weight: 500; line-height: 16px;
}
.application-page .apply-field-label { margin-bottom: 20px; }
.application-page .apply-purpose, .application-page .apply-chip,
.application-page .apply-subfield .apply-chip {
  padding: 9px 16px; min-height: 37px; border-radius: 999px;
  font-size: 14px; font-weight: 400; line-height: 17px;
}
.application-page .apply-purpose.active, .application-page .apply-chip.active { border: 1.5px solid var(--teal); padding: 8.5px 15.5px; font-weight: 500; }
.application-page .apply-purpose.active::after, .application-page .apply-chip.active::after { content: "✓"; margin-left: 6px; font-size: 12px; }
.application-page .apply-validity-note { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; margin-top: 20px; color: var(--muted); font-size: 12px; line-height: 18px; }
.apply-scope-note { margin: 12px 0 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.mw-scope-note { margin: 0 0 16px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.declaration-panel { padding: 28px; margin: 16px; background: #fff; color: var(--ink); border: 1px solid var(--soft-line); border-radius: 16px; }
.declaration-panel h2 { margin: 0 0 10px; font-size: 22px; }
.console.awaiting-confirmation { border: 0; box-shadow: none; overflow: visible; }
.console.awaiting-confirmation > .screen-canvas, .console.awaiting-confirmation > .console-tabs, .console.awaiting-confirmation > .status-bar { display: none; }
.console.awaiting-confirmation .declaration-panel { margin: 0; }
.confirmation-intro, .confirmation-footnote { color: var(--muted); line-height: 1.7; }
.confirmation-group { margin: 24px 0; }
.confirmation-group h3 { font-size: 15px; color: var(--teal); }
.confirmation-row { min-width: 0; margin: 14px 0; border: 1px solid var(--soft-line); border-radius: 12px; padding: 16px; }
.confirmation-row legend { max-width: 100%; padding: 0 6px; font-size: 14px; font-weight: 600; }
.confirmation-answer { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; color: var(--muted); font-size: 13px; }
.confirmation-answer select { min-height: 40px; max-width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; background: #fff; color: var(--ink); }
.confirmation-row textarea { box-sizing: border-box; width: 100%; min-height: 80px; margin-top: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.confirmation-check { display: flex; align-items: flex-start; gap: 8px; margin-top: 14px; font-size: 13px; line-height: 1.7; }
.confirmation-check input { margin-top: 4px; accent-color: var(--teal); }
.confirmation-progress { color: var(--teal); font-size: 13px; }
.declaration-panel .btn:disabled { background: #e5eae7; border-color: #e5eae7; color: #78877f; cursor: not-allowed; }
.confirmation-error { color: #a23527; line-height: 1.7; }
.confirmation-footnote { font-size: 12px; }
@media(max-width: 600px) { .declaration-panel { margin: 8px 0; padding: 18px; } }
.application-page .apply-text-action { padding: 0; border: 0; background: transparent; color: var(--teal); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.application-page .apply-text-action:hover { text-decoration: underline; }
.application-page .apply-subfield-first > label { margin-bottom: 20px; min-height: 30px; }
.application-page .apply-about-grid { column-gap: 44px; row-gap: 20px; margin-top: 20px; padding-top: 20px; border-top-color: var(--soft-line); }
.application-page .apply-about-grid .apply-subfield:nth-child(-n+2) { min-height: 84px; }
.application-page .apply-about-grid .apply-subfield:nth-child(n+3) { min-height: 104px; }
.application-page .apply-about-grid label { margin-bottom: 12px; }
.application-page .apply-about-grid select { height: 48px; border-radius: 10px; padding: 12px 14px; }
.application-page .apply-about-grid .hint { margin-top: 8px; color: #929c96; font-size: 12px; line-height: 18px; }
.application-page .apply-input-grid { column-gap: 48px; row-gap: 20px; }
.application-page .apply-input-grid .col { gap: 8px; }
.application-page .apply-input-grid input { width: 100%; height: 48px; padding: 12px 14px; font-size: 14px; line-height: 20px; border-radius: 10px; }
.application-page .apply-section[data-sec="trip"] .apply-input-grid { min-height: 92px; justify-content: center; }
.application-page .trip-help-trigger { width: 16px; height: 16px; min-width: 16px; padding: 0; margin-left: -4px; border: 1.5px solid var(--muted); border-radius: 50%; background: transparent; font-size: 11px; line-height: 13px; }
.application-page .apply-repeat-visit { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--soft-line); }
.application-page .apply-repeat-visit > label { margin-bottom: 20px; }
.application-page .apply-phone-input { display: flex; align-items: center; height: 48px; padding-left: 14px; border: 1px solid var(--line); border-radius: 10px; }
.application-page .apply-phone-input > span { flex: none; font-size: 14px; }
.application-page .apply-phone-input input { height: 46px; border: 0; padding-left: 5px; background: transparent; }
.application-page .apply-phone-input:focus-within { outline: 2px solid var(--teal-soft); border-color: var(--teal); }
.application-page .apply-phone-input input:focus { outline: none; }
.application-page .apply-section[data-sec="contact"] .apply-input-grid { min-height: 108px; }
.application-page .apply-input-grid .hint { font-size: 12px; line-height: 18px; color: #929c96; }
.application-page .apply-contact-note { display: flex; align-items: baseline; gap: 8px; margin-top: 20px; color: var(--muted); font-size: 12px; line-height: 18px; }
.application-page .apply-nav { min-height: 104px; margin: 0; padding: 20px 20px 20px 24px; justify-content: space-between; align-items: center; background: #fff; border: 1px solid var(--soft-line); border-radius: 16px; }
.application-page .apply-completion { display: flex; flex-direction: column; gap: 6px; font-size: 12px; }
.application-page .apply-completion strong { font-size: 13px; font-weight: 500; }
.application-page .apply-completion span { color: var(--muted); }
.application-page .apply-nav .btn.primary { height: 44px; border-radius: 11px; padding: 0 22px; font-size: 14px; display: inline-flex; align-items: center; gap: 12px; white-space: nowrap; }
.birth-city-supplement { margin: 20px 0; padding: 18px 20px; background: #f4f8f6; border: 1px solid #dbe3de; border-radius: 12px; }
.birth-city-supplement h3 { margin: 0 0 8px; font-size: 16px; }
.birth-city-supplement p { margin: 0 0 12px; color: #57615c; font-size: 13px; line-height: 1.6; }
.birth-city-supplement-controls { display: flex; flex-wrap: wrap; gap: 10px; }
.birth-city-supplement-controls input { padding: 10px 12px; border: 1px solid #b2bdb8; border-radius: 10px; font: inherit; max-width: 100%; }
.birth-city-supplement [role="status"] { margin-top: 8px; font-size: 13px; color: #094a3b; }
@media (max-width: 720px) {
  .application-frame .topbar { padding: 0 16px; }
  .application-frame .brand .logo { font-size: 18px; }
  .application-frame .page.application-page { width: calc(100% - 32px); padding-top: 20px; }
  .application-page .apply-stepper { height: auto; min-height: 104px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 16px; }
  .application-page .apply-step { gap: 8px; }
  .application-page .apply-step .name { font-size: 12px; }
  .application-page .apply-step .asof { font-size: 10px; }
  .application-page .apply-header { padding: 16px; flex-wrap: wrap; }
  .application-page .apply-header h2 { font-size: 24px; line-height: 30px; }
  .application-page .apply-header .sub { line-height: 20px; }
  .application-page .apply-section { padding: 22px 20px; }
  .application-page .apply-input-grid, .application-page .apply-about-grid { grid-template-columns: 1fr; }
  .application-page .apply-about-grid .apply-subfield { min-height: auto; }
  .application-page .apply-section[data-sec] .apply-input-grid { min-height: auto; }
  .application-page .apply-nav { padding: 20px; flex-wrap: wrap; gap: 18px; }
  .application-page .apply-nav .btn { width: 100%; justify-content: center; }
}
.visa-scope-close { flex: none; width: 32px; height: 32px; border: 0; border-radius: 50%; background: #f0f4f1; color: var(--ink); font-size: 24px; cursor: pointer; }
.visa-scope-close:hover { background: #e6eeea; }
/* Materials workbench: one task, one next action, shared application palette. */
.mw-page { width:100%; max-width:1120px; padding:32px 40px 48px; animation:none; }
.material-workbench { --mw-green:var(--teal); --mw-muted:#65736d; color:#182c23; }
.mw-stepper { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); align-items:center; gap:12px; font-size:13px; margin:0 0 28px; min-height:84px; padding:20px 24px; border-radius:16px; box-shadow:none; border:1px solid #e1e9e4; background:#fff; }
.mw-stepper .apply-step { gap:10px; }
.mw-stepper .meta { display:grid; gap:4px; }
.mw-stepper .name { font-size:13px; font-weight:600; color:#324c3d; }
.mw-stepper .asof { font-size:11px; color:#768a7d; }
.mw-stepper .dot { width:32px; height:32px; }
.mw-stepper .active .dot::before { content:none; }
.mw-stepper .apply-step.active .dot .num { display:inline; }
.mw-stepper a { color:#586b61; text-decoration:none; }
.mw-stepper > span:empty { height:1px; background:#d9e1dc; flex:1; }
.mw-stepper b { color:var(--mw-green); }
.mw-future { color:#89958f; }
.mw-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:24px; }
.mw-eyebrow { font-size:11px; letter-spacing:1.4px; color:#6b7b72; font-weight:600; }
.mw-heading h1 { font-size:32px; letter-spacing:-1px; margin:8px 0; font-weight:650; }
.mw-heading p { font-size:14px; color:var(--mw-muted); margin:0; line-height:1.7; }
.mw-primary,.mw-secondary,.mw-filter,.mw-card-action,.mw-drawer-close { font-family:inherit; cursor:pointer; }
.mw-primary { display:inline-flex; align-items:center; justify-content:center; background:var(--teal); color:#fff; border:1px solid var(--teal); border-radius:10px; padding:13px 21px; font-size:14px; font-weight:600; white-space:nowrap; min-height:44px; }
.mw-primary:hover { background:#164c39; }
.mw-primary:disabled { background:#e5eae7; border-color:#e5eae7; color:#6e7b73; cursor:wait; }
.mw-secondary { border:1px solid #d7e2da; background:white; color:var(--teal); border-radius:9px; padding:10px 14px; font-size:13px; min-height:44px; }
.mw-secondary:hover { background:#f2f7f4; }
.material-workbench button:focus-visible,.material-workbench a:focus-visible,.mw-drawer button:focus-visible,.mw-template button:focus-visible, .material-workbench summary:focus-visible,.mw-drawer summary:focus-visible { outline:3px solid #4c9475; outline-offset:3px; }
.mw-overview { border:1px solid #dbe6df; border-radius:16px; padding:23px 26px; background:#f7faf8; }
.mw-progress-heading { display:flex; align-items:center; justify-content:space-between; font-size:13px; }
.mw-progress-heading strong { font-size:28px; font-weight:600; }
.mw-progress-heading strong span { font-size:14px; font-weight:400; color:#53675b; }
.mw-progress-track { background:#e0e9e3; height:6px; border-radius:8px; margin:16px 0; overflow:hidden; }
.mw-progress-track i { display:block; height:100%; background:#37795b; border-radius:8px; transition:width .2s; }
.mw-counts { display:flex; gap:24px; flex-wrap:wrap; color:#647268; font-size:13px; }
.mw-ready { color:#2c7152; }
.mw-attention { color:#966326; }
.mw-basis { font-size:12px; margin:14px 0; color:#6b786e; }
.mw-basis > summary { display:flex; justify-content:space-between; gap:14px; cursor:pointer; list-style:none; padding:8px 0; }
.mw-basis > div { padding:16px 20px; border:1px solid #e3ebe5; border-radius:12px; color:#536359; line-height:1.75; }
.mw-basis p { margin:0 0 8px; }
.mw-intro { margin:-8px 0 26px; }
.mw-intro > summary { padding:10px 0; align-items:center; color:#64766b; }
.mw-intro-profile { color:#7b897f; }
.mw-intro-toggle { transition:transform .15s; }
.mw-intro[open] .mw-intro-toggle { transform:rotate(180deg); }
.mw-category { margin:0 0 28px; }
.mw-category-heading { display:flex; align-items:baseline; justify-content:space-between; gap:14px; margin:0 0 8px; }
.mw-category-heading h3 { font-size:15px; font-weight:600; margin:0; color:#344c3e; }
.mw-category-heading h3 small { font-size:11px; color:#87958b; font-weight:400; margin-left:7px; }
.mw-category-state { font-size:12px; color:#7b897f; line-height:1.6; }
.mw-category-help { color:#718277; font-size:12px; margin:0 0 14px; line-height:1.75; }
.mw-category-help > summary { display:inline-flex; gap:10px; align-items:center; list-style:none; cursor:pointer; min-height:32px; }
.mw-category-help[open] { padding-bottom:12px; border-bottom:1px solid #e7ede8; }
.mw-category-help p { margin:6px 0; max-width:85ch; }
.mw-category-help > small { display:block; }
.mw-deferred { margin:14px 0 0; padding:12px 14px; border:1px solid #e2ebe5; border-radius:10px; background:#f8faf8; }
.mw-deferred > summary { cursor:pointer; color:var(--teal); font-size:13px; font-weight:600; }
.mw-deferred > p { margin:10px 0; color:var(--muted); font-size:12px; line-height:1.7; }
.mw-deferred > .mw-card-grid { margin-top:12px; }
@media(max-width:600px){.mw-intro > summary{display:flex;gap:10px;font-size:12px;}.mw-category-heading{align-items:flex-start;flex-direction:column;gap:4px;}.mw-category-state{font-size:11px;}.mw-category{margin-bottom:24px;}}
.mw-section-title { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 16px; }
.mw-section-title h2 { font-size:18px; font-weight:600; margin:0; }
.mw-section-title > span { font-size:12px; background:#f8eddd; color:#946120; padding:4px 10px; border-radius:20px; }
.mw-section-title small { color:#728078; font-size:12px; }
.mw-filters { display:flex; gap:6px; margin:18px 0; flex-wrap:wrap; }
.mw-filter { background:transparent; color:#67756c; border:1px solid transparent; padding:9px 14px; border-radius:9px; font-size:13px; min-height:42px; }
.mw-filter span { font-size:11px; margin-left:5px; opacity:.8; }
.mw-filter[aria-pressed=true] { color:var(--teal); background:#e8f2ec; border-color:#d8e8de; font-weight:600; }
.mw-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.verify-card.mw-card { cursor:default; min-height:238px; background:#fff; border:1px solid #dce5df; border-radius:14px; padding:20px; display:flex; flex-direction:column; box-shadow:none; transform:none; }
.verify-card.mw-card:hover { box-shadow:0 4px 18px #1e4f3210; border-color:#b7cabc; }
.verify-card.mw-card.mw-attention { border-color:#e8d7b8; background:#fffefa; }
.mw-card-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.mw-document-icon { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; background:#f1f6f3; font-size:19px; color:#426b54; }
.mw-status { display:inline-block; font-size:11px; font-weight:500; padding:4px 9px; border-radius:6px; color:#617469; background:#f0f4f2; }
.mw-status.mw-ready { background:#e9f4ed; color:#2d7856; }
.mw-status.mw-attention { background:#fff0da; color:#976327; }
.mw-status.mw-checking { background:#eef1ff; color:#52679b; }
.mw-card h3.vc-name { font-size:15px; font-weight:600; margin:0 0 5px; color:#253b2e; }
.mw-requirement { color:#829087; font-size:11px; }
.mw-card > p { margin:13px 0 10px; font-size:13px; line-height:1.65; color:#65756a; flex:1; }
.mw-file { color:#87928b; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; font-size:11px; min-height:18px; }
.mw-card-action { width:100%; display:flex; justify-content:space-between; align-items:center; background:transparent; border:0; border-top:1px solid #edf1ee; color:var(--teal); padding:15px 0 0; margin-top:14px; text-align:left; font-size:13px; font-weight:500; min-height:40px; }
.mw-bottom { position:sticky; bottom:0; z-index:5; background:#ffffffed; backdrop-filter:blur(10px); display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid #d7e2da; margin-top:30px; padding:20px 0 12px; }
.mw-bottom strong { font-size:14px; font-weight:500; }
.mw-bottom p { color:#77857b; font-size:12px; margin:6px 0 0; }
.mw-loading { padding:32px; color:#65736b; line-height:1.8; }
.mw-empty { grid-column:1/-1; text-align:center; padding:32px; color:#829187; font-size:14px; }
.mw-drawer { position:fixed; inset:0 0 0 auto; border:0; border-left:1px solid #dbe4dd; margin:0; padding:0; height:100dvh; max-height:none; width:520px; max-width:100%; color:#253d2e; box-shadow:-10px 0 50px #0a301518; }
.mw-drawer::backdrop,.mw-template::backdrop { background:#182d2348; }
.mw-drawer-head { display:flex; align-items:flex-start; justify-content:space-between; padding:28px; border-bottom:1px solid #e3ebe5; background:#f8fbf9; position:sticky; top:0; z-index:2; }
.mw-drawer-head h2 { font-size:24px; margin:10px 0 5px; font-weight:600; }
.mw-drawer-head small { color:#839085; font-size:12px; }
.mw-drawer-close { border:0; background:white; font-size:24px; color:#64796b; width:40px; height:40px; border-radius:10px; }
.mw-drawer-body { padding:24px 28px; font-size:14px; line-height:1.75; }
.mw-drawer-body p { color:#6b796f; margin:8px 0 16px; }
.mw-drawer-body h3 { font-size:14px; margin:22px 0 8px; }
.mw-detail { border-bottom:1px solid #e7ece9; padding:14px 0; }
.mw-detail summary { cursor:pointer; font-size:14px; font-weight:500; }
.mw-detail ol { padding-left:20px; color:#6b796f; font-size:13px; }
.mw-detail li { margin:7px 0; }
.mw-detail dl { display:grid; grid-template-columns:1fr 1fr; font-size:12px; gap:8px; }
.mw-detail dt { color:#77887c; }.mw-detail dd { margin:0; overflow-wrap:anywhere; }
.mw-issue { padding:16px; border-radius:10px; background:#fff7e8; border:1px solid #ecddc3; margin:16px 0; }
.mw-issue h3 { margin:0; color:#88622d; }.mw-issue p { font-size:13px; margin:8px 0 0; color:#856d4b; }
.mw-drawer-actions { display:grid; gap:10px; padding-top:12px; }
.mw-check-scope { font-size:12px; }
.mw-template { border:1px solid #dce6df; border-radius:18px; padding:28px; width:720px; max-width:calc(100% - 24px); max-height:90dvh; color:#264130; }
.mw-template h2 { font-size:24px; margin:0 44px 10px 0; }
.mw-template header > button { float:right; }
.mw-template p { color:#6b796f; font-size:13px; line-height:1.7; }
.mw-template-fields { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:18px 0; }
.mw-template-fields label { font-size:12px; color:#63786a; display:grid; gap:6px; }
.mw-template-fields input { width:100%; padding:11px; color:#274231; border:1px solid #d8e3dc; border-radius:8px; font:inherit; }
.mw-draft { white-space:pre-wrap; padding:18px; border:1px solid #dde7e1; border-radius:10px; background:#f7faf8; font-size:13px; line-height:1.8; min-height:160px; }
.mw-template-actions { display:flex; flex-wrap:wrap; gap:10px; margin:16px 0; }
.mw-template-error { color:#9d682d; font-size:13px; line-height:1.7; }
@media(min-width:1300px){body:has(.material-workbench){background:#eef3f0;}.frame:has(.material-workbench){max-width:1280px;background:#fcfdfc;}}
@media(max-width:900px){.mw-page{padding:24px;}.mw-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.mw-section-title small{display:none;}.mw-stepper{gap:10px;font-size:11px;}}
@media(max-width:600px){.mw-page{padding:22px 16px;}.mw-heading{align-items:flex-start;flex-direction:column;gap:16px;}.mw-heading h1{font-size:27px;}.mw-heading>button{width:100%;}.mw-card-grid{grid-template-columns:1fr;gap:12px;}.mw-overview{padding:18px;}.mw-counts{gap:14px;}.mw-progress-heading strong{font-size:24px;}.mw-progress-heading strong span{font-size:12px;}.mw-basis>summary{display:grid;gap:6px;}.mw-bottom{align-items:stretch;flex-direction:column;gap:14px;padding-bottom:16px;}.mw-stepper{flex-wrap:wrap;gap:8px;}.mw-stepper>span:empty{min-width:10px;}.mw-drawer{width:100%;}.mw-drawer-body,.mw-drawer-head{padding:22px;}.mw-template-fields{grid-template-columns:1fr;}}
.mw-dropzone { padding:32px 20px; border:1.5px dashed #b9cdbf; border-radius:12px; text-align:center; background:#f6faf7; cursor:pointer; color:#41684e; }
.mw-dropzone p { margin:8px 0; }.mw-dropzone span { font-size:13px; color:var(--teal); }.mw-dropzone.is-over { border-color:var(--teal); background:#e7f3ec; }
.mw-page { margin:0 auto; }
.mw-progress-help,.mw-coverage>p,.mw-condition p {font-size:13px;line-height:1.7;color:#63786a;margin:10px 0 0;}
.mw-conditions,.mw-coverage {margin:22px 0;padding:20px 24px;border:1px solid #dce6df;border-radius:14px;background:#fff;}
.mw-condition {display:flex;align-items:center;justify-content:space-between;gap:20px;}
.mw-condition-actions,.mw-evidence-actions {display:flex;flex-wrap:wrap;gap:8px;}
.mw-coverage h2 {font-size:18px;margin:0;}
.mw-evidence-goal {border-top:1px solid #e5ece7;padding:14px 0;margin-top:12px;}
.mw-evidence-goal summary {display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;}
.mw-goal-state {font-size:12px;color:#89652f;background:#fff5e4;border-radius:6px;padding:5px 8px;}
.mw-goal-state.provided {color:#41694e;background:#eff6f1;}
.mw-evidence-goal p {font-size:13px;line-height:1.7;color:#63786a;}
.mw-evidence-actions {margin:12px 0;}
.mw-evidence-goal small {display:block;font-size:12px;color:#63786a;line-height:1.7;}
.mw-goal-sources {margin-top:8px;}.mw-goal-sources a {color:var(--teal);margin-right:10px;}
@media(max-width:600px){.mw-conditions,.mw-coverage{padding:18px;}.mw-condition{align-items:flex-start;flex-direction:column;gap:12px;}.mw-evidence-goal summary{align-items:flex-start;}.mw-goal-state{max-width:58%;}.mw-condition-actions .mw-filter{font-size:12px;}}
.mw-file-link { display:inline-block; font-size:13px; color:var(--teal); margin:0 12px 10px 0; }
.mw-classify-row { display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:center;font-size:13px;margin:16px 0; }
.mw-classify-row span { overflow-wrap:anywhere; }
.mw-classify-row select { min-width:0;padding:10px;border:1px solid #d8e3dc;border-radius:8px;background:white;font:inherit; }
@media(max-width:600px){.mw-stepper{grid-template-columns:repeat(2,minmax(0,1fr));padding:16px;gap:16px 8px;}.mw-stepper .apply-step{flex:initial;}}
/* Local applications: the same restrained material-workbench language. */
.applications-heading {display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 0 20px;}
.applications-heading h1 {font-size:28px;margin:0 0 10px;color:#153e35;}
.applications-heading p,.applications-storage {color:#667a73;font-size:14px;line-height:1.7;margin:0;}
.applications-storage {margin-bottom:20px;}
.applications-list {display:grid;gap:16px;}
.application-card {background:#fff;border:1px solid #dce5e0;border-radius:20px;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:24px;}
.application-card.is-current {border-color:#216b58;background:#f8fcfa;}
.application-card-title {display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.application-card h2 {font-size:18px;margin:0;color:#153e35;}
.application-card h2 span {font-weight:400;font-size:13px;color:#647a70;margin-left:8px;}
.application-card p {font-size:14px;line-height:1.6;color:#5e746b;margin:10px 0;}
.application-card-main {min-width:0;flex:1;}
.application-stages {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;margin:16px 0;}
.application-stage {display:flex;flex-direction:column;gap:3px;padding:9px 12px;background:#f2f7f4;border-radius:10px;font-size:12px;color:#64786c;}
.application-stage strong {font-size:13px;font-weight:600;line-height:1.45;color:#224b39;}
.application-card small {color:#73847b;}
.application-card-actions {display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.application-delete {border:0;background:transparent;color:#a43c3c;padding:8px;cursor:pointer;font:inherit;}
.application-delete:hover {text-decoration:underline;}
.application-confirm-dialog {width:min(440px,calc(100vw - 36px));border:1px solid #dce5e0;border-radius:18px;padding:24px;background:#fff;color:#153e35;box-shadow:0 20px 70px #0f302742;}
.application-confirm-dialog::backdrop {background:#10282080;}
.application-confirm-dialog h2 {font-size:21px;margin:0 0 12px;}
.application-confirm-dialog p {font-size:15px;line-height:1.7;margin:0 0 22px;color:#53665f;}
.application-confirm-actions {display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;}
.application-tag {font-size:12px;border-radius:20px;padding:5px 10px;background:#e2f1e9;color:#235b45;}
.application-tag.latest {background:#eef1f0;color:#61736b;}
@media(max-width:640px) {.applications-heading,.application-card {align-items:stretch;flex-direction:column;gap:16px;}.application-card{padding:20px}.applications-heading h1{font-size:24px}.application-card-actions{flex-direction:column;align-items:stretch}.application-card button,.applications-heading button{width:100%}}
@media(max-width:640px) {.application-stages{grid-template-columns:1fr;}}
.run-handoff-steps {padding-left:24px;margin:12px 0;color:#25523a;line-height:1.7;}
.run-handoff-steps li {padding-left:5px;margin:7px 0;}
.run-handoff-preview {margin:14px 0;max-width:720px;}
.run-handoff-preview p {font-size:12px;margin:0 0 8px;color:#a8d4b2;}
.run-handoff-image {position:relative;width:100%;line-height:0;border:1px solid #487453;border-radius:8px;overflow:hidden;}
.run-handoff-image img {display:block;width:100%;height:auto;}
.run-handoff-pin {position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;border:2px solid white;border-radius:50%;background:#ef5a43;color:white;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;line-height:1;box-shadow:0 2px 8px #0009;pointer-events:none;}
.payment-guidance {margin:16px 0;padding:16px;border:1px solid #487453;border-radius:12px;background:#f4faf6;color:#224635;line-height:1.6;}
.payment-guidance h3 {margin:0 0 6px;font-size:17px;color:#17482e;}
.payment-guidance > p {margin:7px 0;}
.payment-guidance .payment-observed {font-weight:600;}
.payment-method-list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0;}
.payment-method {padding:12px 14px;border:1px solid #c8ddcf;border-radius:10px;background:#fff;}
.payment-method h4 {margin:0 0 4px;font-size:14px;color:#17482e;}
.payment-method p {margin:0 0 6px;}
.payment-method small {display:block;color:#537260;}
.payment-guidance details {margin-top:7px;}
.payment-guidance summary {cursor:pointer;font-weight:600;}
.payment-guidance a {color:#135e45;text-decoration:underline;overflow-wrap:anywhere;}
.payment-guidance .payment-final-note {font-size:12px;color:#385e48;}
.remote-control-panel {margin:14px 0;padding:14px;border-radius:12px;background:#f4faf6;color:#224635;}
.remote-control-panel[hidden] {display:none;}
.remote-control-bar {display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px;}
.remote-control-bar strong {font-size:15px;}
.remote-control-screen {display:block;width:100%;max-width:100%;overflow:hidden;border:2px solid #74a08b;border-radius:10px;background:#f2f5f2;outline:none;cursor:crosshair;}
.remote-control-screen:focus-visible {border-color:#165c40;box-shadow:0 0 0 3px #b8ddc7;}
.remote-control-screen img {display:block;width:100%;height:auto;user-select:none;pointer-events:none;}
.remote-control-status {margin:8px 0;color:#315d48;font-size:12px;}
.payment-help,.payment-sources {border-top:1px solid #d4e4d8;padding-top:8px;}
@media(max-width:700px) {.payment-method-list {grid-template-columns:1fr;}}

.mw-condition-settings { margin-top:16px; }
.mw-condition-settings > summary { cursor:pointer; color:var(--teal); font-weight:500; }
.mw-condition-settings .mw-conditions { margin:12px 0 0; }

/* Honest material risk decisions, shared by drawer and document detail. */
.material-risk-review {margin:16px 0;padding:18px;border:1px solid #dccb9a;border-radius:12px;background:#fffaf0;color:#554a35;line-height:1.65;}
.material-risk-clear {border-color:#b8d6c6;background:#f0f8f3;color:#24553e;}
.material-risk-clear .material-risk-finding {border-color:#cee2d5;}
.material-risk-review h3,.material-risk-review h4 {margin:0 0 8px;font-weight:600;}
.material-risk-review p {margin:6px 0;font-size:13px;}
.material-risk-group {margin:16px 0;}
.material-risk-finding {padding:10px 0;border-top:1px solid #eadfc5;font-size:14px;}
.material-risk-check {display:flex;gap:8px;align-items:flex-start;margin:10px 0;font-size:13px;cursor:pointer;}
.material-risk-check input {flex:none;margin-top:5px;width:16px;height:16px;accent-color:#2b6551;}
.material-risk-review button {margin:10px 0;white-space:normal;}
.material-risk-review button:disabled {opacity:.5;cursor:not-allowed;}
.material-risk-feedback:empty {display:none;}

/* Review uses the same workspace shell as materials, before automation starts. */
.review-page .mw-heading { margin-bottom:24px; }
.review-page .official-edit-notice,
.application-page .official-edit-notice,
.mw-page .official-edit-notice { padding:14px 18px; margin:0 0 20px; border:1px solid #c9ded5; border-radius:12px; background:#eef7f3; color:#244d40; font-size:13px; line-height:1.65; }
.official-edit-notice a { color:#07543c; font-weight:700; margin-left:8px; }
.confirmation-page .confirmation-host { max-width:900px; }
.confirmation-page .declaration-panel { margin:0; }
.mw-bottom { flex-wrap:wrap; }
.mw-bottom > .mw-secondary { margin-left:auto; }
.review-page .console.awaiting-confirmation { background:transparent; }
.review-page .declaration-panel { padding:24px 28px; margin:0; border-color:#dbe3de; border-radius:16px; }
.review-page .confirmation-intro { margin:0 0 20px; font-size:13px; }
.review-page .confirmation-bulk-tip { margin:0 0 20px; padding:12px 14px; border-radius:10px; background:#eef7f3; color:#244d40; font-size:13px; line-height:1.7; }
.confirmation-bulk-tip button { border:0; padding:0; background:none; color:var(--teal); font:inherit; font-weight:600; text-decoration:underline; cursor:pointer; }
.confirmation-bulk-tip button:focus-visible { outline:2px solid var(--teal); outline-offset:3px; }
.review-page .confirmation-group { margin:0 0 24px; }
.review-page .confirmation-group h3 { margin:0 0 6px; font-size:15px; }
.confirmation-group-help { font-size:12px; color:var(--muted); margin:0 0 10px; }
.review-page .confirmation-row { border:0; border-bottom:1px solid #e6ece8; border-radius:0; margin:0; padding:12px 0; position:relative; }
.review-page .confirmation-row legend { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.confirmation-row-layout { display:grid; grid-template-columns:minmax(0,1fr) 112px 84px; align-items:center; gap:18px; }
.confirmation-label { font-size:13px; line-height:1.7; }
.review-page .confirmation-answer select { width:100%; min-height:36px; padding:6px 10px; font-size:13px; }
.review-page .confirmation-check { margin:0; align-items:center; white-space:nowrap; }
.review-page .confirmation-check input { margin:0; }
.review-page .confirmation-backfill { margin:8px 0 0; padding:10px 12px; border-radius:8px; background:#f3f7f5; font-size:12px; line-height:1.6; }
.review-page .confirmation-backfill p { margin:0 0 8px; }
.review-page .confirmation-backfill button { margin:0 8px 6px 0; min-height:34px; }
.confirmation-all-row { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:16px 0; border-top:1px solid #dbe3de; }
.confirmation-all-row label { display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--teal); cursor:pointer; }
.confirmation-all-row input { accent-color:var(--teal); }
.confirmation-all-row .confirmation-progress { margin:0; font-size:12px; }
.confirmation-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top:8px; }
.review-page .confirmation-footnote { font-size:12px; margin:14px 0 0; }
.review-page .confirmation-error:empty { display:none; }
.review-page .run-offline { color:var(--ink); padding:20px; background:#fff; border:1px solid #dbe3de; border-radius:16px; }
.review-page .run-offline [style] { color:var(--ink)!important; }
@media(max-width:600px){
 .review-page .declaration-panel { padding:20px 16px; }
 .review-page .mw-stepper { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .confirmation-row-layout { grid-template-columns:minmax(0,1fr) 84px; gap:10px; }
 .confirmation-label { grid-column:1/-1; }
 .review-page .confirmation-answer { max-width:130px; }
 .confirmation-actions { flex-direction:column; align-items:stretch; }
 .confirmation-actions button { width:100%; }
}

.review-page [data-testid=confirm-declarations]:disabled { background:#e5eae7; border-color:#e5eae7; color:#78877f; cursor:not-allowed; }

.confirmation-material-note { font-size:12px; color:#775415; margin:0 0 20px; padding:10px 12px; background:#fff8ed; border-radius:8px; }
.confirmation-material-note > summary { cursor:pointer; }

/* Once official work starts, give the browser preview the full workspace. */
.review-page.mw-page:has(.console.official-live) { max-width:1312px; padding:20px 20px 36px; }
.review-page:has(.console.official-live) .mw-heading { display:none; }
.review-page .console.official-live { box-shadow:none; border-color:#dbe3de; }
.review-page .console.official-live .console-tabs,
.review-page .console.official-live .canvas-badge { display:none; }
.review-page .console.official-live .screen-canvas {
  width:calc(100% - 24px);
  height:auto;
  aspect-ratio:16 / 9;
  max-height:calc(100dvh - 205px);
  min-height:480px;
  margin:12px;
  border-radius:12px;
}
.review-page .console.official-live .screen-canvas .boot { min-width:0; min-height:0; }
.review-page .console.official-live .status-bar { padding:8px 16px 14px; }
@media(max-width:600px){
  .review-page.mw-page:has(.console.official-live) { padding:16px 8px 24px; }
  .review-page .console.official-live .screen-canvas {
    width:calc(100% - 12px);
    min-height:280px;
    max-height:none;
    margin:6px;
    border-radius:10px;
  }
}

/* Results live in the document flow, outside the clipped browser preview. */
.review-page .console.has-run-result > .run-result-card {
  margin:12px;
  overflow-wrap:anywhere;
}
.run-result-card .run-current-page { margin-top:10px; font-weight:600; }
.runner-note-persistent { padding:16px 20px; border:1px solid #dbe3de; border-radius:12px; background:#fff; color:#203b31; }
.runner-note-persistent p { margin:0; color:#60756b; }
.runner-note-persistent [role=status] { overflow-wrap:anywhere; }
.run-result-card .run-next-action { margin-top:6px; }
.run-result-card .run-execution-details { margin-top:12px; }
.run-result-card .run-execution-details > summary { cursor:pointer; }
.run-result-card .run-execution-details > div {
  max-height:320px;
  overflow:auto;
  background:#111a24;
  padding:10px;
  border-radius:8px;
  margin-top:8px;
  font-size:12px;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
/* The browser remains the main working surface, including after completion. */
.review-page.mw-page:has(.console.official-live) { max-width:1480px; }
.automation-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 20px; border-bottom:1px solid #e4ebe7; background:#fff; }
.automation-toolbar-title { display:grid; gap:3px; color:#203b31; }
.automation-toolbar-title strong { font-size:16px; }
.automation-toolbar-title span { font-size:12px; color:#718078; }
.automation-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.automation-actions .btn { min-height:36px; font-size:13px; padding:7px 12px; white-space:nowrap; }
.official-portal-link { text-decoration:none; background:#edf5f0; color:#075342; border:1px solid #c8ddd2; }
.review-page .console.official-live .screen-canvas { background:#f1f4f2; min-height:440px; max-height:none; }
.review-page #live-screen { background:#f1f4f2 !important; }
.review-page #live-screen-fallback { background:#f1f4f2 !important; color:#42594c !important; }
#live-screen-fallback p { margin:0 0 12px; font-size:13px; }
.preview-empty-icon { font-size:40px; color:#8fa99b; }
.review-page .spinner { border-color:#d0ded6; border-top-color:#17634d; }
.review-page #live-screen-stale { background:#fff7e8 !important; color:#765823 !important; }
.review-page .console.has-run-result > .run-result-card { background:#f6faf7 !important; color:#294d3a !important; border:1px solid #d9e5dc !important; border-radius:12px !important; padding:18px 20px !important; font-size:14px !important; line-height:1.65 !important; }
.run-result-card .run-execution-details > div { background:#edf2ee; color:#3e5145; }
.review-page .run-result-card .btn { background:#fff !important; color:#214e3b !important; border:1px solid #cbdcd1 !important; border-radius:8px !important; }
.review-page .run-result-card [data-act=home] { background:transparent !important; border-color:transparent !important; }
.review-page .live-bring-failure-notice { position:static; width:auto; max-width:none; margin:12px; pointer-events:auto; box-shadow:none; font-size:13px; }
.review-page .runner-note-persistent { margin:16px 0 0 !important; padding:16px 20px; }
.runner-note-persistent .runner-note-body { grid-template-columns:1fr auto; align-items:end; }
.runner-note-persistent .runner-note-body label { grid-column:1; grid-row:1; }
.runner-note-persistent .runner-note-body textarea { min-height:60px !important; height:60px; resize:vertical; }
.runner-note-persistent .runner-note-body [data-act=send-note] { grid-column:2; grid-row:1; margin-bottom:2px; }
.runner-note-persistent .runner-note-body p,.runner-note-persistent .runner-note-body [role=status] { grid-column:1 / -1; }
@media(max-width:600px) {
  .automation-toolbar { align-items:flex-start; flex-direction:column; padding:14px 12px; gap:12px; }
  .automation-actions { width:100%; gap:6px; }
  .automation-actions .btn { font-size:12px; padding:7px 9px; }
  .review-page .console.official-live .screen-canvas { min-height:240px; }
  .review-page .console.has-run-result > .run-result-card { margin:6px; padding:14px !important; }
  .review-page .runner-note-persistent { padding:14px 12px; }
  .runner-note-persistent .runner-note-body { grid-template-columns:1fr; }
  .runner-note-persistent .runner-note-body [data-act=send-note] { grid-column:1; grid-row:auto; }
}
/* Legacy result templates supplied light text for dark panels. */
.review-page .run-result-card [style*="color:"] { color:inherit !important; }
.review-page .run-result-card div[style*="background:"] { background:#edf2ee !important; }

.residence-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.apply-subfield .residence-grid label { min-width:0; }
.apply-subfield input[data-testid=residence-detail] { width:100%; box-sizing:border-box; }
.apply-input-grid input[type=date] { width:100%; min-width:0; box-sizing:border-box; cursor:pointer; }
.application-page .apply-subfield > .residence-custom[hidden] { display:none; }
.application-page .apply-subfield input[data-testid=residence-detail],
.application-page .apply-subfield input[data-testid=residence-custom-city] {
  display:block; width:100%; box-sizing:border-box; min-height:46px; padding:11px 14px;
  border:1px solid #cbd7d0; border-radius:10px; background:#fff; color:#203b31; font:inherit;
}
.application-page .apply-subfield input:focus { outline:2px solid #0b6650; outline-offset:2px; }