@keyframes spin { to { transform: rotate(360deg); } }

.modal-overlay { position:fixed; inset:0; background:rgba(15,30,80,0.5); backdrop-filter:blur(6px); z-index:100; display:flex; align-items:center; justify-content:center; padding:16px; animation:fadeIn 0.2s ease; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.modal { background:var(--card); border:1px solid var(--border); border-radius:18px; width:90%; max-width:520px; overflow:hidden; animation:slideUp 0.25s cubic-bezier(0.34,1.56,0.64,1); position:relative; }
@keyframes slideUp { from{opacity:0;transform:translateY(28px) scale(0.96)} to{opacity:1;transform:translateY(0) scale(1)} }
.modal-close { position:absolute; top:14px; right:14px; width:28px; height:28px; border-radius:50%; background:rgba(0,0,0,0.06); display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:14px; z-index:2; transition:background 0.15s; }
.modal-close:hover { background:rgba(0,0,0,0.1); }

.analyzing-modal { background:var(--card); border:1px solid var(--border); max-width:400px; text-align:center; padding:32px 28px 36px; width:100%; overflow:hidden; }

/* Scan image box */
.anlz-img-wrap { position:relative; width:180px; height:140px; margin:0 auto 22px; border-radius:12px; overflow:hidden; border:2px solid rgba(75,142,240,0.35); }
.anlz-img      { width:100%; height:100%; object-fit:cover; display:block; }
.anlz-img-placeholder { width:100%; height:100%; background:var(--card2); display:flex; align-items:center; justify-content:center; }

/* Scan line */
.anlz-scan-line { position:absolute; left:0; right:0; height:2px; background:linear-gradient(90deg, transparent 0%, #3b82f6 20%, #60a5fa 50%, #3b82f6 80%, transparent 100%); box-shadow:0 0 12px 3px rgba(96,165,250,0.6); animation:scanDown 1.8s ease-in-out infinite; }
@keyframes scanDown { 0%{top:0%} 50%{top:calc(100% - 2px)} 100%{top:0%} }

/* Corner brackets */
.anlz-corner { position:absolute; width:14px; height:14px; border-color:#60a5fa; border-style:solid; }
.anlz-corner.tl { top:6px; left:6px;  border-width:2px 0 0 2px; }
.anlz-corner.tr { top:6px; right:6px; border-width:2px 2px 0 0; }
.anlz-corner.bl { bottom:6px; left:6px;  border-width:0 0 2px 2px; }
.anlz-corner.br { bottom:6px; right:6px; border-width:0 2px 2px 0; }

/* Grid overlay */
.anlz-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(59,130,246,0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(59,130,246,0.07) 1px, transparent 1px); background-size:24px 24px; }

/* Horizontal sweep lines */
.anlz-sweep { position:absolute; left:0; right:0; height:1px; background:rgba(96,165,250,0.3); animation:sweepFade 1.8s ease-in-out infinite; }
.anlz-sweep:nth-child(1) { animation-delay:0s; }
.anlz-sweep:nth-child(2) { animation-delay:0.6s; }
.anlz-sweep:nth-child(3) { animation-delay:1.2s; }
@keyframes sweepFade { 0%{top:0%;opacity:0.6} 50%{top:100%;opacity:0} 100%{top:0%;opacity:0} }

.analyzing-title { font-size:18px; font-weight:700; color:var(--text); margin-bottom:20px; }

.progress-bar  { height:3px; background:var(--border); border-radius:2px; overflow:hidden; }
.progress-fill { height:100%; background:linear-gradient(90deg, #2563eb, #60a5fa); border-radius:2px; animation:progressAnim 55s linear forwards; }
@keyframes progressAnim { 0%{width:2%} 10%{width:22%} 35%{width:52%} 65%{width:74%} 90%{width:91%} 100%{width:95%} }

.listing-modal { max-width:680px; max-height:85vh; overflow-y:auto; }
.listing-modal-header { padding:22px 24px 16px; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:12px; }
.lmh-title { font-size:17px; font-weight:700; }
.lmh-sub   { font-size:12px; color:var(--muted); }
.listing-body   { padding:20px 24px; }
.listing-actions { padding:16px 24px; border-top:1px solid var(--border); display:flex; gap:12px; justify-content:flex-end; }
.edit-modal { max-width: 600px; position: relative; }

.camera-modal { max-width:480px; }
.camera-modal-header { padding:18px 22px 14px; border-bottom:1px solid var(--border); }
.camera-body { padding:20px; }
video { width:100%; border-radius:10px; background:#000; }
.camera-actions { display:flex; margin-top:14px; justify-content:center; }
.capture-btn { width:58px; height:58px; border-radius:50%; background:linear-gradient(135deg, var(--primary), var(--primary2)); display:flex; align-items:center; justify-content:center; font-size:22px; cursor:pointer; box-shadow:0 0 22px rgba(37,99,200,0.35); transition:transform 0.15s; }
.capture-btn:hover { transform:scale(1.08); }

.delete-confirm { position:fixed; inset:0; background:rgba(15,30,80,0.45); backdrop-filter:blur(4px); z-index:200; display:flex; align-items:center; justify-content:center; animation:fadeIn 0.15s ease; }
.delete-confirm-box { background:var(--card); border:1px solid rgba(220,38,38,0.25); border-radius:16px; padding:28px 32px; text-align:center; max-width:340px; animation:slideUp 0.2s ease; }
.delete-confirm-box .dc-icon  { font-size:32px; margin-bottom:12px; }
.delete-confirm-box .dc-title { font-size:16px; font-weight:700; margin-bottom:6px; }
.delete-confirm-box .dc-sub   { font-size:13px; color:var(--muted); margin-bottom:22px; }
.delete-confirm-box .dc-btns  { display:flex; gap:10px; justify-content:center; }

@media(max-width:768px){
  .modal-overlay { align-items:center; justify-content:center; padding:20px 16px; }
  .modal { width:100%; border-radius:16px; }
  .analyzing-modal { padding:36px 24px; }
  .analyzing-title { font-size:18px; }
  .analyzing-sub { font-size:12.5px; margin-bottom:22px; }
  .delete-confirm-box { padding:24px 20px; }
  .camera-modal { width:100%; }
}