:root {
  --ink: #50406c;
  --sub: #7a6b95;
  --yellow: #ffe167;
  --yellow-deep: #ffbc3d;
  --pink: #ffb7df;
  --pink-deep: #ff7cb3;
  --blue: #bfe9ff;
  --blue-deep: #57c4ff;
  --mint: #daf7d1;
  --orange: #ffd6b0;
  --purple: #e4d8ff;
  --cream: #fff3d5;
  --white: #fff;
  --line: rgba(117, 98, 165, .18);
  --shadow: 0 28px 72px rgba(112, 84, 168, .18);
  --soft-shadow: 0 14px 32px rgba(112, 84, 168, .12);
  --radius-xl: 44px;
  --radius-lg: 30px;
  --radius-md: 20px;
  --max: min(1180px, calc(100vw - 32px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: hidden;
  color: var(--ink);
  line-height: 1.75;
  font-family: 'Zen Maru Gothic', 'M PLUS Rounded 1c', system-ui, sans-serif;
  background: linear-gradient(180deg, #fffdf7 0%, #fff8ea 40%, #f8fcff 100%);
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.container { width: var(--max); margin-inline: auto; }

.bg-glow {
  position: fixed;
  border-radius: 50%;
  filter: blur(6px);
  opacity: .52;
  pointer-events: none;
  z-index: -3;
  animation: orbFloat 18s ease-in-out infinite;
}
.glow-a { width: 380px; height: 380px; left: -140px; top: 120px; background: #fff0a2; }
.glow-b { width: 340px; height: 340px; right: -110px; top: 220px; background: #ffd5ea; animation-delay: 2s; }
.glow-c { width: 360px; height: 360px; left: 20%; bottom: -130px; background: #c8edff; animation-delay: 4s; }
.bg-sparkles {
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background-image:
    radial-gradient(circle at 12% 12%, rgba(255,255,255,.84) 0 2px, transparent 2.4px),
    radial-gradient(circle at 84% 15%, rgba(255,255,255,.74) 0 2px, transparent 2.4px),
    radial-gradient(circle at 32% 74%, rgba(255,255,255,.72) 0 2px, transparent 2.4px),
    radial-gradient(circle at 76% 82%, rgba(255,255,255,.8) 0 2px, transparent 2.4px),
    radial-gradient(circle at 44% 28%, rgba(255,236,141,.85) 0 2px, transparent 2.4px),
    radial-gradient(circle at 64% 58%, rgba(255,182,220,.6) 0 2px, transparent 2.4px);
  animation: twinkle 10s linear infinite;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(255,255,255,.8);
}
.header-inner {
  min-height: 86px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}
.site-logo {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.site-logo-icon {
  width: 62px;
  height: 62px;
  flex: 0 0 auto;
  filter: drop-shadow(0 10px 18px rgba(255, 199, 61, .34));
}
.site-logo-title { display: grid; line-height: 1.05; }
.site-logo-title small {
  font-size: .68rem;
  font-weight: 900;
  color: var(--pink-deep);
  letter-spacing: .18em;
}
.site-logo-title strong {
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-weight: 900;
  font-size: 1.14rem;
}
.site-logo-title .c1 { color: #ff992b; }
.site-logo-title .c2 { color: #39a8ff; }
.site-logo-title .c3 { color: #6c4d26; }
.site-logo-title .c4 { color: #ff6e98; }
.site-logo-title .c5 { color: #00a9b7; }
.site-nav {
  display: flex;
  align-items: center;
  gap: 18px;
  font-weight: 900;
  color: #76698f;
}
.site-nav a { position: relative; }
.site-nav a::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -8px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--yellow), var(--pink-deep), var(--blue-deep));
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .25s ease;
}
.site-nav a:hover::after,
.site-nav a:focus-visible::after { transform: scaleX(1); }
.nav-cta {
  background: var(--white);
  border-radius: 999px;
  padding: 11px 16px;
  border: 1px solid var(--line);
  box-shadow: var(--soft-shadow);
}
.nav-toggle {
  display: none;
  border: none;
  background: var(--white);
  color: var(--ink);
  font-weight: 900;
  border-radius: 999px;
  padding: 12px 18px;
  box-shadow: var(--soft-shadow);
}

.hero-section { padding: 28px 0 0; position: relative; }
.hero-layout {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 26px;
  align-items: center;
}
.hero-copy {
  position: relative;
  z-index: 2;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(12px);
  border-radius: 36px;
  padding: 36px 34px 32px;
  border: 1px solid rgba(255,255,255,.84);
  box-shadow: var(--shadow);
}
.section-kicker {
  margin: 0 0 12px;
  font-size: .82rem;
  letter-spacing: .16em;
  font-weight: 900;
  color: var(--pink-deep);
}
.hero-copy h1 {
  margin: 0;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-size: clamp(2.5rem, 5vw, 4.8rem);
  line-height: 1.08;
}
.hero-copy h1 span {
  background: linear-gradient(90deg, #ffb53f, #ff75af 46%, #53c4ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero-lead {
  margin: 18px 0 22px;
  color: var(--sub);
  font-weight: 700;
}
.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 14px 24px;
  font-weight: 900;
  box-shadow: var(--soft-shadow);
  transition: transform .25s ease, box-shadow .25s ease;
}
.btn:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow);
}
.btn-primary { background: linear-gradient(135deg, var(--yellow), var(--yellow-deep)); }
.btn-secondary {
  background: rgba(255,255,255,.96);
  border: 1px solid var(--line);
}
.hero-chip-list {
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}
.hero-chip-list li,
.pill-row span,
.friend-quote,
.town-pin,
.watch-links a,
.coloring-card a,
.content-icon {
  box-shadow: var(--soft-shadow);
}
.hero-chip-list li {
  background: rgba(255,255,255,.95);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  font-size: .92rem;
  font-weight: 900;
}

.hero-visual { position: relative; }
.hero-scene {
  position: relative;
  min-height: 700px;
  border-radius: var(--radius-xl);
  overflow: hidden;
  border: 8px solid rgba(255,255,255,.76);
  box-shadow: var(--shadow);
}
.hero-scene-map {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.04);
  animation: sceneZoom 18s ease-in-out infinite;
}
.hero-scene::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 22% 18%, rgba(255,255,255,.62), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,0) 36%);
  pointer-events: none;
}
.hero-scene-glow {
  position: absolute;
  inset: auto auto 0 0;
  width: 100%;
  height: 48%;
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,251,241,.14) 20%, rgba(255,251,241,.5) 100%);
}
.hero-character {
  position: absolute;
  filter: drop-shadow(0 20px 24px rgba(95, 78, 145, .18));
  animation: bob 4s ease-in-out infinite;
}
.hero-character.piko { width: min(250px, 34%); right: 17%; bottom: 16px; }
.hero-character.momo { width: min(220px, 30%); right: 41%; bottom: 18px; animation-delay: .7s; }
.hero-character.bot { width: min(168px, 24%); right: 3%; bottom: 190px; animation-delay: 1.2s; }
.hero-character.kororin { width: min(126px, 18%); right: 58%; bottom: 18px; animation-delay: 1.8s; }
.hero-character.kirara { width: min(122px, 18%); right: 4%; top: 48px; animation-delay: 2.2s; }
.bubble {
  position: absolute;
  z-index: 4;
  background: rgba(255,255,255,.96);
  border: 2px solid rgba(255,255,255,.95);
  border-radius: 999px;
  padding: 12px 16px;
  font-weight: 900;
}
.bubble-a { right: 18%; top: 52px; color: var(--pink-deep); }
.bubble-b { right: 30%; top: 146px; color: var(--blue-deep); }
.bubble-c { right: 6%; top: 220px; color: #ffb138; }
.hero-cloud {
  position: absolute;
  background: rgba(255,255,255,.84);
  border-radius: 999px;
  box-shadow: inset 0 -8px 0 rgba(255,255,255,.34);
  pointer-events: none;
  z-index: 0;
  animation: cloudDrift 22s ease-in-out infinite;
}
.hero-cloud::before,
.hero-cloud::after {
  content: '';
  position: absolute;
  background: inherit;
  border-radius: inherit;
}
.cloud-a { width: 150px; height: 52px; left: 7%; top: 58px; }
.cloud-a::before { width: 72px; height: 72px; left: 18px; top: -24px; }
.cloud-a::after { width: 58px; height: 58px; right: 18px; top: -18px; }
.cloud-b { width: 118px; height: 42px; right: 13%; top: 90px; animation-delay: 2s; }
.cloud-b::before { width: 58px; height: 58px; left: 14px; top: -18px; }
.cloud-b::after { width: 48px; height: 48px; right: 14px; top: -14px; }
.cloud-c { width: 100px; height: 34px; left: 51%; top: 28px; animation-delay: 1s; }
.cloud-c::before { width: 44px; height: 44px; left: 12px; top: -12px; }
.cloud-c::after { width: 42px; height: 42px; right: 12px; top: -12px; }

.message-ticker {
  overflow: hidden;
  margin-top: 18px;
  background: rgba(255,255,255,.88);
  border-block: 1px solid rgba(255,255,255,.8);
  box-shadow: 0 10px 24px rgba(105, 84, 158, .08);
}
.message-ticker-track {
  display: flex;
  gap: 28px;
  min-width: max-content;
  white-space: nowrap;
  padding: 14px 0;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-size: 1.24rem;
  font-weight: 900;
  color: var(--pink-deep);
  animation: ticker 24s linear infinite;
}
.message-ticker-track span:nth-child(4n) { color: var(--yellow-deep); }
.message-ticker-track span:nth-child(4n+2) { color: var(--blue-deep); }

.section { padding: 98px 0; position: relative; }
.section-sweet {
  background:
    radial-gradient(circle at 12% 18%, rgba(255,234,176,.42) 0, transparent 20%),
    radial-gradient(circle at 84% 22%, rgba(255,209,233,.35) 0, transparent 18%),
    linear-gradient(180deg, rgba(255,252,243,.74) 0%, rgba(246,251,255,.76) 100%);
}
.section-watch {
  background: linear-gradient(180deg, rgba(255,250,236,.8) 0%, rgba(238,248,255,.8) 100%);
}
.section-heading { margin-bottom: 34px; }
.section-heading.center {
  text-align: center;
  max-width: 820px;
  margin-inline: auto;
}
.section-heading h2,
.story-copy h2,
.watch-copy h2,
.coloring-copy h2 {
  margin: 0 0 14px;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-size: clamp(2rem, 3.2vw, 3.3rem);
  line-height: 1.16;
}
.section-heading p,
.story-copy p,
.watch-copy p,
.coloring-copy p,
.footer-copy,
.spot-copy p,
.friend-copy p,
.content-card p {
  margin: 0 0 14px;
  color: var(--sub);
  font-weight: 600;
}

.story-wrap {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 42px;
  align-items: center;
}
.pill-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 20px;
}
.pill-row span {
  background: rgba(255,255,255,.96);
  border-radius: 999px;
  border: 1px solid var(--line);
  padding: 10px 14px;
  font-weight: 900;
}
.story-visual {
  position: relative;
  min-height: 560px;
}
.visual-card {
  position: absolute;
  background: var(--white);
  padding: 12px;
  border-radius: 32px;
  box-shadow: var(--shadow);
}
.visual-card img { border-radius: 24px; }
.main-card {
  width: 74%;
  right: 0;
  top: 24px;
  transform: rotate(2deg);
}
.sub-card {
  width: 42%;
  animation: bob 4s ease-in-out infinite;
}
.left-card { left: 0; bottom: 24px; transform: rotate(-8deg); }
.right-card { left: 14%; top: 0; transform: rotate(-5deg); animation-delay: 1s; }

.friends-stage {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.friend-card {
  position: relative;
  overflow: hidden;
  min-height: 430px;
  border-radius: 34px;
  padding: 24px 22px 24px;
  box-shadow: var(--shadow);
  border: 1px solid rgba(255,255,255,.84);
  transition: transform .28s ease, box-shadow .28s ease;
}
.friend-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 38px 80px rgba(112, 84, 168, .22);
}
.friend-card::before {
  content: '';
  position: absolute;
  inset: auto -20px -20px auto;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: rgba(255,255,255,.26);
}
.theme-yellow { background: linear-gradient(180deg, #fff3bd 0%, #fffdf4 100%); }
.theme-pink { background: linear-gradient(180deg, #ffe2f1 0%, #fffdf6 100%); }
.theme-blue { background: linear-gradient(180deg, #dff4ff 0%, #fffef9 100%); }
.theme-orange { background: linear-gradient(180deg, #ffe7c8 0%, #fffdf6 100%); }
.theme-cream { background: linear-gradient(180deg, #fff2d7 0%, #fffef9 100%); }
.theme-purple { background: linear-gradient(180deg, #ede4ff 0%, #fffef9 100%); }
.friend-halo {
  position: absolute;
  left: 50%;
  top: 36px;
  transform: translateX(-50%);
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.86) 0%, rgba(255,255,255,.28) 62%, transparent 100%);
}
.friend-figure {
  position: relative;
  z-index: 2;
  height: 220px;
  margin: 12px auto 8px;
  object-fit: contain;
  filter: drop-shadow(0 18px 20px rgba(99, 76, 150, .15));
}
.friend-copy { position: relative; z-index: 2; }
.friend-copy h3 { margin: 0 0 4px; font-size: 1.42rem; }
.friend-role {
  margin: 0 0 10px;
  font-weight: 900;
  color: var(--pink-deep);
}
.friend-quote {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 4px;
  background: rgba(255,255,255,.95);
  border-radius: 999px;
  border: 1px solid var(--line);
  padding: 8px 14px;
  font-weight: 900;
}

.town-map-panel {
  position: relative;
  border-radius: 40px;
  overflow: hidden;
  border: 8px solid rgba(255,255,255,.78);
  box-shadow: var(--shadow);
  margin-bottom: 28px;
}
.town-map-image {
  width: 100%;
  max-height: 640px;
  object-fit: cover;
}
.town-pin {
  position: absolute;
  background: rgba(255,255,255,.96);
  border-radius: 999px;
  padding: 9px 14px;
  border: 2px solid var(--yellow);
  font-weight: 900;
  animation: pulse 2.6s ease-in-out infinite;
}
.pin-lab { left: 13%; top: 43%; }
.pin-clock { left: 43%; top: 18%; animation-delay: .4s; }
.pin-park { right: 27%; bottom: 22%; animation-delay: .8s; }
.pin-shop { left: 18%; top: 22%; animation-delay: 1.1s; }
.pin-station { right: 14%; bottom: 8%; animation-delay: 1.5s; }

.spot-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.spot-card {
  background: rgba(255,255,255,.96);
  border-radius: 30px;
  overflow: hidden;
  box-shadow: var(--soft-shadow);
  border: 1px solid var(--line);
  transition: transform .25s ease, box-shadow .25s ease;
}
.spot-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow);
}
.spot-card img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.spot-copy { padding: 18px 18px 20px; }
.spot-copy h3 { margin: 0 0 8px; }

.coloring-panel {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 28px;
  background: linear-gradient(135deg, #fff7cb 0%, #ffe7f1 52%, #dff4ff 100%);
  border-radius: 42px;
  padding: 34px;
  box-shadow: var(--shadow);
  border: 1px solid rgba(255,255,255,.84);
}
.coloring-note {
  background: rgba(255,255,255,.84);
  border-radius: 20px;
  padding: 14px 16px;
  font-weight: 800;
}
.coloring-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.coloring-card {
  background: rgba(255,255,255,.96);
  border-radius: 28px;
  padding: 16px;
  text-align: center;
  box-shadow: var(--soft-shadow);
}
.coloring-card.wide { grid-column: span 2; }
.coloring-card img {
  width: 100%;
  background: #fff;
  border-radius: 18px;
  padding: 10px;
  object-fit: contain;
}
.coloring-card h3 { margin: 12px 0 10px; }
.coloring-card a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--yellow), var(--yellow-deep));
  border-radius: 999px;
  padding: 10px 16px;
  font-weight: 900;
}

.content-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.content-card {
  background: rgba(255,255,255,.96);
  border-radius: 30px;
  padding: 26px 22px;
  box-shadow: var(--soft-shadow);
  border: 1px solid var(--line);
  text-align: center;
}
.content-icon {
  width: 58px;
  height: 58px;
  display: inline-grid;
  place-items: center;
  margin-bottom: 14px;
  border-radius: 50%;
  background: linear-gradient(145deg, var(--yellow), var(--yellow-deep));
  font-size: 1.45rem;
  font-weight: 900;
}
.content-card h3 { margin: 0 0 8px; }
.content-card p { margin-bottom: 0; }


.tv-heading {
  margin-bottom: 44px;
}
.broadcast-time {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 4px 0 12px !important;
  padding: 11px 20px;
  border-radius: 999px;
  background: rgba(255,255,255,.96);
  border: 2px solid rgba(255, 198, 66, .58);
  box-shadow: var(--soft-shadow);
  color: var(--ink) !important;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-size: clamp(1.05rem, 2vw, 1.32rem);
  font-weight: 900 !important;
}
.broadcast-light,
.tv-on-air-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ff6685;
  box-shadow: 0 0 0 5px rgba(255,102,133,.16), 0 0 16px rgba(255,102,133,.8);
  animation: onAirBlink 1.5s ease-in-out infinite;
}
.tv-world {
  position: relative;
  min-height: 760px;
  display: grid;
  place-items: center;
  padding: 94px 120px 84px;
  border-radius: 48px;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 22%, rgba(255,226,108,.55), transparent 22%),
    radial-gradient(circle at 88% 24%, rgba(255,185,222,.46), transparent 20%),
    radial-gradient(circle at 50% 100%, rgba(171,229,255,.62), transparent 34%),
    linear-gradient(155deg, #fff9d9 0%, #fff0f6 45%, #e8f8ff 100%);
  border: 1px solid rgba(255,255,255,.9);
  box-shadow: var(--shadow);
}
.tv-world::before,
.tv-world::after {
  content: '';
  position: absolute;
  pointer-events: none;
}
.tv-world::before {
  inset: 0;
  background-image:
    radial-gradient(circle at 8% 72%, rgba(255,255,255,.86) 0 3px, transparent 3.5px),
    radial-gradient(circle at 91% 66%, rgba(255,255,255,.84) 0 3px, transparent 3.5px),
    radial-gradient(circle at 78% 12%, rgba(255,225,80,.68) 0 3px, transparent 3.5px),
    radial-gradient(circle at 24% 12%, rgba(255,143,190,.58) 0 3px, transparent 3.5px);
}
.tv-world::after {
  left: 4%;
  right: 4%;
  bottom: 42px;
  height: 72px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(91,79,132,.16) 0%, transparent 70%);
  filter: blur(7px);
}
.retro-tv {
  position: relative;
  z-index: 4;
  width: min(900px, 100%);
  padding-top: 78px;
}
.tv-antennas {
  position: absolute;
  left: 50%;
  top: 0;
  width: 250px;
  height: 110px;
  transform: translateX(-50%);
  z-index: -1;
}
.antenna {
  position: absolute;
  bottom: 12px;
  width: 10px;
  height: 112px;
  border-radius: 999px;
  background: linear-gradient(90deg, #796997, #c7bce0 50%, #66577f);
  transform-origin: bottom center;
  box-shadow: 0 5px 12px rgba(80,64,112,.18);
}
.antenna-left { left: 92px; transform: rotate(-31deg); }
.antenna-right { right: 92px; transform: rotate(31deg); }
.antenna-ball {
  position: absolute;
  top: 2px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: linear-gradient(145deg, #ffe77b, #ffb93c);
  border: 4px solid #fff4c4;
  box-shadow: var(--soft-shadow);
}
.ball-left { left: 36px; }
.ball-right { right: 36px; }
.tv-top-sign {
  position: absolute;
  top: 54px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: min(470px, 80%);
  padding: 12px 22px;
  border-radius: 999px;
  background: linear-gradient(135deg, #fff8c6, #ffd985);
  border: 5px solid #fff6d5;
  outline: 2px solid rgba(207,157,50,.34);
  color: #665071;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-size: clamp(1rem, 2vw, 1.28rem);
  font-weight: 900;
  box-shadow: 0 12px 24px rgba(116,82,144,.17);
}
.tv-cabinet {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 160px;
  gap: 18px;
  padding: 28px;
  border-radius: 44px 44px 32px 32px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.48), transparent 18%),
    linear-gradient(145deg, #ffbf72 0%, #e98455 48%, #c66051 100%);
  border: 9px solid #fff0bb;
  outline: 3px solid rgba(133,76,72,.3);
  box-shadow:
    inset 0 -14px 0 rgba(118,55,62,.18),
    inset 0 12px 0 rgba(255,255,255,.24),
    0 28px 54px rgba(91,63,116,.25);
}
.tv-screen-frame {
  padding: 18px;
  border-radius: 34px;
  background: linear-gradient(145deg, #745a78 0%, #473b5a 50%, #2f2b42 100%);
  box-shadow: inset 0 0 0 4px rgba(255,255,255,.14), inset 0 0 28px rgba(0,0,0,.45);
}
.tv-screen {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border-radius: 24px;
  background: #171923;
  box-shadow: inset 0 0 22px rgba(0,0,0,.78);
}
.tv-screen::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,.16) 0%, transparent 22%, transparent 100%);
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.08);
}
.tv-screen iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.tv-side-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: 10px 6px 0;
}
.tv-brand-mark {
  width: 112px;
  min-height: 62px;
  display: grid;
  place-items: center;
  text-align: center;
  border-radius: 18px;
  background: rgba(255,248,204,.9);
  border: 4px solid rgba(255,255,255,.5);
  color: #7f5062;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: .06em;
  box-shadow: inset 0 -6px 0 rgba(196,116,69,.12);
}
.tv-knob {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 30%, #fff5c2 0 12%, #ffd453 13% 55%, #cc803f 57% 72%, #85536a 74% 100%);
  box-shadow: 0 10px 18px rgba(84,54,87,.24), inset 0 -7px 0 rgba(120,71,53,.2);
}
.tv-knob span {
  width: 5px;
  height: 28px;
  border-radius: 999px;
  background: #75506b;
  transform: rotate(28deg);
  transform-origin: center;
}
.knob-volume { transform: scale(.82); }
.knob-volume span { transform: rotate(-35deg); }
.tv-speaker {
  width: 112px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
  padding: 15px 16px;
  border-radius: 22px;
  background: rgba(112,70,82,.32);
  box-shadow: inset 0 3px 10px rgba(71,41,58,.2);
}
.tv-speaker i {
  display: block;
  height: 8px;
  border-radius: 999px;
  background: rgba(255,241,198,.72);
}
.tv-feet {
  display: flex;
  justify-content: space-between;
  width: 72%;
  margin: -4px auto 0;
}
.tv-feet span {
  width: 92px;
  height: 28px;
  border-radius: 0 0 22px 22px;
  background: linear-gradient(180deg, #98565b, #6f4358);
  transform: skewX(-10deg);
  box-shadow: 0 10px 14px rgba(75,50,90,.15);
}
.tv-feet span:last-child { transform: skewX(10deg); }
.tv-character {
  position: absolute;
  z-index: 6;
  filter: drop-shadow(0 18px 20px rgba(91,65,126,.2));
  animation: bob 4.2s ease-in-out infinite;
  pointer-events: none;
}
.tv-piko { width: 150px; left: 20px; bottom: 54px; }
.tv-momo { width: 136px; right: 24px; bottom: 54px; animation-delay: .7s; }
.tv-bot { width: 118px; left: 54px; top: 52px; animation-delay: 1.2s; }
.tv-kirara { width: 110px; right: 58px; top: 44px; animation-delay: 1.8s; }
.tv-after-message {
  position: relative;
  z-index: 5;
  margin-top: 24px;
  text-align: center;
}
.tv-after-message p {
  margin: 0 0 14px;
  color: var(--sub);
  font-weight: 800;
}

.site-footer {
  padding: 40px 0 28px;
  margin-top: 14px;
  background: rgba(255,255,255,.82);
}
.footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}
.footer-title {
  margin: 0 0 6px;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-size: 1.3rem;
  font-weight: 900;
}
.footer-copy { margin: 0; }

.footer-production {
  margin: 8px 0 0;
  color: var(--ink);
  font-weight: 900;
  font-size: 1rem;
}
.footer-nav {
  display: flex;
  gap: 18px;
  font-weight: 900;
  color: #75688f;
}
.footer-credit {
  text-align: center;
  color: #9a8fb4;
  font-size: .92rem;
  margin: 24px 0 0;
}

.reveal {
  opacity: 1;
  transform: none;
  transition: opacity .85s ease, transform .85s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}
.delay-1 { transition-delay: .12s; }
.delay-2 { transition-delay: .24s; }

@keyframes bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}
@keyframes pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}
@keyframes ticker {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@keyframes sceneZoom {
  0%, 100% { transform: scale(1.04); }
  50% { transform: scale(1.08); }
}
@keyframes cloudDrift {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(22px); }
}
@keyframes orbFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-20px); }
}
@keyframes twinkle {
  0%, 100% { opacity: .92; transform: translateY(0); }
  50% { opacity: .66; transform: translateY(-10px); }
}

@media (max-width: 1100px) {
  .hero-layout,
  .story-wrap,
  .coloring-panel,
  .friends-stage,
  .spot-grid { grid-template-columns: repeat(2, 1fr); }
  .content-grid { grid-template-columns: repeat(2, 1fr); }
  .hero-scene { min-height: 760px; }
}

@media (max-width: 760px) {
  .header-inner { min-height: 74px; }
  .site-logo-icon { width: 44px; height: 44px; }
  .site-logo-title small { display: none; }
  .site-logo-title strong { font-size: .92rem; }
  .nav-toggle { display: inline-flex; }
  .site-nav {
    position: absolute;
    top: calc(100% + 10px);
    left: 16px;
    right: 16px;
    display: grid;
    gap: 4px;
    background: rgba(255,255,255,.96);
    border-radius: 24px;
    padding: 14px;
    box-shadow: var(--shadow);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: .25s ease;
  }
  .site-nav.open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  .site-nav a { padding: 10px 12px; }

  .hero-scene { min-height: 860px; }
  .hero-copy { padding: 28px 22px 24px; border-radius: 28px; }
  .hero-copy h1 { font-size: clamp(2.15rem, 10vw, 3.2rem); }
  .hero-character.piko { width: 165px; right: 12%; }
  .hero-character.momo { width: 150px; right: 48%; }
  .hero-character.bot { width: 122px; right: 0; bottom: 160px; }
  .hero-character.kororin { width: 92px; right: 70%; }
  .hero-character.kirara { width: 94px; right: 6px; top: 146px; }
  .bubble { display: none; }

  .section { padding: 74px 0; }
  .friends-stage,
  .spot-grid,
  .content-grid,
  .coloring-cards { grid-template-columns: 1fr; }
  .coloring-card.wide { grid-column: auto; }
  .story-visual { min-height: 420px; }
  .main-card { position: relative; width: 86%; top: 0; }
  .sub-card { width: 45%; }
  .right-card { left: 0; }
  .footer-inner { display: grid; justify-items: start; }
  .footer-nav { flex-wrap: wrap; }
  .town-pin {
    font-size: .78rem;
    padding: 7px 10px;
  }
}


@media (max-width: 980px) {
  .tv-world {
    min-height: 660px;
    padding: 82px 72px 72px;
  }
  .tv-cabinet {
    grid-template-columns: minmax(0, 1fr) 125px;
    padding: 22px;
  }
  .tv-brand-mark,
  .tv-speaker { width: 92px; }
  .tv-knob { width: 62px; height: 62px; }
  .tv-piko { width: 118px; left: 8px; }
  .tv-momo { width: 108px; right: 8px; }
  .tv-bot { width: 94px; left: 24px; }
  .tv-kirara { width: 88px; right: 28px; }
}

@media (max-width: 720px) {
  .tv-world {
    min-height: 560px;
    padding: 68px 12px 62px;
    border-radius: 32px;
  }
  .retro-tv {
    width: 100%;
    padding-top: 58px;
  }
  .tv-top-sign {
    top: 42px;
    min-width: 78%;
    padding: 9px 14px;
    font-size: .88rem;
    border-width: 4px;
  }
  .tv-antennas {
    width: 180px;
    height: 78px;
  }
  .antenna { height: 76px; width: 8px; }
  .antenna-left { left: 66px; }
  .antenna-right { right: 66px; }
  .antenna-ball { width: 22px; height: 22px; }
  .ball-left { left: 26px; }
  .ball-right { right: 26px; }
  .tv-cabinet {
    display: block;
    padding: 14px;
    border-width: 7px;
    border-radius: 30px 30px 24px 24px;
  }
  .tv-screen-frame { padding: 10px; border-radius: 24px; }
  .tv-screen { border-radius: 17px; }
  .tv-side-panel {
    flex-direction: row;
    justify-content: center;
    gap: 12px;
    padding-top: 14px;
  }
  .tv-brand-mark { width: 86px; min-height: 48px; font-size: .78rem; }
  .tv-knob { width: 46px; height: 46px; }
  .tv-knob span { height: 18px; }
  .tv-speaker { width: 88px; grid-template-columns: repeat(4, 1fr); padding: 10px; gap: 6px; }
  .tv-speaker i { height: 6px; }
  .tv-feet { width: 68%; }
  .tv-feet span { width: 58px; height: 20px; }
  .tv-character { display: none; }
  .broadcast-time { font-size: 1rem; padding: 9px 14px; }
}

@keyframes onAirBlink {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .45; transform: scale(.82); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
  .reveal { opacity: 1; transform: none; }
}

/* Nurie implementation: the gallery is always visible, independent of animation JS. */
html { color-scheme: light; }
main > section { scroll-margin-top: 108px; }
.container, .container > *, .nurie-grid > * { min-width: 0; }
.skip-to-coloring { position:fixed;left:12px;top:12px;transform:translateY(-160%);z-index:1000;background:#fff3aa;color:#483858;padding:12px 20px;border:2px solid #715f4b;border-radius:16px;font-weight:800; }
.skip-to-coloring:focus { transform:none; }
.reveal[data-reveal-pending="true"] { opacity:0;transform:translateY(24px); }
.nurie-section { padding:76px 0 90px; background:linear-gradient(180deg,#fff9ea 0%,#ffedf2 42%,#eaf7f3 100%); position:relative;overflow:hidden; }
.nurie-world { position:relative;max-width:1180px; }
.nurie-heading { text-align:center;position:relative;padding:32px 20px 42px;isolation:isolate; }
.nurie-heading::before { content:"";position:absolute;inset:10px 10% 18px;background:#ffffffa8;border:2px dashed #efcd95;border-radius:48% 52% 46% 54% / 24% 27% 24% 22%;z-index:-1; }
.nurie-kicker { display:inline-block;margin:0 0 13px;padding:5px 20px;background:#fff2a9;color:#735d36;border-radius:999px;font-size:15px;font-weight:900;letter-spacing:.12em; }
.nurie-heading h2 { margin:0;color:#534166;font-family:'M PLUS Rounded 1c',sans-serif;font-size:clamp(19px,2.4vw,28px);line-height:1.5; }
.nurie-heading h2 span { display:block;margin:3px 0 15px;font-size:clamp(30px,4.6vw,48px);letter-spacing:.05em;color:#bb597c;text-shadow:0 3px 0 #fff;line-height:1.4; }
.nurie-intro { margin:0;color:#6a586f;font-weight:700;font-size:17px;line-height:1.9; }
.nurie-tags { display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:20px 0 0; }
.nurie-tags span { font-size:13px;font-weight:800;border-radius:999px;background:#fff;color:#5b6871;padding:6px 14px;border:1px solid #dddcd5; }
.nurie-crayons { position:absolute;right:2.5%;top:39px;display:flex;align-items:flex-end;gap:8px;transform:rotate(18deg);pointer-events:none; }
.nurie-crayons i { width:14px;height:73px;border-radius:2px 2px 4px 4px;background:linear-gradient(to right,#ffffff55,transparent 42%,#00000012);background-color:#efac62;position:relative;border-top:8px solid #51456625;border-bottom:8px solid #51456625; }
.nurie-crayons i::before { content:"";position:absolute;left:0;top:-23px;width:14px;height:16px;background:inherit;clip-path:polygon(50% 0,100% 100%,0 100%); }
.nurie-crayons i:nth-child(2) { height:85px;background-color:#e792b1; }
.nurie-crayons i:nth-child(3) { height:93px;background-color:#70bad7; }
.nurie-crayons i:nth-child(4) { height:79px;background-color:#a1c47c; }
.nurie-crayons i:nth-child(5) { height:69px;background-color:#b59ad7; }
.nurie-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:14px; }
.nurie-card { min-width:0;background:#fff;border:2px solid var(--nurie-tint);border-radius:28px;box-shadow:0 12px 28px #72535f12;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease; }
.nurie-card:hover { transform:translateY(-4px);box-shadow:0 18px 34px #72535f1c; }
.nurie-paper { position:relative;display:block;background:#fff;border-bottom:2px dashed var(--nurie-tint);padding:24px 23px 18px; }
.nurie-paper img { display:block;width:100%;height:auto;aspect-ratio:1122/1402;object-fit:contain;background:#fff;max-height:380px; }
.nurie-magnify { position:absolute;right:15px;bottom:14px;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--nurie-tint);color:var(--nurie-accent);box-shadow:0 2px 10px #0000000d; }
.nurie-magnify svg,.nurie-save svg { width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.nurie-caption { text-align:center;padding:17px 22px 20px;background:linear-gradient(180deg,#fff,var(--nurie-tint)); }
.nurie-caption h3 { margin:0 0 5px;font-size:25px;font-weight:900;color:var(--nurie-accent); }
.nurie-caption p { margin:0 0 17px;font-size:13px;font-weight:600;color:#6c6170;line-height:1.7; }
.nurie-save { display:flex;align-items:center;justify-content:center;gap:9px;min-height:49px;padding:12px 18px;background:#ffdc67;border:1px solid #e8bc44;border-radius:999px;color:#524029;font-weight:900;box-shadow:0 4px 0 #edbc4240;text-decoration:none;font-size:16px;cursor:pointer; }
.nurie-save:hover { background:#ffce47; }
.nurie-print-link { display:inline-block;margin-top:11px;padding:5px 4px;font-size:13px;font-weight:700;color:#685b71;text-decoration:underline;text-underline-offset:4px; }
.nurie-help { display:grid;grid-template-columns:auto 1fr;align-items:start;gap:22px;margin-top:32px;padding:21px 28px;border:1px solid #d5e3d1;background:#ffffffb8;border-radius:24px;color:#5e6567; }
.nurie-help strong { font-size:15px;color:#4b715c;padding-top:2px;white-space:nowrap; }
.nurie-help p { margin:0;line-height:1.85;font-size:14px; }
.nurie-section a:focus-visible,.nurie-dialog a:focus-visible,.nurie-dialog button:focus-visible { outline:3px solid #287ab4;outline-offset:4px; }
.nurie-dialog { width:min(820px,calc(100% - 24px));max-width:820px;max-height:90vh;max-height:90dvh;box-sizing:border-box;margin:auto;border:0;border-radius:24px;padding:0;background:#fff;color:#544263;box-shadow:0 20px 90px #2e1f4544; }
.nurie-dialog:not([open]) { display:none; }
.nurie-dialog::backdrop { background:#3028419c; }
.nurie-dialog-head { display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 22px;border-bottom:1px solid #eee5df;background:#fffaf0; }
.nurie-dialog-head h2 { font-size:21px;line-height:1.5;margin:0; }
.nurie-close { display:inline-flex;align-items:center;gap:12px;min-height:44px;font:700 14px/1.2 system-ui;color:#665175;background:white;border:1px solid #e3dce9;border-radius:999px;padding:10px 15px;cursor:pointer; }
.nurie-close span { font-size:23px; }
.nurie-dialog-body { overflow:auto;overscroll-behavior:contain;max-height:65vh;max-height:65dvh;display:flex;justify-content:center;background:white;padding:16px; }
.nurie-dialog-body img { width:auto;height:auto;max-height:calc(65vh - 32px);max-height:calc(65dvh - 32px);max-width:100%;object-fit:contain;display:block;background:white; }
.nurie-dialog-foot { display:flex;justify-content:center;align-items:center;gap:12px;padding:14px 20px;border-top:1px solid #eee5df;background:#fffaf0; }
.nurie-dialog-foot a { flex:1;max-width:260px;text-align:center; }
.nurie-print-button { display:block;border-radius:999px;border:1px solid #dacfe0;padding:12px 16px;min-height:49px;background:white;font-weight:700;font-size:15px;color:#654e75; }
html.nurie-open { overflow:hidden; }
.footer-production { margin:8px 0 0;color:var(--ink);font-weight:900; }
/* Keep existing mobile sections full-width; these grids had regressed to two columns. */
@media(max-width:1100px) {
  .story-wrap { grid-template-columns:minmax(0,1fr); }
  .nurie-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:24px; }
}
@media(max-width:980px) {
  .site-logo { gap:8px;min-width:0; }
  .header-inner { gap:12px; }
  .site-logo-title strong { font-size:.9rem; }
  .site-nav { gap:10px;font-size:13px; }
}
@media(max-width:760px) {
  .site-logo-title { min-width:0; }
  .site-logo-title strong { font-size:.83rem;line-height:1.4; }
  .site-logo-icon { width:36px;height:36px; }
  .nav-toggle { flex-shrink:0;padding:11px 14px;font-size:13px; }
  .site-nav { font-size:15px; }
  .nurie-section { padding:46px 0 56px; }
  .nurie-heading { padding:26px 6px 26px; }
  .nurie-heading::before { inset:10px 0; }
  .nurie-crayons { right:8px;top:0;transform:scale(.65) rotate(18deg);transform-origin:top right;opacity:.7; }
  .nurie-kicker { font-size:12px;margin-bottom:14px; }
  .nurie-intro { font-size:15px; }
  .nurie-tags { gap:6px;margin-top:14px; }
  .nurie-tags span { font-size:11px;padding:5px 9px; }
  .nurie-help { display:block;padding:18px 20px; }
  .nurie-help strong { display:block;margin-bottom:8px; }
  .nurie-help p { font-size:13px; }
  .nurie-dialog-head { padding:12px 14px; }
  .nurie-dialog-head h2 { font-size:17px; }
  .nurie-dialog-foot { gap:8px;padding:12px; }
  .nurie-dialog-foot a { font-size:13px;padding:12px 8px; }
  .tv-cabinet,.tv-side-panel { min-width:0; }
}
@media(max-width:599px) {
  .nurie-grid { grid-template-columns:minmax(0,1fr);gap:24px;width:min(100%,400px);margin:14px auto 0; }
  .nurie-paper { padding:20px 32px 16px; }
  .nurie-paper img { height:300px;max-height:300px;aspect-ratio:auto; }
  .nurie-caption { padding:16px 24px 18px; }
  .nurie-caption h3 { font-size:23px; }
}
@media(max-width:400px) {
  .header-inner { gap:8px; }
  .site-logo { max-width:calc(100% - 74px); }
  .site-logo-title strong { font-size:12px; }
  .site-logo-icon { width:30px;height:30px; }
  .nurie-heading h2 span { font-size:29px;letter-spacing:.015em; }
  .nurie-intro { font-size:14px; }
  .nurie-paper img { height:285px;max-height:285px; }
  .tv-side-panel { flex-wrap:wrap;gap:8px; }
}
@media(prefers-reduced-motion:reduce) {
  .reveal[data-reveal-pending="true"] { opacity:1;transform:none; }
  .nurie-card { transition:none; }
  .nurie-card:hover { transform:none; }
}

/* Header / key visual layout. The image is an unobstructed, separate region. */
:root { --kururi-header-height:110px; }
.visually-hidden { position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important; }
.site-header { position:sticky;top:0;z-index:50;background:#fffcf6f5;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:0;box-shadow:0 2px 14px #48788810; }
.site-header::after { content:"";position:absolute;bottom:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,#ffc85e 0%,#ffc85e 20%,#ef9eba 20%,#ef9eba 40%,#7ecada 40%,#7ecada 60%,#a8ca7d 60%,#a8ca7d 80%,#b3a1d6 80%); }
.header-inner { width:calc(100% - 64px);max-width:1440px;min-height:var(--kururi-header-height);height:auto;gap:32px;padding:7px 0 10px; }
.site-logo { display:block;flex:0 0 278px;width:278px;max-width:none;min-width:0;padding:0;margin:0;line-height:0; }
.site-logo picture { display:block;width:100%; }
.site-title-logo { display:block;width:100%;height:auto;max-height:96px;object-fit:contain;filter:drop-shadow(0 2px 0 #5e4e6712); }
.site-logo:focus-visible { outline:3px solid #468da5;outline-offset:4px;border-radius:10px; }
.site-nav { position:static;display:flex;gap:clamp(14px,1.55vw,28px);align-items:center;font-size:14px;line-height:1.5;font-weight:800;color:#69556a;visibility:visible;opacity:1;transform:none;box-shadow:none;background:none;padding:0; }
.site-nav a { display:inline-flex;align-items:center;gap:7px;white-space:nowrap;min-height:46px;padding:9px 1px; }
.site-nav a::after { bottom:5px; }
.site-nav .nav-cta { padding:12px 19px;background:#ffde79;border:1px solid #eaba4770;border-radius:999px;box-shadow:0 4px 0 #e9bc4024;color:#634d30; }
.site-nav .nav-cta::after { display:none; }
.site-nav .nav-cta:hover { background:#ffd15b; }
.nav-toggle { display:none; }
main > section { scroll-margin-top:calc(var(--kururi-header-height) + 14px); }

.kv-hero { position:relative;padding:0;margin:0; }
.kv-world { position:relative;isolation:isolate;overflow:hidden;padding:18px max(16px,2.6vw) 24px;background:radial-gradient(ellipse at 2% 85%,#ecfbff 0,transparent 44%),radial-gradient(ellipse at 97% 20%,#effcff 0,transparent 45%),linear-gradient(180deg,#d0effd,#bee4f5 66%,#e9f7fb); }
.kv-stage { position:relative;z-index:1;display:table;width:auto;max-width:100%;margin:0 auto;padding:0;border:0;border-radius:0;overflow:visible;background:transparent;box-shadow:0 8px 30px #365c7724; }
.kv-stage::after { content:none;display:none; }
.kv-image { position:static;display:block;width:auto;height:auto;max-width:100%;max-height:calc(100vh - var(--kururi-header-height) - 42px);max-height:calc(100svh - var(--kururi-header-height) - 42px);object-fit:contain;object-position:center;transform:none;animation:none;border-radius:0;filter:none; }
.kv-sky-decor { position:absolute;z-index:0;inset:0;pointer-events:none; }
.kv-cloud { display:block;position:absolute;width:155px;height:40px;background:#ffffffab;border-radius:100px; }
.kv-cloud::before,.kv-cloud::after { content:"";position:absolute;background:inherit;border-radius:50%; }
.kv-cloud::before { width:74px;height:74px;left:20px;bottom:7px; }
.kv-cloud::after { width:57px;height:57px;right:16px;bottom:9px; }
.kv-cloud-left { left:-48px;top:31%;animation:cloudDrift 24s ease-in-out infinite; }
.kv-cloud-right { right:-42px;top:62%;animation:cloudDrift 29s ease-in-out infinite reverse; }
.kv-twinkle { position:absolute;color:#fff8cf;text-shadow:0 0 7px #fff;font-size:32px;animation:twinkle 9s ease-in-out infinite; }
.twinkle-left { left:2.2%;top:12%; }.twinkle-right { right:2.2%;bottom:15%;font-size:25px; }

.welcome-band { position:relative;background:#fffcf3;border-top:1px solid #fff;border-bottom:1px dashed #e2c997; }
.welcome-inner { width:calc(100% - 64px);max-width:1300px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:30px;padding:28px 0 30px; }
.welcome-kicker { margin:0 0 7px;color:#93815e;font-size:10px;font-weight:900;letter-spacing:.18em; }
.welcome-copy h2 { margin:0 0 6px;font-family:'M PLUS Rounded 1c',sans-serif;font-size:clamp(23px,2.05vw,29px);font-weight:900;line-height:1.4;color:#65495a; }
.welcome-copy > p:last-child { margin:0;color:#7a6c6d;font-weight:500;font-size:14px;line-height:1.85; }
.welcome-links { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px; }
.welcome-link { display:flex;align-items:center;gap:12px;min-width:218px;min-height:84px;border-radius:22px;padding:16px 18px;border:1px solid #e5bd67;box-shadow:0 4px 0 #e9b8492e;background:#ffe39c;color:#684f30;transition:transform .2s,box-shadow .2s; }
.welcome-coloring { background:#e3f2da;border-color:#b6cea1;box-shadow:0 4px 0 #89ae7426;color:#4c6a49; }
.welcome-link:hover { transform:translateY(-3px);box-shadow:0 8px 15px #68584213; }
.welcome-link:focus-visible,.nav-toggle:focus-visible,.site-nav a:focus-visible { outline:3px solid #348faa;outline-offset:4px; }
.welcome-icon { flex:none;width:40px;height:40px;display:grid;place-items:center; }
.welcome-icon svg { width:35px;height:35px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round; }
.welcome-icon .play-glyph { fill:currentColor;stroke:none; }
.welcome-link-copy { display:grid;gap:2px; }
.welcome-link-copy small { font-size:10px;font-weight:700;white-space:nowrap;line-height:1.5; }
.welcome-link-copy strong { font-size:17px;font-weight:900;white-space:nowrap;line-height:1.5; }
.welcome-arrow { margin-left:auto;font-size:18px; }
.kv-hero .message-ticker { margin-top:0;box-shadow:none; }
.kv-hero .message-ticker-track { font-size:15px;padding:10px 0;letter-spacing:.035em; }

@media(min-width:981px) and (max-width:1160px) {
 .header-inner { width:calc(100% - 40px);gap:20px; }
 .site-logo { flex-basis:244px;width:244px; }
 .site-nav { gap:14px;font-size:13px; }
 .site-nav .nav-cta { padding-inline:13px; }
 .welcome-inner { width:calc(100% - 48px);gap:22px; }
 .welcome-link { min-width:196px;padding-inline:14px;gap:8px; }
 .welcome-link-copy strong { font-size:16px; }
 .welcome-arrow { display:none; }
}
@media(max-width:980px) {
 :root { --kururi-header-height:88px; }
 .header-inner { width:calc(100% - 32px);min-height:88px;padding:6px 0 9px;gap:20px; }
 .site-logo { flex:0 1 220px;width:220px;max-width:calc(100% - 86px); }
 .site-title-logo { width:100%;height:auto;max-height:74px; }
 .nav-toggle { display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;flex:0 0 64px;min-width:64px;min-height:58px;padding:10px 8px;border:1px solid #e7d7b5;background:#fffdf7;border-radius:18px;color:#715769;box-shadow:0 3px 0 #c6ab8420;font-size:10px;line-height:1.3;cursor:pointer; }
 .menu-strokes { display:grid;gap:4px;width:23px;height:18px; }
 .menu-strokes i { display:block;width:23px;height:2px;border-radius:5px;background:currentColor;transition:transform .2s,opacity .2s; }
 .nav-toggle[aria-expanded="true"] .menu-strokes i:nth-child(1) { transform:translateY(6px) rotate(45deg); }
 .nav-toggle[aria-expanded="true"] .menu-strokes i:nth-child(2) { opacity:0; }
 .nav-toggle[aria-expanded="true"] .menu-strokes i:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }
 .site-nav { display:none;position:absolute;top:calc(100% + 8px);left:16px;right:16px;padding:16px;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:calc(100svh - 110px);overflow:auto;background:#fffdf8;border:1px solid #ecdabc;border-radius:22px;box-shadow:0 12px 35px #63524f24;visibility:hidden;opacity:0;transform:none;font-size:14px; }
 .site-nav.open { display:grid;visibility:visible;opacity:1;transform:none; }
 .site-nav a { justify-content:center;min-height:49px;padding:10px;background:#fff7e6;border-radius:12px;white-space:normal;text-align:center; }
 .site-nav .nav-cta { padding:10px;border-radius:12px; }
 .site-nav a::after { display:none; }
 .kv-world { padding:14px 16px 18px; }
 .kv-image { max-height:none; }
 .welcome-inner { width:calc(100% - 48px);grid-template-columns:1fr;gap:20px;text-align:center;padding:25px 0 28px; }
 .welcome-links { width:100%;max-width:520px;margin:auto; }
 .welcome-link { min-width:0;text-align:left;justify-content:center; }
 .welcome-copy h2 { font-size:26px; }
 .welcome-copy > p:last-child { font-size:14px; }
}
@media(max-width:599px) {
 :root { --kururi-header-height:82px; }
 .header-inner { width:calc(100% - 28px);min-height:82px;gap:12px; }
 .site-logo { flex:0 1 214px;width:214px;max-width:calc(100% - 76px); }
 .site-title-logo { max-height:72px; }
 .nav-toggle { min-width:58px;flex-basis:58px;min-height:54px;padding:8px 6px;border-radius:17px; }
 .site-nav { left:12px;right:12px; }
 .kv-world { padding:10px 0 14px; }
 .kv-stage { width:100%;max-width:100%;box-shadow:none; }
 .kv-image { width:100%;height:auto;max-height:none; }
 .kv-sky-decor { display:none; }
 .welcome-inner { width:calc(100% - 32px);padding:24px 0 26px;gap:18px; }
 .welcome-kicker { font-size:9px;letter-spacing:.14em;margin-bottom:8px; }
 .welcome-copy h2 { font-size:23px;line-height:1.45; }
 .welcome-copy > p:last-child { max-width:330px;margin:0 auto;font-size:13px;line-height:1.9;text-wrap:pretty; }
 .welcome-links { gap:10px; }
 .welcome-link { display:flex;flex-direction:column;gap:8px;min-height:120px;padding:14px 8px 13px;border-radius:20px;text-align:center; }
 .welcome-icon { width:30px;height:29px; }
 .welcome-icon svg { width:30px;height:30px; }
 .welcome-link-copy { gap:3px; }
 .welcome-link-copy small { font-size:9px; }
 .welcome-link-copy strong { font-size:15px; }
 .welcome-arrow { display:none; }
 .kv-hero .message-ticker-track { font-size:13px;gap:20px;padding:9px 0; }
}
@media(max-width:359px) {
 .header-inner { width:calc(100% - 24px); }
 .site-logo { flex-basis:195px;width:195px; }
 .welcome-inner { width:calc(100% - 24px); }
 .welcome-copy h2 { font-size:21px; }
 .welcome-link-copy strong { font-size:14px; }
 .welcome-link-copy small { font-size:8px; }
}
@media(prefers-reduced-motion:reduce) {
 .kv-cloud,.kv-twinkle { animation:none; }
 .welcome-link { transition:none; }.welcome-link:hover { transform:none; }
}

@media(max-width:599px) { .welcome-copy > p:last-child span { display:block; } }
