.scan-page{max-width:1180px;margin:0 auto;padding:1.25rem 1rem 2.5rem}
.scan-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.scan-head h1{margin:0;font-size:1.35rem;font-weight:700;color:#111}
.scan-head p{margin:.35rem 0 0;color:#64748b;font-size:.9rem}
.scan-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.9fr);gap:1rem}
.scan-panel{border:1px solid #dfe5eb;border-radius:10px;background:#fff;overflow:hidden;display:flex;flex-direction:column;min-height:420px}
.scan-panel-head{padding:.65rem .75rem;background:#f8fafc;border-bottom:1px solid #e7ebef;font-weight:700;color:#243447}
.scan-switch{display:flex;gap:.4rem;flex-wrap:wrap;width:100%}
.scan-switch label{flex:1;min-width:7rem;text-align:center;border:1px solid #d0d7de;border-radius:8px;padding:.45rem .55rem;font-size:.85rem;cursor:pointer;background:#fff;font-weight:600;color:#334155}
.scan-switch input{position:absolute;opacity:0;pointer-events:none}
.scan-switch label:has(input:checked){border-color:#2563eb;background:#eff6ff;color:#1d4ed8}
.scan-layout.is-id{grid-template-columns:1fr}
.scan-panel-body{padding:1rem;display:flex;flex-direction:column;gap:.75rem;flex:1}
.scan-stage{position:relative;background:#0f172a;border-radius:8px;min-height:320px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.scan-stage video,.scan-stage canvas,.scan-stage img{max-width:100%;max-height:56vh;display:block}
.scan-stage canvas{cursor:crosshair;touch-action:none}
.scan-stage-empty{color:#94a3b8;font-size:.9rem;padding:2rem;text-align:center}
.scan-actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:stretch}
.scan-actions .btn{flex:1 1 auto}
.scan-actions-main .scan-primary{flex:1 1 100%;padding:.95rem 1rem;font-size:1.05rem;font-weight:700}
.scan-adjust{font-size:.85rem;color:#475569;margin:0}
.scan-adjust .form-check-input{margin-top:.2rem}
.scan-modes{display:flex;gap:.4rem;flex-wrap:wrap}
.scan-modes label{flex:1;min-width:4.5rem;text-align:center;border:1px solid #d0d7de;border-radius:8px;padding:.45rem .35rem;font-size:.85rem;cursor:pointer;background:#fff}
.scan-modes input{position:absolute;opacity:0;pointer-events:none}
.scan-modes label:has(input:checked){border-color:#2563eb;background:#eff6ff;color:#1d4ed8;font-weight:600}
.scan-pages{display:flex;flex-direction:column;gap:.6rem;max-height:62vh;overflow:auto}
.scan-page-item{display:grid;grid-template-columns:56px 1fr auto;gap:.55rem;align-items:center;border:1px solid #e2e8f0;border-radius:8px;padding:.45rem}
.scan-page-item img{width:56px;height:72px;object-fit:cover;border-radius:4px;background:#f1f5f9;cursor:zoom-in}
.scan-page-item img:hover{outline:2px solid #93c5fd;outline-offset:1px}
.scan-page-preview{position:fixed;inset:0;z-index:2460;background:rgba(15,23,42,.78);display:flex;align-items:center;justify-content:center;padding:1rem}
.scan-page-preview[hidden]{display:none!important}
.scan-page-preview-panel{width:min(920px,100%);max-height:94vh;background:#fff;border-radius:12px;padding:1rem;display:flex;flex-direction:column;gap:.75rem}
.scan-page-preview-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.scan-page-preview-head strong{font-size:1rem;color:#0f172a}
.scan-page-preview-stage{background:#0f172a;border-radius:8px;min-height:240px;display:flex;align-items:center;justify-content:center;overflow:auto;flex:1}
.scan-page-preview-stage img{max-width:100%;max-height:72vh;object-fit:contain;display:block;background:#fff}
.scan-page-preview-nav .btn{flex:1}
.scan-page-item strong{display:block;font-size:.88rem}
.scan-page-item span{color:#64748b;font-size:.78rem}
.scan-page-item .page-ops{display:flex;flex-direction:column;gap:.25rem}
.scan-page-item button{border:0;background:#f1f5f9;border-radius:6px;padding:.2rem .45rem;font-size:.75rem;cursor:pointer}
.scan-page-item button:hover{background:#e2e8f0}
.scan-export{display:flex;flex-direction:column;gap:.55rem;margin-top:auto;padding-top:.5rem;border-top:1px solid #eef2f6}
.scan-export .form-check{font-size:.88rem}
.scan-layout-modes{display:flex;flex-direction:column;gap:.35rem}
.scan-layout-modes label{display:flex;align-items:flex-start;gap:.45rem;font-size:.82rem;color:#334155;cursor:pointer;line-height:1.4}
.scan-layout-modes input{margin-top:.2rem;flex-shrink:0}
.scan-note{font-size:.8rem;color:#64748b;margin:0}
.scan-status{min-height:1.2rem;font-size:.85rem;color:#475569}
.scan-id-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.scan-id-slot.is-next .scan-id-preview{border-color:#2563eb;background:#eff6ff;color:#1d4ed8}
.scan-id-slot{display:flex;flex-direction:column;gap:.45rem;align-items:stretch}
.scan-id-actions{display:flex;flex-wrap:wrap;gap:.4rem}
.scan-id-actions .btn{flex:1 1 5rem}
.scan-id-slot strong{font-size:.9rem;color:#243447}
.scan-id-preview{aspect-ratio:1.586/1;border:1px dashed #cbd5e1;border-radius:8px;background:#f8fafc;color:#94a3b8;display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:.85rem}
.scan-id-preview img{width:100%;height:100%;object-fit:contain;background:#fff}
.scan-ocr-panel{display:flex;flex-direction:column;gap:.45rem;padding:.75rem;border:1px solid #e2e8f0;border-radius:8px;background:#f8fafc}
.scan-ocr-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.scan-ocr-head strong{font-size:.9rem;color:#243447}
.scan-ocr-text{width:100%;min-height:8rem;resize:vertical;border:1px solid #d0d7de;border-radius:8px;padding:.65rem .75rem;font-size:.85rem;line-height:1.55;color:#1e293b;background:#fff}
.scan-camera{position:fixed;inset:0;z-index:2400;background:#0b1220;display:flex;flex-direction:column}
.scan-camera[hidden]{display:none!important}
.scan-camera-stage{position:relative;flex:1;min-height:0;background:#000;overflow:hidden}
.scan-camera-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:none}
.scan-camera-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.scan-camera-mask{position:absolute;inset:0;pointer-events:none}
.scan-camera-guide{position:absolute;border:2px solid rgba(56,189,248,.95);border-radius:10px;box-shadow:0 0 0 9999px rgba(15,23,42,.45);transition:left .22s ease,top .22s ease,width .22s ease,height .22s ease}
.scan-camera-guide.is-locked{border-color:#4ade80;box-shadow:0 0 0 9999px rgba(15,23,42,.38),0 0 0 2px rgba(74,222,128,.35)}
.scan-camera-hint{position:absolute;left:50%;bottom:1rem;transform:translateX(-50%);margin:0;padding:.4rem .75rem;border-radius:999px;background:rgba(15,23,42,.72);color:#e2e8f0;font-size:.85rem;white-space:nowrap;max-width:92%;overflow:hidden;text-overflow:ellipsis}
.scan-camera-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.75rem;padding:.85rem 1rem calc(.85rem + env(safe-area-inset-bottom));background:#0f172a}
.scan-camera-bar .btn:first-child{justify-self:start}
.scan-camera-bar .btn:last-child{justify-self:end}
.scan-camera-shutter{min-width:7.5rem;font-weight:700}
.scan-id-adjust{position:fixed;inset:0;z-index:2450;background:rgba(15,23,42,.72);display:flex;align-items:center;justify-content:center;padding:1rem}
.scan-id-adjust[hidden]{display:none!important}
.scan-id-adjust-panel{width:min(640px,100%);background:#fff;border-radius:12px;padding:1rem;display:flex;flex-direction:column;gap:.75rem;max-height:92vh}
.scan-id-adjust-head{display:flex;flex-direction:column;gap:.2rem}
.scan-id-adjust-head strong{font-size:1rem;color:#0f172a}
.scan-id-adjust-tip{font-size:.82rem;color:#64748b}
.scan-id-adjust-stage{background:#0f172a;border-radius:8px;min-height:220px;display:flex;align-items:center;justify-content:center;overflow:auto}
.scan-id-adjust-stage canvas{max-width:100%;max-height:58vh;display:block;cursor:crosshair;touch-action:none}
@media (max-width:860px){
  .scan-layout{grid-template-columns:1fr}
  .scan-stage{min-height:260px}
  .scan-pages{max-height:none}
  .scan-id-grid{grid-template-columns:1fr}
}
