Hugging Face's logo

Spaces:
Cauanne
/
Checkerv5
Sleeping

App Files Community
Cauanne commited on
Commit
47f844b
·
verified ·
1 Parent(s): b1d2cc8

Upload index.html

Browse files
Files changed (1) hide show
  1. templates/index.html +796 -0
templates/index.html CHANGED
@@ -0,0 +1,796 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="pt-BR">
3
+ <head>
4
+ <meta charset="UTF-8"/>
5
+ <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1"/>
6
+ <title>BY: Rei Hotmart Checker Payt V2</title>
7
+ <audio id="liveAudio" src="/static/live.mp3" preload="auto"></audio>
8
+ <script src="https://cdn.socket.io/4.7.2/socket.io.min.js" defer></script>
9
+ <link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Share+Tech+Mono&family=Inter:wght@400;500;600&display=swap" rel="stylesheet"/>
10
+ <style>
11
+ *,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
12
+ :root{
13
+ --bg: #000000;
14
+ --surface: #050505;
15
+ --card: #0a0a0a;
16
+ --border: #1a1a1a;
17
+ --border2: #ffffff;
18
+ --green: #00ff88;
19
+ --green-d: #00e680;
20
+ --red: #ff1744;
21
+ --red-d: #e6154d;
22
+ --yellow: #ffffff;
23
+ --blue: #ffffff;
24
+ --purple: #ffffff;
25
+ --cyan: #ffffff;
26
+ --orange: #cccccc;
27
+ --text: #ffffff;
28
+ --muted: #444444;
29
+ --radius: 12px;
30
+ --mono: 'Share Tech Mono', monospace;
31
+ --hud: 'Orbitron', monospace;
32
+ --body: 'Inter', sans-serif;
33
+ }
34
+ html{scroll-behavior:smooth}
35
+ body{background:var(--bg);color:var(--text);font-family:var(--body);min-height:100vh;overflow-x:hidden}
36
+ #bgc{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.06}
37
+ .wrap{position:relative;z-index:1;max-width:1440px;margin:0 auto;padding:0 16px 40px}
38
+
39
+ /* ── HEADER ── */
40
+ .header{padding:30px 0 20px;text-align:center}
41
+ .header::after{content:'';display:block;height:3px;margin-top:20px;
42
+ background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1) 15%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0.1) 85%, transparent);
43
+ animation:hline 6s linear infinite;box-shadow: 0 0 25px rgba(255,255,255,0.3);}
44
+ @keyframes hline{0%,100%{opacity:.4}50%{opacity:1}}
45
+ .logo{font-family:var(--hud);font-size:clamp(28px,8vw,64px);font-weight:900;letter-spacing:8px;
46
+ background:linear-gradient(135deg,#fff,#eee); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; text-shadow: 0 0 15px #fff;
47
+ -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
48
+ text-transform: uppercase;animation:lp 3s ease-in-out infinite}
49
+ @keyframes lp{0%,100%{opacity:1}50%{opacity:0.95}}
50
+ .logo-sub{font-family:var(--mono);font-size:12px;letter-spacing:4px;color:var(--muted);margin-top:8px;font-weight:600}
51
+ .logo-sub em{color:#ffffff;font-style:normal;font-weight:900}
52
+
53
+ /* ── TOP BAR ── */
54
+ .topbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;
55
+ background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);
56
+ padding:12px 20px;margin:15px 0;font-family:var(--mono);font-size:13px;box-shadow: 0 0 25px rgba(0,255,136,0.15),inset 0 0 15px rgba(0,255,136,0.05)}
57
+ .tb-dot{width:10px;height:10px;border-radius:50%;background:var(--muted);transition:all .3s;flex-shrink:0}
58
+ .tb-dot.on{background:#00ff88;box-shadow:0 0 20px #00ff88;animation:db 1s ease-in-out infinite}
59
+ @keyframes db{0%,100%{opacity:1}50%{opacity:.3}}
60
+ .tb-s{display:flex;align-items:center;gap:10px}
61
+ .tb-s span{color:#ffffff;font-weight:bold}
62
+ .tb-clock{color:#ffffff;letter-spacing:2px;font-weight:bold}
63
+ .tb-el{color:var(--muted);font-size:12px}
64
+
65
+ /* ── STATS ── */
66
+ .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:15px 0}
67
+ .stat{background:var(--card);border:2px solid var(--border);border-radius:var(--radius);
68
+ padding:18px 12px 15px;text-align:center;position:relative;overflow:hidden;transition:all .3s ease;
69
+ box-shadow: 0 0 20px rgba(0,0,0,0.4),inset 0 0 10px rgba(0,0,0,0.2)}
70
+ .stat:hover{transform: translateY(-5px); border-color: var(--border2); box-shadow: 0 0 35px rgba(0,255,136,0.2),inset 0 0 15px rgba(0,255,136,0.05)}
71
+ .stat::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;border-radius:var(--radius) var(--radius) 0 0}
72
+ .s-live::before{background:linear-gradient(90deg,#00e680,#00ff88);box-shadow: 0 0 15px #00ff88}
73
+ .s-die::before {background:linear-gradient(90deg,#e6154d,#ff1744);box-shadow: 0 0 15px #ff1744}
74
+ .s-err::before {background:linear-gradient(90deg,#ff9500,#ffff00);box-shadow: 0 0 15px #ffff00}
75
+ .s-tot::before {background:linear-gradient(90deg,#0088ff,#00d4ff);box-shadow: 0 0 15px #00d4ff}
76
+ .stat-lbl{font-family:var(--mono);font-size:14px;letter-spacing:3px;text-transform:uppercase;margin-bottom:8px;font-weight:bold}
77
+ .s-live .stat-lbl{color:#ffffff} .s-die .stat-lbl{color:#ff1744}
78
+ .s-err .stat-lbl{color:#ffffff} .s-tot .stat-lbl{color:#ffffff}
79
+ .stat-val{font-family:var(--hud);font-size:clamp(36px,8vw,64px);font-weight:900;line-height:1}
80
+ .s-live .stat-val{color:var(--green); text-shadow: 0 0 15px rgba(0,255,136,0.3)}
81
+ .s-die .stat-val{color:var(--red); text-shadow: 0 0 15px rgba(255,23,68,0.3)}
82
+ .s-err .stat-val{color:var(--yellow); text-shadow: 0 0 15px rgba(255,255,0,0.3)}
83
+ .s-tot .stat-val{color:var(--blue); text-shadow: 0 0 15px rgba(0,212,255,0.3)}
84
+ .stat-rate{font-family:var(--mono);font-size:14px;color:var(--muted);margin-top:6px;font-weight:500}
85
+ @keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.3);text-shadow:0 0 50px var(--green)}100%{transform:scale(1)}}
86
+ .s-live.pop .stat-val{animation:pop .5s ease}
87
+
88
+ /* ── PROGRESS ── */
89
+ .prog-wrap{background:var(--card);border:2px solid var(--border);border-radius:var(--radius);padding:15px 20px;margin:12px 0;box-shadow: 0 0 20px rgba(0,0,0,0.4),inset 0 0 10px rgba(0,0,0,0.2)}
90
+ .prog-head{display:flex;justify-content:space-between;font-family:var(--mono);font-size:16px;color:var(--muted);margin-bottom:10px;font-weight:bold}
91
+ .prog-head b{color:#ffffff;font-size:18px}
92
+ .prog-track{height:10px;background:var(--surface);border-radius:6px;overflow:hidden;border:1px solid var(--border)}
93
+ .prog-fill{height:100%;width:0%;background:linear-gradient(90deg,#00ff88,#00ffff);border-radius:6px;transition:width .5s cubic-bezier(0.4, 0, 0.2, 1);box-shadow: 0 0 20px #00ff88}
94
+
95
+ /* ── THREADS PANEL ── */
96
+ .threads-panel{background:var(--card);border:2px solid var(--border);border-radius:var(--radius);padding:15px 20px;margin:12px 0;box-shadow: 0 0 20px rgba(0,0,0,0.4),inset 0 0 10px rgba(0,0,0,0.2)}
97
+ .threads-hd{display:flex;align-items:center;justify-content:space-between;font-family:var(--mono);font-size:16px;color:var(--muted);margin-bottom:12px;font-weight:bold}
98
+ .threads-hd b{color:#cccccc;font-size:18px}
99
+ .threads-grid{display:flex;flex-wrap:wrap;gap:10px}
100
+ .thread-slot{flex:1;min-width:180px;background:var(--surface);border:2px solid var(--border);border-radius:10px;
101
+ padding:12px 18px;font-family:var(--mono);font-size:14px;display:flex;align-items:center;gap:12px;transition:all .3s;min-height:55px}
102
+ .thread-slot.active{border-color:#00ffff;background:rgba(0,255,255,.12);box-shadow: 0 0 25px rgba(0,255,255,0.3),inset 0 0 10px rgba(0,255,255,0.1)}
103
+ .thread-slot.done-live{border-color:#ffffff;background:rgba(0,255,136,.15);animation:flashG .6s ease;box-shadow: 0 0 20px rgba(0,255,136,0.4)}
104
+ .thread-slot.done-die {border-color:#ff1744;background:rgba(255,23,68,.15); animation:flashR .6s ease;box-shadow: 0 0 20px rgba(255,23,68,0.4)}
105
+ .thread-slot.done-err {border-color:#ffffff;background:rgba(255,255,0,.12); animation:flashY .6s ease;box-shadow: 0 0 20px rgba(255,255,0,0.3)}
106
+ @keyframes flashG{0%{box-shadow:0 0 30px #00ff8899,inset 0 0 10px rgba(0,255,136,0.2)}100%{box-shadow:none}}
107
+ @keyframes flashR{0%{box-shadow:0 0 30px #ff174499,inset 0 0 10px rgba(255,23,68,0.2)}100%{box-shadow:none}}
108
+ @keyframes flashY{0%{box-shadow:0 0 30px #ffff0099,inset 0 0 10px rgba(255,255,0,0.2)}100%{box-shadow:none}}
109
+ .t-spin{width:12px;height:12px;border:2px solid var(--border2);border-top-color:#00ffff;
110
+ border-radius:50%;animation:spin .6s linear infinite;flex-shrink:0;display:none;box-shadow: 0 0 10px #00ffff}
111
+ .thread-slot.active .t-spin{display:block}
112
+ @keyframes spin{to{transform:rotate(360deg)}}
113
+ .t-num{color:var(--muted);font-size:13px;flex-shrink:0;font-weight:bold}
114
+ .t-card{color:#00ffff;flex:1;font-size:14px;font-weight:600;word-break:break-all}
115
+ .thread-slot:not(.active) .t-card{color:var(--muted);opacity:.5}
116
+
117
+ /* ── MAIN GRID ── */
118
+ .grid{display:grid;grid-template-columns:420px 1fr;gap:16px;margin-top:16px}
119
+
120
+ /* ── PANEL ── */
121
+ .panel{background:var(--card);border:2px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;box-shadow: 0 0 25px rgba(0,0,0,0.4),inset 0 0 10px rgba(0,0,0,0.2)}
122
+ .panel-hd{background:var(--surface);border-bottom:2px solid var(--border);padding:12px 18px;display:flex;align-items:center;gap:10px}
123
+ .ph-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;background:#ff9500;box-shadow: 0 0 10px #ff9500}
124
+ .ph-ttl{font-family:var(--mono);font-size:16px;letter-spacing:3px;text-transform:uppercase;color:#ffffff;font-weight:bold}
125
+ .ph-act{margin-left:auto;background:none;border:none;font-family:var(--mono);font-size:11px;
126
+ color:var(--muted);cursor:pointer;letter-spacing:1px;transition:all .2s;padding:6px 10px;border-radius:6px}
127
+ .ph-act:hover{color:#ffffff;background: rgba(255,255,0,0.15)}
128
+ .panel-body{padding:18px;flex:1;display:flex;flex-direction:column;gap:15px}
129
+
130
+ /* ── TEXTAREA ── */
131
+ .ta{width:100%;height:250px;background:var(--surface);border:2px solid var(--border);border-radius:10px;
132
+ color:#ffffff;font-family:var(--mono);font-size:16px;padding:18px;resize:vertical;outline:none;
133
+ line-height:1.6;transition:all .3s;-webkit-appearance:none;box-shadow: 0 0 15px rgba(0,0,0,0.3),inset 0 0 10px rgba(0,0,0,0.2);font-weight:600}
134
+ .ta:focus{border-color:#ffffff;box-shadow:0 0 0 3px #00ff8833, inset 0 0 15px rgba(0,255,136,0.1),0 0 20px rgba(0,255,136,0.2)}
135
+ .ta::placeholder{color:#1a2a3a;font-style:italic}
136
+ .ta:disabled{opacity:.4;cursor:not-allowed}
137
+
138
+ /* ── THREAD CONTROL ── */
139
+ .thread-ctrl{display:flex;align-items:center;gap:12px;background:var(--surface);border:2px solid var(--border);border-radius:10px;padding:12px 18px;box-shadow: 0 0 15px rgba(0,0,0,0.3),inset 0 0 10px rgba(0,0,0,0.2);transition:all .3s}
140
+ .thread-ctrl:hover{border-color:var(--border2);box-shadow: 0 0 25px rgba(255,149,0,0.2),inset 0 0 10px rgba(255,149,0,0.05)}
141
+ .tc-lbl{font-family:var(--mono);font-size:16px;color:var(--text);white-space:nowrap;font-weight:bold}
142
+ .tc-lbl em{color:#cccccc;font-style:normal;font-weight:900}
143
+ input[type=range]{flex:1;accent-color:var(--orange);cursor:pointer;height:6px;min-width:0}
144
+ .tc-val{font-family:var(--hud);font-size:24px;color:#cccccc;font-weight:900;min-width:40px;text-align:center}
145
+
146
+ .hint{font-family:var(--mono);font-size:14px;color:var(--muted);padding:12px 18px;
147
+ background:var(--surface);border-radius:8px;border-left:4px solid #00d4ff;line-height:1.4;box-shadow: inset 0 0 10px rgba(0,0,0,0.2)}
148
+ .hint span{color:#00ffff;font-weight:bold}
149
+
150
+ /* ── BUTTONS ── */
151
+ .btn-row{display:flex;gap:10px}
152
+ .btn{flex:1;padding:18px 15px;border:none;border-radius:10px;font-family:var(--hud);font-size:14px;
153
+ font-weight:900;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:all .3s;
154
+ position:relative;overflow:hidden;-webkit-tap-highlight-color:transparent;border:2px solid transparent}
155
+ .btn::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;
156
+ background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}
157
+ .btn:hover:not(:disabled)::after{left:100%}
158
+ .btn-start{background:linear-gradient(135deg,#00e680,#00ff88);color:var(--bg);box-shadow: 0 0 20px rgba(0,255,136,0.4)}
159
+ .btn-start:hover:not(:disabled){transform:scale(1.02);box-shadow: 0 0 35px rgba(0,255,136,0.6)}
160
+ .btn-stop{background:linear-gradient(135deg,#e6154d,#ff1744);color:var(--text);box-shadow: 0 0 20px rgba(255,23,68,0.4)}
161
+ .btn-stop:hover:not(:disabled){transform:scale(1.02);box-shadow: 0 0 35px rgba(255,23,68,0.6)}
162
+ .btn:disabled{opacity:.3;cursor:not-allowed;filter:grayscale(1)}
163
+
164
+ /* ── LOGS ── */
165
+ .log-panel{flex:1;background:var(--card);border:2px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;box-shadow: 0 0 25px rgba(0,0,0,0.4),inset 0 0 10px rgba(0,0,0,0.2)}
166
+ .log-body{flex:1;padding:10px;overflow-y:auto;max-height:400px;min-height:400px;font-family:var(--mono);font-size:13px;display:flex;flex-direction:column;gap:6px;background:rgba(0,0,0,0.2)}
167
+ .log-body::-webkit-scrollbar{width:6px}
168
+ .log-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
169
+ .log-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);gap:10px;opacity:.5}
170
+ .log-empty .ico{font-size:40px}
171
+
172
+ .entry{padding:10px 14px;border-radius:8px;background:var(--surface);border-left:4px solid var(--muted);animation:fadeIn .3s ease;transition:all .2s}
173
+ @keyframes fadeIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}
174
+ .entry:hover{background:rgba(255,255,255,0.03)}
175
+ .entry.live{border-color:var(--green);background:rgba(0,255,136,0.05);color:var(--green)}
176
+ .entry.die{border-color:var(--red);background:rgba(255,23,68,0.03);color:var(--red)}
177
+ .entry.error{border-color:var(--yellow);background:rgba(255,255,0,0.03);color:var(--yellow)}
178
+ .entry-top{display:flex;align-items:center;gap:10px;margin-bottom:4px;flex-wrap:wrap}
179
+ .badge{padding:2px 8px;border-radius:4px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:1px}
180
+ .b-live{background:var(--green);color:var(--bg)}
181
+ .b-die{background:var(--red);color:var(--text)}
182
+ .b-erro{background:var(--yellow);color:var(--bg)}
183
+ .b-info{background:var(--blue);color:var(--bg)}
184
+ .b-t{color:var(--cyan);font-weight:bold;font-size:11px}
185
+ .b-tempo{color:var(--muted);font-size:11px}
186
+ .e-card{font-weight:bold;letter-spacing:1px}
187
+ .live .e-card{color:var(--green)}
188
+ .die .e-card{color:var(--red)}
189
+ .e-ts{margin-left:auto;color:var(--muted);font-size:11px;flex-shrink:0}
190
+ .b-tempo{color:var(--muted);font-size:11px;flex-shrink:0;background:rgba(255,255,255,0.05);padding:2px 6px;border-radius:4px}
191
+ .entry-msg{color:var(--muted);font-size:12px;line-height:1.4;word-break:break-all;opacity:0.7}
192
+ .live .entry-msg{color:var(--green);opacity:0.8}
193
+ .die .entry-msg{color:var(--text);opacity:0.6}
194
+
195
+ /* ── LIVES LIST ── */
196
+ .lives-panel{background:var(--card);border:2px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;box-shadow: 0 0 25px rgba(0,0,0,0.4),inset 0 0 10px rgba(0,0,0,0.2)}
197
+ .lives-body{flex:1;padding:10px;overflow-y:auto;max-height:300px;background:rgba(0,255,136,0.02)}
198
+ .lives-body::-webkit-scrollbar{width:6px}
199
+ .lives-body::-webkit-scrollbar-thumb{background:var(--green);border-radius:3px}
200
+ .live-item{padding:12px;border-radius:8px;background:rgba(0,255,136,0.05);border:1px solid rgba(0,255,136,0.2);margin-bottom:10px;font-family:var(--mono);animation:slideIn .3s ease;box-shadow: 0 2px 10px rgba(0,0,0,0.2)}
201
+ @keyframes slideIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
202
+ .lives-empty{padding:40px;text-align:center;color:var(--muted);font-family:var(--mono);font-size:14px}
203
+
204
+ /* ── ACTION BUTTONS (LIVES) ── */
205
+ .lives-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:15px;background:var(--surface);border-top:2px solid var(--border)}
206
+ .btn-action{padding:15px;border:none;border-radius:10px;font-family:var(--hud);font-size:12px;font-weight:900;color:var(--text);cursor:pointer;transition:all .3s;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-transform:uppercase;letter-spacing:1px}
207
+ .btn-download{background:linear-gradient(135deg,#8e2de2,#4a00e0);box-shadow: 0 0 15px rgba(142,45,226,0.4)}
208
+ .btn-copy{background:linear-gradient(135deg,#00d2ff,#3a7bd5);box-shadow: 0 0 15px rgba(0,210,255,0.4)}
209
+ .btn-action:hover{transform:translateY(-3px);filter:brightness(1.2)}
210
+ .btn-action span{font-size:10px;opacity:.8;font-family:var(--mono)}
211
+
212
+ /* ── TOASTS ── */
213
+ #toasts{position:fixed;bottom:20px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:10px}
214
+ .toast{padding:14px 24px;border-radius:10px;font-family:var(--mono);font-size:14px;font-weight:bold;color:var(--text);box-shadow: 0 10px 30px rgba(0,0,0,0.5);animation:toastIn .3s cubic-bezier(0.175, 0.885, 0.32, 1.275)}
215
+ @keyframes toastIn{from{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}
216
+ .toast.ok{background:var(--green);color:var(--bg)}
217
+ .toast.err{background:var(--red)}
218
+ .toast.info{background:var(--blue);color:var(--bg)}
219
+
220
+ /* ── MOBILE ── */
221
+ @media(max-width:900px){
222
+ .grid{grid-template-columns:1fr}
223
+ .stats{grid-template-columns:repeat(2,1fr)}
224
+ .logo{font-size:40px}
225
+ }
226
+ </style>
227
+ </head>
228
+ <body>
229
+ <canvas id="bgc"></canvas>
230
+ <audio id="liveAudio" preload="auto">
231
+ <source src="/static/live.mp3" type="audio/mpeg">
232
+ </audio>
233
+
234
+ <div class="wrap">
235
+ <header class="header">
236
+ <div class="logo">REI HOTMART</div>
237
+ <div class="logo-sub">PAYT CHECKER <em>V2.0</em> · ULTIMATE EDITION</div>
238
+ </header>
239
+
240
+ <div class="topbar">
241
+ <div class="tb-s">
242
+ <div id="dot" class="tb-dot"></div>
243
+ <div id="statusLbl">STATUS: <span style="color:var(--muted);">INATIVO</span></div>
244
+ </div>
245
+ <div class="tb-clock" id="clock">00:00:00</div>
246
+ <div class="tb-el">ELAPSED: <span id="elapsed">00:00</span></div>
247
+ <div class="tb-s">
248
+ <span id="threadCount">0 / 1</span> THREADS ACTIVE
249
+ </div>
250
+ <div class="tb-s">
251
+ <button onclick="playLiveSound()" style="background:var(--green); color:var(--bg); border:none; padding:4px 10px; border-radius:4px; font-family:var(--mono); font-weight:bold; cursor:pointer; font-size:11px;">TESTAR ÁUDIO 🔊</button>
252
+ </div>
253
+ </div>
254
+
255
+ <div class="stats">
256
+ <div class="stat s-live" id="cLive">
257
+ <div class="stat-lbl">Lives</div>
258
+ <div class="stat-val" id="vLive">0</div>
259
+ <div class="stat-rate" id="rLive">0%</div>
260
+ </div>
261
+ <div class="stat s-die">
262
+ <div class="stat-lbl">Dies</div>
263
+ <div class="stat-val" id="vDie">0</div>
264
+ <div class="stat-rate" id="rDie">0%</div>
265
+ </div>
266
+ <div class="stat s-err">
267
+ <div class="stat-lbl">Errors</div>
268
+ <div class="stat-val" id="vErr">0</div>
269
+ <div class="stat-rate" id="rErr">0%</div>
270
+ </div>
271
+ <div class="stat s-tot">
272
+ <div class="stat-lbl">Total</div>
273
+ <div class="stat-val" id="vTot">0</div>
274
+ <div class="stat-rate" id="rTot">0 checked</div>
275
+ </div>
276
+ </div>
277
+
278
+ <div class="prog-wrap">
279
+ <div class="prog-head">
280
+ <span>PROGRESSO GERAL</span>
281
+ <b id="progPct">0%</b>
282
+ </div>
283
+ <div class="prog-track">
284
+ <div id="progBar" class="prog-fill"></div>
285
+ </div>
286
+ <div style="text-align:center; margin-top:8px; font-family:var(--mono); font-size:12px; color:var(--muted);" id="progLbl">0 / 0</div>
287
+ </div>
288
+
289
+ <div class="threads-panel">
290
+ <div class="threads-hd">
291
+ <span>MONITOR DE THREADS</span>
292
+ <b>ACTIVE SLOTS</b>
293
+ </div>
294
+ <div class="threads-grid" id="threadsGrid">
295
+ <!-- Slots via JS -->
296
+ </div>
297
+ </div>
298
+
299
+ <div class="grid">
300
+ <div class="panel">
301
+ <div class="panel-hd">
302
+ <div class="ph-dot"></div>
303
+ <div class="ph-ttl">Terminal de Entrada</div>
304
+ <span id="card-count-badge" class="badge b-info" style="display:none; margin-left:10px;">0 CARDS</span>
305
+ <button class="ph-act" onclick="clearInput()">[ LIMPAR ]</button>
306
+ </div>
307
+ <div class="panel-body">
308
+ <textarea id="cardsInput" class="ta" placeholder="numero|mes|ano|cvv&#10;numero|mes|ano|cvv..."></textarea>
309
+
310
+ <div class="thread-ctrl">
311
+ <div class="tc-lbl">THREADS: <em id="thrLabel">1</em></div>
312
+ <input type="range" id="thrSlider" min="1" max="4" value="1" oninput="onSlider(this.value)">
313
+ <div class="tc-val" id="thrVal">1</div>
314
+ </div>
315
+
316
+ <div class="hint">
317
+ <span>DICA:</span> Use de 1 a 4 threads para melhor performance sem bloqueios.
318
+ </div>
319
+
320
+ <div class="btn-row">
321
+ <button id="btnStart" class="btn btn-start" onclick="doStart()">INICIAR CHECKER</button>
322
+ <button id="btnStop" class="btn btn-stop" onclick="doStop()" disabled>PARAR</button>
323
+ </div>
324
+ </div>
325
+ </div>
326
+
327
+ <div style="display:flex; flex-direction:column; gap:16px;">
328
+ <div class="lives-panel">
329
+ <div class="panel-hd">
330
+ <div class="ph-dot" style="background:var(--green); box-shadow:0 0 10px var(--green)"></div>
331
+ <div class="ph-ttl" style="color:var(--green)">LIVES ENCONTRADAS (<span id="liveCnt">0</span>)</div>
332
+ <button class="ph-act" onclick="playLiveSound()" style="color:var(--orange); border:1px solid var(--orange); margin-right:5px;">TESTAR ÁUDIO</button>
333
+ <button class="ph-act" onclick="clearLives()">LIMPAR</button>
334
+ </div>
335
+ <div id="livesList" class="lives-body">
336
+ <div class="lives-empty">
337
+ <div class="ico">✨</div>
338
+ <div>Nenhuma live ainda…</div>
339
+ </div>
340
+ </div>
341
+ <div class="lives-actions">
342
+ <button class="btn-action btn-download" onclick="downloadLives()">
343
+ ↓ BAIXAR LIVES (.TXT)
344
+ <span>SALVAR ARQUIVO</span>
345
+ </button>
346
+ <button class="btn-action btn-copy" onclick="copyLives()">
347
+ 📋 COPIAR LIVES
348
+ <span>PARA O CLIPBOARD</span>
349
+ </button>
350
+ </div>
351
+ </div>
352
+
353
+ <div class="log-panel">
354
+ <div class="panel-hd">
355
+ <div class="ph-dot" style="background:var(--blue); box-shadow:0 0 10px var(--blue)"></div>
356
+ <div class="ph-ttl" style="color:var(--blue)">CONSOLE DE RESULTADOS</div>
357
+ <button class="ph-act" onclick="clearLog()">LIMPAR LOG</button>
358
+ </div>
359
+ <div id="log" class="log-body">
360
+ <div class="log-empty">
361
+ <div class="ico">📡</div>
362
+ <div>Aguardando início do processamento...</div>
363
+ </div>
364
+ </div>
365
+ </div>
366
+ </div>
367
+ </div>
368
+ </div>
369
+
370
+ <div id="toasts"></div>
371
+
372
+ <script>
373
+ /* ── MATRIX ── */
374
+ (function(){
375
+ const cv=document.getElementById('bgc'),cx=cv.getContext('2d');
376
+ function rs(){cv.width=innerWidth;cv.height=innerHeight}rs();addEventListener('resize',rs);
377
+ const CH='01アイウエオカキクケコサシスセソタチツテトナニヌネノ';
378
+ let dr=[];
379
+ function init(){dr=Array.from({length:Math.floor(cv.width/18)},()=>Math.random()*cv.height/18|0)}
380
+ init();addEventListener('resize',init);
381
+ function draw(){
382
+ cx.fillStyle='rgba(2,4,10,.08)';cx.fillRect(0,0,cv.width,cv.height);
383
+ cx.fillStyle='#00ff88';cx.font='12px Share Tech Mono';
384
+ dr.forEach((y,i)=>{
385
+ cx.fillText(CH[Math.random()*CH.length|0],i*18,y*18);
386
+ if(y*18>cv.height&&Math.random()>.975)dr[i]=0;dr[i]++;
387
+ });
388
+ }
389
+ let last=0;(function loop(ts){if(ts-last>60){draw();last=ts}requestAnimationFrame(loop)})(0);
390
+ })();
391
+
392
+ /* ── CLOCK ── */
393
+ setInterval(()=>{document.getElementById('clock').textContent=new Date().toTimeString().slice(0,8)},1000);
394
+
395
+ /* ── CARD COUNTER ── */
396
+ const cardsInput = document.getElementById('cardsInput');
397
+ const cardCountBadge = document.getElementById('card-count-badge');
398
+ const vTot = document.getElementById('vTot');
399
+ cardsInput.addEventListener('input', () => {
400
+ const lines = cardsInput.value.split('\n').filter(l => l.trim() !== '' && !l.trim().startsWith('#'));
401
+ const count = lines.length;
402
+ if (count > 0) {
403
+ cardCountBadge.textContent = `${count} CARDS`;
404
+ cardCountBadge.style.display = 'inline-block';
405
+ if(!running) vTot.textContent = count;
406
+ } else {
407
+ cardCountBadge.style.display = 'none';
408
+ if(!running) vTot.textContent = '0';
409
+ }
410
+ });
411
+
412
+ /* ── ELAPSED ── */
413
+ let _ts=null,_el=null;
414
+ function startEl(){_ts=Date.now();_el=setInterval(()=>{const s=Math.floor((Date.now()-_ts)/1000);document.getElementById('elapsed').textContent=String(Math.floor(s/60)).padStart(2,'0')+':'+String(s%60).padStart(2,'0')},500)}
415
+ function stopEl(){clearInterval(_el);_el=null}
416
+
417
+ /* ── ÁUDIO DE LIVE ── */
418
+ const liveAudio = new Audio('/static/live.mp3');
419
+ liveAudio.preload = 'auto';
420
+
421
+ function playLiveSound(){
422
+ try {
423
+ console.log('Tentando tocar áudio de LIVE...');
424
+ liveAudio.pause();
425
+ liveAudio.currentTime = 0;
426
+
427
+ const playPromise = liveAudio.play();
428
+ if (playPromise !== undefined) {
429
+ playPromise.then(() => {
430
+ console.log('Áudio reproduzido com sucesso!');
431
+ }).catch(e => {
432
+ console.error('Erro na reprodução (Autoplay bloqueado?):', e);
433
+ toast('Clique no botão "TESTAR ÁUDIO" para habilitar o som!', 'info');
434
+ });
435
+ }
436
+ } catch(e) {
437
+ console.error('Erro crítico ao tocar áudio:', e);
438
+ }
439
+ }
440
+
441
+ // Prepara o áudio sem tocar automaticamente
442
+ document.addEventListener('click', () => {
443
+ liveAudio.load();
444
+ }, { once: true });
445
+
446
+ /* ── SLIDER ── */
447
+ function onSlider(v){
448
+ document.getElementById('thrLabel').textContent=v;
449
+ document.getElementById('thrVal').textContent=v;
450
+ if(!running)buildThreadsGrid(parseInt(v));
451
+ }
452
+
453
+ /* ── THREADS GRID ── */
454
+ let _numThreads=1;
455
+ let _activeSlots = new Set();
456
+
457
+ function buildThreadsGrid(n){
458
+ _numThreads=n;
459
+ const g=document.getElementById('threadsGrid');g.innerHTML='';
460
+ for(let i=0;i<n;i++){
461
+ const d=document.createElement('div');
462
+ d.className='thread-slot';d.id='tslot-'+i;
463
+ d.innerHTML=`<div class="t-spin"></div><span class="t-num">T${i+1}</span><span class="t-card" id="tc-${i}">— aguardando —</span>`;
464
+ g.appendChild(d);
465
+ }
466
+ updateActiveThreadCount();
467
+ }
468
+ buildThreadsGrid(1);
469
+
470
+ function updateActiveThreadCount() {
471
+ document.getElementById('threadCount').textContent=`${_activeSlots.size} / ${_numThreads}`;
472
+ }
473
+
474
+ function threadStart(slot,card){
475
+ const el=document.getElementById('tslot-'+slot);if(!el)return;
476
+ el.className='thread-slot active';
477
+ const tc=document.getElementById('tc-'+slot);if(tc)tc.textContent=card;
478
+ _activeSlots.add(slot);
479
+ updateActiveThreadCount();
480
+ }
481
+
482
+ function threadDone(slot,status){
483
+ const el=document.getElementById('tslot-'+slot);if(!el)return;
484
+ const cls={'LIVE':'done-live','DIE':'done-die','ERROR':'done-err','ERRO':'done-err'}[status]||'';
485
+ el.className='thread-slot '+cls;
486
+ const tc=document.getElementById('tc-'+slot);if(tc)tc.textContent='— concluído —';
487
+ _activeSlots.delete(slot);
488
+ updateActiveThreadCount();
489
+ setTimeout(()=>{
490
+ if(el && !el.classList.contains('active')) {
491
+ el.className='thread-slot';
492
+ if(tc)tc.textContent='— aguardando —';
493
+ }
494
+ },1800);
495
+ }
496
+
497
+ function resetThreads(){
498
+ _activeSlots.clear();
499
+ for(let i=0;i<_numThreads;i++){
500
+ const el=document.getElementById('tslot-'+i);
501
+ if(el){
502
+ el.className='thread-slot';
503
+ const tc=document.getElementById('tc-'+i);
504
+ if(tc)tc.textContent='— aguardando —';
505
+ }
506
+ }
507
+ updateActiveThreadCount();
508
+ }
509
+
510
+ /* ── SOCKET.IO ── */
511
+ let socket=null,running=false;
512
+ function initSocket(){
513
+ socket=io({
514
+ transports: ['polling', 'websocket'],
515
+ reconnection: true,
516
+ reconnectionAttempts: Infinity,
517
+ reconnectionDelay: 500,
518
+ reconnectionDelayMax: 2000,
519
+ timeout: 20000,
520
+ autoConnect: true
521
+ });
522
+
523
+ socket.on('sync_state', d => {
524
+ updateStats(d);
525
+ if(d.running){
526
+ running = true;
527
+ setUI(true);
528
+ if(!_el) startEl();
529
+ buildThreadsGrid(d.threads || 1);
530
+ addLog('info','SYS',null,`🔄 Reconectado — checker rodando (${d.checked}/${d.total})`,null,null,null);
531
+ if(d.results && d.results.length){
532
+ d.results.forEach(e=>{ if(e.status==='LIVE') addLive(e.card, e.tempo, e.msg); });
533
+ }
534
+ } else {
535
+ running = false;
536
+ setUI(false);
537
+ addLog('info','SYS',null,'Conectado ao servidor — pronto',null,null,null);
538
+ }
539
+ });
540
+
541
+ socket.on('started',d=>{
542
+ running=true;setUI(true);startEl();buildThreadsGrid(d.threads||1);resetThreads();
543
+ addLog('info','SYS',null,`⚡ Iniciado · ${d.total} cartão(ões) · ${d.threads} thread(s)`,null,null,null);
544
+ toast(`Iniciado com ${d.threads} thread(s)!`,'ok');
545
+ // Resetar estatísticas
546
+ vLiv.textContent='0'; vDie.textContent='0'; vErr.textContent='0'; vTot.textContent=d.total||0;
547
+ updateStats({total:d.total||0,checked:0,lives:0,dies:0,errors:0});
548
+ });
549
+
550
+ socket.on('thread_start',d=>threadStart(d.slot,d.card));
551
+
552
+ socket.on('result',d=>{
553
+ const {entry:e,stats:s}=d;
554
+ threadDone(e.slot,e.status);
555
+ addLog(e.status.toLowerCase(),e.status,e.card,e.msg,e.ts,e.slot,e.tempo);
556
+ updateStats(s);
557
+
558
+ // Atualização inteligente da textarea: Remove apenas o card processado, mantendo a ordem.
559
+ const textarea = document.getElementById('cardsInput');
560
+ const lines = textarea.value.split('\n');
561
+ const target = e.card.trim();
562
+ const idx = lines.findIndex(l => l.trim() === target);
563
+ if(idx !== -1) {
564
+ lines.splice(idx, 1);
565
+ textarea.value = lines.join('\n');
566
+ }
567
+
568
+ // Atualiza o contador de cards no badge
569
+ const count = lines.filter(l => l.trim() !== '' && !l.trim().startsWith('#')).length;
570
+ if (count > 0) {
571
+ cardCountBadge.textContent = `${count} CARDS`;
572
+ cardCountBadge.style.display = 'inline-block';
573
+ } else {
574
+ cardCountBadge.style.display = 'none';
575
+ }
576
+
577
+ if(e.status==='LIVE'){
578
+ addLive(e.card, e.tempo, e.msg);
579
+ pulseLive();
580
+ playLiveSound();
581
+ toast('🟢 LIVE: '+e.card.split('|')[0],'ok');
582
+ }
583
+ });
584
+
585
+ socket.on('finished',d=>{
586
+ running=false;setUI(false);stopEl();resetThreads();updateStats(d.stats);
587
+ addLog('info','SYS',null,d.stopped?'⛔ Checker parado.':'✔ Checker finalizado!',null,null,null);
588
+ toast(d.stopped?'Checker parado!':'Checker finalizado!','info');
589
+ });
590
+
591
+ socket.on('disconnect',()=>{
592
+ addLog('info','SYS',null,'⚠️ Conexão perdida — reconectando...',null,null,null);
593
+ });
594
+ }
595
+ window.addEventListener('load', () => {
596
+ setTimeout(initSocket, 200);
597
+ // Notificação persistente para ativar o som
598
+ setTimeout(() => {
599
+ const soundToast = toast('🔊 Clique AQUI ou no botão "TESTAR ÁUDIO" para ativar o som das LIVES!', 'info', 0);
600
+ soundToast.style.cursor = 'pointer';
601
+ soundToast.style.border = '2px solid var(--green)';
602
+ soundToast.style.animation = 'pulse 2s infinite';
603
+
604
+ const enableSound = () => {
605
+ // playLiveSound(); <- Removido para não tocar som ao carregar a página
606
+ soundToast.style.transition = 'opacity 0.5s';
607
+ soundToast.style.opacity = '0';
608
+ setTimeout(() => soundToast.remove(), 500);
609
+ document.removeEventListener('click', enableSound);
610
+ };
611
+
612
+ soundToast.addEventListener('click', enableSound);
613
+ document.addEventListener('click', enableSound, { once: true });
614
+ }, 1000);
615
+ });
616
+
617
+ // Adicionando animação de pulso para o toast de som
618
+ const style = document.createElement('style');
619
+ style.innerHTML = `
620
+ @keyframes pulse {
621
+ 0% { box-shadow: 0 0 0 0 rgba(0, 255, 136, 0.7); }
622
+ 70% { box-shadow: 0 0 0 10px rgba(0, 255, 136, 0); }
623
+ 100% { box-shadow: 0 0 0 0 rgba(0, 255, 136, 0); }
624
+ }`;
625
+ document.head.appendChild(style);
626
+
627
+ /* ── UI ── */
628
+ function setUI(on){
629
+ const dot=document.getElementById('dot'),lbl=document.getElementById('statusLbl');
630
+ document.getElementById('btnStart').disabled=on;
631
+ document.getElementById('btnStop').disabled=!on;
632
+ document.getElementById('cardsInput').disabled=on;
633
+ document.getElementById('thrSlider').disabled=on;
634
+ if(on){
635
+ dot.className='tb-dot on';
636
+ lbl.innerHTML='STATUS: <span style="color:var(--green); text-shadow: 0 0 10px var(--green);">EM EXECUÇÃO</span>';
637
+ } else {
638
+ dot.className='tb-dot';
639
+ lbl.innerHTML='STATUS: <span style="color:var(--muted);">INATIVO</span>';
640
+ }
641
+ }
642
+
643
+ function updateStats(s){
644
+ const vLive = document.getElementById('vLive');
645
+ const vDie = document.getElementById('vDie');
646
+ const vErr = document.getElementById('vErr');
647
+ const vTot = document.getElementById('vTot');
648
+
649
+ vLive.textContent = String(s.lives || 0);
650
+ vDie.textContent = String(s.dies || 0);
651
+ vErr.textContent = String(s.errors || 0);
652
+ vTot.textContent = String(s.total || 0);
653
+
654
+ document.getElementById('liveCnt').textContent = String(s.lives || 0);
655
+ const tot=s.checked||1;
656
+ document.getElementById('rLive').textContent=Math.round((s.lives||0)/tot*100)+'%';
657
+ document.getElementById('rDie').textContent=Math.round((s.dies||0)/tot*100)+'%';
658
+ document.getElementById('rErr').textContent=Math.round((s.errors||0)/tot*100)+'%';
659
+ document.getElementById('rTot').textContent=(s.checked||0)+' checked';
660
+ const pct=s.total>0?Math.round((s.checked||0)/s.total*100):0;
661
+ document.getElementById('progBar').style.width=pct+'%';
662
+ document.getElementById('progPct').textContent=pct+'%';
663
+ document.getElementById('progLbl').textContent=`${s.checked||0} / ${s.total||0}`;
664
+ }
665
+
666
+ function pulseLive(){
667
+ const c=document.getElementById('cLive');
668
+ c.classList.remove('pop');void c.offsetWidth;c.classList.add('pop');
669
+ setTimeout(()=>c.classList.remove('pop'),600);
670
+ }
671
+
672
+ function playLiveSound() {
673
+ const audio = document.getElementById('liveAudio');
674
+ if (audio) {
675
+ audio.currentTime = 0;
676
+ audio.play().catch(e => console.log('Erro ao tocar áudio:', e));
677
+ }
678
+ }
679
+
680
+ function addLog(type,badge,card,msg,ts,slot,tempo){
681
+ const log=document.getElementById('log');
682
+ const empty=log.querySelector('.log-empty');if(empty)empty.remove();
683
+
684
+ const bMap={live:'b-live',die:'b-die',erro:'b-erro',error:'b-erro',info:'b-info',sys:'b-info'};
685
+ const cls=bMap[type]||'b-info';
686
+ const el=document.createElement('div');
687
+ el.className=`entry ${type}`;
688
+
689
+ const tBadge = (slot!=null) ? `<span class="b-t">T${slot+1}</span>` : '';
690
+ const tempoBadge = (tempo!=null&&tempo>0) ? `<span class="b-tempo" style="margin-left: 8px; color: var(--muted); font-size: 12px;">${tempo}s</span>` : '';
691
+ const cardHtml = card ? `<span class="e-card">${esc(card)}</span>` : '';
692
+
693
+ const msgLine = msg ? `<div class="entry-msg" style="margin-top: 4px; font-size: 13px; color: var(--text); opacity: 0.9;">${esc(msg)}</div>` : '';
694
+
695
+ el.innerHTML =
696
+ `<div class="entry-top" style="display: flex; align-items: center; flex-wrap: wrap;">`+
697
+ `<span class="badge ${cls}" style="margin-right: 8px;">${esc(badge)}</span>`+
698
+ tBadge+
699
+ `<div style="display: flex; align-items: center;">`+
700
+ cardHtml+
701
+ tempoBadge+
702
+ `</div>`+
703
+ `</div>`+
704
+ msgLine;
705
+
706
+ log.appendChild(el);
707
+ log.scrollTop=log.scrollHeight;
708
+ }
709
+
710
+ function addLive(card, tempo, msg){
711
+ const list=document.getElementById('livesList');
712
+ const empty=list.querySelector('.lives-empty');if(empty)empty.remove();
713
+ const el=document.createElement('div');el.className='live-item';
714
+
715
+ const tempoHtml = tempo ? `<span style="color:var(--muted); font-size:11px; float:right;">${tempo}s</span>` : '';
716
+
717
+ el.innerHTML = `
718
+ <div style="border-bottom:1px solid rgba(0,255,136,0.1); padding-bottom:5px; margin-bottom:5px;">
719
+ <span style="color:#00ff88; font-weight:bold; font-size:16px; letter-spacing:1px;">${esc(card)}</span>
720
+ ${tempoHtml}
721
+ </div>
722
+ <div style="color:rgba(255,255,255,0.8); font-size:13px; line-height:1.4; word-break:break-all;">
723
+ ${esc(msg)}
724
+ </div>
725
+ `;
726
+
727
+ list.appendChild(el);
728
+ list.scrollTop=list.scrollHeight;
729
+ }
730
+
731
+ function esc(s){return String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;')}
732
+
733
+ function toast(msg,type,duration=3500){
734
+ const c=document.getElementById('toasts');
735
+ const t=document.createElement('div');t.className=`toast ${type}`;t.textContent=msg;
736
+ c.appendChild(t);
737
+ if(duration > 0) {
738
+ setTimeout(()=>{t.style.transition='opacity .3s';t.style.opacity='0';setTimeout(()=>t.remove(),320)},duration);
739
+ }
740
+ return t;
741
+ }
742
+
743
+ function clearInput(){ document.getElementById('cardsInput').value=''; vTot.textContent='0'; cardCountBadge.style.display='none'; }
744
+ function clearLog(){ document.getElementById('log').innerHTML='<div class="log-empty"><div class="ico">📡</div><div>Aguardando início do processamento...</div></div>'; }
745
+ function clearLives(){ document.getElementById('livesList').innerHTML='<div class="lives-empty"><div class="ico">✨</div><div>Nenhuma live ainda…</div></div>'; document.getElementById('liveCnt').textContent='0'; }
746
+
747
+ async function doStart(){
748
+ const cards=document.getElementById('cardsInput').value.trim();
749
+ if(!cards){toast('Cole os cartões antes de iniciar!','err');return}
750
+ const threads=parseInt(document.getElementById('thrSlider').value)||1;
751
+ clearLives();
752
+ clearLog();
753
+ document.getElementById('progBar').style.width='0%';
754
+ document.getElementById('progPct').textContent='0%';
755
+ document.getElementById('progLbl').textContent='0 / 0';
756
+ document.getElementById('vLive').textContent='0';
757
+ document.getElementById('vDie').textContent='0';
758
+ document.getElementById('vErr').textContent='0';
759
+ document.getElementById('vTot').textContent='0';
760
+ document.getElementById('rLive').textContent='0%';
761
+ document.getElementById('rDie').textContent='0%';
762
+ document.getElementById('rErr').textContent='0%';
763
+ document.getElementById('rTot').textContent='0 checked';
764
+ resetThreads();
765
+ try{
766
+ const r=await fetch('/api/start',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({cards,threads})});
767
+ const d=await r.json();
768
+ if(!r.ok)toast(d.msg||'Erro ao iniciar','err');
769
+ }catch(e){toast('Erro de conexão','err')}
770
+ }
771
+
772
+ async function doStop(){
773
+ try{
774
+ document.getElementById('btnStop').disabled=true;
775
+ await fetch('/api/stop',{method:'POST'});
776
+ }catch(e){toast('Erro ao parar','err')}
777
+ }
778
+
779
+ async function downloadLives(){
780
+ window.location.href='/api/download/lives';
781
+ }
782
+
783
+ function copyLives(){
784
+ const items = document.querySelectorAll('.live-item');
785
+ if(items.length === 0) { toast('Nenhuma live para copiar!','err'); return; }
786
+ let txt = '';
787
+ items.forEach(el => { txt += el.textContent + '\n'; });
788
+ navigator.clipboard.writeText(txt).then(() => {
789
+ toast('Lives copiadas com sucesso!','ok');
790
+ }).catch(() => {
791
+ toast('Erro ao copiar lives','err');
792
+ });
793
+ }
794
+ </script>
795
+ </body>
796
+ </html>