/* Basic reset & layout */
#seo-ops * { box-sizing: border-box; }
#seo-ops { 
  --bg:#0b0f10; --panel:#0e1416; --text:#d8f3dc; --accent:#39ff14; --muted:#8ab4a7; 
  --danger:#ff5c5c; --ok:#39ff14; --warn:#ffcc00;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  background: radial-gradient(1200px 500px at 30% -20%, rgba(57,255,20,0.12), transparent 55%) , var(--bg);
  color: var(--text);
  padding: 16px;
  border: 1px solid #163327;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
}
#seo-ops::before{
  content:'';
  position:absolute; inset:0;
  background: repeating-linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.15) 2px, transparent 2px, transparent 4px);
  pointer-events:none;
}
#seo-ops .seo-lab-header{
  display:flex; gap:10px; align-items:center; justify-content:space-between;
  font-weight:600; padding-bottom:10px; border-bottom:1px solid #14351f; margin-bottom:12px;
}
#seo-ops .brand { color: var(--accent); letter-spacing: .5px; text-shadow: 0 0 6px rgba(57,255,20,.55); }
#seo-ops .mode { color: var(--muted); font-size:.9rem; }

#seo-ops .seo-lab-form { display:grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; align-items: end; }
#seo-ops label { font-size:.9rem; color: var(--muted); }
#seo-ops input[type="text"],
#seo-ops input[type="password"]{
  width:100%; padding:10px 12px; border:1px solid #1f3a2a; background:#0f1618; color:#d8f3dc; border-radius:8px;
  outline:none;
}
#seo-ops input::placeholder{ color:#5b7c6f; }
#seo-ops .actions { display:flex; flex-wrap: wrap; gap:8px; }
#seo-ops .btn{
  padding:10px 14px; border-radius:8px; border:1px solid #1f3a2a; background:#10261b; color:#d8f3dc; cursor:pointer;
  transition: transform .06s ease, box-shadow .12s ease;
}
#seo-ops .btn:hover{ transform: translateY(-1px); box-shadow: 0 8px 20px rgba(57,255,20,.09); }
#seo-ops .btn:disabled{ opacity:.5; cursor:not-allowed; }
#seo-ops .btn.start{ border-color:#2e6f40; }
#seo-ops .btn.stop{ border-color:#6f2e2e; background:#1d0f0f; }
#seo-ops .btn.reset{ border-color:#2e596f; background:#0f1820; }
#seo-ops .btn.save{ border-color:#275a3a; background:#0f2018; }
#seo-ops .btn.download{ border-color:#2b3a6f; background:#111826; }

#seo-ops .notice{
  grid-column: 1 / -1;
  margin: 0;
  color: #9fd8ad;
  font-size:.9rem;
  opacity:.85;
}

#seo-ops .seo-lab-stats {
  display:grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 14px 0;
}
#seo-ops .bots-panel, 
#seo-ops .target-panel,
#seo-ops .run-panel{
  background: var(--panel);
  border: 1px solid #173224;
  border-radius: 10px;
  padding: 10px 12px;
  min-height: 72px;
  display:flex; flex-direction:column; gap:6px; justify-content:center;
}
#seo-ops .label{ font-size:.85rem; color:#78a892; }
#seo-ops .value{ font-size:1.25rem; color: var(--accent); text-shadow: 0 0 6px rgba(57,255,20,.5); }

#seo-ops .seo-lab-console{
  border:1px solid #14351f; border-radius:10px; background:#081011; min-height: 320px; max-height: 520px; overflow:auto;
  padding: 10px 12px; line-height:1.4;
  box-shadow: inset 0 0 20px rgba(0,0,0,.35);
}
#seo-ops .log-line{ padding: 2px 0; color:#c6f0c8; white-space: pre-wrap; word-break: break-word; }
#seo-ops .warn{ grid-column:1/-1; color:#ffc107; background:#2a2108; border:1px solid #4c3b0b; padding:8px 10px; border-radius:8px; }

@keyframes shakeX { 0%,100%{ transform: translateX(0) } 20%{ transform: translateX(-5px) } 40%{ transform: translateX(5px) } 60%{ transform: translateX(-5px) } 80%{ transform: translateX(5px) } }
#seo-ops .shake{ animation: shakeX .35s both; }

@media (max-width: 800px){
  #seo-ops .seo-lab-form{ grid-template-columns: 1fr; }
  #seo-ops .seo-lab-stats{ grid-template-columns: 1fr; }
}
