/* Scan to PDF studio — owner mock layout (2026-10-27), themed via data-theme. Scoped: .scx */
.scx{--scx-pagebg:#0B1020;--scx-card:#111827;--scx-border:#243049;--scx-panel:#0F1626;--scx-fieldbd:#2C3A5C;--scx-btn:#1B2440;--scx-ink:#E5E7EB;--scx-mut:#94A3B8;--scx-faint:#64748B;--scx-track:#243049;--scx-thumbbg:#fff}
html[data-theme="light"] .scx{--scx-pagebg:#E9EDF4;--scx-card:#FFFFFF;--scx-border:#D8E0EE;--scx-panel:#F2F5FA;--scx-fieldbd:#C9D4E6;--scx-btn:#EDF1F8;--scx-ink:#141C2E;--scx-mut:#5A6B87;--scx-faint:#8494AD;--scx-track:#D8E0EE}
.scx{color:var(--scx-ink);font-size:14px;line-height:1.45}
.scx *{box-sizing:border-box}
.scx button{font-family:inherit;cursor:pointer}
.scx button:disabled{opacity:.45;cursor:not-allowed}
.scx-wrap{background:radial-gradient(900px 420px at 50% -120px,rgba(99,102,241,.20),transparent),var(--scx-pagebg);border-radius:20px;padding:18px}
.scx-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.scx-head .sp{margin-left:auto;display:flex;gap:8px}
.scx-grid{display:grid;grid-template-columns:290px minmax(0,1fr) 400px;gap:20px;align-items:start}
.scx-grid2{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start;margin-top:20px}
.scx-card{background:var(--scx-card);border:1px solid var(--scx-border);border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:12px;min-width:0}
.scx-lbl{font-size:12px;font-weight:700;letter-spacing:.8px;color:var(--scx-mut)}
.scx-g{background:var(--scx-btn);border:1px solid var(--scx-fieldbd);color:var(--scx-ink);border-radius:10px;padding:8px 12px;font-size:13px;font-weight:600}
.scx-g:hover{border-color:#6366F1}
.scx-tbtn{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:10px;border:1px solid var(--scx-fieldbd);background:var(--scx-btn);font-size:13px;font-weight:600;color:var(--scx-ink)}
.scx-tbtn:hover{border-color:#6366F1}
.scx-seg{display:flex;background:var(--scx-panel);border:1px solid var(--scx-border);border-radius:12px;padding:4px;gap:4px}
.scx-seg button{flex:1;min-width:0;border:0;background:transparent;color:var(--scx-mut);padding:8px 6px;border-radius:9px;font-size:13px;font-weight:600;white-space:nowrap}
.scx-seg button.on{background:linear-gradient(135deg,#4F46E5,#7C3AED);color:#fff}
.scx-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:13px;font-weight:700;border:1px solid var(--scx-fieldbd);background:var(--scx-panel);color:var(--scx-ink)}
.scx-chip.grn{color:#34D399}
.scx-pill2{padding:3px 9px;border-radius:999px;font-size:12px;font-weight:700;background:rgba(99,102,241,.2);color:#A5B4FC}
html[data-theme="light"] .scx-pill2{color:#4F46E5}
.scx-pill2.grn{background:rgba(52,211,153,.16);color:#34D399}
.scx-nw{font-size:10px;font-weight:800;padding:2px 6px;border-radius:6px;background:#10B981;color:#04281d;margin-left:6px;font-style:normal;vertical-align:2px}
.scx-f{display:flex;flex-direction:column;gap:8px}
.scx-r{display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:600;gap:10px}
.scx-n{background:var(--scx-panel);border:1px solid var(--scx-fieldbd);border-radius:10px;padding:7px 12px;min-width:76px;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.scx-in{background:var(--scx-panel);border:1px solid var(--scx-fieldbd);border-radius:10px;padding:9px 12px;font-size:14px;color:var(--scx-ink);width:100%;font-family:inherit}
input[type=range].scx-range{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:6px;background:linear-gradient(90deg,#6366F1,#8B5CF6) 0/var(--p,50%) 100% no-repeat,var(--scx-track);outline:none;padding:0;border:0;cursor:pointer}
input[type=range].scx-range::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:0;box-shadow:0 1px 4px rgba(0,0,0,.45);cursor:pointer}
input[type=range].scx-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:0;box-shadow:0 1px 4px rgba(0,0,0,.45);cursor:pointer}
.scx-tg{display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:600;gap:12px}
.scx-sw{width:40px;height:22px;border-radius:12px;background:var(--scx-track);position:relative;border:0;flex:none;padding:0}
.scx-sw::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .15s}
.scx-sw.on{background:#6366F1}
.scx-sw.on::after{left:21px}
.scx-thumbs{display:flex;flex-direction:column;gap:8px;overflow-y:auto;min-height:0;padding-right:2px}
.scx-thumb{position:relative;border:2px solid var(--scx-border);border-radius:12px;padding:6px;background:var(--scx-panel);display:flex;align-items:center;gap:10px;cursor:pointer;text-align:left;width:100%;color:var(--scx-ink)}
.scx-thumb.on{border-color:#6366F1;box-shadow:0 0 0 2px rgba(99,102,241,.3)}
.scx-thumb .no{position:absolute;left:8px;top:8px;background:#4F46E5;color:#fff;border-radius:6px;font-size:11px;font-weight:800;padding:1px 6px;z-index:2}
.scx-thumb .dh{cursor:grab;color:var(--scx-mut);font-size:16px;flex:none;padding:2px}
.scx-thumb .tim{border-radius:6px;overflow:hidden;flex:none;width:58px;height:70px;background:#2B2F3A;display:flex;align-items:center;justify-content:center}
.scx-thumb .tim img{width:100%;height:100%;object-fit:cover;display:block}
.scx-thumb .tmeta{flex:1;font-size:12px;color:var(--scx-mut);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scx-thumb .del{padding:4px 8px;flex:none}
.scx-thumb.dragging{opacity:.45}
.scx-hint{font-size:12px;color:var(--scx-mut);line-height:1.55}
.scx-stage{position:relative;flex:1;display:flex;align-items:center;justify-content:center;background:var(--scx-panel);border:1px dashed var(--scx-fieldbd);border-radius:14px;min-height:280px;overflow:hidden;padding:10px}
.scx-stage canvas{max-width:100%;height:auto;display:block;border-radius:4px}
.scx-stage .quadwrap{position:relative;line-height:0}
.scx-stage svg.quad{position:absolute;inset:0;width:100%;height:100%}
.scx-stage svg.quad polygon{fill:rgba(99,102,241,.10);stroke:#818CF8;stroke-width:1.5;stroke-dasharray:5 3}
.scx-stage svg.quad circle{fill:#fff;stroke:#6366F1;stroke-width:2;cursor:grab}
.scx-edbtns{display:flex;gap:8px;flex-wrap:wrap}
.scx-flrow{display:flex;gap:16px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap}
.scx-filters{display:flex;gap:12px;flex-wrap:wrap}
.scx-fl{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--scx-mut);background:none;border:0;padding:0}
.scx-fl .fb{border:2px solid var(--scx-border);border-radius:10px;overflow:hidden;width:66px;height:80px;background:#2B2F3A}
.scx-fl .fb canvas{width:100%;height:100%;display:block;object-fit:cover}
.scx-fl.on{color:#A5B4FC}
html[data-theme="light"] .scx-fl.on{color:#4F46E5}
.scx-fl.on .fb{border-color:#6366F1}
.scx-sliders{width:300px;max-width:100%;display:flex;flex-direction:column;gap:10px}
.scx-est{font-size:13px;color:var(--scx-mut)}
.scx-est b{color:var(--scx-ink)}
.scx-create{border:0;border-radius:14px;padding:16px;font-size:16px;font-weight:800;color:#fff;background:linear-gradient(135deg,#4F46E5,#7C3AED);box-shadow:0 10px 26px rgba(99,102,241,.5);width:100%}
.scx-create:disabled{box-shadow:none}
.scx-3row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.scx-status{font-size:13px;color:var(--scx-mut);min-height:18px;margin:0}
.scx-status.err{color:#e2604f}
.scx-tip{display:flex;gap:14px;align-items:center;padding:16px 18px;border-radius:16px;background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.35);font-size:14px;line-height:1.6;color:var(--scx-ink)}
.scx-presets{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.scx-s{padding:14px;border-radius:14px;background:var(--scx-panel);border:1px solid var(--scx-border);text-align:left;color:var(--scx-ink)}
.scx-s b{font-size:14px;display:block}
.scx-s span{font-size:12px;color:var(--scx-mut);display:block;margin-top:4px;line-height:1.5}
.scx-s:hover{border-color:#6366F1}
.scx-phone{width:230px;max-width:100%;border:3px solid #334155;border-radius:28px;padding:10px;background:#020617;flex:none;margin:0 auto}
.scx-phone .scr{position:relative;border-radius:18px;overflow:hidden;background:#2B2F3A;aspect-ratio:100/122}
.scx-phone canvas{width:100%;height:100%;display:block;object-fit:cover}
.scx-phone .det{position:absolute;left:10px;top:10px;background:rgba(16,185,129,.9);color:#04281d;font-size:11px;font-weight:800;padding:3px 8px;border-radius:999px}
.scx-phone .bar{display:flex;align-items:center;justify-content:space-between;padding:12px 6px 4px}
.scx-shutter{width:54px;height:54px;border-radius:50%;background:#fff;border:5px solid #818CF8;display:inline-block;cursor:pointer;padding:0}
.scx-ba{position:relative;display:flex;border-radius:14px;overflow:hidden;background:#2B2F3A;min-height:200px;user-select:none;touch-action:none}
.scx-ba .half{flex:1;overflow:hidden;position:relative}
.scx-ba canvas{display:block;width:100%;height:100%;object-fit:cover}
.scx-ba .afterwrap{position:absolute;top:0;right:0;bottom:0;overflow:hidden}
.scx-ba .afterwrap canvas{position:absolute;top:0;right:0;height:100%}
.scx-ba .divider{position:absolute;top:0;bottom:0;width:3px;background:#fff;transform:translateX(-1.5px);cursor:ew-resize;z-index:3}
.scx-ba .tag{position:absolute;bottom:10px;z-index:2}
.scx-next{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.scx-next a.scx-s{text-decoration:none}
.scx-vidwrap{position:relative;width:100%;display:flex;align-items:center;justify-content:center}
.scx-vidwrap video{max-width:100%;max-height:520px;border-radius:10px;display:block}
.scx-gridlines{position:absolute;inset:0;pointer-events:none;background:
 linear-gradient(to right,transparent calc(33.33% - 1px),rgba(255,255,255,.5) 33.33%,transparent calc(33.33% + 1px)),
 linear-gradient(to right,transparent calc(66.66% - 1px),rgba(255,255,255,.5) 66.66%,transparent calc(66.66% + 1px)),
 linear-gradient(to bottom,transparent calc(33.33% - 1px),rgba(255,255,255,.5) 33.33%,transparent calc(33.33% + 1px)),
 linear-gradient(to bottom,transparent calc(66.66% - 1px),rgba(255,255,255,.5) 66.66%,transparent calc(66.66% + 1px))}
.scx-count{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:110px;font-weight:800;color:#fff;text-shadow:0 4px 30px rgba(0,0,0,.7);pointer-events:none}
@media(min-width:1281px){.scx-card.tall{height:800px}}
@media(max-width:1280px){.scx-grid{grid-template-columns:250px minmax(0,1fr)}.scx-card.set{grid-column:1/-1}}
.scx-2col{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.scx-2col>*{min-width:0}
.scx-grid>*,.scx-grid2>*{min-width:0}
@media(max-width:900px){
 .scx-grid,.scx-grid2{grid-template-columns:1fr}
 .scx-thumbs{flex-direction:row;overflow-x:auto;overflow-y:hidden}
 .scx-thumb{flex:0 0 200px}
 .scx-next{grid-template-columns:repeat(2,1fr)}
 .scx-wrap{padding:12px}
 .scx-sliders{width:100%}
 .scx-seg button{white-space:normal;font-size:12px;padding:7px 4px;line-height:1.25}
}
@media(max-width:560px){.scx-2col{grid-template-columns:1fr}}

/* ---------- theme/stage override layer ----------
   theme.css washes every .tool-panel button amber (!important) and forces
   span/link colours; pdf-stage-ui.css forces 2px radii (!important).
   The studio's own tokens win inside .scx via the doubled-class prefix. */
body .tool-panel.tool-panel .scx button{font-family:var(--font-body)!important;text-shadow:none!important;box-shadow:none!important;transform:none!important;letter-spacing:normal!important;text-transform:none!important}
body .tool-panel.tool-panel .scx .scx-g,body .tool-panel.tool-panel .scx span.scx-g{background:var(--scx-btn)!important;color:var(--scx-ink)!important;border:1px solid var(--scx-fieldbd)!important;border-radius:10px!important;padding:8px 12px!important;font-size:13px!important;font-weight:600!important}
body .tool-panel.tool-panel .scx .scx-g:hover{border-color:#6366F1!important}
body .tool-panel.tool-panel .scx .scx-tbtn{background:var(--scx-btn)!important;color:var(--scx-ink)!important;border:1px solid var(--scx-fieldbd)!important;border-radius:10px!important;padding:8px 12px!important;font-size:13px!important;font-weight:600!important}
body .tool-panel.tool-panel .scx .scx-tbtn:hover{border-color:#6366F1!important}
body .tool-panel.tool-panel .scx .scx-seg button{background:transparent!important;color:var(--scx-mut)!important;border:0!important;border-radius:9px!important;padding:8px 6px!important;font-size:13px!important;font-weight:600!important}
body .tool-panel.tool-panel .scx .scx-seg button.on{background:linear-gradient(135deg,#4F46E5,#7C3AED)!important;color:#fff!important}
body .tool-panel.tool-panel .scx .scx-create{background:linear-gradient(135deg,#4F46E5,#7C3AED)!important;color:#fff!important;border:0!important;border-radius:14px!important;padding:16px!important;font-size:16px!important;font-weight:800!important;box-shadow:0 10px 26px rgba(99,102,241,.5)!important}
body .tool-panel.tool-panel .scx .scx-create:disabled{box-shadow:none!important}
body .tool-panel.tool-panel .scx .scx-sw{width:40px!important;height:22px!important;border-radius:12px!important;background:var(--scx-track)!important;border:0!important;padding:0!important}
body .tool-panel.tool-panel .scx .scx-sw.on{background:#6366F1!important}
body .tool-panel.tool-panel .scx .scx-fl{background:transparent!important;border:0!important;padding:0!important;color:var(--scx-mut)!important;font-size:12px!important;font-weight:700!important}
body .tool-panel.tool-panel .scx .scx-fl.on{color:#A5B4FC!important}
html[data-theme="light"] body .tool-panel.tool-panel .scx .scx-fl.on{color:#4F46E5!important}
body .tool-panel.tool-panel .scx .scx-fl>span:last-child{color:inherit!important}
body .tool-panel.tool-panel .scx .scx-s{background:var(--scx-panel)!important;border:1px solid var(--scx-border)!important;border-radius:14px!important;padding:14px!important;color:var(--scx-ink)!important;text-align:left!important;font-size:14px!important}
body .tool-panel.tool-panel .scx a.scx-s{color:var(--scx-ink)!important}
body .tool-panel.tool-panel .scx .scx-s span{color:var(--scx-mut)!important}
body .tool-panel.tool-panel .scx .scx-shutter{width:54px!important;height:54px!important;border-radius:50%!important;background:#fff!important;border:5px solid #818CF8!important;padding:0!important}
body .tool-panel.tool-panel .scx .scx-chip{border-radius:999px!important;color:var(--scx-ink)!important;background:var(--scx-panel)!important;border:1px solid var(--scx-fieldbd)!important;padding:6px 12px!important;font-size:13px!important;font-weight:700!important}
body .tool-panel.tool-panel .scx .scx-phone .scx-chip{background:#0F1626!important;color:#CBD5E1!important}
body .tool-panel.tool-panel .scx .scx-chip.grn{color:#34D399!important}
body .tool-panel.tool-panel .scx .scx-pill2{border-radius:999px!important;color:#A5B4FC!important}
html[data-theme="light"] body .tool-panel.tool-panel .scx .scx-pill2{color:#4F46E5!important}
body .tool-panel.tool-panel .scx .scx-pill2.grn{color:#34D399!important}
body .tool-panel.tool-panel .scx .scx-n{color:var(--scx-ink)!important}
body .tool-panel.tool-panel .scx .scx-tg>span:first-child,body .tool-panel.tool-panel .scx .scx-r>span{color:var(--scx-ink)!important}
body .tool-panel.tool-panel .scx .scx-thumb .no{color:#fff!important}
body .tool-panel.tool-panel .scx .det{color:#04281d!important}
body .tool-panel.tool-panel .scx .scx-lbl{color:var(--scx-mut)!important}
body .tool-panel.tool-panel .scx .scx-in{background:var(--scx-panel)!important;color:var(--scx-ink)!important;border:1px solid var(--scx-fieldbd)!important;border-radius:10px!important;padding:9px 12px!important;font-family:var(--font-body)!important;font-size:14px!important;width:100%!important}
body .tool-panel.tool-panel .scx input[type="range"].scx-range{-webkit-appearance:none!important;appearance:none!important;background:linear-gradient(90deg,#6366F1,#8B5CF6) 0/var(--p,50%) 100% no-repeat,var(--scx-track)!important;border:0!important;border-radius:6px!important;padding:0!important;height:6px!important;width:100%!important;accent-color:auto!important}
body .tool-panel.tool-panel .scx .scx-wrap{background-image:radial-gradient(900px 420px at 50% -120px,rgba(99,102,241,.20),transparent)!important;background-color:var(--scx-pagebg)!important}
body .tool-panel.tool-panel .scx .scx-thumb{border-radius:12px!important}
body .tool-panel.tool-panel .scx .scx-card{border-radius:18px!important}
body .tool-panel.tool-panel .scx .scx-stage{border-radius:14px!important}
.scx-card.tall .scx-stage{min-height:0}
.scx-card.tall .scx-thumbs{flex:1;min-height:0}
.scx-stage .quadwrap{max-height:100%}
.scx-stage canvas{max-height:100%}

/* the site image-preview lightbox button is superseded by the editor stage */
.scx .tool-image-preview{display:none!important}