*{

  margin:0;

  padding:0;

  box-sizing:border-box;

  font-family:
  Inter,
  sans-serif;

}

body{

  background:#0f0f0f;

  color:white;

  padding:40px 20px;

}

.optimizer-container{

  width:100%;

  max-width:1300px;

  margin:auto;

}

/* =========================
   HEADER
========================= */

.optimizer-header{

  margin-bottom:28px;

}

.optimizer-header h1{

  font-size:34px;

  margin-bottom:8px;

}

.optimizer-header p{

  color:
  rgba(255,255,255,0.65);

  font-size:14px;

}

/* =========================
   SEARCH
========================= */

.weapon-select-area{

  position:relative;

  margin-bottom:32px;

}

#weaponSearch{

  width:100%;

  padding:16px 18px;

  border:none;

  outline:none;

  border-radius:16px;

  background:
  rgba(255,255,255,0.05);

  border:
  1px solid rgba(255,255,255,0.06);

  color:white;

  font-size:15px;

}

#weaponSearch::placeholder{

  color:
  rgba(255,255,255,0.45);

}

.weapon-dropdown{

  position:absolute;

  top:100%;

  left:0;

  width:100%;

  max-height:400px;

  overflow:auto;

  background:#171717;

  border-radius:16px;

  margin-top:10px;

  border:
  1px solid rgba(255,255,255,0.06);

  display:none;

  z-index:999;

}

.weapon-item{

  padding:14px 18px;

  cursor:pointer;

  transition:0.2s;

  border-bottom:
  1px solid rgba(255,255,255,0.05);

}

.weapon-item:hover{

  background:
  rgba(255,255,255,0.05);

}

.weapon-name{

  font-size:15px;

  margin-bottom:5px;

}

.weapon-stats{

  font-size:12px;

  color:
  rgba(255,255,255,0.55);

}

/* =========================
   CARD
========================= */

.nether-results{

  display:flex;

  flex-direction:column;

  gap:18px;

}

.nether-card{

  background:
  rgba(255,255,255,0.04);

  border:
  1px solid rgba(255,255,255,0.06);

  border-radius:18px;

  overflow:hidden;

}

.nether-header{

  padding:20px;

  cursor:pointer;

  display:flex;

  justify-content:space-between;

  align-items:center;

}

.nether-title{

  font-size:20px;

  font-weight:700;

  margin-bottom:5px;

}

.nether-summary{

  font-size:13px;

  color:
  rgba(255,255,255,0.55);

}

.nether-content{

  display:none;

  padding:0 20px 20px;

}

/* =========================
   TABLE
========================= */

.monster-table{

  width:100%;

  border-collapse:collapse;

}

.monster-table th{

  text-align:left;

  padding:14px;

  font-size:13px;

  border-bottom:
  1px solid rgba(255,255,255,0.06);

}

.monster-table td{

  padding:14px;

  font-size:13px;

  color:
  rgba(255,255,255,0.8);

  border-bottom:
  1px solid rgba(255,255,255,0.05);

}

/* =========================
   SCROLLBAR
========================= */

::-webkit-scrollbar{

  width:8px;

}

::-webkit-scrollbar-thumb{

  background:
  rgba(255,255,255,0.15);

  border-radius:999px;

}