* { box-sizing: border-box; margin: 0; padding: 0; }
body { background: #0d0d0d; color: #e6e6e6; font-family: 'Segoe UI', Tahoma, sans-serif;
  display: flex; align-items: center; justify-content: center; min-height: 100vh; position: relative; }
.container { background: #1a1a1a; padding: 2rem; border-radius: 1rem;
  box-shadow: 0 0 20px rgba(0, 255, 255, 0.2); width: 100%; max-width: 400px; }
h1 { text-align: center; margin-bottom: 1rem; font-size: 1.5rem; color: #00ffff; }
.input-group { display: flex; gap: 0.5rem; margin-bottom: 1rem; }
input { flex: 1; padding: 0.5rem; border: 2px solid #00ffff; border-radius: 0.5rem;
  background: #0d0d0d; color: #e6e6e6; }
button { padding: 0.5rem 1rem; border: none; border-radius: 0.5rem;
  cursor: pointer; background: #00ffff; color: #0d0d0d; font-weight: bold; }
button:hover { background: #00cccc; }
.copy-btn { background: none; border: none; padding: 0; margin: 0; cursor: pointer; }
.copy-btn svg { width: 1rem; height: 1rem; fill: #00ffff; }
.hidden { display: none; }
#results-list { list-style: none; margin-top: 1rem; }
#results-list .item { display: flex; justify-content: space-between; align-items: center;
  background: #262626; padding: 0.5rem; margin-bottom: 0.5rem; border-radius: 0.5rem; }
#results-list .item:hover { background: #333333; }
#toast { visibility: hidden; min-width: 200px; margin-left: -100px; background: #333;
  color: #fff; text-align: center; border-radius: 0.5rem; padding: 0.75rem;
  position: fixed; left: 50%; bottom: 30px; font-size: 0.875rem; z-index: 100; }
#toast.show { visibility: visible; animation: fadein 0.5s, fadeout 0.5s 2.5s; }
@keyframes fadein { from { bottom: 0; opacity: 0; } to { bottom: 30px; opacity: 1; } }
@keyframes fadeout { from { bottom: 30px; opacity: 1; } to { bottom: 0; opacity: 0; } }