/* 2026-10-11：字体改本地自带。原先外链 fonts.googleapis.com 是「渲染阻塞」的第三方依赖，
   境外网络不可达/被墙时整页要等它超时才渲染（官网和局域网都中招）。 */
@font-face{font-family:'Geist';font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/geist.woff2) format('woff2')}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/geistmono.woff2) format('woff2')}
.imgZoom{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.62);pointer-events:none;opacity:0;transition:opacity .15s ease}
.imgZoom.on{opacity:1}
.imgZoom img{max-width:96vw;max-height:96vh;border-radius:10px;box-shadow:0 10px 48px rgba(0,0,0,.65)}


/* Hallmark · pre-emit critique: P4 H4 E4 S4 R5 V4
 * Hallmark · genre: atmospheric · macrostructure: Workbench · theme: Midnight
 * tone: nocturnal workshop · anchor hue: warm amber ~55°
 * nav: N9 edge-aligned · footer: Ft2 inline single line · enrichment: none (typography + canvas blooms)
 */
:root{
  --color-paper:    oklch(14% 0.008 55);
  --color-paper-2:  oklch(18% 0.010 55);
  --color-paper-3:  oklch(22% 0.012 55);
  --color-rule:     oklch(30% 0.008 55);
  --color-neutral:  oklch(58% 0.008 55);
  --color-muted:    oklch(72% 0.006 55);
  --color-ink:      oklch(94% 0.006 80);
  --color-accent:   oklch(70% 0.19 55);
  --color-accent-ink: oklch(18% 0.02 55);
  --color-focus:    oklch(75% 0.17 60);
  --color-ok:       oklch(72% 0.16 155);
  --color-warn:     oklch(78% 0.15 80);
  --color-err:      oklch(68% 0.20 25);

  --font-display: "Geist", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-body:    "Geist", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-outlier: "Geist Mono", ui-monospace, "Sarasa Mono SC", monospace;

  --space-3xs: 0.25rem; --space-2xs: 0.5rem;  --space-xs: 0.75rem;
  --space-sm:  1rem;    --space-md:  1.5rem;  --space-lg: 2rem;
  --space-xl:  3rem;

  --text-xs: 0.75rem; --text-sm: 0.875rem; --text-base: 1rem;
  --text-md: 1.25rem; --text-lg: 1.5625rem; --text-xl: 1.9531rem;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-short: 220ms;

  --radius-card: 16px; --radius-pill: 999px; --radius-input: 12px;
}
*{box-sizing:border-box}
html,body{overflow-x:clip;min-height:100dvh}
body{
  margin:0; min-height:100vh;
  font-family:var(--font-body); font-weight:400; font-size:var(--text-base);
  color:var(--color-ink);
  background:var(--color-paper);
  padding:var(--space-md) clamp(16px,2.2vw,40px) var(--space-2xs);
}
.wrap{width:100%;max-width:1680px;margin:0 auto}

/* ---- nav: N9 edge-aligned ---- */
header{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-sm);margin-bottom:var(--space-md)}
.wordmark{font-family:var(--font-outlier);font-weight:600;font-size:var(--text-md);letter-spacing:-0.01em;white-space:nowrap}
.wordmark b{color:var(--color-accent);font-weight:600}
header small{display:block;color:var(--color-muted);font-size:var(--text-sm);margin-top:var(--space-3xs)}
.tag{font-family:var(--font-outlier);font-size:var(--text-xs);color:var(--color-muted);
  border:1px solid var(--color-rule);border-radius:var(--radius-pill);padding:4px 12px;white-space:nowrap}

/* ---- elevated cards, no hairlines ---- */
.card{background:var(--color-paper-2);border:1px solid oklch(26% 0.010 55);border-radius:var(--radius-card);
  padding:clamp(1.25rem,1.4vw,1.75rem);margin-bottom:0}
.card h2{font-family:var(--font-display);font-size:var(--text-base);font-weight:600;margin:0 0 var(--space-sm);letter-spacing:-0.01em}
.card h2 .pill{margin-left:var(--space-2xs)}

/* ---- 生成模式选择卡（真人 / 动漫 直接摆出来，不藏下拉）---- */
.modeGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:var(--space-sm)}
.modeCard{display:flex;flex-direction:column;gap:6px;text-align:left;width:100%;white-space:normal;
  background:var(--color-paper-3);border:1px solid var(--color-rule);border-radius:var(--radius-input);
  padding:var(--space-md);cursor:pointer;color:var(--color-ink);font-weight:400;
  transition:border-color var(--dur-short) var(--ease-out),background-color var(--dur-short) var(--ease-out)}
.modeCard:hover{border-color:var(--color-neutral)}
.modeCard .mt{font-size:var(--text-md);font-weight:600;letter-spacing:-0.01em;line-height:1.2}
.modeCard .md{font-size:var(--text-xs);color:var(--color-muted);line-height:1.55}
.modeCard.on{background:oklch(24% 0.030 55);border-color:var(--color-accent);box-shadow:inset 3px 0 0 var(--color-accent)}
.modeCard.on .mt{color:var(--color-accent)}
.modeCard:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}
/* 2026-10-21 剧情类型（文戏/武戏）：原生 radio + label，默认文戏 */
.genrePick{border:0;padding:0;margin:0 0 var(--space-sm);min-width:0}
.genrePick[hidden]{display:none}
.genrePick legend{font-size:var(--text-sm);color:var(--color-muted);padding:0;margin:0 0 var(--space-2xs)}
.genreGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(160px,100%),1fr));gap:var(--space-sm)}
.genreCard{position:relative;display:flex;flex-direction:column;justify-content:center;gap:4px;
  min-height:56px;padding:10px 14px;margin:0;cursor:pointer;font-weight:400;
  background:var(--color-paper-3);border:1px solid var(--color-rule);border-radius:var(--radius-input);
  transition:border-color var(--dur-short) var(--ease-out),background-color var(--dur-short) var(--ease-out)}
.genreCard input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.genreCard .gt{display:flex;align-items:center;gap:8px;font-size:var(--text-md);font-weight:600;line-height:1.2;color:var(--color-ink)}
.genreCard .gt::before{content:"";flex:0 0 auto;width:14px;height:14px;border-radius:50%;
  border:2px solid var(--color-neutral);transition:border-color var(--dur-short) var(--ease-out),background-color var(--dur-short) var(--ease-out)}
.genreCard .gd{font-size:var(--text-xs);color:var(--color-muted);line-height:1.5}
.genreCard input:checked ~ .gt{color:var(--color-accent)}
.genreCard input:checked ~ .gt::before{border-color:var(--color-accent);background:var(--color-accent);box-shadow:inset 0 0 0 2px var(--color-paper-3)}
.genreCard.on{background:oklch(24% 0.030 55);border-color:var(--color-accent);box-shadow:inset 3px 0 0 var(--color-accent)}
.genreCard:focus-within{outline:3px solid var(--color-focus);outline-offset:2px}
.genreCard.off{cursor:not-allowed;opacity:.55}
.genrePick.muted .gd{color:var(--color-muted)}
label{display:block;font-size:var(--text-sm);color:var(--color-muted);margin:0 0 var(--space-2xs)}
input[type=text],input[type=password],textarea,select{
  width:100%;background:var(--color-paper-3);border:1px solid transparent;color:var(--color-ink);
  border-radius:var(--radius-input);padding:12px 14px;font-size:var(--text-base);font-family:inherit;outline:none;
  transition:border-color var(--dur-short) var(--ease-out)}
input:focus-visible,textarea:focus-visible,select:focus-visible{border-color:var(--color-focus)}
textarea{resize:vertical;min-height:clamp(96px,14vh,180px);line-height:1.6}
.row{display:flex;gap:var(--space-sm);flex-wrap:wrap}
.row>.col{flex:1;min-width:min(200px,100%)}
.hint{font-size:var(--text-xs);color:var(--color-neutral);margin-top:var(--space-2xs);line-height:1.5}
.dur-range{width:100%;height:28px;margin:6px 0 0;accent-color:var(--color-accent);cursor:pointer}
.dur-range:disabled{opacity:.55;cursor:default}
.dur-ticks{display:flex;justify-content:space-between;gap:4px;font-size:var(--text-xs);color:var(--color-muted);margin-top:2px}
.dur-ticks .off{opacity:.35;text-decoration:line-through}
.count{float:right;color:var(--color-neutral);font-size:var(--text-xs);font-variant-numeric:tabular-nums}

/* ---- buttons ---- */
button{font-family:inherit;cursor:pointer;border:0;font-size:var(--text-base);font-weight:600;white-space:nowrap}
.btn-primary{
  background:var(--color-accent);color:var(--color-accent-ink);
  border-radius:var(--radius-pill);padding:14px 28px;width:100%;font-size:var(--text-md);
  transition:transform 100ms var(--ease-out), background-color var(--dur-short) var(--ease-out)}
.btn-primary:hover{background:oklch(75% 0.19 58)}
.btn-primary:active{transform:translateY(1px)}
.btn-primary:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn-primary:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}
.btn-ghost{background:var(--color-paper-3);color:var(--color-ink);border-radius:var(--radius-pill);padding:12px 20px;
  transition:background-color var(--dur-short) var(--ease-out)}
.btn-ghost:hover{background:var(--color-rule)}
.btn-danger{background:transparent;color:var(--color-err);border-radius:var(--radius-pill);padding:8px 16px;
  border:1px solid oklch(40% 0.08 25)}
.btn-danger:hover{background:oklch(28% 0.06 25)}

/* ---- 小影聊窗 ---- */
#xyFab{position:fixed;right:22px;bottom:22px;z-index:900;width:60px;height:60px;border-radius:50%;
  background:var(--color-accent);color:oklch(14% 0.008 55);font-size:26px;border:none;cursor:pointer;
  box-shadow:0 6px 24px oklch(14% 0.008 55 / .45);display:flex;align-items:center;justify-content:center;
  transition:transform var(--dur-short) var(--ease-out)}
#xyFab:hover{transform:scale(1.08)}
#xyFab .ping{position:absolute;top:2px;right:2px;width:12px;height:12px;border-radius:50%;background:var(--color-ok);border:2px solid var(--color-paper-2)}
#xyPanel{position:fixed;right:22px;bottom:92px;z-index:901;width:min(392px,calc(100vw - 32px));height:min(560px,calc(100vh - 130px));
  background:var(--color-paper-2);border:1px solid var(--color-rule);border-radius:18px;display:none;flex-direction:column;
  overflow:hidden;box-shadow:0 18px 60px oklch(14% 0.008 55 / .55)}
#xyPanel.open{display:flex}
#xyHead{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--color-rule);background:var(--color-paper-3)}
#xyHead .ava{width:36px;height:36px;border-radius:12px;background:var(--color-accent);display:flex;align-items:center;justify-content:center;font-size:19px}
#xyHead .t{flex:1;line-height:1.25}
#xyHead .t b{font-size:15px}
#xyHead .t span{display:block;font-size:11px;color:var(--color-muted)}
#xyClose{background:none;border:none;color:var(--color-muted);font-size:20px;cursor:pointer;padding:4px}
#xyMsgs{flex:1;overflow-y:auto;padding:14px 12px;display:flex;flex-direction:column;gap:10px}
.xym{max-width:84%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.65;white-space:pre-wrap;word-break:break-word}
.xym.ai{align-self:flex-start;background:var(--color-paper-3);border:1px solid var(--color-rule);border-bottom-left-radius:4px}
.xym.me{align-self:flex-end;background:var(--color-accent);color:oklch(14% 0.008 55);border-bottom-right-radius:4px}
.xym.sys{align-self:center;background:none;color:var(--color-muted);font-size:11.5px;padding:2px}
#xyChips{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 8px}
#xyChips button{font-size:12px;padding:6px 12px;border-radius:var(--radius-pill);border:1px solid var(--color-rule);
  background:var(--color-paper-3);color:var(--color-ink);cursor:pointer}
#xyChips button:hover{border-color:var(--color-accent)}
#xyInputRow{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--color-rule);background:var(--color-paper-3)}
#xyInput{flex:1;background:var(--color-paper-2);border:1px solid var(--color-rule);border-radius:12px;padding:10px 12px;
  color:var(--color-ink);font-size:13.5px;resize:none;outline:none;font-family:inherit;max-height:84px}
#xyInput:focus{border-color:var(--color-accent)}
#xySend{background:var(--color-accent);color:oklch(14% 0.008 55);border:none;border-radius:12px;padding:0 16px;
  font-size:15px;cursor:pointer;flex:none}
#xySend:disabled{opacity:.45;cursor:default}
.xytyping{display:inline-flex;gap:4px;padding:4px 2px}
.xytyping i{width:6px;height:6px;border-radius:50%;background:var(--color-muted);animation:xyblink 1.2s infinite}
.xytyping i:nth-child(2){animation-delay:.2s}.xytyping i:nth-child(3){animation-delay:.4s}
@keyframes xyblink{0%,80%,100%{opacity:.25}40%{opacity:1}}

.upload{display:block;background:var(--color-paper-3);border:1.5px dashed var(--color-rule);border-radius:var(--radius-input);
  padding:var(--space-md);text-align:center;color:var(--color-muted);cursor:pointer;
  transition:border-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out)}
.upload:hover{border-color:var(--color-accent);color:var(--color-ink)}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(92px,28%),1fr));gap:10px;margin-top:var(--space-sm)}
.ref-slot-cell{display:flex;flex-direction:column;gap:6px;min-width:0}
.ref-slot-cell .ref-slot{width:100%}
.ref-slot-label{font-size:11px;line-height:1.35;color:var(--color-muted);text-align:center;min-height:2.7em;display:flex;align-items:flex-start;justify-content:center}
.ref-slot-label b{color:var(--color-ink);font-weight:600}
.thumb{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:1;background:var(--color-paper)}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb .x{position:absolute;top:4px;right:4px;width:24px;height:24px;border-radius:50%;z-index:2;
  background:oklch(14% 0.008 55 / 0.85);color:var(--color-ink);font-size:14px;line-height:1;padding:0}
.thumb .n{position:absolute;bottom:4px;left:4px;font-size:var(--text-xs);font-family:var(--font-outlier);z-index:1;
  background:oklch(14% 0.008 55 / 0.85);padding:2px 7px;border-radius:6px}
.ref-slot{min-width:0;border:1.5px solid transparent}
.ref-slot.empty{display:flex;align-items:center;justify-content:center;border-style:dashed;border-color:var(--color-rule);background:var(--color-paper-3);color:var(--color-muted);cursor:pointer}
.ref-slot.empty .slot-empty{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:var(--text-xs);pointer-events:none}
.ref-slot.empty .slot-empty b{font-family:var(--font-outlier);font-size:var(--text-sm);color:var(--color-neutral)}
.ref-slot.filled{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;transition:border-color .14s ease,box-shadow .14s ease}
.ref-slot.filled:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}
.ref-slot.filled.dragging{cursor:grabbing;opacity:.35}
.ref-slot .x{cursor:pointer}
.ref-slot.magnet-target{border-color:var(--color-accent);box-shadow:0 0 0 3px oklch(70% 0.19 55 / .24),0 8px 24px oklch(0% 0 0 / .28)}
.ref-slot.magnet-landed{animation:refMagnet .22s var(--ease-out)}
.ref-drag-ghost{position:fixed;left:0;top:0;z-index:10001;margin:0;pointer-events:none;opacity:.94;box-shadow:0 16px 44px rgba(0,0,0,.46);will-change:transform}
@keyframes refMagnet{0%{transform:scale(.9)}65%{transform:scale(1.045)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.ref-slot.filled{transition:none}.ref-slot.magnet-landed{animation:none}}

/* ---- progress ---- */
.status-line{display:flex;align-items:center;gap:10px;margin:var(--space-2xs) 0 var(--space-sm)}
.machline{grid-column:1/-1;flex-wrap:wrap;gap:8px 14px;margin:0}
.dot{width:10px;height:10px;border-radius:50%;background:var(--color-neutral);flex:none}
.dot.run{background:var(--color-warn);animation:pulse 1.2s var(--ease-in-out) infinite}
.dot.ok{background:var(--color-ok)} .dot.bad{background:var(--color-err)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.progress{height:8px;background:var(--color-paper-3);border-radius:var(--radius-pill);overflow:hidden}
.progress>i{display:block;height:100%;width:0;background:var(--color-accent);border-radius:var(--radius-pill);
  transition:width .4s var(--ease-out)}
#pmeta{font-variant-numeric:tabular-nums}

/* ---- result ---- */
.result{border-radius:var(--radius-input);overflow:hidden;background:var(--color-paper)}
.result img{width:100%;display:block}
.msg{font-size:var(--text-sm);margin-top:var(--space-2xs)}
.msg.err{color:var(--color-err)} .msg.ok{color:var(--color-ok)}

/* ---- details ---- */
details{margin-bottom:var(--space-md)}
summary{cursor:pointer;color:var(--color-muted);font-size:var(--text-sm);list-style:none;user-select:none}
summary::-webkit-details-marker{display:none}
summary:before{content:"› ";color:var(--color-accent)}
details[open]>summary:before{content:"⌄ "}
.pill{display:inline-block;font-size:var(--text-xs);font-family:var(--font-outlier);
  background:var(--color-paper-3);color:var(--color-muted);padding:2px 10px;border-radius:var(--radius-pill)}
pre{background:var(--color-paper);border-radius:10px;padding:var(--space-sm);font-size:var(--text-xs);
  font-family:var(--font-outlier);white-space:pre-wrap;line-height:1.6;color:var(--color-muted)}
pre b{color:var(--color-accent);font-weight:600}

/* ---- header live status ---- */
.tag .sdot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--color-neutral);margin-right:6px;vertical-align:1px}
.tag.on .sdot{background:var(--color-ok)} .tag.off .sdot{background:var(--color-err)}
.tag.on{color:var(--color-ok)} .tag.off{color:var(--color-err)}

/* ---- recent jobs table ---- */
.jobs{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
.jobs th{font-weight:500;color:var(--color-neutral);text-align:left;padding:0 var(--space-2xs) var(--space-2xs);font-size:var(--text-xs)}
.jobs td{padding:10px var(--space-2xs);border-top:1px solid var(--color-rule);vertical-align:middle}
.jobs td.t{color:var(--color-neutral);font-family:var(--font-outlier);font-size:var(--text-xs);white-space:nowrap}
.jname{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jst{display:inline-block;font-size:var(--text-xs);border-radius:var(--radius-pill);padding:2px 10px;white-space:nowrap}
.jst.queued{background:var(--color-paper-3);color:var(--color-muted)}
.jst.running{background:oklch(35% 0.08 80);color:var(--color-warn)}
.jst.succeeded{background:oklch(30% 0.07 155);color:var(--color-ok)}
.jst.failed,.jst.cancelled{background:oklch(32% 0.08 25);color:var(--color-err)}
/* 2026-09-22：订单来源徽章（AI=琥珀一眼可辨，员工=中性灰） */
.jsrc{display:inline-block;font-size:var(--text-xs);border-radius:var(--radius-pill);padding:2px 10px;white-space:nowrap}
.jsrc.ai{background:oklch(38% 0.09 80);color:var(--color-warn);font-weight:500}
.jsrc.staff{background:var(--color-paper-3);color:var(--color-neutral)}
.jdl{color:var(--color-accent);text-decoration:none;font-weight:500;white-space:nowrap}
.jdl:hover{text-decoration:underline}

/* ---- tabs ---- */
.tabs{display:flex;gap:var(--space-2xs);margin-bottom:var(--space-md)}
.tab{background:var(--color-paper-2);color:var(--color-muted);border-radius:var(--radius-pill);
  padding:9px 20px;font-size:var(--text-sm);font-weight:600}
.tab.on{background:var(--color-accent);color:var(--color-accent-ink)}
.tab:hover:not(.on){background:var(--color-paper-3);color:var(--color-ink)}

/* ---- gallery ---- */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(180px,15vw,260px),1fr));gap:var(--space-sm)}
.vcard{background:var(--color-paper);border-radius:var(--radius-input);overflow:hidden}
.vcard video{width:100%;display:block;aspect-ratio:960/544;background:#000}
.vcard img{width:100%;display:block;aspect-ratio:1/1;object-fit:cover;background:#000;cursor:pointer}
/* ---- 图片工坊：传送带动画场景 ---- */
.scene{padding:var(--space-sm) 0 var(--space-2xs)}
.countdown{text-align:center;font-size:var(--text-lg);font-weight:600;color:var(--color-accent);font-variant-numeric:tabular-nums;letter-spacing:.02em;margin-top:var(--space-2xs)}
.belt{animation:beltMove .8s linear infinite}
.roller{transform-box:fill-box;transform-origin:center;animation:rollerSpin 1.6s linear infinite}
.robot{transform-box:fill-box;animation:robotBob 1.6s ease-in-out infinite}
.arm-left{transform-box:fill-box;transform-origin:top center;animation:armLeftSwing 1.6s ease-in-out infinite}
.arm-right{transform-box:fill-box;transform-origin:6px 4px;animation:armThrow 1.6s ease-in-out infinite}
.flying-pic{transform-box:fill-box;animation:picFly 1.6s linear infinite}
.puff{animation:puffFlash 1.6s linear infinite}
@keyframes beltMove{to{stroke-dashoffset:-24}}
@keyframes rollerSpin{to{transform:rotate(360deg)}}
@keyframes robotBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes armLeftSwing{0%,100%{transform:rotate(6deg)}50%{transform:rotate(-6deg)}}
@keyframes armThrow{0%,100%{transform:rotate(0)}18%{transform:rotate(-52deg)}32%{transform:rotate(8deg)}46%{transform:rotate(0)}}
@keyframes picFly{0%{transform:translate(150px,118px);opacity:0}10%{opacity:1}78%{opacity:1}88%,100%{transform:translate(492px,118px);opacity:0}}
@keyframes puffFlash{0%,80%,100%{opacity:0}86%,92%{opacity:1}}
.vcard .vmeta{padding:var(--space-2xs) var(--space-xs);font-size:var(--text-xs);color:var(--color-muted)}
.vcard .vmeta .vname{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--color-ink);font-size:var(--text-sm)}
.vcard .vmeta a{color:var(--color-accent);text-decoration:none;font-weight:500}
/* ---- 视频库：生成中占位坑位（2026-10-14 动态视频库） ---- */
.vcard.slot .sthumb{width:100%;aspect-ratio:960/544;background:linear-gradient(110deg,var(--color-paper-3) 30%,rgba(255,255,255,.09) 45%,var(--color-paper-3) 60%);background-size:220% 100%;animation:slotShimmer 1.8s linear infinite;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--color-muted);font-size:var(--text-xs)}
@keyframes slotShimmer{to{background-position:-220% 0}}
.vcard.slot .sdot{width:10px;height:10px;border-radius:50%;background:var(--color-accent);animation:pulse 1.2s ease-in-out infinite}
.vcard.slot .sbar{padding:var(--space-2xs) var(--space-xs) 0}
.vcard.slot .spctline{display:flex;justify-content:space-between;gap:8px;font-variant-numeric:tabular-nums;padding:2px var(--space-xs) var(--space-2xs);font-size:var(--text-xs);color:var(--color-muted)}
.vcard.slot .spct{color:var(--color-accent);font-weight:600}
.vcard .newbadge{display:inline-block;background:var(--color-accent);color:#fff;border-radius:var(--radius-pill);padding:0 8px;font-size:10px;margin-left:6px;animation:pulse 1.6s ease-in-out infinite;vertical-align:2px}
.result video{width:100%;display:block}
/* 成片库：6 部之后的紧凑列表 */
.vlist{margin-top:var(--space-md)}
.vsep{margin:var(--space-sm) 0 var(--space-2xs);font-size:var(--text-xs);color:var(--color-muted);border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:2px}
.vlist .vrow{display:flex;align-items:center;gap:var(--space-2xs);padding:8px var(--space-2xs);
  border-top:1px solid var(--color-rule);font-size:var(--text-sm)}
.vrow .vname{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vrow .t{color:var(--color-neutral);font-family:var(--font-outlier);font-size:var(--text-xs);white-space:nowrap}
.vrow a{color:var(--color-accent);text-decoration:none;font-weight:500;white-space:nowrap}
.vrow a:hover{text-decoration:underline}

/* ---- login gate ---- */
.loginveil{position:fixed;inset:0;background:var(--color-paper);z-index:50;display:flex;align-items:center;justify-content:center;padding:var(--space-md)}
.loginveil .box{background:var(--color-paper-2);border-radius:var(--radius-card);padding:var(--space-lg);width:min(92vw,380px)}
.loginveil h1{font-family:var(--font-outlier);font-size:var(--text-lg);margin:0 0 var(--space-2xs);font-weight:600}
.loginveil h1 b{color:var(--color-accent)}
.loginveil .sub{color:var(--color-muted);font-size:var(--text-sm);margin-bottom:var(--space-md)}
.loginveil input{margin-bottom:var(--space-sm)}

/* ---- footer: Ft2 inline single line ---- */
.foot{color:var(--color-neutral);font-size:var(--text-xs);text-align:center;margin-top:var(--space-sm)}
.foot b{color:var(--color-muted);font-weight:500}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* ---- 2026-10-11 宽幅布局：多列网格铺满、免滚动 ---- */
#panePic,#paneGen,#paneAnime,#paneBridge{display:grid;gap:var(--space-md);
  grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:start}
#paneGen,#paneAnime,#paneBridge{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
#paneGen>.details-full,#paneGen>details{grid-column:1/-1;margin-bottom:0}
.colL,.colR{display:flex;flex-direction:column;gap:var(--space-md);min-width:0;min-height:0}
.jobs-wrap{grid-column:1/-1}
.jobs-scroll{max-height:clamp(160px,22vh,280px);overflow:auto}
table.jobs thead th{position:sticky;top:0;background:var(--color-paper-2)}
.tabs{margin-bottom:var(--space-md)}
@media (max-width:899px){
  #panePic,#paneGen,#paneAnime,#paneBridge{grid-template-columns:minmax(0,1fr)}
}
/* ---- 局域网入口：安静一条，不做广告牌 ---- */
.lanbar{display:inline-flex;align-items:center;gap:var(--space-2xs);
  background:var(--color-paper-2);border:1px solid var(--color-rule);color:var(--color-muted);
  border-radius:var(--radius-pill);padding:7px 15px;margin-bottom:var(--space-md);
  text-decoration:none;font-size:var(--text-sm);
  transition:border-color var(--dur-short) var(--ease-out),color var(--dur-short) var(--ease-out)}
.lanbar:hover{border-color:var(--color-accent);color:var(--color-ink)}
.lanbar .t{font-weight:600;font-size:var(--text-sm);letter-spacing:0}
.lanbar .d{display:none}
.lanbar .go{font-weight:600;font-size:var(--text-sm);opacity:.9;white-space:nowrap}

.libraryBoard{min-width:0}
.libraryHeading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);margin-bottom:var(--space-sm)}
.libraryHeading h2{margin:0}
.libToolbar{display:flex;align-items:end;gap:var(--space-2xs);flex-wrap:wrap;margin-bottom:var(--space-md)}
.libToolbar .btn-primary,.libToolbar .btn-ghost{min-height:40px;width:auto}
.libSearchLabel{font-size:var(--text-xs);margin:0;align-self:center;white-space:nowrap}
.libToolbar input{flex:1;min-width:min(260px,100%);width:auto}
.libraryShell{display:grid;grid-template-columns:230px minmax(0,1fr);gap:var(--space-md);align-items:start}
.projectRail{display:flex;flex-direction:column;gap:var(--space-3xs);min-width:0}
.projectRow{display:flex;align-items:center;gap:var(--space-2xs);min-height:38px;padding:7px 10px;border:1px solid transparent;border-radius:var(--radius-input);color:var(--color-muted);cursor:pointer;white-space:nowrap;transition:background-color var(--dur-short) var(--ease-out),border-color var(--dur-short) var(--ease-out)}
.projectRow:hover{background:var(--color-paper-3);color:var(--color-ink)}
.projectRow.on{background:var(--color-paper-3);border-color:var(--color-accent);color:var(--color-ink)}
.projectRow.archived{opacity:.62}
.projectRow:focus-visible,.projectArchivedToggle:focus-visible,.dragHandle:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}
.projectIcon{color:var(--color-accent);font-size:var(--text-base)}
.projectName{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.projectCount{font-family:var(--font-outlier);font-size:var(--text-xs);color:var(--color-neutral)}
.projectSectionLabel{margin:var(--space-sm) 10px var(--space-2xs);font-size:var(--text-xs);color:var(--color-neutral)}
.projectArchivedToggle{min-height:32px;margin-top:var(--space-xs);padding:5px 10px;border:0;background:transparent;color:var(--color-neutral);text-align:left;cursor:pointer}
.projectArchivedToggle.on{color:var(--color-accent)}
.projectDrop{background:var(--color-paper-3);border-color:var(--color-accent);box-shadow:inset 3px 0 0 var(--color-accent)}
.projectSelect,.projectSelectLabel{display:none}
.libraryContent{min-width:0}
.libraryContent .gallery{grid-template-columns:repeat(auto-fill,minmax(clamp(180px,15vw,260px),1fr))}
.libraryCurrent{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);margin-bottom:var(--space-sm)}
.libraryCurrent h3{margin:0;font-size:var(--text-md);font-weight:600;overflow-wrap:anywhere;min-width:0}
.libraryCurrentActions{display:flex;gap:var(--space-2xs);flex-wrap:wrap}
.selectionBar{display:flex;align-items:center;gap:var(--space-2xs);flex-wrap:wrap;margin-bottom:var(--space-sm)}
.selectionBar select{width:auto;min-width:150px;padding:7px 10px;font-size:var(--text-sm)}
.selectAllLabel{display:flex;align-items:center;gap:6px;margin:0;min-height:32px;color:var(--color-muted)}
.selectAllLabel input,.videoCheck input{width:18px;height:18px;accent-color:var(--color-accent)}
.videoTools{display:grid;grid-template-columns:auto 30px minmax(0,1fr);align-items:center;gap:var(--space-2xs);padding:7px 9px;background:var(--color-paper-2)}
.videoCheck{display:flex;align-items:center;gap:5px;margin:0;min-height:28px;font-size:var(--text-xs)}
.dragHandle{display:flex;align-items:center;justify-content:center;min-width:28px;min-height:28px;cursor:grab;user-select:none;color:var(--color-neutral)}
.dragHandle:active{cursor:grabbing}
.moveSelect{width:100%;min-width:0;padding:5px 7px;font-size:var(--text-xs)}
.libraryVideoCard{min-width:0;content-visibility:visible}
.libraryVideoCard.dragging{opacity:.55}
.videoTitle{color:var(--color-ink);font-size:var(--text-sm);font-weight:600;line-height:1.4;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.videoPrompt{margin-top:3px;color:var(--color-neutral);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.videoFacts,.videoActions{margin-top:5px;line-height:1.55;overflow-wrap:anywhere}
.libraryPagination{display:flex;justify-content:center;align-items:center;gap:var(--space-sm);margin-top:var(--space-md)}
.libraryFeedback{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-sm);min-height:40px;margin-top:var(--space-sm)}
#libNotice{flex:1;font-size:var(--text-sm);color:var(--color-muted)}
.emptyLibrary{grid-column:1/-1;padding:var(--space-xl) var(--space-sm);text-align:center;color:var(--color-neutral);border:1px dashed var(--color-rule);border-radius:var(--radius-input)}
@media (max-width:1100px){
  .libraryContent .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:899px){
  .libraryShell{grid-template-columns:minmax(0,1fr)}
  .projectRail{display:none}
  .projectSelectLabel{display:block;margin-bottom:var(--space-3xs)}
  .projectSelect{display:block;margin-bottom:var(--space-sm)}
  .libraryCurrent{align-items:flex-start;flex-direction:column}
  .libraryContent .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:480px){
  .libToolbar{align-items:stretch}
  .libToolbar input{min-width:0;width:100%;flex-basis:100%}
  .libSearchLabel{align-self:auto}
  .libraryContent .gallery{grid-template-columns:minmax(0,1fr)}
  .selectionBar select{flex:1;min-width:130px}
}
@media (pointer:coarse){
  .dragHandle{display:none}
  .videoTools{grid-template-columns:auto minmax(0,1fr)}
}
.projectDialog{width:min(420px,calc(100vw - 32px));padding:var(--space-md);border:1px solid var(--color-rule);border-radius:var(--radius-card);background:var(--color-paper-2);color:var(--color-ink)}
.projectDialog::backdrop{background:oklch(8% 0.008 55 / .78)}
.projectDialog h3{margin:0 0 var(--space-sm);font-size:var(--text-md)}
.projectDialog p{color:var(--color-muted);font-size:var(--text-sm);line-height:1.6}
.dialogActions{display:flex;justify-content:flex-end;gap:var(--space-2xs);margin-top:var(--space-md)}
.dialogActions .btn-primary,.dialogActions .btn-ghost{width:auto;min-height:36px}