:root {
  --bg: #0f172a; --fg: #e2e8f0; --muted: #94a3b8; --card: #111827; --accent: #38bdf8;
  --danger: #ef4444; --btn-text: #f8fafc;
}
*{box-sizing:border-box;}
html,body{height:100%;margin:0;background:var(--bg);color:var(--fg);font-family:ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;}
.container{max-width:960px;margin:0 auto;padding:16px;}
.title{margin:12px 0 0;font-size:28px;font-weight:800;}
.subtitle{margin:4px 0 16px;color:var(--muted);}
.card{background:var(--card);border:1px solid #1f2937;border-radius:16px;padding:16px;margin:16px 0;box-shadow:0 10px 30px rgba(0,0,0,0.3);}
.input{width:100%;font-size:18px;padding:12px 14px;border-radius:12px;border:1px solid #374151;background:#0b1220;color:var(--fg);outline:none;margin-bottom:12px;}
.btn{display:inline-block;padding:10px 14px;font-size:14px;font-weight:700;border-radius:10px;border:1px solid #334155;background:linear-gradient(180deg,#111827,#0b1220);color:var(--btn-text);cursor:pointer;transition:transform .06s ease, box-shadow .1s ease;}
.btn:active{transform:translateY(1px);} .btn.secondary{border-color:#2a3648;} .btn.link{background:transparent;border:none;color:var(--accent);width:auto;padding:8px 0;}
.error{color:var(--danger);}
.qr{display:block;width:240px;height:240px;margin:12px auto 16px;border-radius:12px;background:#fff;}
.arrow{width:0;height:0;margin:20px auto 16px;border-left:18px solid transparent;border-right:18px solid transparent;border-bottom:120px solid var(--accent);filter:drop-shadow(0 6px 18px rgba(0,0,0,0.35));transition:transform .25s ease-out;}
.scanner-wrap{margin-top:12px;border:1px solid #2b3446;border-radius:12px;overflow:hidden;}
.hidden{display:none;}
.list{list-style:none;margin:0;padding:0;}
.list li{border-bottom:1px solid #1f2937;padding:10px 6px;}
.list li:last-child{border-bottom:none;}
.mono{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;font-size:12px;background:#0b1220;padding:2px 6px;border-radius:6px;}

.dnd-list{max-height:60vh; overflow:auto; padding:0; border:1px solid #2b3446; border-radius:12px;}
.dnd-item{padding:10px; margin:0; cursor:grab; user-select:none;}
.dnd-item.dragover{outline:2px dashed #38bdf8; outline-offset:-6px;}
.dnd-item.dragging{opacity:0.6;}