.commands-hero{min-height:25rem}
.main:has(.commands-page){max-width:100%;overflow-x:clip}.commands-page{min-width:0}
.commands-hero .sparkles{z-index:auto;inset:-5% -5% 1%;pointer-events:none}
.commands-hero .decoration{z-index:1;color:#77bcf2}
.command-title-art{top:31%;width:min(82%,22rem);translate:-50% 0}
.command-hero-note--ko{left:0;top:5%;width:min(33%,9rem)}
.command-hero-note--en{right:0;top:8%;width:min(29%,8rem)}
.command-hero-symbol{position:absolute;z-index:2;height:auto;object-fit:contain;filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 9px #fff)}
.command-hero-symbol--chat{left:4%;top:43%;width:5rem;animation:command-chat-slide 8.2s ease-in-out infinite}
.command-hero-symbol--terminal{right:3%;top:43%;width:5.2rem;animation:command-terminal-slide 9.4s ease-in-out infinite}
.commands-hero .command-signature{top:76%}
@keyframes command-chat-slide{0%,100%{translate:0 0;rotate:0deg}50%{translate:-18px 0;rotate:-8deg}}
@keyframes command-terminal-slide{0%,100%{translate:0 0;rotate:0deg}50%{translate:18px 0;rotate:8deg}}
@media(min-width:640px){.commands-hero{min-height:29rem}.command-title-art{width:min(72%,26rem)}.command-hero-note--ko{left:4%;width:min(27%,10rem)}.command-hero-note--en{right:4%;width:min(25%,9rem)}}
@media(min-width:1000px){.commands-hero{min-height:29rem}.command-title-art{top:31%;width:96%}.command-hero-note--ko{top:4%;left:-2%;width:45%}.command-hero-note--en{top:7%;right:-1%;width:39%}.command-hero-symbol--chat{left:-3%;top:44%;width:4.8rem}.command-hero-symbol--terminal{right:-4%;top:44%;width:5rem}}
@media(max-width:420px){.commands-hero{min-height:24rem}.command-title-art{top:32%;width:84%}.command-hero-symbol--chat{left:3%;width:4.3rem}.command-hero-symbol--terminal{right:2%;width:4.5rem}}
.commands-page .commands-hero .decoration--paw{top:96%!important}
@media(max-width:639px){
  .commands-hero{height:24rem;min-height:24rem;max-height:24rem}
}
/* Keep the supporting icons clear of the wide brush lettering. */
.commands-hero img[src*="command-chat"] {
  margin-left: -1.35rem;
  scale: 1.18;
}

.commands-hero img[src*="command-terminal"] {
  margin-left: 1.35rem;
}

.commands-hero .command-signature {
  position: absolute;
}

.commands-hero .command-signature::after {
  content: "명령어를 입력하고 재미있는 순간을 만들어 보세요!";
  position: absolute;
  top: calc(100% + 1.15rem);
  left: 50%;
  width: min(82vw, 31rem);
  translate: -50% 0;
  color: #55718f;
  font-family: "Hion Korean", sans-serif;
  font-size: clamp(.92rem, 3.5vw, 1.08rem);
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.45;
  text-align: center;
  text-shadow: 0 1px 10px rgba(255, 255, 255, .92);
  white-space: nowrap;
}

.commands-hero .command-signature::before {
  content: "♡";
  position: absolute;
  top: calc(100% + 3.75rem);
  left: 50%;
  width: 9.5rem;
  translate: -50% 0;
  color: var(--hero-signature-color);
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  background: linear-gradient(currentColor,currentColor) left center/3.6rem 1px no-repeat,linear-gradient(currentColor,currentColor) right center/3.6rem 1px no-repeat;
  text-shadow: 0 0 9px rgba(255, 255, 255, .98);
}

@media (max-width: 420px) {
  .commands-hero .command-signature::after {
    top: calc(100% + .95rem);
    width: 88vw;
    font-size: .84rem;
  }

  .commands-hero .command-signature::before {
    top: calc(100% + 3.35rem);
  }
}