.himeko-page {
  background:
    linear-gradient(90deg, rgba(255, 128, 189, 0.11) 1px, transparent 1px),
    linear-gradient(180deg, rgba(80, 230, 242, 0.1) 1px, transparent 1px),
    #fff9ed;
  background-size: 16px 16px;
}

.himeko-profile {
  padding: clamp(14px, 2.8vw, 28px);
}

.profile-header {
  padding-bottom: 16px;
  border-bottom: 2px solid #101010;
}

.profile-header .kicker {
  margin-bottom: 10px;
  background: #ff80bd;
}

.system-line {
  margin-bottom: 10px;
  color: #001db0;
  font: 900 0.76rem/1.25 var(--mono);
}

.profile-header h1 {
  max-width: none;
  margin-bottom: 10px;
  font-size: clamp(2.35rem, 6.8vw, 5.4rem);
  line-height: 0.92;
  text-transform: none;
}

.profile-header h1 span {
  display: block;
  margin-top: 8px;
  font-size: 0.43em;
  line-height: 1;
}

.dek {
  max-width: none;
  margin-bottom: 0;
  color: #111111;
  font: 900 clamp(0.9rem, 2vw, 1.1rem)/1.35 var(--mono);
  text-transform: lowercase;
}

.profile-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.03fr) minmax(310px, 0.97fr);
  gap: clamp(16px, 3vw, 30px);
  align-items: start;
  padding-top: 20px;
}

.bio {
  padding: clamp(14px, 2.4vw, 22px);
  border: 1px solid #101010;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 7px 7px 0 rgba(16, 16, 16, 0.2);
  font: 700 clamp(0.82rem, 1.5vw, 0.98rem)/1.55 var(--mono);
}

.bio p:last-child {
  margin-bottom: 0;
}

.final-line {
  color: #8b0051;
  font-weight: 900;
}

.gallery {
  display: grid;
  gap: 12px;
}

.gallery figure {
  margin: 0;
  border: 2px solid #ffffff;
  border-right-color: #404040;
  border-bottom-color: #404040;
  background: #c0c0c0;
  box-shadow: 5px 5px 0 rgba(16, 16, 16, 0.2);
}

.gallery img {
  display: block;
  width: 100%;
  object-fit: cover;
}

.gallery-lead img {
  aspect-ratio: 16 / 10;
  object-position: center 39%;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.gallery-grid img {
  aspect-ratio: 1 / 1;
  object-position: center 28%;
}

.gallery figcaption {
  padding: 5px 6px;
  overflow: hidden;
  color: #111111;
  font: 900 0.64rem/1.2 var(--mono);
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 780px) {
  .profile-layout {
    grid-template-columns: 1fr;
  }

  .gallery {
    order: -1;
  }
}

@media (max-width: 440px) {
  .gallery-grid {
    grid-template-columns: 1fr;
  }
}