/* WP Nerdle Advanced Mobile Fixed */
.wpnerdle-app,
.wpnerdle-app *{box-sizing:border-box}

.wpnerdle-app{
  --purple:#82005f;
  --green:#159b7f;
  --pink:#c12a87;
  --tile:#eef1f7;
  --tile2:#e8edf5;
  --line:#cfd7e5;
  --text:#111827;
  width:100%;
  max-width:620px;
  margin:0 auto 28px!important;
  padding:0 10px!important;
  background:#fff!important;
  color:var(--text)!important;
  font-family:"Work Sans",Arial,sans-serif!important;
  overflow-x:hidden!important;
}

.wpnerdle-app button{
  font-family:"Work Sans",Arial,sans-serif!important;
  text-transform:none!important;
  letter-spacing:normal!important;
}

.wpnerdle-gamebar{
  width:100%;
  min-height:50px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) 108px;
  align-items:center;
  gap:4px;
  margin:0 auto 8px!important;
  padding:4px 0 8px!important;
  border-bottom:1px solid #e5e7eb!important;
}

.wpnerdle-menu{
  border:0!important;
  background:transparent!important;
  color:#111827!important;
  font-size:31px!important;
  line-height:1!important;
  padding:4px!important;
  cursor:pointer!important;
}

.wpnerdle-brand{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  white-space:nowrap;
}

.wpnerdle-logo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:31px;
  height:31px;
  border-radius:6px;
  background:var(--purple)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:25px;
  font-weight:900;
  line-height:1;
  box-shadow:8px -5px 0 #1aa784;
  flex:0 0 auto;
}

.wpnerdle-title{
  color:var(--pink)!important;
  font-size:31px;
  font-weight:400;
  line-height:1;
}

.wpnerdle-number{
  color:#64748b!important;
  font-size:14px;
  font-weight:700;
  margin-left:2px;
}

.wpnerdle-tools{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:5px;
}

.wpnerdle-tools button{
  border:0!important;
  background:transparent!important;
  color:#111827!important;
  font-size:21px!important;
  line-height:1!important;
  padding:3px!important;
  cursor:pointer!important;
}

.wpnerdle-main{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:0!important;
}

.wpnerdle-status{
  width:100%;
  min-height:22px;
  margin:0 0 4px!important;
  text-align:center;
  font-size:14px;
  font-weight:800;
  color:#334155!important;
}
.wpnerdle-status.good{color:#047857!important}
.wpnerdle-status.bad{color:#b91c1c!important}

.wpnerdle-board{
  width:min(100%,424px);
  display:grid;
  grid-template-rows:repeat(6,48px);
  gap:5px;
  margin:0 auto 12px!important;
}

.wpnerdle-row{
  width:100%;
  display:grid;
  grid-template-columns:repeat(8,minmax(0,1fr));
  gap:5px;
}

.wpnerdle-tile{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--tile)!important;
  border:2px solid transparent!important;
  border-radius:5px!important;
  color:#111827!important;
  -webkit-text-fill-color:#111827!important;
  font-size:24px;
  font-weight:900!important;
  line-height:1!important;
}

.wpnerdle-row.current .wpnerdle-tile{
  background:#f8fafc!important;
  border-color:#111827!important;
}

.wpnerdle-tile.filled{
  background:#fff!important;
  border-color:#94a3b8!important;
}

.wpnerdle-tile.correct{
  background:var(--green)!important;
  border-color:var(--green)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
.wpnerdle-tile.present{
  background:var(--pink)!important;
  border-color:var(--pink)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
.wpnerdle-tile.absent{
  background:#6b7280!important;
  border-color:#6b7280!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

.wpnerdle-keyboard{
  width:min(100%,424px);
  background:#dfe7f2!important;
  padding:6px!important;
  display:grid;
  gap:6px;
  margin:0 auto 14px!important;
  border-radius:0!important;
  overflow:hidden!important;
}

.wpnerdle-keyrow{
  display:grid;
  gap:5px;
}

.wpnerdle-keyrow.numbers{
  grid-template-columns:repeat(10,minmax(0,1fr));
}

.wpnerdle-keyrow.operators{
  grid-template-columns:repeat(5,minmax(0,1fr)) minmax(74px,2.6fr) minmax(48px,1.2fr);
}

.wpnerdle-key{
  min-width:0!important;
  height:48px!important;
  border:0!important;
  border-radius:6px!important;
  background:#fff!important;
  color:#000!important;
  -webkit-text-fill-color:#000!important;
  font-size:21px!important;
  font-weight:900!important;
  line-height:1!important;
  cursor:pointer!important;
  box-shadow:0 1px 3px rgba(15,23,42,.14)!important;
  padding:0!important;
}

.wpnerdle-key.enter{
  font-size:15px!important;
}

.wpnerdle-key.correct{background:var(--green)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
.wpnerdle-key.present{background:var(--pink)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
.wpnerdle-key.absent{background:#6b7280!important;color:#fff!important;-webkit-text-fill-color:#fff!important}

.wpnerdle-links{
  width:min(100%,424px);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:0 auto 22px!important;
}

.wpnerdle-links button{
  min-height:52px;
  border:1px solid #dbe3ef!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#111827!important;
  -webkit-text-fill-color:#111827!important;
  padding:8px 10px!important;
  font-size:15px!important;
  font-weight:800!important;
  cursor:pointer!important;
  box-shadow:0 1px 2px rgba(15,23,42,.05)!important;
}

.wpnerdle-mini{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--purple)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  border-radius:3px;
  padding:2px 4px;
  margin-right:6px;
  font-weight:900;
}

.wpnerdle-about{
  width:min(100%,424px);
  margin:0 auto!important;
  padding:0 2px 16px!important;
}

.wpnerdle-about h3{
  margin:0 0 8px!important;
  color:#000!important;
  font-size:24px!important;
  line-height:1.14!important;
  font-weight:700!important;
}

.wpnerdle-about p{
  margin:0!important;
  color:#334155!important;
  font-size:16px!important;
  line-height:1.55!important;
}

.wpnerdle-modal{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.55);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:99999;
  padding:18px;
}
.wpnerdle-modal[hidden]{display:none}
.wpnerdle-card{
  position:relative;
  width:min(620px,100%);
  max-height:88vh;
  overflow:auto;
  background:#fff!important;
  color:#111827!important;
  border-radius:18px;
  padding:26px;
  box-shadow:0 24px 80px rgba(0,0,0,.35);
}
.wpnerdle-close{
  position:absolute;
  right:14px;
  top:8px;
  border:0!important;
  background:transparent!important;
  color:#111827!important;
  font-size:34px!important;
  cursor:pointer!important;
}

@keyframes wpnerdle-shake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
.wpnerdle-shake{animation:wpnerdle-shake .3s ease}
@keyframes wpnerdle-pop{50%{transform:scale(1.08)}}
.wpnerdle-pop{animation:wpnerdle-pop .16s ease}

@media(max-width:480px){
  .wpnerdle-app{
    max-width:400px;
    padding:0 8px!important;
  }
  .wpnerdle-gamebar{
    grid-template-columns:38px minmax(0,1fr) 92px;
    min-height:48px;
    margin-bottom:6px!important;
  }
  .wpnerdle-title{font-size:29px}
  .wpnerdle-logo{width:29px;height:29px;font-size:23px;box-shadow:7px -5px 0 #1aa784}
  .wpnerdle-number{font-size:13px}
  .wpnerdle-tools button{font-size:19px!important}
  .wpnerdle-board{
    width:100%;
    grid-template-rows:repeat(6,49px);
    gap:4px;
    margin-bottom:10px!important;
  }
  .wpnerdle-row{gap:4px}
  .wpnerdle-tile{font-size:23px}
  .wpnerdle-keyboard{width:100%;padding:5px!important;gap:5px;margin-bottom:12px!important}
  .wpnerdle-keyrow{gap:4px}
  .wpnerdle-key{height:48px!important;font-size:20px!important}
  .wpnerdle-key.enter{font-size:14px!important}
  .wpnerdle-links{width:100%;gap:8px;margin-bottom:20px!important}
  .wpnerdle-links button{font-size:14px!important}
}

@media(max-width:360px){
  .wpnerdle-title{font-size:25px}
  .wpnerdle-board{grid-template-rows:repeat(6,43px)}
  .wpnerdle-tile{font-size:20px}
  .wpnerdle-key{height:44px!important;font-size:18px!important}
  .wpnerdle-key.enter{font-size:13px!important}
}