/* The same rounded typeface and night-sky gradient used by the approved artwork. */
@font-face {
  font-family: 'Ibiki Rounded';
  src: url('../fonts/ibiki-rounded-800.woff2') format('woff2');
  font-weight: 800;
  font-display: swap;
}
.illareya-header-link:has(.ibiki-header-brand) {
  position: relative;
  display: block;
  container-type: inline-size;
}
.ibiki-header-brand {
  position: absolute;
  left: 17.7%; top: 35%; width: 44.5%; height: 30%;
  display: flex; align-items: center;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1' height='173' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x2='0' y2='1'%3E%3Cstop stop-color='%23131a40'/%3E%3Cstop offset='.33' stop-color='%23141c44'/%3E%3Cstop offset='1' stop-color='%2317214e'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23g)' d='M0 0h1v173H0z'/%3E%3C/svg%3E") 0 0 / 100% 100%;
  color: #fff;
  font-family: 'Ibiki Rounded', "Yu Gothic", sans-serif;
  font-size: 5.30cqw; font-weight: 800; letter-spacing: -.025em;
  line-height: 1; white-space: nowrap;
}
.ibiki-banner-brand-anchor { position: relative; display: block; container-type: inline-size; }
.ibiki-banner-brand {
  position: absolute; left: 13.6%; top: 6.7%; width: 35.5%; height: 8%;
  display: flex; align-items: center;
  color: white;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1' height='40' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x2='0' y2='1'%3E%3Cstop stop-color='%230e1433'/%3E%3Cstop offset='1' stop-color='%230f1536'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23g)' d='M0 0h1v40H0z'/%3E%3C/svg%3E") 0 0 / 100% 100%;
  font: 800 4cqw/1 'Ibiki Rounded', "Yu Gothic", sans-serif;
  letter-spacing: -.05em; white-space: nowrap;
}
[data-ibiki-banner-variant="M3"] .ibiki-banner-brand { background: #f8eff8; color: #25204a; }
[data-ibiki-banner-variant="M3"] .ibiki-banner-original-icon {
  position: absolute; left: 4.2%; top: 3.8%; width: 8%; height: auto;
  border-radius: 19%;
}
[data-ibiki-banner-variant="M2"] .ibiki-banner-brand,
[data-ibiki-banner-variant="B"] .ibiki-banner-brand {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='192' height='40' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='.25'%3E%3Cstop stop-color='%23152032'/%3E%3Cstop offset='1' stop-color='%230e141f'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23g)' d='M0 0h192v40H0z'/%3E%3C/svg%3E") 0 0 / 100% 100%;
}
[data-ibiki-banner-variant="N2"] .ibiki-banner-brand { left: 60%; width: 32%; font-size: 3.55cqw; }
[data-ibiki-banner-variant="M4"] .ibiki-banner-brand { display: none; }

/* Keep the approved comic artwork and update the one speech-bubble name. */
a[data-ibiki-comic-brand] { position: relative; display: block; container-type: inline-size; }
a[data-ibiki-comic-brand]::after,
.illareya-lightbox.ibiki-comic-brand .illareya-lightbox-inner::after {
  content: 'いびきスカウター'; position: absolute; z-index: 2;
  display: flex; justify-content: flex-start; align-items: center;
  writing-mode: vertical-rl; white-space: nowrap; font-family: 'Yu Mincho', 'Noto Serif CJK JP', serif;
  font-weight: 500; line-height: 1; color: #000 !important;
  background-color: #fff !important; pointer-events: none;
}
a[data-ibiki-comic-brand]::after {
  left: 89.8%; top: 5.4%; width: 2%; height: 13.5%; padding-top: .45cqw; font-size: 1.55cqw;
}
.illareya-lightbox.ibiki-comic-brand .illareya-lightbox-inner { position: relative; container-type: inline-size; }
.illareya-lightbox.ibiki-comic-brand .illareya-lightbox-inner::after {
  left: 79.8%; top: 2.9%; width: 3.3%; height: 6.9%; padding-top: .5cqw; font-size: 3cqw;
}
@media (max-width: 640px) {
  a[data-ibiki-comic-brand]::after { left: 79.8%; top: 2.9%; width: 3.3%; height: 6.9%; padding-top: .5cqw; font-size: 3cqw; }
}

/* Article banners retain the approved artwork, links and proportions. */
.ibiki-article-banner { position: relative; display: block; container-type: inline-size; }
.ibiki-article-banner > img { display: block; width: 100%; height: auto; }
.ibiki-article-banner[data-banner$="-slim"] { aspect-ratio: 728 / 90; overflow: hidden; }
.ibiki-article-banner[data-banner$="-slim"] > img.ibiki-article-banner-art {
  position: absolute; left: 0; top: 50%; width: 100%; height: auto; transform: translateY(-50%);
}
.ibiki-article-banner[data-banner$="-slim"] > img.ibiki-article-banner-icon {
  position: absolute; left: 2%; top: 18%; width: 8%; height: auto;
}
.ibiki-article-banner-name {
  position: absolute; display: flex; align-items: center; white-space: nowrap;
  font-family: 'Ibiki Rounded', 'Yu Gothic', sans-serif; font-weight: 800;
  line-height: 1; color: #fff;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1' height='40' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x2='0' y2='1'%3E%3Cstop stop-color='%23151d48'/%3E%3Cstop offset='1' stop-color='%23182250'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23g)' d='M0 0h1v40H0z'/%3E%3C/svg%3E") 0 0 / 100% 100%;
}
.ibiki-article-banner[data-banner="A-slim"] .ibiki-article-banner-name {
  left: 37.6%; top: 56%; width: 21%; height: 22%; font-size: 2.05cqw;
}
.ibiki-article-banner[data-banner="B-slim"] .ibiki-article-banner-name {
  left: 27%; top: 56%; width: 21%; height: 22%; font-size: 1.85cqw; font-weight: 500; color: #a3b2c6;
  background: #0e131c;
}
.ibiki-article-banner[data-banner="A"] .ibiki-article-banner-name {
  left: 10%; top: 11%; width: 19%; height: 10%; font-size: 2.1cqw;
  background: #101738;
}
.ibiki-article-banner[data-banner="A"] .ibiki-article-banner-phone-name {
  left: 72.5%; top: 18%; width: 11%; height: 6%; font-size: .95cqw;
  background: #0d1117;
}