@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');

:root {
  --g:       #00ff41;
  --g2:      #39ff14;
  --gdim:    #00882a;
  --gdark:   #001800;
  --gbg:     #050f05;
  --gpanel:  #070d07;
  --gtext:   #4a7a4a;
  --cyan:    #00d4ff;
  --cyandim: #007799;
  --amber:   #ffb000;
  --red:     #ff3030;
  --pink:    #ff00cc;
  --border:  #1a3a1a;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}

body{
  background:var(--gbg);
  color:var(--g);
  font-family:'Courier New',Courier,monospace;
  font-size:13px;
  min-height:100vh;
  line-height:1.6;
}

/* CRT scanlines overlay */
body::before{
  content:'';
  position:fixed;
  inset:0;
  background:repeating-linear-gradient(
    0deg,
    transparent 0px, transparent 3px,
    rgba(0,0,0,0.07) 3px, rgba(0,0,0,0.07) 4px
  );
  pointer-events:none;
  z-index:9999;
}

/* ── NAV ── */
.nav{
  background:var(--gdark);
  border-bottom:2px solid var(--gdim);
  padding:.6rem 1.2rem;
  display:flex;
  align-items:center;
  gap:.8rem;
  position:sticky;
  top:0;
  z-index:100;
  box-shadow:0 2px 0 rgba(0,255,65,.1);
}
.nav-brand{
  font-family:'Press Start 2P',monospace;
  font-size:.6rem;
  color:var(--cyan);
  text-shadow:0 0 8px var(--cyan);
  text-decoration:none;
  letter-spacing:1px;
  white-space:nowrap;
}
.nav-links{display:flex;gap:.3rem;margin-left:auto;align-items:center;flex-wrap:wrap}
.nav-link{
  font-family:'Press Start 2P',monospace;
  font-size:.45rem;
  color:var(--gtext);
  text-decoration:none;
  padding:.45rem .7rem;
  border:1px solid transparent;
  transition:all .1s;
  white-space:nowrap;
}
.nav-link:hover,.nav-link.active{
  border-color:var(--gdim);
  background:rgba(0,255,65,.08);
  color:var(--g);
}
.nav-link.danger{color:var(--red)}
.nav-link.danger:hover{border-color:var(--red);background:rgba(255,48,48,.08)}
.blink{animation:blink 1.2s step-end infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}

/* ── LAYOUT ── */
.main{padding:1.2rem 1.5rem;max-width:1700px;margin:0 auto}
.page-title{
  font-family:'Press Start 2P',monospace;
  font-size:.75rem;
  color:var(--cyan);
  text-shadow:0 0 10px var(--cyan);
  margin-bottom:1.2rem;
  display:flex;
  align-items:center;
  gap:.8rem;
}
.page-title::before{content:'> ';color:var(--g)}

/* ── FILTERS ── */
.filters{
  background:var(--gpanel);
  border:1px solid var(--border);
  padding:.8rem 1rem;
  margin-bottom:1rem;
  display:flex;
  flex-wrap:wrap;
  gap:.8rem;
  align-items:flex-end;
}
.fg{display:flex;flex-direction:column;gap:.3rem}
.fl{
  font-family:'Press Start 2P',monospace;
  font-size:.4rem;
  color:var(--gtext);
  text-transform:uppercase;
}
.fi,.fs{
  background:var(--gbg);
  border:1px solid var(--border);
  color:var(--g);
  font-family:'Courier New',monospace;
  font-size:12px;
  padding:.35rem .6rem;
  outline:none;
  transition:border-color .15s;
  min-width:130px;
}
.fi:focus,.fs:focus{border-color:var(--gdim);box-shadow:0 0 4px rgba(0,255,65,.2)}
.fs option{background:var(--gbg)}
.filters .btn{align-self:flex-end}

/* ── BUTTONS ── */
.btn{
  font-family:'Press Start 2P',monospace;
  font-size:.45rem;
  padding:.55rem .9rem;
  border:2px solid;
  cursor:pointer;
  transition:all .05s;
  text-decoration:none;
  display:inline-block;
  white-space:nowrap;
  letter-spacing:.5px;
}
.btn:active{transform:translate(2px,2px);box-shadow:none!important}
.btn-g{
  color:var(--gbg);background:var(--g);border-color:var(--g);
  box-shadow:3px 3px 0 var(--gdim);
}
.btn-g:hover{background:var(--g2);color:#000}
.btn-c{
  color:var(--gbg);background:var(--cyan);border-color:var(--cyan);
  box-shadow:3px 3px 0 var(--cyandim);
}
.btn-c:hover{filter:brightness(1.1)}
.btn-o{
  color:var(--g);background:transparent;border-color:var(--border);
  box-shadow:2px 2px 0 var(--gdark);
}
.btn-o:hover{border-color:var(--gdim);background:rgba(0,255,65,.05)}
.btn-red{
  color:#fff;background:var(--red);border-color:var(--red);
  box-shadow:3px 3px 0 #880000;
}
.btn-sm{font-size:.38rem;padding:.35rem .55rem}

/* ── TABLE ── */
.tbl-wrap{overflow-x:auto;border:1px solid var(--border)}
.tbl{width:100%;border-collapse:collapse;font-size:12px}
.tbl th{
  font-family:'Press Start 2P',monospace;
  font-size:.4rem;
  color:var(--cyan);
  padding:.55rem .7rem;
  text-align:left;
  border-bottom:2px solid var(--gdim);
  background:var(--gdark);
  white-space:nowrap;
  user-select:none;
}
.tbl th a{color:inherit;text-decoration:none}
.tbl th a:hover{color:var(--g)}
.tbl td{
  padding:.45rem .7rem;
  border-bottom:1px solid rgba(0,255,65,.07);
  vertical-align:middle;
  color:var(--g);
}
.tbl tr:hover td{background:rgba(0,255,65,.03)}
.tbl tr.row-fail td{opacity:.35}
.tbl tr.row-success td .co-name{color:var(--gdim)}

/* ── EDITABLE INPUTS ── */
.editable{
  background:transparent;
  border:none;
  border-bottom:1px dashed var(--border);
  color:var(--g);
  font-family:'Courier New',monospace;
  font-size:12px;
  width:100%;
  outline:none;
  padding:.15rem .2rem;
  transition:border-bottom-color .15s;
}
.editable:focus{border-bottom-color:var(--gdim);background:rgba(0,255,65,.04)}
.editable.phone{color:var(--cyan);font-weight:bold}
.editable.phone::placeholder{color:var(--gtext);font-weight:normal}

.notes-ta{
  background:transparent;
  border:1px dashed var(--border);
  color:var(--g);
  font-family:'Courier New',monospace;
  font-size:11px;
  width:100%;
  min-height:32px;
  max-height:80px;
  resize:vertical;
  outline:none;
  padding:.3rem;
  transition:border-color .15s;
}
.notes-ta:focus{border-color:var(--gdim);background:rgba(0,255,65,.03)}

.save-dot{
  display:inline-block;
  width:6px;height:6px;
  border-radius:50%;
  background:var(--border);
  margin-left:4px;
  transition:background .3s;
  vertical-align:middle;
}
.save-dot.saving{background:var(--amber);animation:blink .5s infinite}
.save-dot.saved{background:var(--g)}

/* ── STATUS ── */
.st-btns{display:flex;gap:3px}
.st-btn{
  font-family:'Press Start 2P',monospace;
  font-size:.4rem;
  padding:.3rem .5rem;
  border:1px solid;
  cursor:pointer;
  background:transparent;
  transition:all .1s;
  white-space:nowrap;
}
.st-btn.s-pending{color:var(--gtext);border-color:var(--border)}
.st-btn.s-success{color:var(--g);border-color:var(--g);background:rgba(0,255,65,.1)}
.st-btn.s-fail{color:var(--red);border-color:var(--red);background:rgba(255,48,48,.1)}
.st-btn.s-call_again{color:var(--amber);border-color:var(--amber);background:rgba(255,176,0,.1)}
.st-btn:not(.active){opacity:.35}
.st-btn:not(.active):hover{opacity:.8}
.st-btn.active{opacity:1}

.badge{
  font-family:'Press Start 2P',monospace;
  font-size:.35rem;
  padding:.2rem .5rem;
  border:1px solid;
  display:inline-block;
  white-space:nowrap;
}
.badge-industry{color:var(--cyan);border-color:var(--cyandim);background:rgba(0,212,255,.08)}
.badge-pending{color:var(--gtext);border-color:var(--gtext)}
.badge-success{color:var(--g);border-color:var(--g);background:rgba(0,255,65,.1)}
.badge-fail{color:var(--red);border-color:var(--red);background:rgba(255,48,48,.1)}
.badge-call_again{color:var(--amber);border-color:var(--amber);background:rgba(255,176,0,.1)}

/* ── STATS GRID ── */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:1.2rem}
.stat-box{
  border:1px solid var(--border);
  background:var(--gpanel);
  padding:1rem;
  text-align:center;
  box-shadow:2px 2px 0 var(--gdark);
}
.stat-n{
  font-family:'Press Start 2P',monospace;
  font-size:1.6rem;
  color:var(--cyan);
  text-shadow:0 0 12px var(--cyan);
  display:block;
  margin-bottom:.5rem;
}
.stat-l{
  font-family:'Press Start 2P',monospace;
  font-size:.38rem;
  color:var(--gtext);
}
.stat-n.green{color:var(--g);text-shadow:0 0 12px var(--g)}
.stat-n.red{color:var(--red);text-shadow:0 0 12px var(--red)}
.stat-n.amber{color:var(--amber);text-shadow:0 0 12px var(--amber)}

/* ── ALERTS ── */
.alert{border:1px solid;padding:.6rem .9rem;margin-bottom:1rem;font-size:.8rem}
.alert-ok{border-color:var(--g);color:var(--g);background:rgba(0,255,65,.05)}
.alert-err{border-color:var(--red);color:var(--red);background:rgba(255,48,48,.05)}

/* ── PAGINATION ── */
.pager{display:flex;gap:.4rem;margin-top:1rem;flex-wrap:wrap;align-items:center}
.pager a,.pager span{
  font-family:'Press Start 2P',monospace;
  font-size:.4rem;
  padding:.4rem .65rem;
  border:1px solid var(--border);
  color:var(--gtext);
  text-decoration:none;
}
.pager a:hover{border-color:var(--gdim);color:var(--g)}
.pager .cur{border-color:var(--g);color:var(--g);background:rgba(0,255,65,.08)}
.pager-info{font-size:.4rem;font-family:'Press Start 2P',monospace;color:var(--gtext);margin-left:auto}

/* ── UPLOAD ── */
.upload-box{
  border:2px dashed var(--gdim);
  background:var(--gpanel);
  padding:2rem;
  text-align:center;
  transition:border-color .2s;
  cursor:pointer;
}
.upload-box:hover,.upload-box.dragover{border-color:var(--g);background:rgba(0,255,65,.03)}
.upload-box input[type=file]{display:none}
.upload-icon{font-size:2rem;display:block;margin-bottom:.8rem}
.preview-table{border:1px solid var(--border);margin-top:1rem}
.preview-table th{background:var(--gdark);color:var(--cyan);font-family:'Press Start 2P',monospace;font-size:.38rem;padding:.4rem .6rem}
.preview-table td{padding:.35rem .6rem;border-bottom:1px solid rgba(0,255,65,.07);font-size:11px;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── LOGIN ── */
.login-wrap{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:2rem;
  position:relative;
  overflow:hidden;
}
#mc{position:fixed;top:0;left:0;opacity:.12;z-index:0;pointer-events:none}
.login-box{
  position:relative;z-index:1;
  width:100%;max-width:460px;
  border:2px solid var(--gdim);
  background:rgba(5,15,5,.97);
  box-shadow:0 0 40px rgba(0,255,65,.15),4px 4px 0 var(--gdark);
  padding:2rem 2rem 2.5rem;
}
.login-box::before{
  content:'';
  position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--g),transparent);
  animation:scan 3s linear infinite;
}
@keyframes scan{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.login-logo{
  font-family:'Press Start 2P',monospace;
  font-size:1.3rem;
  color:var(--cyan);
  text-shadow:0 0 20px var(--cyan),0 0 40px rgba(0,212,255,.3);
  display:block;
  text-align:center;
  margin-bottom:.5rem;
  animation:gp 3s ease-in-out infinite;
}
@keyframes gp{
  0%,100%{text-shadow:0 0 20px var(--cyan)}
  50%{text-shadow:0 0 30px var(--cyan),0 0 60px rgba(0,212,255,.4)}
}
.login-sub{
  font-family:'Press Start 2P',monospace;
  font-size:.38rem;
  color:var(--gdim);
  text-align:center;
  display:block;
  margin-bottom:1.5rem;
  letter-spacing:2px;
}
.term-lines{
  font-size:.72rem;
  color:var(--gdim);
  line-height:1.9;
  margin-bottom:1.5rem;
  min-height:4rem;
  font-family:'Courier New',monospace;
}
.term-lines .p{color:var(--g)}
.login-label{
  font-family:'Press Start 2P',monospace;
  font-size:.4rem;
  color:var(--gtext);
  display:block;
  margin-bottom:.4rem;
}
.login-input{
  width:100%;
  background:var(--gbg);
  border:1px solid var(--border);
  color:var(--g);
  font-family:'Courier New',monospace;
  font-size:1rem;
  padding:.65rem .8rem;
  outline:none;
  transition:border-color .2s,box-shadow .2s;
  margin-bottom:1rem;
}
.login-input:focus{border-color:var(--gdim);box-shadow:0 0 8px rgba(0,255,65,.2)}
.login-btn{
  width:100%;
  background:var(--g);
  border:2px solid var(--g);
  color:var(--gbg);
  font-family:'Press Start 2P',monospace;
  font-size:.5rem;
  padding:.85rem;
  cursor:pointer;
  letter-spacing:2px;
  box-shadow:3px 3px 0 var(--gdim);
  transition:all .05s;
  margin-top:.5rem;
}
.login-btn:hover{background:var(--g2)}
.login-btn:active{transform:translate(2px,2px);box-shadow:none}
.login-err{
  color:var(--red);
  font-family:'Press Start 2P',monospace;
  font-size:.38rem;
  margin-bottom:1rem;
  padding:.5rem .7rem;
  border:1px solid var(--red);
  background:rgba(255,48,48,.05);
}
.login-lockout{
  color:var(--amber);
  font-family:'Press Start 2P',monospace;
  font-size:.38rem;
  margin-bottom:1rem;
  padding:.5rem .7rem;
  border:1px solid var(--amber);
  background:rgba(255,176,0,.05);
}

/* ── MISC ── */
a.tlink{color:var(--cyan);text-decoration:none;font-size:11px}
a.tlink:hover{text-decoration:underline}
.dim{color:var(--gtext)}
.mono{font-family:'Press Start 2P',monospace}
.sep{border:none;border-top:1px solid var(--border);margin:1rem 0}
.row-info{
  font-family:'Press Start 2P',monospace;
  font-size:.38rem;
  color:var(--gtext);
  margin-bottom:.6rem;
  display:flex;
  align-items:center;
  gap:1rem;
  flex-wrap:wrap;
}
.row-info .hi{color:var(--g)}

/* scrollbar */
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:var(--gbg)}
::-webkit-scrollbar-thumb{background:var(--gdim);border-radius:0}
::-webkit-scrollbar-thumb:hover{background:var(--g)}

/* phone col width */
.col-phone{min-width:140px}
.col-notes{min-width:160px}
.col-company{min-width:160px}
.col-actions{white-space:nowrap;width:1%}

/* ── COMPACT TABLE ── */
.tbl-compact td { padding: .25rem .45rem; font-size: 11px; }
.tbl-compact th { padding: .4rem .45rem; }
.co-trunc { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; font-size: 12px; }
.co-cell { min-width: 0; }

/* ── SECTION HEADERS ── */
.section-hdr {
  font-family: 'Press Start 2P', monospace;
  font-size: .55rem;
  color: var(--cyan);
  padding: .5rem .7rem;
  background: var(--gdark);
  border: 1px solid var(--border);
  border-bottom: 2px solid var(--gdim);
  margin-top: 1.5rem;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  gap: .8rem;
}
.section-hdr .cnt {
  font-size: .45rem;
  background: var(--g);
  color: var(--gbg);
  padding: .15rem .4rem;
}
.section-hdr.win-hdr  { color: var(--g);     border-color: var(--gdim);  }
.section-hdr.fu-hdr   { color: var(--amber); border-color: var(--amber); }
.section-hdr.dead-hdr { color: var(--red);   border-color: var(--red);   }

/* ── CALL ATTEMPT BUTTONS ── */
.att-wrap { display: flex; gap: 2px; }
.att-btn {
  font-family: 'Press Start 2P', monospace;
  font-size: .32rem;
  width: 22px; height: 20px;
  border: 1px solid var(--border);
  background: var(--gbg);
  color: var(--gtext);
  cursor: pointer;
  padding: 0;
  display: flex; align-items: center; justify-content: center;
  transition: all .1s;
}
.att-btn:hover { border-color: var(--amber); color: var(--amber); }
.att-btn.lit  { background: var(--amber); color: var(--gbg); border-color: var(--amber); }
.att-btn.lit3 { background: var(--red);   color: #fff;       border-color: var(--red);   }

/* ── WIN / FOLLOWUP ACTIONS ── */
.win-actions { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.fu-date-past { color: var(--red); font-weight: bold; }
.fu-date-soon { color: var(--amber); }
.fu-date-ok   { color: var(--g); }

/* ── INLINE DATE INPUT ── */
.date-input {
  background: var(--gbg);
  border: 1px solid var(--gdim);
  color: var(--g);
  font-family: 'Courier New', monospace;
  font-size: 11px;
  padding: .2rem .4rem;
  outline: none;
  width: 130px;
}
.date-input:focus { border-color: var(--g); }

/* ── DUPE HIGHLIGHT ── */
.row-dupe td { background: rgba(255,176,0,.04); }
.row-dupe td:first-child { border-left: 2px solid var(--amber); }

/* ── SCRIPT PANEL ── */
.script-panel {
  background: var(--gpanel);
  border: 1px solid var(--gdim);
  padding: 1rem;
  margin-bottom: 1rem;
  display: none;
}
.script-panel.open { display: block; }
.script-content {
  font-family: 'Courier New', monospace;
  font-size: 13px;
  color: var(--g);
  line-height: 1.8;
  white-space: pre-wrap;
  max-height: 250px;
  overflow-y: auto;
}
.script-ta {
  width: 100%;
  background: var(--gbg);
  border: 1px solid var(--gdim);
  color: var(--g);
  font-family: 'Courier New', monospace;
  font-size: 13px;
  padding: .6rem;
  min-height: 150px;
  resize: vertical;
  outline: none;
  line-height: 1.8;
}
.script-ta:focus { border-color: var(--g); }

/* ── WEB / GOOGLE BTNS ── */
.btn-web {
  font-family: 'Press Start 2P', monospace;
  font-size: .32rem;
  padding: .25rem .45rem;
  border: 1px solid var(--cyandim);
  color: var(--cyan);
  background: transparent;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  white-space: nowrap;
}
.btn-web:hover { background: rgba(0,212,255,.1); }
.btn-goog {
  font-family: 'Press Start 2P', monospace;
  font-size: .32rem;
  padding: .25rem .45rem;
  border: 1px solid var(--gdim);
  color: var(--g);
  background: transparent;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  white-space: nowrap;
}
.btn-goog:hover { background: rgba(0,255,65,.08); border-color: var(--g); }

/* ── RESET / RESURRECT BUTTON ── */
.btn-reset {
  background: transparent;
  border: 1px solid var(--red);
  color: var(--red);
  font-size: .7rem;
  width: 22px; height: 22px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  padding: 0;
  line-height: 1;
  transition: all .1s;
  border-radius: 0;
}
.btn-reset:hover { background: var(--red); color: #fff; }