/* P4-Web 前端样式 · 无 CDN / 无框架 / 移动优先
   色板：底 #FFF8F0、卡片白、主色 #FF6B35（派工单指定） */

:root{
  --bg:#FFF8F0;
  --card:#FFFFFF;
  --ink:#2B2118;
  --muted:#7A6A5E;
  --line:#F0E2D4;
  --soft:#FFF2E7;
  --soft-2:#FFE8D6;
  --primary:#FF6B35;
  --primary-dark:#E9551F;
  --primary-ink:#8A3210;
  --ok:#2F7D4F; --ok-bg:#EDF8F1; --ok-line:#CBE9D6;
  --bad:#B42318; --bad-bg:#FDECEA; --bad-line:#F5C9C4;
  --warn:#9A5B00; --warn-bg:#FFF7E6; --warn-line:#F1DDB6;
  --info:#205EA8; --info-bg:#EEF4FF; --info-line:#CFE0FA;
  --radius:16px;
  --shadow:0 10px 30px rgba(122,42,11,.08);
  --shadow-sm:0 2px 8px rgba(122,42,11,.06);
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%; text-size-adjust:100%}
body{
  margin:0;
  min-width:0;
  background:var(--bg);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  font-size:15px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img,svg,video{max-width:100%; height:auto}
a{color:var(--primary-ink)}
a:hover{color:var(--primary-dark)}
code,.mono{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
  font-size:.9em;
  overflow-wrap:anywhere;
}
button,input,select,textarea{font:inherit; color:inherit}
:focus-visible{outline:3px solid rgba(255,107,53,.45); outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:8px;top:-48px;z-index:100;background:var(--ink);color:#fff;padding:8px 12px;border-radius:10px;text-decoration:none}
.skip:focus{top:8px}

/* 演示模式横幅：始终可见，避免假数据被当成真实跑数 */
.demo-ribbon{
  position:static; z-index:60;
  background:var(--ink); color:#FFE8D6;
  font-size:12.5px; line-height:1.45; text-align:center;
  padding:6px 12px; letter-spacing:.01em;
  overflow-wrap:anywhere;
}
.demo-ribbon b{color:#fff}

.wrap{width:min(1080px, 100% - 32px); margin-inline:auto}
@media (max-width:420px){ .wrap{width:calc(100% - 24px)} }

/* 顶栏 */
.appbar{
  position:sticky; top:0; z-index:50;
  background:rgba(255,248,240,.94);
  border-bottom:1px solid var(--line);
  backdrop-filter:saturate(1.2) blur(8px);
}
.appbar-inner{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; padding:10px 0}
.brand{display:inline-flex; align-items:center; gap:9px; text-decoration:none; color:var(--ink); min-width:0}
.brand-mark{
  width:34px;height:34px;border-radius:11px;flex:none;
  background:linear-gradient(135deg,#FF9A6B,#FF5A1F);
  color:#fff;display:grid;place-items:center;font-weight:800;font-size:15px;
  box-shadow:0 5px 14px rgba(255,90,31,.28);
}
.brand-text{display:grid; line-height:1.15; min-width:0}
.brand-text strong{font-size:15px; letter-spacing:.01em}
.brand-text small{color:var(--muted); font-size:11px}
.nav{display:flex; align-items:center; gap:2px; flex-wrap:wrap}
.nav a,.nav button{
  appearance:none; border:0; background:transparent; cursor:pointer;
  color:var(--muted); text-decoration:none; font-size:13px; font-weight:600;
  padding:7px 10px; border-radius:999px; min-height:34px;
}
.nav a[aria-current="page"]{background:var(--soft); color:var(--primary-ink)}
.nav a:hover,.nav button:hover{background:var(--soft)}
@media (max-width:520px){
  .brand-text small{display:none}
  .nav a,.nav button{padding:6px 8px; font-size:12.5px}
  .nav [data-user]{display:none}
}

main{padding:18px 0 40px; min-width:0}
.page-head{display:flex; align-items:flex-end; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:2px 0 16px}
.page-head h1{font-size:22px; line-height:1.25; margin:0; letter-spacing:-.01em}
.page-head p{margin:4px 0 0; color:var(--muted); font-size:13px}
.eyebrow{color:var(--primary-ink); font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase}

.card{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:18px; box-shadow:var(--shadow-sm); min-width:0;
}
@media (max-width:420px){ .card{padding:15px; border-radius:14px} }
.card + .card{margin-top:14px}
.card-head{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:12px}
.card-head h2{font-size:16px; margin:0; line-height:1.35}
.card-head .sub{color:var(--muted); font-size:12px}
.stack{display:grid; gap:14px}

/* 按钮 */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-height:42px; padding:9px 15px; border-radius:12px;
  border:1px solid var(--line); background:#fff; color:var(--ink);
  font-size:14px; font-weight:650; text-decoration:none; cursor:pointer;
  min-width:0; transition:background .15s ease, border-color .15s ease, transform .05s ease;
}
.btn:hover{background:#FFFCF8; border-color:#E8D4C0}
.btn:active{transform:translateY(1px)}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.5; cursor:not-allowed; transform:none}
.btn-primary{background:var(--primary); border-color:var(--primary); color:#fff; box-shadow:0 7px 18px rgba(255,107,53,.24)}
.btn-primary:hover{background:var(--primary-dark); border-color:var(--primary-dark); color:#fff}
.btn-ghost{background:transparent}
.btn-block{width:100%}
.btn-sm{min-height:34px; padding:5px 11px; font-size:13px; border-radius:10px}
.btn-row{display:flex; gap:8px; flex-wrap:wrap}

/* 表单 */
.field{display:grid; gap:6px; margin-bottom:14px; min-width:0}
.field > label{font-size:13px; font-weight:650}
.field .hint{margin:0}
.input,select,textarea{
  width:100%; min-height:46px; padding:10px 12px;
  border:1px solid var(--line); border-radius:12px; background:#fff;
  color:var(--ink); min-width:0;
}
.input::placeholder{color:#B5A394}
.input:focus,select:focus,textarea:focus{border-color:var(--primary); outline:none; box-shadow:0 0 0 3px rgba(255,107,53,.16)}
.hint{font-size:12.5px; color:var(--muted); margin:8px 0 0; overflow-wrap:anywhere}
.hint code{background:var(--soft); padding:1px 5px; border-radius:5px}

/* 提示条 */
.notice{
  border:1px solid var(--line); background:#FFFCF8; color:var(--ink);
  border-radius:12px; padding:11px 13px; font-size:13px; line-height:1.55;
  overflow-wrap:anywhere;
}
.notice + .notice{margin-top:10px}
.notice-bad{border-color:var(--bad-line); background:var(--bad-bg); color:#7A1A12}
.notice-warn{border-color:var(--warn-line); background:var(--warn-bg); color:#6E4100}
.notice-ok{border-color:var(--ok-line); background:var(--ok-bg); color:#1D5C39}
.notice-info{border-color:var(--info-line); background:var(--info-bg); color:#1B4C86}
.notice strong{font-weight:700}
.notice .code-line{display:block; margin-top:4px; font-size:12px; color:inherit; opacity:.85}
.notice button{margin-top:8px}

/* 徽标 */
.badge{
  display:inline-flex; align-items:center; gap:6px;
  border:1px solid var(--line); border-radius:999px;
  padding:2px 9px; font-size:12px; font-weight:650; line-height:1.5;
  max-width:100%; overflow-wrap:anywhere;
  background:#FBF7F2; color:var(--muted);
}
.badge::before{content:""; width:6px; height:6px; border-radius:50%; background:currentColor; flex:none; opacity:.85}
.badge-ok{border-color:var(--ok-line); background:var(--ok-bg); color:var(--ok)}
.badge-bad{border-color:var(--bad-line); background:var(--bad-bg); color:var(--bad)}
.badge-warn{border-color:var(--warn-line); background:var(--warn-bg); color:var(--warn)}
.badge-info{border-color:var(--info-line); background:var(--info-bg); color:var(--info)}
.badge-muted{border-color:var(--line); background:#FBF7F2; color:var(--muted)}

/* 登录 */
.login-shell{min-height:calc(100dvh - 120px); display:grid; grid-template-columns:minmax(0,1fr); justify-items:center; align-content:center; padding:24px 0}
.login-card{width:100%; max-width:420px; min-width:0; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:26px; box-shadow:var(--shadow)}
@media (max-width:420px){ .login-card{padding:20px; border-radius:16px} }
.login-brand{display:grid; gap:8px; margin-bottom:20px}
.login-brand .brand-mark{width:46px;height:46px;border-radius:14px;font-size:19px;margin-bottom:2px}
.login-brand h1{font-size:23px; margin:0; letter-spacing:-.01em}
.login-brand p{margin:0; color:var(--muted); font-size:13px; line-height:1.55}
.form-error{margin:0 0 14px}
.login-foot{margin-top:18px; padding-top:14px; border-top:1px dashed var(--line); color:var(--muted); font-size:12px}

/* 上传 */
.dropzone{
  display:block;
  border:2px dashed #E7CDB6; border-radius:16px; background:#FFFCF8;
  padding:26px 16px; text-align:center; cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
}
.dropzone:hover,.dropzone.is-drag{border-color:var(--primary); background:var(--soft)}
.dropzone:focus-within{outline:3px solid rgba(255,107,53,.35); outline-offset:2px}
.dropzone input[type="file"]{position:absolute; width:1px; height:1px; opacity:0; pointer-events:none}
.dropzone .dz-icon{width:44px;height:44px;margin:0 auto 8px;border-radius:14px;background:var(--soft);display:grid;place-items:center;color:var(--primary-ink);font-size:20px;font-weight:800}
.dropzone strong{display:block; font-size:15px}
.dropzone span{display:block; color:var(--muted); font-size:12.5px; margin-top:3px}
.file-chip{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  border:1px solid var(--line); background:#FFFCF8; border-radius:12px;
  padding:9px 11px; margin-top:12px; font-size:13px; min-width:0;
}
.file-chip .name{font-weight:650; overflow-wrap:anywhere; min-width:0}
.file-chip .size{color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums}
.form-grid{display:grid; gap:12px; grid-template-columns:1fr}
@media (min-width:640px){ .form-grid{grid-template-columns:1.2fr .8fr; align-items:end} }
.form-actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px}
.two-col{display:grid; gap:14px; min-width:0}
@media (min-width:900px){ .two-col{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)} .two-col > .card + .card{margin-top:0} }
.mt-12{margin-top:12px}
.mt-14{margin-top:14px}
.mb-0{margin-bottom:0}
.align-center{align-self:center}

/* 任务列表 */
.job-list{display:grid; gap:10px}
.job-card{
  display:grid; gap:8px; padding:13px 14px; border:1px solid var(--line);
  border-radius:14px; background:#FFFCF8; text-decoration:none; color:inherit;
  transition:border-color .15s ease, background .15s ease;
}
.job-card:hover{border-color:#E3C6AC; background:#FFF7EE}
.job-card .row{display:flex; align-items:center; gap:8px; flex-wrap:wrap; min-width:0}
.job-card .fname{font-weight:650; font-size:14px; overflow-wrap:anywhere; min-width:0}
.job-card .meta{color:var(--muted); font-size:12px; display:flex; gap:10px; flex-wrap:wrap}
.job-card .meta code{background:var(--soft); padding:1px 5px; border-radius:5px}
.empty{
  border:1px dashed #E7CDB6; border-radius:14px; padding:26px 16px;
  text-align:center; color:var(--muted); background:#FFFCF8;
}
.empty strong{display:block; color:var(--ink); font-size:14px; margin-bottom:3px}
.empty span{font-size:12.5px}

/* 任务详情 */
.meta-chips{display:flex; gap:6px; flex-wrap:wrap; margin:2px 0 0}
.chip{font-size:12px; border:1px solid var(--line); border-radius:999px; padding:2px 9px; background:#FFFCF8; color:var(--muted); max-width:100%; overflow-wrap:anywhere}
.chip code{color:var(--ink); background:transparent; padding:0}
.progress-head{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:8px}
.progress-head strong{font-size:14px}
.progress-head span{color:var(--muted); font-size:12px}
.bar{height:10px; border-radius:999px; background:var(--soft-2); overflow:hidden}
.bar.bar-steps{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:4px; height:10px; background:transparent; overflow:visible}
.bar-steps .seg{display:block; height:10px; border-radius:999px; background:var(--soft-2)}
.bar-steps .seg.is-done{background:linear-gradient(90deg,#FF9A6B,var(--primary))}
.bar-steps .seg.is-running{background:#FFB38F; animation:stepPulse 1.2s ease-in-out infinite}
.bar-steps .seg.is-failed{background:var(--bad)}
.bar-steps .seg.is-partial{background:var(--warn)}
.bar-steps .seg.is-skipped{background:#EADFD5}
.bar.is-failed .seg.is-pending{background:#F6E3DE}
@keyframes stepPulse{0%,100%{opacity:.55} 50%{opacity:1}}
.steps{display:grid; gap:8px; margin:14px 0 0; padding:0; list-style:none}
.step{display:grid; grid-template-columns:34px 1fr auto; gap:10px; align-items:center; border:1px solid var(--line); border-radius:12px; padding:9px 11px; background:#fff; min-width:0}
.step .idx{width:30px;height:30px;border-radius:9px;background:var(--soft);color:var(--primary-ink);display:grid;place-items:center;font-size:12px;font-weight:750}
.step .body{min-width:0}
.step .name{font-size:13.5px; font-weight:650; display:flex; align-items:center; gap:7px; flex-wrap:wrap}
.step .desc{color:var(--muted); font-size:11.5px; overflow-wrap:anywhere}
.step .right{text-align:right; display:grid; gap:3px; justify-items:end}
.step .dur{font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums}
.step.is-running{border-color:#FFD2BD; background:#FFF8F2}
.step.is-done .idx{background:var(--ok-bg); color:var(--ok)}
.step.is-failed{border-color:var(--bad-line); background:#FFF9F8}
.step.is-failed .idx{background:var(--bad-bg); color:var(--bad)}
.step.is-partial{border-color:var(--warn-line); background:var(--warn-bg)}
.step.is-partial .idx{background:var(--warn-line); color:var(--primary-ink)}
.step.is-skipped{opacity:.7}

/* 结果页 · 七数 */
.kpi-section .card-head{align-items:flex-start}
.kpis{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px}
@media (min-width:720px){ .kpis{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (min-width:1000px){ .kpis{grid-template-columns:repeat(7,minmax(0,1fr))} }
@media (max-width:719px){ .kpis .kpi:last-child{grid-column:1 / -1} }
.kpi{border:1px solid var(--line); border-radius:12px; padding:10px 11px; background:linear-gradient(#fff,#FFFCF8); min-width:0}
.kpi .k-label{display:block; color:var(--muted); font-size:11.5px; line-height:1.35; min-height:3.1em; overflow-wrap:anywhere}
.kpi .k-value{display:block; font-size:clamp(19px,5.4vw,24px); font-weight:750; line-height:1.2; letter-spacing:-.01em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere}
.kpi .k-note{display:block; color:var(--muted); font-size:10.5px; line-height:1.35; margin-top:3px; min-height:2.7em; overflow-wrap:anywhere}
.kpi.is-warn{border-color:var(--warn-line); background:#FFFBF2}
.kpi.is-missing{border-style:dashed}

/* 结果页 · 逐份 */
.items{display:grid; gap:10px}
.item{border:1px solid var(--line); border-radius:14px; padding:12px 13px; background:#fff; min-width:0}
.item-top{display:flex; align-items:center; gap:8px; flex-wrap:wrap; min-width:0}
.item-no{width:26px;height:26px;border-radius:8px;background:var(--soft);color:var(--primary-ink);display:grid;place-items:center;font-size:11.5px;font-weight:750;flex:none}
.item .noteid{font-size:12px; color:var(--ink); background:#FBF7F2; padding:2px 6px; border-radius:6px; max-width:100%}
.item .badge{margin-left:auto}
@media (max-width:420px){ .item .badge{margin-left:0} }
.item-meta{display:flex; gap:8px 12px; flex-wrap:wrap; color:var(--muted); font-size:12px; margin-top:7px; min-width:0}
.item-note{margin:8px 0 0; color:var(--muted); font-size:12px; line-height:1.5; overflow-wrap:anywhere}
.item-actions{display:flex; gap:7px; flex-wrap:wrap; margin-top:10px}
.thumb{display:block; width:100%; max-height:320px; object-fit:contain; background:#FBF7F2; border:1px solid var(--line); border-radius:10px; margin-top:10px}
.thumb-placeholder{display:grid; place-items:center; height:92px; border:1px dashed #E7CDB6; border-radius:10px; background:#FFFCF8; color:var(--muted); font-size:12px; margin-top:10px}

/* 页脚 / 边界 */
.foot{border-top:1px solid var(--line); padding:16px 0 26px; color:var(--muted); font-size:12px}
.foot .wrap{display:flex; gap:8px 16px; flex-wrap:wrap; justify-content:space-between}
.foot .foot-legal{margin-top:6px; font-size:12px; color:#9A8A7E}
.foot .foot-legal a{color:#9A8A7E; text-decoration:none}
.foot .foot-legal a:hover,.foot .foot-legal a:focus-visible{color:#FF6B35; text-decoration:underline}
.boundary{background:#FFFCF8; border-color:var(--line)}
.boundary ul{margin:0; padding-left:18px}
.boundary li{margin:4px 0; font-size:12.5px; color:var(--muted); overflow-wrap:anywhere}
.boundary strong{color:var(--ink)}

/* toast */
.toast{
  position:fixed; left:50%; bottom:calc(18px + env(safe-area-inset-bottom));
  transform:translateX(-50%) translateY(12px);
  background:var(--ink); color:#FFF3E8; font-size:13px; line-height:1.45;
  border-radius:999px; padding:9px 15px; box-shadow:var(--shadow);
  opacity:0; pointer-events:none; transition:opacity .18s ease, transform .18s ease;
  max-width:calc(100vw - 32px); text-align:center; z-index:90;
}
.toast.is-on{opacity:1; transform:translateX(-50%) translateY(0)}
.toast.is-bad{background:#7A1A12; color:#FFE9E6}

/* 载入占位 */
.skeleton{position:relative; overflow:hidden; background:#FBF3EA; border-radius:10px; min-height:14px; color:transparent!important}
.sk-74{height:74px}
.sk-96{height:96px}
.skeleton::after{content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent); transform:translateX(-100%); animation:shimmer 1.3s infinite}
@keyframes shimmer{to{transform:translateX(100%)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; scroll-behavior:auto!important}
}

/* ---------- D3：引用 / 跳过 / 受阻 与产物清单 ---------- */
.step.is-imported{border-color:var(--warn-line); background:#FFFCF4}
.step.is-imported .idx{background:var(--warn-bg); color:var(--warn)}
.step.is-blocked{border-color:var(--warn-line); background:#FFFCF4}
.step.is-blocked .idx{background:var(--warn-bg); color:var(--warn)}
.step.is-skipped .idx{background:#F2ECE4; color:var(--muted)}
.bar .seg.is-imported,.bar .seg.is-blocked{background:var(--warn)}
.bar .seg.is-skipped{background:#CBBFB2}
.bar .seg.is-imported,.bar .seg.is-blocked,.bar .seg.is-skipped{opacity:.85}
.code-hint,.reason-text{display:block; margin-top:3px; color:var(--muted); overflow-wrap:anywhere}
.code-hint{color:#6E4100}
.arts{margin-top:7px; font-size:12px}
.arts summary{cursor:pointer; color:var(--muted)}
.arts summary:hover,.arts summary:focus-visible{color:var(--ink)}
.arts ul{margin:6px 0 0; padding-left:0; list-style:none}
.arts li{display:flex; flex-direction:column; gap:2px; padding:5px 0; border-top:1px dashed var(--line)}
.art-path{font-size:11.5px; overflow-wrap:anywhere; word-break:break-all; color:var(--ink)}
.art-meta{font-size:11.5px; color:var(--muted)}
.artifact-list{margin:0; padding:0; list-style:none}
.artifact-list li{display:flex; flex-direction:column; gap:3px; padding:7px 0; border-top:1px dashed var(--line)}
.artifact-list li:first-child{border-top:0}
.json{max-height:340px; overflow:auto; background:#FBF7F2; border:1px solid var(--line); border-radius:10px; padding:10px; font-size:11.5px; line-height:1.5; white-space:pre-wrap; word-break:break-all}

/* ---------- D3：批次台 ---------- */
.source-line{display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12px; color:var(--muted); margin:-4px 0 12px; overflow-wrap:anywhere}
.batch-list{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:10px}
.batch-card{border:1px solid var(--line); border-radius:12px; background:#FFFDFA; padding:10px 12px}
.batch-top{display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap}
.batch-top .noteid{font-size:11.5px; word-break:break-all}
.batch-card .item-meta{margin-top:6px; display:flex; flex-wrap:wrap; gap:4px 10px; font-size:12px; color:var(--muted)}
.batch-card .item-meta code{font-size:11.5px}
.claim-on code{color:var(--ok); border-color:var(--ok-line); background:var(--ok-bg)}
.batch-card .item-actions{margin-top:8px}
.subhead{font-size:13px; margin:16px 0 6px}
.kv{display:grid; grid-template-columns:minmax(90px,180px) 1fr; gap:4px 12px; margin:0; font-size:12.5px}
.kv dt{color:var(--muted)}
.kv dd{margin:0; overflow-wrap:anywhere; word-break:break-all}
.reasons{margin:0; padding-left:18px; font-size:12.5px; color:var(--muted); overflow-wrap:anywhere}
.reasons li{margin:3px 0}

@media (max-width:520px){
  .batch-list{grid-template-columns:1fr}
  .kv{grid-template-columns:1fr}
  .kv dt{margin-top:5px}
  .kv dd{padding-bottom:4px; border-bottom:1px dashed var(--line)}
}

/* ---------- 登录页 v4（追加段；上方 1–371 行逐字节不动） ----------
   结构：split pass-gate — 左侧深可可品牌板 + 右侧暖白表单卡
   配色：纸底 #FFF8F0 / 主色 #FF6B35 / 内联 SVG 装饰，零外链零脚本外引 */
.lgx{
  display:grid; align-items:center;
  min-height:calc(100dvh - 128px);
  padding-block:clamp(20px,3.6vw,52px);
  overflow-x:clip;
}
.lgx-shell{
  position:relative;
  display:grid; grid-template-columns:minmax(0,1fr);
  border-radius:28px;
  background:var(--card);
  border:1px solid #EDD9C6;
  box-shadow:
    0 1px 0 rgba(255,255,255,.9) inset,
    0 40px 90px -34px rgba(74,34,12,.34),
    0 4px 14px rgba(74,34,12,.055);
  overflow:hidden;
  isolation:isolate;
}

/* ---- 左侧品牌板 ---- */
.lgx-side{
  position:relative; overflow:hidden;
  background:
    radial-gradient(120% 90% at 8% 0%, #4A2E1B 0%, rgba(74,46,27,0) 62%),
    linear-gradient(163deg,#241710 0%,#332116 55%,#472C1A 100%);
  color:#FFF3E6;
  padding:clamp(26px,3.4vw,42px) clamp(22px,3vw,40px);
  display:grid; align-items:center;
}
.lgx-art{position:absolute; inset:0; pointer-events:none}
.lgx-art-svg{display:block; width:100%; height:100%}
.lgx-side-inner{position:relative; display:grid; gap:18px; min-width:0}

.lgx-brand{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.lgx-logo{
  width:38px; height:38px; border-radius:11px; flex:none;
  display:grid; place-items:center;
  background:linear-gradient(142deg,#FFA169,#FF6B35 72%);
  box-shadow:0 10px 22px rgba(255,92,26,.38), 0 1px 0 rgba(255,255,255,.4) inset;
}
.lgx-wordmark{font-size:15.5px; font-weight:750; letter-spacing:.012em; color:#FFF6EC}
.lgx-tag{
  font-size:11.5px; font-weight:650; letter-spacing:.05em;
  padding:3px 9px; border-radius:999px;
  color:#FFD9BE; border:1px solid rgba(255,169,105,.4);
  background:rgba(255,140,66,.14);
}

.lgx-title{
  margin:2px 0 0; font-size:clamp(25px,2.5vw,34px); line-height:1.22;
  font-weight:800; letter-spacing:-.024em; color:#FFF6EC;
  text-wrap:balance;
}
.lgx-sub{margin:0; max-width:31em; font-size:13.5px; line-height:1.7; color:rgba(255,243,230,.84); text-wrap:pretty}

/* ---- 三步时间轴 ---- */
.lgx-flow{list-style:none; margin:4px 0 0; padding:0; display:grid; gap:0; max-width:31em}
.lgx-flow li{
  position:relative;
  display:grid; grid-template-columns:26px minmax(0,1fr); gap:13px;
  padding:0 0 16px;
}
.lgx-flow li:last-child{padding-bottom:0}
.lgx-flow li::before{
  content:""; position:absolute; left:10px; top:18px; bottom:2px; width:1px;
  background:linear-gradient(180deg, rgba(255,178,122,.45), rgba(255,178,122,.06));
}
.lgx-flow li:last-child::before{display:none}
.lgx-n{
  position:relative; width:21px; height:21px; border-radius:50%;
  display:grid; place-items:center;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:9.5px; font-weight:700; letter-spacing:.02em;
  color:#FFC79E; background:rgba(255,107,53,.16);
  border:1px solid rgba(255,169,105,.38);
  margin-top:1px;
}
.lgx-flow-txt{display:block; min-width:0}
.lgx-flow-txt b{display:block; font-size:13.5px; font-weight:700; color:#FFF3E6; letter-spacing:.005em}
.lgx-flow-txt em{
  display:block; margin-top:3px; font-style:normal;
  font-size:12.5px; line-height:1.58; color:rgba(255,243,230,.6);
}
.lgx-side-foot{
  margin:8px 0 0; padding-top:16px;
  border-top:1px solid rgba(255,196,150,.15);
  font-size:11.5px; letter-spacing:.02em; color:rgba(255,243,230,.62);
}

/* ---- 右侧表单区 ---- */
.lgx-main{
  position:relative; display:grid; align-items:center;
  background:linear-gradient(190deg,#FFFFFF 0%,#FFFCF8 100%);
}
.lgx-main::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(58% 44% at 100% 0%, rgba(255,140,66,.075), rgba(255,140,66,0) 70%);
}
.lgx-main-inner{position:relative; padding:clamp(26px,3.2vw,44px) clamp(22px,3vw,48px)}

.lgx-eyebrow{
  display:flex; align-items:center; gap:7px;
  margin:0 0 9px; font-size:11px; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:#B58B6C;
}
.lgx-dot{
  width:5px; height:5px; border-radius:50%; flex:none;
  background:var(--primary); box-shadow:0 0 0 3px rgba(255,107,53,.16);
}
.lgx-main-inner h2{
  margin:0; font-size:clamp(23px,2.1vw,29px); line-height:1.2;
  font-weight:800; letter-spacing:-.026em; color:var(--ink);
}
.lgx-hintline{margin:7px 0 0; font-size:13px; color:var(--muted)}
.lgx-main .form-error, .lgx-main .notice{margin:16px 0 0}

/* 登录页错误态：随暖色主色走，不用全局 .notice-bad 的玫红（只作用于 .lgx-main）
   对比度实测 7.3:1（#8A3210 on #FFEFE1），role="alert" 与理由码结构不变 */
.lgx-main .notice-bad{
  border-color:#FFC9A6;
  background:linear-gradient(180deg,#FFF6EC 0%,#FFEFE1 100%);
  color:#8A3210;
  box-shadow:0 1px 0 rgba(255,255,255,.65) inset;
}
.lgx-main .notice-bad strong{color:#7E2C0C}
.lgx-main .notice-bad .code-line{opacity:1; color:#A05327}
.lgx-main .notice-bad code{
  background:rgba(255,107,53,.13); border-radius:5px; padding:0 4px;
  color:#7E2C0C;
}
.lgx-main noscript .notice{margin:16px 0 0}

.lgx-form{display:grid; gap:15px; margin-top:24px}
.lgx-form .field{margin-bottom:0; gap:7px}
.lgx-form .field > label{font-size:12.5px; font-weight:700; letter-spacing:.015em; color:#4A392C}
.lgx-form .hint{margin:0; font-size:11.5px; line-height:1.5; color:#9C8878}

.lgx-field{position:relative; display:block; min-width:0}
.lgx-ico{
  position:absolute; left:15px; top:50%; transform:translateY(-50%);
  color:#B29C89; pointer-events:none;
  transition:color .16s ease-out;
}
.lgx-field .input{
  height:52px; min-height:52px; width:100%;
  padding:0 46px 0 42px;
  border:1px solid #E6D3C1; border-radius:13px; background:#FFFCF9;
  font-size:15px; color:var(--ink);
  box-shadow:0 1px 2px rgba(74,34,12,.04) inset;
  transition:border-color .16s ease-out, box-shadow .16s ease-out, background-color .16s ease-out;
}
.lgx-field .input::placeholder{color:#B6A392}
.lgx-field .input:hover{border-color:#D6B99F}
.lgx-field .input:focus{
  background:#fff; border-color:var(--primary); outline:none;
  box-shadow:0 0 0 3.5px rgba(255,107,53,.18), 0 1px 2px rgba(74,34,12,.05) inset;
}
.lgx-field:focus-within .lgx-ico{color:var(--primary)}

/* 口令显示开关（内联脚本驱动；无脚本时隐藏） */
.lgx-eye{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  width:34px; height:34px; display:none; place-items:center;
  border:0; border-radius:10px; background:transparent; color:#A28C79;
  cursor:pointer;
  transition:background-color .14s ease-out, color .14s ease-out;
}
.js-on .lgx-eye{display:grid}
.lgx-eye:hover{background:#FFF1E6; color:#8A5228}
.lgx-eye:active{background:#FFE4D2}
.lgx-eye[aria-pressed="true"]{color:var(--primary); background:#FFF1E6}
.lgx-eye:focus-visible{outline:2px solid var(--primary); outline-offset:1px}

.lgx-submit{
  margin-top:8px; min-height:52px; border-radius:13px;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-size:15px; font-weight:750; letter-spacing:.02em;
  background:linear-gradient(135deg,#FF8C42 0%,#FF5F26 100%);
  border:0; color:#fff;
  box-shadow:0 14px 28px -10px rgba(255,95,38,.62), 0 1px 0 rgba(255,255,255,.34) inset;
  transition:transform .12s ease-out, box-shadow .16s ease-out, filter .16s ease-out;
}
.lgx-submit:hover{filter:brightness(1.045); box-shadow:0 18px 34px -12px rgba(255,95,38,.7), 0 1px 0 rgba(255,255,255,.34) inset}
.lgx-submit:active{transform:translateY(1px); box-shadow:0 8px 18px -10px rgba(255,95,38,.6)}
.lgx-submit:focus-visible{outline:2px solid #C24A15; outline-offset:3px}
.lgx-submit:disabled{filter:saturate(.5) brightness(.95); cursor:not-allowed; transform:none}
.lgx-submit svg{transition:transform .16s ease-out}
.lgx-submit:hover svg{transform:translateX(2px)}

.lgx-legal{
  margin:24px 0 0; padding-top:16px; border-top:1px solid #F3E5D8;
  font-size:11.5px; line-height:1.64; color:#9C8878; overflow-wrap:anywhere;
}

/* ---- 断点 ---- */
@media (min-width:940px){
  .lgx-shell{grid-template-columns:minmax(342px,.94fr) minmax(420px,1.06fr)}
  .lgx-main-inner{padding:clamp(38px,3.6vw,56px) clamp(36px,4vw,60px)}
  /* 双栏时右侧与左侧同高对齐，去掉右卡圆角接缝 */
  .lgx-side{border-radius:0}
  /* 深板向浅卡的柔性过渡，避免生硬直边 */
  .lgx-side::after{
    content:""; position:absolute; inset-block:0; right:-1px; width:64px;
    pointer-events:none;
    background:linear-gradient(90deg, rgba(40,24,14,0) 0%, rgba(40,24,14,.18) 58%, rgba(40,24,14,0) 100%);
    mix-blend-mode:multiply; opacity:.55;
  }
}
@media (max-width:939px){
  .lgx{min-height:0; padding-block:clamp(14px,3vw,26px)}
  .lgx-shell{border-radius:20px}
  .lgx-side{padding:24px clamp(18px,4vw,28px) 22px; align-items:start}
  .lgx-side-inner{gap:12px}
  .lgx-title{font-size:clamp(21px,5.2vw,27px)}
  .lgx-title br{display:none}
  .lgx-sub{font-size:12.5px; line-height:1.62}
  .lgx-flow{display:none}
  .lgx-side-foot{display:none}
  .lgx-main-inner{padding:clamp(22px,4.4vw,30px) clamp(18px,4.4vw,28px) clamp(24px,4.6vw,32px)}
  .lgx-form{margin-top:20px}
  .lgx-art-svg{opacity:.85}
}
@media (max-width:420px){
  .lgx-shell{border-radius:16px}
  .lgx-logo{width:34px; height:34px; border-radius:10px}
  .lgx-wordmark{font-size:14.5px}
  .lgx-title{font-size:20px}
  .lgx-field .input{height:50px; min-height:50px; font-size:14.5px}
  .lgx-submit{min-height:50px}
  .lgx-legal{font-size:11px}
}

@media (prefers-reduced-motion:reduce){
  .lgx-ico, .lgx-field .input, .lgx-eye, .lgx-submit, .lgx-submit svg{transition:none}
  .lgx-submit:hover svg{transform:none}
}

/* 高对比度/强制色模式兜底：深板不吞浅字 */
@media (forced-colors:active){
  .lgx-side{background:#1F1A16}
  .lgx-art{display:none}
}

/* ==========================================================================
   D9-R1 · 内页 v6（追加覆盖段；上方 1–371 行逐字节不动）
   设计令牌与登录页 v4/v5 同源：可可品牌面 / 暖白卡 / 主橙 / 深橙字 / 眉标棕
   只作用于登录之后的页面，登录页 .lgx-* 不受影响。
   ========================================================================== */

body:not([data-page="login"]){
  --ix-cocoa-1:#241710;
  --ix-cocoa-2:#332116;
  --ix-cocoa-3:#472C1A;
  --ix-cream:#FFF3E6;
  --ix-card-a:#FFFFFF;
  --ix-card-b:#FFFCF8;
  --ix-line:#EDD9C6;
  --ix-line-soft:#F3E5D8;
  --ix-primary:#FF6B35;
  --ix-primary-light:#FFA169;
  --ix-deep:#8A3210;
  --ix-deep-2:#7E2C0C;
  --ix-secondary:#A05327;
  --ix-eyebrow:#B58B6C;
  --ix-label:#4A392C;
  --ix-muted:#7A6A5E;
  --ix-muted-2:#87705E;
  --ix-shadow:0 22px 44px -30px rgba(74,34,12,.38), 0 3px 10px rgba(74,34,12,.05);
  --ix-shadow-hover:0 24px 44px -24px rgba(74,34,12,.34), 0 4px 12px rgba(74,34,12,.06);
  background-color:#FFF8F0;
  background-image:
    radial-gradient(80% 380px at 50% -120px, rgba(255,154,91,.16), rgba(255,154,91,0) 72%),
    linear-gradient(180deg,#FFF9F3 0%,#FFF6ED 320px,#FFF8F0 100%);
  background-repeat:no-repeat;
}

/* ---- 顶栏：与登录页可可品牌面同一套语言 ---- */
body:not([data-page="login"]) .appbar{
  background:
    radial-gradient(120% 160% at 6% 0%, rgba(74,46,27,.9) 0%, rgba(74,46,27,0) 62%),
    linear-gradient(163deg,#241710 0%,#332116 58%,#3D2718 100%);
  border-bottom:1px solid rgba(255,196,150,.16);
  box-shadow:0 10px 28px -22px rgba(20,12,8,.9);
  backdrop-filter:none;
}
body:not([data-page="login"]) .appbar-inner{padding:11px 0}
body:not([data-page="login"]) .brand{color:var(--ix-cream)}
body:not([data-page="login"]) .brand-mark{
  background:linear-gradient(142deg,#FFA169,#FF6B35 72%);
  box-shadow:0 8px 18px rgba(255,92,26,.34), 0 1px 0 rgba(255,255,255,.35) inset;
}
body:not([data-page="login"]) .brand-text strong{color:#FFF6EC; font-weight:750; letter-spacing:.012em}
body:not([data-page="login"]) .brand-text small{color:rgba(255,243,230,.62)}
body:not([data-page="login"]) .nav a,
body:not([data-page="login"]) .nav button{
  color:rgba(255,243,230,.76); border-radius:999px;
  transition:background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
body:not([data-page="login"]) .nav a:hover,
body:not([data-page="login"]) .nav button:hover{
  background:rgba(255,180,130,.13); color:#FFF6EC;
}
body:not([data-page="login"]) .nav a[aria-current="page"]{
  background:rgba(255,140,66,.18); color:#FFD9BE;
  box-shadow:inset 0 0 0 1px rgba(255,169,105,.28);
}
body:not([data-page="login"]) .appbar .chip{
  background:rgba(255,243,230,.1);
  border-color:rgba(255,196,150,.24);
  color:#FFD9BE;
}
body:not([data-page="login"]) .appbar [data-logout]{
  border:1px solid rgba(255,196,150,.28);
  background:rgba(255,255,255,.045);
  color:#FFF3E6;
}
body:not([data-page="login"]) .appbar [data-logout]:hover{
  background:rgba(255,140,66,.17);
  border-color:rgba(255,169,105,.48);
  color:#FFF6EC;
}
body:not([data-page="login"]) .appbar [data-logout]:disabled{opacity:.55}

/* ---- 页头 ---- */
body:not([data-page="login"]) .ix-page{padding-top:20px; padding-bottom:44px}
body:not([data-page="login"]) .page-head{
  align-items:flex-end; gap:16px; flex-wrap:wrap;
  margin:0 0 20px; padding-top:2px;
}
body:not([data-page="login"]) .page-head h1{
  margin:4px 0 0; font-size:clamp(24px,3vw,33px); line-height:1.16;
  font-weight:800; letter-spacing:-.022em; color:#2B2118; text-wrap:balance;
}
body:not([data-page="login"]) .page-head p{
  margin:7px 0 0; max-width:62ch; color:var(--ix-muted);
  font-size:13.5px; line-height:1.66; text-wrap:pretty;
}
body:not([data-page="login"]) .eyebrow{
  display:flex; align-items:center; gap:8px;
  color:var(--ix-eyebrow); font-size:11px; font-weight:750;
  letter-spacing:.14em; text-transform:uppercase;
}
body:not([data-page="login"]) .eyebrow::before{
  content:""; width:6px; height:6px; border-radius:50%; flex:none;
  background:var(--ix-primary); box-shadow:0 0 0 3px rgba(255,107,53,.15);
}
.ix-head-badge{
  display:inline-flex; align-items:center; gap:8px; flex:none;
  border:1px solid var(--ix-line); border-radius:999px;
  background:linear-gradient(180deg,#fff,#FFFCF8);
  padding:7px 13px; color:var(--ix-secondary);
  font-size:11.5px; font-weight:700; letter-spacing:.02em;
  box-shadow:0 6px 16px -14px rgba(74,34,12,.6);
}
.ix-head-badge .ix-live{
  width:7px; height:7px; border-radius:50%; flex:none;
  background:var(--ix-primary); box-shadow:0 0 0 3px rgba(255,107,53,.16);
}

/* ---- 布局 ---- */
.ix-grid{display:grid; gap:18px; min-width:0}
@media (min-width:900px){
  .ix-grid{grid-template-columns:minmax(0,1.16fr) minmax(330px,.84fr); align-items:start}
  .ix-queue{position:sticky; top:82px}
}
.ix-panel{min-width:0}

/* ---- 卡片 ---- */
body:not([data-page="login"]) .card{
  background:linear-gradient(190deg,var(--ix-card-a) 0%,var(--ix-card-b) 100%);
  border:1px solid var(--ix-line);
  border-radius:18px; padding:20px;
  box-shadow:var(--ix-shadow);
}
body:not([data-page="login"]) .card-head{
  align-items:flex-start; margin-bottom:15px; padding-bottom:12px;
  border-bottom:1px solid var(--ix-line-soft);
}
body:not([data-page="login"]) .card-head h2{
  margin:0; font-size:17px; line-height:1.32; font-weight:750; letter-spacing:-.012em;
}
body:not([data-page="login"]) .card-head .sub{
  color:var(--ix-muted-2); font-size:11.5px; line-height:1.5; text-align:right;
}
@media (max-width:420px){
  body:not([data-page="login"]) .card{padding:16px; border-radius:16px}
  body:not([data-page="login"]) .card-head .sub{text-align:left}
}

/* ---- 按钮 ---- */
body:not([data-page="login"]) .btn{
  min-height:44px; border-radius:12px; border-color:#E8D4C0;
  background:linear-gradient(180deg,#FFFFFF 0%,#FFFCF8 100%);
  font-weight:700; box-shadow:0 1px 2px rgba(74,34,12,.04);
  transition:transform .13s ease, box-shadow .16s ease, border-color .16s ease, background-color .16s ease;
}
body:not([data-page="login"]) .btn:hover{
  transform:translateY(-1px); border-color:#DDBFA6;
  box-shadow:0 10px 20px -16px rgba(74,34,12,.55);
}
body:not([data-page="login"]) .btn:active{transform:translateY(0)}
body:not([data-page="login"]) .btn:disabled,
body:not([data-page="login"]) .btn[aria-disabled="true"]{
  transform:none; filter:saturate(.55) brightness(.98); opacity:.62;
}
body:not([data-page="login"]) .btn-primary{
  border-color:transparent;
  background:linear-gradient(142deg,#FFA169 0%,#FF6B35 72%);
  color:#fff;
  box-shadow:0 14px 26px -12px rgba(255,107,53,.62), 0 1px 0 rgba(255,255,255,.35) inset;
}
body:not([data-page="login"]) .btn-primary:hover{
  border-color:transparent; color:#fff;
  background:linear-gradient(142deg,#FFAC78 0%,#FF5F26 72%);
  box-shadow:0 18px 32px -14px rgba(255,95,38,.68), 0 1px 0 rgba(255,255,255,.35) inset;
}
body:not([data-page="login"]) .btn-sm{min-height:34px; padding:5px 12px; border-radius:10px; font-size:12.5px}

/* 提交中：按钮内转圈（app.js 只改文字，不改结构） */
@keyframes ixspin{to{transform:rotate(360deg)}}
body:not([data-page="login"]) #submit-btn:disabled::before{
  content:""; width:14px; height:14px; flex:none; border-radius:50%;
  border:2px solid rgba(255,255,255,.42); border-top-color:#fff;
  animation:ixspin .8s linear infinite; margin-right:2px;
}

/* ---- 表单控件 ---- */
body:not([data-page="login"]) .field{gap:7px; margin-bottom:0}
body:not([data-page="login"]) .field > label{
  color:var(--ix-label); font-size:12.5px; font-weight:700; letter-spacing:.015em;
}
body:not([data-page="login"]) .input,
body:not([data-page="login"]) select,
body:not([data-page="login"]) textarea{
  min-height:48px; padding:11px 13px; border-radius:12px;
  border:1px solid #E6D3C1; background:#FFFCF9; color:var(--ink);
  box-shadow:0 1px 2px rgba(74,34,12,.035) inset;
  transition:border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
body:not([data-page="login"]) .input:hover,
body:not([data-page="login"]) select:hover,
body:not([data-page="login"]) textarea:hover{border-color:#D6B99F}
body:not([data-page="login"]) .input:focus,
body:not([data-page="login"]) select:focus,
body:not([data-page="login"]) textarea:focus{
  background:#fff; border-color:var(--ix-primary); outline:none;
  box-shadow:0 0 0 3.5px rgba(255,107,53,.16), 0 1px 2px rgba(74,34,12,.04) inset;
}
body:not([data-page="login"]) .input::placeholder,
body:not([data-page="login"]) textarea::placeholder{color:#B6A392}
body:not([data-page="login"]) .hint{
  margin:0; color:var(--ix-muted-2); font-size:11.5px; line-height:1.55;
}
body:not([data-page="login"]) .hint code{background:#FFF2E7; color:var(--ix-deep-2)}

/* ---- 上传区 ---- */
body:not([data-page="login"]) .dropzone{
  position:relative; overflow:hidden;
  border:2px dashed #E7CDB6; border-radius:18px;
  background:
    radial-gradient(80% 120% at 50% 0%, rgba(255,169,105,.10), rgba(255,169,105,0) 68%),
    linear-gradient(180deg,#FFFDFA 0%,#FFFCF8 100%);
  padding:30px 18px 26px; text-align:center;
  transition:border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
body:not([data-page="login"]) .dropzone:hover,
body:not([data-page="login"]) .dropzone.is-drag{
  border-color:#F79A6C;
  box-shadow:0 16px 30px -24px rgba(255,107,53,.55);
  background:
    radial-gradient(80% 120% at 50% 0%, rgba(255,169,105,.17), rgba(255,169,105,0) 70%),
    linear-gradient(180deg,#FFFCF8 0%,#FFF8F1 100%);
}
body:not([data-page="login"]) .dropzone .dz-icon{
  width:52px; height:52px; margin:0 auto 11px; border-radius:16px;
  display:grid; place-items:center; color:#fff;
  background:linear-gradient(142deg,#FFA169 0%,#FF6B35 72%);
  box-shadow:0 12px 24px -12px rgba(255,95,38,.62), 0 1px 0 rgba(255,255,255,.34) inset;
}
body:not([data-page="login"]) .dropzone .dz-icon svg{display:block; width:24px; height:24px}
body:not([data-page="login"]) .dropzone strong{display:block; font-size:15.5px; color:var(--ink); letter-spacing:-.005em}
body:not([data-page="login"]) .dropzone > span:not(.dz-icon){
  margin-top:4px; color:var(--ix-muted-2); font-size:12.5px; line-height:1.55;
}
body:not([data-page="login"]) .file-chip{
  margin-top:12px; padding:10px 12px; border-radius:12px;
  border:1px solid var(--ix-line); background:#fff;
  box-shadow:0 10px 22px -20px rgba(74,34,12,.55);
}
body:not([data-page="login"]) .file-chip .name{font-size:13px}
body:not([data-page="login"]) .file-chip .size{font-size:11.5px; color:var(--ix-muted-2)}

.ix-form{display:grid; gap:14px; min-width:0}
.ix-field-pair{display:grid; gap:14px; min-width:0}
@media (min-width:620px){ .ix-field-pair{grid-template-columns:1.25fr .75fr; align-items:start} }

/* 更多设置：默认收起，保证主 CTA 首屏可见 */
.ix-advanced{
  border:1px dashed #E7CDB6; border-radius:14px;
  background:linear-gradient(180deg,#FFFDFA,#FFFCF8);
  overflow:hidden;
}
.ix-advanced > summary{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  list-style:none; cursor:pointer; padding:12px 14px;
  color:var(--ix-deep-2); font-size:13px; font-weight:700;
}
.ix-advanced > summary::-webkit-details-marker{display:none}
.ix-advanced > summary::before{
  content:""; width:7px; height:7px; border-radius:2px; flex:none;
  background:var(--ix-primary); transform:rotate(45deg); margin-right:2px;
}
.ix-advanced > summary::after{
  content:"展开"; flex:none; margin-left:auto;
  font-size:11px; font-weight:700; letter-spacing:.02em; color:var(--ix-secondary);
  background:rgba(255,107,53,.12); border-radius:999px; padding:2px 9px;
}
.ix-advanced[open] > summary::after{content:"收起"}
.ix-advanced > summary:hover{background:#FFF7EF}
.ix-advanced > summary:focus-visible{outline:3px solid rgba(255,107,53,.35); outline-offset:-3px}
.ix-advanced-body{
  display:grid; gap:14px; padding:14px; border-top:1px dashed #F0E2D4;
  background:rgba(255,252,248,.72);
}

.ix-actions{
  display:flex; align-items:center; gap:12px 14px; flex-wrap:wrap;
  margin-top:2px; padding-top:15px; border-top:1px solid var(--ix-line-soft);
}
.ix-actions #submit-btn{min-width:168px; min-height:52px; font-size:15.5px; letter-spacing:.02em}
.ix-actions .hint{flex:1 1 180px; min-width:0}
@media (max-width:520px){
  .ix-actions{display:grid; gap:8px}
  .ix-actions #submit-btn{width:100%; min-width:0}
}

.ix-points{
  list-style:none; display:flex; flex-wrap:wrap; gap:6px;
  margin:0; padding:0;
}
.ix-points li{
  display:inline-flex; align-items:center; gap:6px;
  border:1px solid var(--ix-line); border-radius:999px;
  background:#FFFCF8; padding:4px 10px;
  color:var(--ix-muted); font-size:11.5px; font-weight:600;
}
.ix-points li::before{
  content:""; width:5px; height:5px; border-radius:50%; flex:none;
  background:#E5A377;
}

/* ---- 队列 / 状态 ---- */
.ix-legend{
  display:flex; align-items:center; gap:6px; flex-wrap:wrap;
  margin:0 0 13px;
}
.ix-legend .badge{font-weight:650; letter-spacing:.01em}
.ix-legend-note{margin-left:auto; color:var(--ix-muted-2); font-size:11px}

body:not([data-page="login"]) .job-list{gap:10px}
body:not([data-page="login"]) .job-card{
  position:relative; padding:13px 14px; border-radius:14px;
  border:1px solid var(--ix-line);
  background:linear-gradient(180deg,#FFFFFF 0%,#FFFCF8 100%);
  box-shadow:0 2px 8px rgba(74,34,12,.04);
  transition:transform .14s ease, box-shadow .16s ease, border-color .16s ease;
}
body:not([data-page="login"]) .job-card:hover{
  transform:translateY(-1.5px); border-color:#EFC3A8;
  box-shadow:0 18px 32px -24px rgba(74,34,12,.55);
}
body:not([data-page="login"]) .job-card .fname{font-size:14px; letter-spacing:-.004em}
body:not([data-page="login"]) .job-card .row .badge{margin-left:auto}
body:not([data-page="login"]) .job-card .meta{color:var(--ix-muted-2); font-size:11.5px}
body:not([data-page="login"]) .job-card .meta code{background:#FFF2E7; color:var(--ix-secondary)}
body:not([data-page="login"]) .job-list > .notice{margin:0}

body:not([data-page="login"]) .badge{
  padding:3px 10px; font-size:11.5px; font-weight:700; line-height:1.55;
  border-radius:999px; gap:6px; background:#FBF7F2;
}
body:not([data-page="login"]) .badge::before{width:6px; height:6px; opacity:1}
body:not([data-page="login"]) .badge-ok{background:#EDF8F1; border-color:#CBE9D6; color:#2F7D4F}
body:not([data-page="login"]) .badge-bad{background:#FDECEA; border-color:#F5C9C4; color:#B42318}
body:not([data-page="login"]) .badge-warn{background:#FFF7E6; border-color:#F1DDB6; color:#9A5B00}
body:not([data-page="login"]) .badge-info{background:#EEF4FF; border-color:#CFE0FA; color:#205EA8}
body:not([data-page="login"]) .badge-muted{background:#F7F2EC; border-color:#EADFD5; color:#7A6A5E}

/* ---- 空态 / 骨架 ---- */
body:not([data-page="login"]) .empty{
  position:relative; border:1px dashed #E7CDB6; border-radius:16px;
  padding:30px 18px 26px; text-align:center; color:var(--ix-muted);
  background:
    radial-gradient(70% 110% at 50% 0%, rgba(255,169,105,.10), rgba(255,169,105,0) 70%),
    #FFFCF8;
}
body:not([data-page="login"]) .empty::before{
  content:""; display:block; width:46px; height:46px; margin:0 auto 10px;
  border-radius:14px; border:1px solid #F2D9C4;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C07A4E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7.5h16v10H4z'/%3E%3Cpath d='M4 11h4l1.6 2h4.8l1.6-2h4'/%3E%3C/svg%3E") center/22px 22px no-repeat,
    linear-gradient(180deg,#FFF8F1,#FFF2E7);
}
body:not([data-page="login"]) .empty strong{display:block; color:var(--ink); font-size:14px; margin-bottom:3px}
body:not([data-page="login"]) .empty span{display:block; font-size:12.5px; line-height:1.6}
body:not([data-page="login"]) .skeleton{
  background:linear-gradient(90deg,#FBF0E4 0%,#FFF7EF 48%,#FBF0E4 100%);
  background-size:200% 100%; border-radius:12px;
}

/* ---- 提示条（内页统一暖色错误态；登录页仍由 .lgx-main 段负责） ---- */
body:not([data-page="login"]) .notice{
  border-radius:13px; padding:12px 14px; font-size:12.5px; line-height:1.6;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
body:not([data-page="login"]) .notice-bad{
  border-color:#FFC9A6;
  background:linear-gradient(180deg,#FFF6EC 0%,#FFEFE1 100%);
  color:#8A3210;
}
body:not([data-page="login"]) .notice-bad strong{color:#7E2C0C}
body:not([data-page="login"]) .notice-bad .code-line{opacity:1; color:#A05327}
body:not([data-page="login"]) .notice-bad code{
  background:rgba(255,107,53,.13); border-radius:5px; padding:0 4px; color:#7E2C0C;
}
body:not([data-page="login"]) .notice-info{
  border-color:#CFE0FA; background:#F4F8FF; color:#1B4C86;
}
body:not([data-page="login"]) .notice-warn{
  border-color:#F1DDB6; background:#FFFBF2; color:#6E4100;
}

/* ---- 口径边界 ---- */
body:not([data-page="login"]) .boundary{
  background:linear-gradient(180deg,#FFFDFA 0%,#FFF8F0 100%);
  border-color:var(--ix-line);
}
body:not([data-page="login"]) .boundary ul{
  list-style:none; margin:0; padding:0; display:grid; gap:8px;
}
body:not([data-page="login"]) .boundary li{
  position:relative; margin:0; padding-left:20px;
  color:var(--ix-muted); font-size:12.5px; line-height:1.68;
}
body:not([data-page="login"]) .boundary li::before{
  content:""; position:absolute; left:5px; top:.68em;
  width:5px; height:5px; border-radius:50%; background:#D9B594;
}
body:not([data-page="login"]) .boundary strong{color:var(--ink); font-weight:700}

/* ---- 批次台 ---- */
body:not([data-page="login"]) .source-line{
  align-items:center; gap:6px 14px; margin:0 0 16px; padding:10px 12px;
  border:1px solid var(--ix-line); border-radius:12px;
  background:linear-gradient(180deg,#fff,#FFFCF8);
  color:var(--ix-muted-2); font-size:11.5px;
  box-shadow:0 2px 8px rgba(74,34,12,.03);
}
body:not([data-page="login"]) .source-line:empty{display:none}
body:not([data-page="login"]) .source-line code{
  background:#FFF2E7; border-radius:5px; padding:1px 5px; color:var(--ix-secondary);
}
body:not([data-page="login"]) .batch-list{
  grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:12px;
}
body:not([data-page="login"]) .batch-card{
  padding:13px 14px; border-radius:15px; border:1px solid var(--ix-line);
  background:linear-gradient(180deg,#FFFFFF 0%,#FFFCF8 100%);
  box-shadow:0 2px 8px rgba(74,34,12,.04);
  transition:transform .14s ease, box-shadow .16s ease, border-color .16s ease;
}
body:not([data-page="login"]) .batch-card:hover{
  transform:translateY(-1.5px); border-color:#EFC3A8;
  box-shadow:0 18px 32px -24px rgba(74,34,12,.5);
}
body:not([data-page="login"]) .batch-card .noteid{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  font-size:11.5px; color:var(--ix-muted); background:#FFF2E7;
  padding:2px 6px; border-radius:6px; letter-spacing:-.01em;
}
body:not([data-page="login"]) .batch-card .badge{margin-left:auto}
body:not([data-page="login"]) .batch-card .item-meta{
  gap:6px 12px; margin-top:7px; font-size:11.5px; color:var(--ix-muted-2);
}
body:not([data-page="login"]) .batch-card .item-meta code{
  background:#FFF7EF; border-radius:4px; padding:0 4px; color:var(--ix-label);
}
body:not([data-page="login"]) .batch-card .item-actions{
  margin-top:10px; padding-top:10px; border-top:1px dashed var(--ix-line-soft);
}
body:not([data-page="login"]) .claim-on code{
  color:#2F7D4F; background:#EDF8F1; border:1px solid #CBE9D6;
  border-radius:5px; padding:1px 6px;
}
body:not([data-page="login"]) .subhead{
  margin:18px 0 7px; font-size:13px; font-weight:750; letter-spacing:-.005em;
}
body:not([data-page="login"]) .kv{gap:5px 14px; font-size:12px}
body:not([data-page="login"]) .kv dt{color:var(--ix-muted-2)}
body:not([data-page="login"]) .kv dd{color:var(--ix-label)}
body:not([data-page="login"]) .reasons{color:var(--ix-muted); font-size:12px}
body:not([data-page="login"]) .json{
  background:linear-gradient(180deg,#241710 0%,#2C1C12 100%);
  border-color:#3D2718; color:#FFE9D6; border-radius:12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
body:not([data-page="login"]) .json code{color:inherit}
body:not([data-page="login"]) .arts summary{color:var(--ix-secondary)}
body:not([data-page="login"]) .arts summary:hover{color:var(--ix-deep-2)}
body:not([data-page="login"]) .arts li{border-top-color:var(--ix-line-soft)}
body:not([data-page="login"]) .art-path{color:var(--ix-deep-2)}

/* ---- 任务详情 / 结果页共享件（供 job.html / result.html 使用） ---- */
body:not([data-page="login"]) .meta-chips{gap:6px}
body:not([data-page="login"]) .chip{
  border-color:var(--ix-line); background:#FFFCF8; color:var(--ix-muted-2);
  padding:3px 9px;
}
body:not([data-page="login"]) .progress-head strong{font-size:14px}
body:not([data-page="login"]) .bar{height:10px; background:#FBE7D8}
body:not([data-page="login"]) .steps{gap:9px; margin-top:16px}
body:not([data-page="login"]) .step{
  border-color:var(--ix-line); border-radius:13px; padding:10px 12px;
  background:linear-gradient(180deg,#fff,#FFFCF8);
  transition:border-color .15s ease, box-shadow .15s ease;
}
body:not([data-page="login"]) .step:hover{
  border-color:#EFC3A8; box-shadow:0 10px 22px -20px rgba(74,34,12,.5);
}
body:not([data-page="login"]) .step .idx{border-radius:10px; background:#FFF2E7; color:var(--ix-deep-2)}
body:not([data-page="login"]) .step.is-running{border-color:#FFD2BD; background:#FFF9F3}
body:not([data-page="login"]) .step.is-done .idx{background:#EDF8F1; color:#2F7D4F}
body:not([data-page="login"]) .step.is-failed{border-color:#F5C9C4; background:#FFF9F7}
body:not([data-page="login"]) .step.is-failed .idx{background:#FDECEA; color:#B42318}
body:not([data-page="login"]) .step.is-partial{border-color:var(--warn-line); background:var(--warn-bg)}
body:not([data-page="login"]) .step.is-partial .idx{background:var(--warn-line); color:var(--primary-ink)}
body:not([data-page="login"]) .item,
body:not([data-page="login"]) .kpi{
  border-color:var(--ix-line); border-radius:14px;
  background:linear-gradient(180deg,#fff,#FFFCF8);
}
body:not([data-page="login"]) .item{box-shadow:0 2px 8px rgba(74,34,12,.035)}
body:not([data-page="login"]) .kpi{padding:11px 12px}
body:not([data-page="login"]) .kpi .k-label{color:var(--ix-muted-2)}
body:not([data-page="login"]) .item-no{background:#FFF2E7; color:var(--ix-deep-2); border-radius:8px}
body:not([data-page="login"]) .thumb-placeholder{border-color:#E7CDB6; background:#FFFCF8}

/* ---- 页脚：与顶栏同色收口 ---- */
body:not([data-page="login"]) .foot{
  margin-top:8px; padding:20px 0 26px; border-top:0;
  background:
    radial-gradient(110% 150% at 6% 0%, rgba(74,46,27,.85) 0%, rgba(74,46,27,0) 60%),
    linear-gradient(163deg,#241710 0%,#332116 58%,#2A1B12 100%);
  color:rgba(255,243,230,.62); font-size:11.5px;
}
body:not([data-page="login"]) .foot .wrap{gap:6px 16px}
body:not([data-page="login"]) .foot .foot-legal{margin-top:4px; color:rgba(255,243,230,.5)}
body:not([data-page="login"]) .foot .foot-legal a{color:rgba(255,243,230,.68)}
body:not([data-page="login"]) .foot .foot-legal a:hover,
body:not([data-page="login"]) .foot .foot-legal a:focus-visible{color:#FFC79E}

/* ---- 小屏收口 ---- */
@media (max-width:640px){
  body:not([data-page="login"]) .appbar-inner{padding:8px 0; gap:6px; flex-wrap:nowrap}
  body:not([data-page="login"]) .brand-mark{width:32px; height:32px; border-radius:10px}
  body:not([data-page="login"]) .brand-text strong{font-size:14px}
  body:not([data-page="login"]) .brand-text small{display:none}
  body:not([data-page="login"]) .nav{gap:0; flex-wrap:nowrap}
  body:not([data-page="login"]) .nav a,
  body:not([data-page="login"]) .nav button{padding:6px 8px; font-size:12px; min-height:32px}
  body:not([data-page="login"]) .nav [data-user]{display:none}
  body:not([data-page="login"]) .ix-page{padding-top:14px}
  body:not([data-page="login"]) .page-head{margin-bottom:15px; gap:10px}
  body:not([data-page="login"]) .page-head h1{font-size:23px}
  body:not([data-page="login"]) .page-head p{font-size:13px}
  .ix-head-badge{padding:5px 10px; font-size:11px}
  body:not([data-page="login"]) .dropzone{padding:24px 14px 22px}
  body:not([data-page="login"]) .dropzone .dz-icon{width:46px; height:46px; border-radius:14px; margin-bottom:9px}
  body:not([data-page="login"]) .card-head{padding-bottom:10px; margin-bottom:13px}
}
@media (max-width:380px){
  body:not([data-page="login"]) .brand-text strong{display:none}
  body:not([data-page="login"]) .nav a,
  body:not([data-page="login"]) .nav button{padding:6px 7px}
}

/* ---- 动效 / 强制色兜底 ---- */
@media (prefers-reduced-motion:reduce){
  body:not([data-page="login"]) .btn,
  body:not([data-page="login"]) .job-card,
  body:not([data-page="login"]) .batch-card,
  body:not([data-page="login"]) .step{transition:none}
  body:not([data-page="login"]) .btn:hover,
  body:not([data-page="login"]) .job-card:hover,
  body:not([data-page="login"]) .batch-card:hover{transform:none}
  body:not([data-page="login"]) #submit-btn:disabled::before{animation:none}
}
@media (forced-colors:active){
  body:not([data-page="login"]) .appbar,
  body:not([data-page="login"]) .foot{background:#1F1A16}
  body:not([data-page="login"]) .dropzone .dz-icon{background:#FF6B35}
  body:not([data-page="login"]) .empty::before{background:#FFF2E7}
}

/* D9-R1 补：小屏已选文件后压缩上传区，保证失败态主 CTA 仍尽量留在首屏 */
@media (max-width:640px){
  body:not([data-page="login"]) .ix-form{gap:12px}
  body:not([data-page="login"]) .ix-form:has(#file-chip:not([hidden])) .dropzone{
    padding:14px; border-style:solid; background:#FFFCF8;
  }
  body:not([data-page="login"]) .ix-form:has(#file-chip:not([hidden])) .dropzone .dz-icon{
    width:36px; height:36px; border-radius:11px; margin-bottom:6px;
  }
  body:not([data-page="login"]) .ix-form:has(#file-chip:not([hidden])) .dropzone .dz-icon svg{width:19px; height:19px}
  body:not([data-page="login"]) .ix-form:has(#file-chip:not([hidden])) .dropzone strong{font-size:14px}
  body:not([data-page="login"]) .ix-form:has(#file-chip:not([hidden])) .dropzone > span:not(.dz-icon){display:none}
  body:not([data-page="login"]) .ix-form:has(#file-chip:not([hidden])) .ix-points{display:none}
}

/* 锚点/详情滚动时给吸顶栏留出高度，避免标题被遮住 */
body:not([data-page="login"]) #main,
body:not([data-page="login"]) #jobs,
body:not([data-page="login"]) #batch-detail{scroll-margin-top:78px}

/* 320–380px：批次卡改为单列，避免 minmax(310px) 在最窄屏溢出 */
@media (max-width:380px){
  body:not([data-page="login"]) .batch-list{grid-template-columns:1fr}
}

/* D9-R1 修复（蔻德）：结果页「换字」KPI 在 7 列/最窄屏被拆成两行（0 / 3645 + 字）。
   原因：.k-value 的 overflow-wrap:anywhere 允许在空格与斜杠处断行，撞上 clamp() 字号。
   处置：整格不换行（数据不补零、不截断），字号上限 24→22px；万一未来数值更长，
   在格内横向可滚动，绝不让页面产生横向溢出。 */
body:not([data-page="login"]) .kpi .k-value{
  font-size:clamp(17px,4.6vw,22px);
  letter-spacing:-.015em;
  white-space:nowrap;
  overflow-wrap:normal;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  padding-bottom:1px;
}
body:not([data-page="login"]) .kpi .k-value::-webkit-scrollbar{display:none}

/* D9-R7 追加（蔻德）：成品图保存条 —— 格式选择 + 逐张保存 + 全部保存。
   打包 zip 下线，改为浏览器逐张下载；转码在前端 canvas 完成，后端不参与。
   仅作用于登录后页面；新增行零 hex，颜色一律走既有令牌。 */
body:not([data-page="login"]) .save-all:not(button):not(a){
  display:flex; align-items:center; gap:8px 10px;
  flex-wrap:wrap; min-width:0; max-width:100%;
}
body:not([data-page="login"]) #save-all-btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:144px; min-height:44px;
}
body:not([data-page="login"]) .save-fmt{
  display:inline-flex; align-items:center; gap:7px;
  flex-wrap:nowrap; min-width:0; max-width:100%;
  color:var(--ix-label); font-size:12.5px; font-weight:700;
  white-space:nowrap;
}
body:not([data-page="login"]) select.save-fmt,
body:not([data-page="login"]) .save-fmt select{
  width:auto; min-width:112px; max-width:100%;
  min-height:38px; height:38px; padding:4px 10px;
  border-radius:10px; border:1px solid var(--ix-line);
  background:var(--ix-card-b); color:var(--ix-label);
  font-size:12.5px; font-weight:650; box-shadow:none;
}
body:not([data-page="login"]) select.save-fmt:hover,
body:not([data-page="login"]) .save-fmt select:hover{border-color:var(--ix-primary-light)}
body:not([data-page="login"]) select.save-fmt:focus,
body:not([data-page="login"]) .save-fmt select:focus{
  border-color:var(--ix-primary); background:var(--ix-card-a);
  outline:none; box-shadow:0 0 0 3px rgba(255,107,53,.16);
}
body:not([data-page="login"]) .btn-save{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-height:36px; padding:6px 13px; border-radius:10px;
  border:1px solid var(--ix-line); background:var(--ix-card-b);
  color:var(--ix-deep-2); font-size:12.5px; font-weight:700; line-height:1.2;
  text-decoration:none; cursor:pointer; min-width:0;
  transition:transform .13s ease, border-color .16s ease, box-shadow .16s ease;
}
body:not([data-page="login"]) .btn-save:hover{
  transform:translateY(-1px); border-color:var(--ix-primary-light); color:var(--ix-deep);
  box-shadow:0 10px 20px -16px rgba(74,34,12,.55);
}
body:not([data-page="login"]) .btn-save:active{transform:translateY(0)}
body:not([data-page="login"]) .btn-save[aria-busy="true"],
body:not([data-page="login"]) .btn-save:disabled{opacity:.62; cursor:progress; transform:none}
@media (max-width:768px){
  body:not([data-page="login"]) .save-all:not(button):not(a){width:100%; gap:8px}
  body:not([data-page="login"]) .save-fmt{flex:1 1 100%; width:100%}
  body:not([data-page="login"]) select.save-fmt,
  body:not([data-page="login"]) .save-fmt select{
    flex:1 1 auto; width:100%; min-width:0; min-height:42px; height:42px;
  }
  body:not([data-page="login"]) #save-all-btn{width:100%; min-width:0}
}

/* ---- 复刻单图直出：中间过程兜底（R14 · 蔻德） ----
   验收口径以渲染层不建节点为准（DOM 里不存在 #steps > * / #materials > * /
   文件记录子节点）；以下规则只在节点意外残留时防止占位，不改 DOM，
   不能当作验收证据，也不替代 app.js 的分支。
   成品由 app.js 决定：优先 job.replicas[]（一图一复刻），缺位才回落 collectShots；
   本节只做占位兜底，不参与成品识别，也不作验收依据。 */
#steps:empty,
#materials:empty,
#artifacts:empty{display:none!important}

/* 容器里只剩渲染层的空态占位（.empty / 无文件记录提示）时，整张卡收掉，不留空白 */
#materials-section:has(#materials:empty),
#materials-section:has(#materials > .empty:only-child),
#items-section:has(#items:empty),
#items-section:has(#items > .empty:only-child),
#artifacts:has(> .notice:only-child),
section.card:has(> #steps:empty){display:none!important}

/* 一张进一张出：单张成品在手机上也要看得清；多张时仍走原网格 */
/* 单张时收成一条轨道：否则卡片停在 300px 轨道里，max-width:760 永远不生效。
   只在 only-child 时改，多张（含旧链路）仍走原 batch-list 网格，版式零变化。 */
#shots.batch-list:has(> .item:only-child){grid-template-columns:1fr}
#shots > .item:only-child{max-width:760px; margin-inline:auto}
#shots > .item:only-child .thumb{max-height:min(72vh,680px)}