/* Runtime additions for the live demo (toasts, dialogs, live recognition states, print). */
.qa-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);z-index:1000;max-width:min(560px,calc(100vw - 32px));padding:12px 18px;border-radius:12px;background:#151B26;color:#FFFFFF;font:500 13px/1.5 'Inter','Noto Sans SC','PingFang SC',sans-serif;box-shadow:0 12px 32px rgba(0,0,0,.28);opacity:0;transition:opacity .2s,transform .2s;pointer-events:none}
.qa-toast.show{opacity:1;transform:translateX(-50%)}
.qa-toast.err{background:#B42318}
.qa-toast.ok{background:#0B6B3A}
.qa-dlg{position:fixed;inset:0;z-index:1001;display:flex;align-items:center;justify-content:center;background:rgba(10,15,25,.45);backdrop-filter:blur(4px)}
.qa-dlg form{width:min(440px,calc(100vw - 32px));padding:22px;border-radius:16px;background:var(--pop-bg,#FFFFFF);color:var(--text,#151B26);border:var(--card-border,1px solid #E4E8EE);box-shadow:0 24px 60px rgba(0,0,0,.3);display:flex;flex-direction:column;gap:12px;font:13px/1.5 'Inter','Noto Sans SC','PingFang SC',sans-serif}
.qa-dlg h3{margin:0;font-size:16px}
.qa-dlg p{margin:0;color:var(--muted,#5E6B7E)}
.qa-dlg input{height:38px;padding:0 10px;border:1px solid var(--ctl-line,#D5DBE3);border-radius:8px;font:inherit;background:var(--ctl-bg,#FFFFFF);color:var(--text,#151B26)}
.qa-dlg .row{display:flex;justify-content:flex-end;gap:8px}
.qa-busy{opacity:.6;pointer-events:none}
.qa-hide{display:none!important}
.qa-err{padding:14px 16px;margin:12px 16px;border-radius:10px;background:var(--r-bg,#FDECEC);color:var(--r-text,#B42318);line-height:1.6}
.qa-drop-over{border-color:var(--acc,#1650E0)!important;background:var(--acc-soft,#EAF0FF)!important}

/* Recognition page driven by real progress instead of the CSS demo timeline */
.js-live .ic .w,.js-live .ic .r,.js-live .ic .k,.js-live .lb,.js-live .ov,.js-live .fd,.js-live .pbar i,.js-live .cta,.js-live .s-run,.js-live .s-done,.js-live .pulse,.js-live .scan{animation:none!important}
.js-live .scan{animation:scan 2.8s cubic-bezier(.45,.05,.55,.95) infinite!important}
.js-live.done .scan{display:none}
.js-live .pulse{animation:pulse 1.2s ease-out infinite!important}
.js-live.done .pulse{display:none}
.js-live .ic .w{opacity:1}.js-live .ic .r{opacity:0}.js-live .ic .k{opacity:0;transform:scale(.6);transition:all .25s}
.js-live li.run .ic .w{opacity:0}.js-live li.run .ic .r{opacity:1;animation:spin .8s linear infinite!important}
.js-live li.done .ic .w,.js-live li.done .ic .r{opacity:0}.js-live li.done .ic .k{opacity:1;transform:none}
.js-live .lb{opacity:.55}.js-live li.run .lb,.js-live li.done .lb{opacity:1}
.js-live .ov{opacity:0}.js-live .ov.in{animation:pop .45s cubic-bezier(.2,.8,.2,1.2) both!important}
.js-live .fd{opacity:0}.js-live .fd.in{animation:rowin .4s ease-out both!important}
.js-live .pbar i{width:0;transition:width .5s ease}
.js-live .cnt-n::after{content:none!important}
.js-live .cta{opacity:.35;pointer-events:none}
.js-live.done .cta{opacity:1;pointer-events:auto;box-shadow:var(--btn-p-shadow),0 0 0 6px var(--acc-soft)}
.js-live .s-run{opacity:1}.js-live .s-done{opacity:0}
.js-live.done .s-run{opacity:0}.js-live.done .s-done{opacity:1}
.cnt-live{color:var(--text)}

.qa-pdf{display:block;width:100%;height:72vh;border:0;background:#FFFFFF}
.qa-empty{padding:18px 16px;color:var(--muted,#5E6B7E)}

@media print{
  body *{visibility:hidden}
  .doc,.doc *{visibility:visible}
  .doc{position:absolute;left:0;top:0;width:100%;box-shadow:none!important;border:0!important}
}
