.scan-workspace{display:flex;flex-direction:column;gap:22px}

.scan-stage{display:flex;flex-direction:column;align-items:center;gap:14px;padding:20px;border:1px solid var(--line);border-radius:15px;background:var(--input-bg)}
.scan-state{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%}

.scan-mode-tabs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;width:100%;max-width:520px}
.scan-mode-tab{display:inline-flex;align-items:center;gap:6px;padding:8px 15px;border:1px solid var(--line);border-radius:999px;background:var(--input-bg);color:var(--muted);font:700 11.5px Inter,sans-serif;cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.scan-mode-tab:not(:disabled):hover{border-color:var(--accent);color:var(--accent)}
.scan-mode-tab.active{border-color:var(--accent);color:var(--accent);background:rgba(25,211,239,.08)}
.scan-mode-tab:disabled{opacity:.55;cursor:not-allowed}
.scan-batch-hint{margin:0;max-width:480px;padding:8px 14px;border:1px solid var(--line);border-radius:10px;background:var(--input-bg);color:var(--muted);font-size:11px;line-height:1.6;text-align:center}
.scan-batch-toast{margin:0;padding:7px 14px;border:1px solid rgba(25,211,239,.3);border-radius:999px;background:rgba(25,211,239,.1);color:var(--accent);font-size:11.5px;font-weight:700;text-align:center}

.scan-capture-view{position:relative;width:100%;max-width:520px;border-radius:12px;overflow:hidden;background:#000}
.scan-capture-view video{display:block;width:100%;max-height:430px;aspect-ratio:3/4;object-fit:cover}
.scan-capture-view video[hidden]{display:none}
.scan-capture-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:280px;aspect-ratio:3/4;max-height:430px;color:var(--faint);text-align:center;padding:0 20px}
.scan-idle-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:rgba(25,211,239,.08);color:var(--accent);font-size:22px}
.scan-capture-placeholder p{margin:0;max-width:230px;font-size:12px;line-height:1.6}

.scan-camera-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px}
.scan-upload-alt{color:var(--muted);font-size:12px}
.scan-upload-alt a{color:var(--accent);font-weight:700;text-decoration:none;cursor:pointer}
.scan-upload-alt a:hover{text-decoration:underline}
.scan-retake-note{display:flex;gap:5px;margin:0;padding:8px 12px;border:1px solid rgba(255,178,107,.35);border-radius:10px;background:rgba(255,178,107,.08);color:#ffb26b;font-size:11px;font-weight:650;text-align:center}

.scan-crop-stage{position:relative;display:block;width:100%;max-width:520px;border-radius:12px;overflow:hidden;background:#000}
.scan-crop-stage img{display:block;width:100%;height:auto;max-height:420px;object-fit:contain;margin:auto}
.scan-corner-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.scan-corner-svg polygon{fill:rgba(25,211,239,.16);stroke:#19d3ef;stroke-width:2}
.scan-handle{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:#19d3ef;border:2px solid #06111b;box-shadow:0 2px 8px rgba(0,0,0,.4);cursor:grab;touch-action:none}
.scan-handle:active{cursor:grabbing}

.scan-edit-controls,.scan-filter-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:center}
.scan-edit-actions,.scan-preview-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:center;margin-top:2px}
.button-ghost{padding:9px 15px;border:1px solid var(--line);border-radius:999px;background:var(--input-bg);color:var(--text);font-size:11.5px;font-weight:700;cursor:pointer;transition:border-color .2s,color .2s}
.button-ghost:hover{border-color:var(--accent);color:var(--accent)}
.button-crop-cancel{padding:9px 15px;border:1px solid rgba(251,113,133,.35);border-radius:999px;background:rgba(251,113,133,.08);color:#fb7185;font-size:11.5px;font-weight:800;cursor:pointer;transition:border-color .2s,background .2s}
.button-crop-cancel:hover{border-color:#fb7185;background:rgba(251,113,133,.16)}
.scan-filter-select-label{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:11.5px;font-weight:650}
.scan-filter-select-label select{height:38px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);font:600 12px Inter,sans-serif;cursor:pointer}
.scan-filter-select-label select:focus{border-color:var(--accent);outline:0}
.scan-quality{display:flex;align-items:center;gap:10px;justify-content:center;color:var(--muted);font-size:11.5px;font-weight:650}
.scan-quality input{width:160px}

.scan-preview-stage{width:100%;max-width:520px;border-radius:12px;overflow:hidden;background:#000}
.scan-preview-stage img{display:block;width:100%;height:auto;max-height:420px;object-fit:contain;margin:auto}
.scan-preview-label{margin:0;text-align:center;color:var(--accent);font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}

.scan-pages-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.scan-pages-head strong{font-size:13px}
.scan-pages-strip{display:flex;flex-wrap:wrap;gap:12px;max-height:420px;overflow-y:auto;padding:2px}
.scan-page-thumb{position:relative;width:128px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--input-bg);transition:border-color .5s,box-shadow .5s}
.scan-page-thumb.flash{border-color:var(--accent);box-shadow:0 0 0 3px rgba(25,211,239,.18)}
.scan-page-thumb img{display:block;width:100%;height:160px;object-fit:cover}
.scan-page-thumb .scan-page-num{position:absolute;top:5px;left:5px;padding:2px 6px;border-radius:999px;background:rgba(0,0,0,.55);color:#fff;font-size:9px;font-weight:800}
.scan-page-meta{padding:5px 6px 0;text-align:center}
.scan-page-size{color:var(--muted);font-size:9.5px;font-weight:650;letter-spacing:.02em}
.scan-page-thumb-actions{display:flex;justify-content:space-between;padding:5px;gap:3px}
.scan-page-thumb-actions button{flex:1;padding:4px 2px;border:0;border-radius:6px;background:var(--input-bg);color:var(--muted);font-size:11px;cursor:pointer}
.scan-page-thumb-actions button:hover{color:var(--accent)}

@media(max-width:560px){
  .scan-crop-stage img,.scan-preview-stage img{max-height:300px}
  .scan-capture-placeholder{min-height:220px}
  .scan-quality input{width:120px}
}