/* Campaign hero and live-broadcast preview. */
.hero{padding-top:6px}
.hero-header{display:flex;align-items:center;justify-content:flex-start;position:relative;z-index:5;height:70px}
.brand.hero-brand{font-size:27px;gap:0;margin:0;letter-spacing:.10em}
.brand.hero-brand img{width:61px;height:61px}
.hero-stage{position:relative;height:630px;margin:0 -18px;isolation:isolate}
.hero h1{position:absolute;z-index:4;left:50px;top:45px;text-align:left;font-size:clamp(58px,5.7vw,77px);line-height:1.45;letter-spacing:-.07em;transform:rotate(-4deg);margin:0}
.headline-line{position:relative;display:block;width:fit-content;isolation:isolate;color:#080d3d;font-weight:900;white-space:nowrap}
.headline-line{paint-order:stroke fill;-webkit-text-stroke:10px #fff;text-shadow:2px 6px 0 #cdd2f480}.headline-line::before{display:none}
.headline-accent{color:#7544ed;font-size:1.1em}.headline-accent>span{color:#008bec}
.hero-art{position:absolute;inset:0;margin:0;height:100%;width:100%;display:block}
.hero-art .hero-halo{width:100%;height:85%;bottom:0;left:0;background:radial-gradient(ellipse at 65% 55%,#e7e0ff 0,#e9fbff70 50%,transparent 72%);border-radius:0}
.hero-characters.generated{position:absolute;width:100%;height:100%;max-width:none;right:-10%;bottom:0;object-fit:cover;object-position:50% 38%;border-radius:0;mask-image:linear-gradient(transparent 0%,#000 9%,#000 80%,transparent 100%);z-index:1;mix-blend-mode:multiply}
.hero-orbit{position:absolute;border:1px solid #b7caff65;border-radius:50%;width:70%;height:32%;bottom:14%;left:18%;transform:rotate(-24deg)}
.orbit-two{width:45%;height:20%;bottom:28%;left:46%;border-color:#bdebfa80}
.hero-stage .spark-one{z-index:2;left:1%;top:64%;font-size:50px}
.hero-stage .spark-two{z-index:2;right:0;top:20%;font-size:35px}
.hero-stage .spark-three{z-index:2;right:9%;top:80%;font-size:25px}
.hero-bottom{margin-top:-14px}
.recruitment{filter:drop-shadow(0 2px 1px #fff);text-shadow:none}
.live-visual{height:410px;max-width:740px;margin:28px auto 8px;grid-template-columns:1fr 1fr;gap:30px;overflow:visible;align-items:center;background:radial-gradient(ellipse at 70% 55%,#efedffbb,transparent 65%)}
.stream-preview{position:relative;isolation:isolate;width:100%;height:100%;max-width:300px;justify-self:center;margin:0;overflow:hidden;border-radius:17px;border:3px solid #fff;box-shadow:0 8px 28px #5169b22b;transform:rotate(-3deg);background:#a8a5d5;color:#fff;text-align:left}
.stream-character{width:100%;height:100%;object-fit:cover;object-position:50% 36%}
.stream-preview::after{position:absolute;content:"";inset:0;background:linear-gradient(#10122e55 0,transparent 20%,transparent 38%,#1c154337 56%,#110f407d 100%);pointer-events:none;z-index:0}
.stream-top{position:absolute;inset:12px 12px auto;z-index:2;display:flex;align-items:center;gap:6px;line-height:1.2}
.stream-avatar{width:29px;height:29px;display:block;border-radius:50%;overflow:hidden;border:1px solid #fff8;flex-shrink:0;background:#fff}
.stream-avatar img{width:100%;height:100%}
.stream-top strong{font-size:12px;text-shadow:0 1px 3px #0008;letter-spacing:.02em}
.on-air{margin-left:auto;padding:4px 6px;background:#f72b7f;font-family:Arial,sans-serif;font-size:11px;line-height:1;font-weight:800;letter-spacing:.06em;border-radius:4px;color:#fff}
.stream-overlay{position:absolute;inset:0;z-index:2;padding:13px;display:flex;flex-direction:column;justify-content:flex-end;pointer-events:none}
.stream-gift{display:flex;align-items:center;width:fit-content;max-width:95%;gap:8px;background:linear-gradient(110deg,#608debe8,#7d4edfdd);border:1px solid #fff9;border-radius:10px;padding:7px 12px;box-shadow:0 2px 14px #553bf940;margin-bottom:9px;transform:rotate(2deg)}
.stream-gift>span{font-size:27px;color:#9cefff;text-shadow:0 0 9px #a1d6ff;line-height:1}
.stream-gift p{font-size:12px;font-weight:700;line-height:1.4;letter-spacing:-.025em}
.stream-gift b{display:block;font-family:Arial,sans-serif;letter-spacing:.2em;font-size:9px;opacity:.9;margin-top:3px}
.stream-comments{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.stream-comments p{display:flex;align-items:center;gap:5px;width:fit-content;max-width:96%;line-height:1.5;padding:3px 8px 3px 5px;border-radius:7px;background:#17172b55;backdrop-filter:blur(5px);font-size:12px;text-shadow:0 1px 2px #0008}
.stream-comments i{display:inline-block;width:14px;height:14px;border-radius:50%;background:linear-gradient(140deg,#b8f0ff,#b3a6ff);flex-shrink:0}
.stream-comments p:nth-child(2) i{background:linear-gradient(140deg,#ffc6e4,#ba98ed)}
.stream-comments p:nth-child(3) i{background:linear-gradient(140deg,#eaeaa8,#9ef2e2)}
.stream-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.stream-toolbar>span{font-size:12px;background:#ffffff2a;border:1px solid #ffffff48;border-radius:40px;flex:1;padding:6px 11px;line-height:1.4}
.stream-toolbar>svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linejoin:round}
.stream-heart{position:absolute;color:#ff75b9;font-size:27px;line-height:1;text-shadow:0 2px 6px #e869d466}
.heart-one{right:11px;bottom:106px;transform:rotate(12deg)}
.heart-two{right:28px;bottom:138px;font-size:20px;color:#a4d8ff;transform:rotate(-13deg)}
.heart-three{right:13px;bottom:166px;font-size:16px;color:#d4aaff}
.stream-preview figcaption{position:absolute;bottom:5px;width:100%;text-align:center;font-size:10px;color:#fff9;line-height:1;z-index:3}
.live-interface{height:350px;max-width:310px;width:100%;align-self:center}
.live-pill{position:absolute;display:flex;flex-direction:column;gap:0;top:0;right:14px;width:184px;border-radius:18px;background:#04040b;transform:rotate(5deg);border:1px solid #514b78;padding:0 9px 13px;box-shadow:0 10px 25px #6d57d928;overflow:hidden}
.live-pill>img{width:153px;height:120px;object-fit:cover;mix-blend-mode:screen}
.live-pill>div{display:flex;align-items:center;gap:7px;justify-content:center;color:#fff}
.live-pill b{font-family:Arial,sans-serif;font-size:21px;line-height:1.2}
.live-pill span{font-size:11px;padding:3px 5px;line-height:1}
.visual-gift{top:138px;left:-8px;width:106px;height:106px;z-index:2}
.mock-comments{top:204px;right:0;width:81%}
.mock-goal{bottom:0;width:95%;left:0}
@media(max-width:1000px) and (min-width:701px){.hero-stage{height:600px}.hero h1{font-size:64px;top:18px}.hero-characters.generated{right:-10%;object-position:60% 0}.live-visual{gap:20px}.live-pill{right:0}}
@media(max-width:700px){
  .hero{padding-top:2px}
  .hero-header{height:56px;margin:0 -7px}
  .brand.hero-brand{font-size:23px;letter-spacing:.08em}
  .brand.hero-brand img{width:48px;height:48px}
  .hero-stage{height:490px;margin:0 -21px}
  .hero h1{top:12px;left:28px;font-size:clamp(36px,9.2vw,56px);line-height:1.45;letter-spacing:-.06em;transform:rotate(-4deg)}
  .headline-line{-webkit-text-stroke:8px white;text-shadow:1px 5px 0 #bccbff80}
  .hero-art{top:71px;height:calc(100% - 71px);width:100%;margin:0}
  .hero-characters.generated{width:140%;height:100%;right:-17%;bottom:0;object-fit:cover;object-position:60% 35%;mask-image:linear-gradient(transparent 0%,#000 10%,#000 83%,transparent 100%)}
  .hero-art .hero-halo{height:95%;bottom:0}
  .hero-stage .spark-one{left:5%;top:38%;font-size:30px}
  .hero-stage .spark-two{right:5%;top:22%;font-size:24px}
  .hero-stage .spark-three{right:4%;top:83%;font-size:20px}
  .hero-bottom{margin-top:-16px}
  .recruitment{font-size:clamp(18px,4.5vw,27px);line-height:1.6}
  .live-visual{height:320px;margin:23px -5px 12px;grid-template-columns:1.18fr .82fr;gap:10px;align-items:center;overflow:visible}
  .stream-preview{width:100%;height:300px;max-width:none;border-radius:13px;border-width:2px;transform:rotate(-3deg)}
  .stream-character{object-position:50% 35%}
  .stream-top{inset:9px 6px auto;gap:4px}
  .stream-avatar{width:20px;height:20px}
  .stream-top strong{font-size:10px}
  .on-air{font-size:9px;padding:4px;margin-left:auto}
  .stream-overlay{padding:8px 6px}
  .stream-gift{gap:4px;padding:6px 5px;max-width:100%;border-radius:7px;margin-bottom:6px}
  .stream-gift>span{font-size:20px}
  .stream-gift p{font-size:10px;line-height:1.5;white-space:nowrap}
  .stream-gift b{font-size:8px;margin-top:1px}
  .stream-comments{gap:4px;margin-bottom:8px}
  .stream-comments p{font-size:10px;padding:3px 5px 3px 3px;gap:3px;white-space:nowrap}
  .stream-comments i{width:10px;height:10px}
  .stream-toolbar{gap:5px;margin-bottom:11px}
  .stream-toolbar>span{font-size:10px;padding:5px 7px}
  .stream-toolbar>svg{width:19px;height:19px}
  .stream-preview figcaption{font-size:9px;bottom:5px}
  .stream-heart{font-size:19px}
  .heart-one{right:8px;bottom:116px}
  .heart-two{right:18px;bottom:146px;font-size:16px}
  .heart-three{right:8px;bottom:170px;font-size:13px}
  .live-interface{height:282px;max-width:none}
  .live-pill{right:0;top:8px;width:100%;max-width:142px;padding:0 5px 10px;border-radius:13px;transform:rotate(5deg)}
  .live-pill>img{width:100%;height:auto;aspect-ratio:1.2;object-fit:cover}
  .live-pill>div{gap:4px;flex-wrap:wrap}
  .live-pill b{font-size:15px}
  .live-pill span{font-size:10px;padding:3px 5px}
  .visual-gift{top:144px;left:-6px;width:77px;height:77px}
  .mock-comments{top:199px;right:0;width:100%}
  .mock-comments>div{padding:5px;gap:5px}
  .mock-comments i{width:15px;height:15px}
  .mock-comments b{font-size:12px}
  .mock-goal{display:none}
}
@media(min-width:480px) and (max-width:700px){.hero-stage{height:600px}.hero-art{top:110px;height:490px}.live-visual{height:400px;gap:25px}.stream-preview{height:380px}.stream-top strong{font-size:13px}.stream-overlay{padding:13px}.stream-comments p,.stream-gift p,.stream-toolbar>span{font-size:12px}.live-interface{height:340px}.live-pill{max-width:175px}.visual-gift{top:180px}.mock-comments{top:250px}}
@media(max-width:370px){.hero-stage{margin:0 -17px;height:430px}.hero h1{left:18px;font-size:33px}.hero-art{top:67px;height:363px}.hero-characters.generated{right:-19%;width:144%}.live-visual{height:290px;grid-template-columns:1.25fr .75fr;gap:8px;margin-left:-6px;margin-right:-6px}.stream-preview{height:280px}.live-interface{height:254px}.live-pill b{font-size:13px}.live-pill span{font-size:9px}.visual-gift{top:130px;width:65px;height:65px}.mock-comments{top:183px}.stream-comments p:nth-child(2){font-size:9px}.stream-top strong{font-size:9px}.stream-top{gap:3px}.on-air{padding:3px;font-size:8px}}
.hero-art{overflow:clip}
/* Original illustration for manager support. */
.manager-card{grid-template-columns:1.18fr 1fr;gap:22px;align-items:center}
.manager-illustration{width:100%;margin:0;align-self:center;justify-self:center}
.manager-illustration img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;mix-blend-mode:multiply}
@media(max-width:700px){.manager-card{grid-template-columns:1fr;gap:20px}.manager-illustration{width:min(100%,320px);margin:0 auto}.manager-illustration img{max-height:300px}}


/* First-cohort announcement and three simple entry points. */
.hero-bottom{padding:0 8px 9px}
.recruitment-kicker{font-size:1.125rem;font-weight:800;letter-spacing:.045em;line-height:1.6}
.recruitment-banner{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:0 .35em;
  width:min(100%,740px);margin:10px auto 0;padding:12px 24px 15px;
  border:3px solid var(--ink);border-radius:0;box-shadow:7px 8px 0 var(--ink);
  background:var(--gradient);color:#fff;font-size:clamp(2rem,6.5vw,4.375rem);
  font-weight:900;letter-spacing:.015em;line-height:1.3;
  paint-order:stroke fill;-webkit-text-stroke:1px #313777;text-shadow:2px 3px 0 #31377770;
}
.recruitment-banner>span,.recruitment-banner>strong{display:block;white-space:nowrap;font-weight:900}
.recruitment-number{font-family:Arial,var(--font);font-weight:900;margin-inline:.02em}
.entry-points{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,5.25rem),1fr));
  align-items:center;justify-items:center;gap:clamp(.375rem,1.7vw,1.5rem);
  width:min(100%,660px);margin:32px auto 0;padding:0;list-style:none;
  font-size:clamp(.9375rem,4vw,1.625rem);font-weight:900;line-height:1.4;letter-spacing:-.02em;
}
.entry-points>li{
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  width:min(100%,10.875rem);aspect-ratio:1;border:2px solid #fff;border-radius:50%;
  padding:2px;background:#7fdef3;color:#102450;text-align:center;
}
.entry-points>li:nth-child(2){background:#a5c9ff}
.entry-points>li:nth-child(3){background:#c8b0ff}
.entry-points span{display:block;white-space:nowrap}
.about+.live-card{margin-top:44px}
.live-card .environment-note{margin-bottom:0}
@media(max-width:700px){
  .hero-bottom{padding-inline:6px;padding-bottom:7px}
  .recruitment-kicker{font-size:1rem;letter-spacing:.025em}
  .recruitment-banner{margin-top:8px;padding:10px 10px 12px;font-size:clamp(2rem,8.8vw,3.375rem);box-shadow:5px 6px 0 var(--ink);text-shadow:1px 2px 0 #31377770}
  .entry-points{margin-top:25px}
  .about+.live-card{margin-top:28px}
}
/* Mobile reading and touch layout are the primary experience. */
@media(max-width:700px){
 .hero-stage{height:clamp(330px,48svh,450px)}
 .hero-art{top:71px;height:calc(100% - 71px)}
 .about-copy,.feature-copy,.live2d-copy .feature-copy,.closing-lead,.flow>p{font-size:16px;line-height:1.9}
 .about-copy{text-align:center}
 .about-copy p{text-wrap:balance}
 .content-section{margin-top:50px}
 .cta{min-height:64px;touch-action:manipulation}
 .live-card .cta{min-height:64px}
 .footer nav a{display:inline-flex;align-items:center;min-height:44px;padding:4px 2px}
 .dialog-close{width:44px;height:44px}
 .dialog-ok{min-height:44px}
}

.footer .operator-note{max-width:30em;margin:0 auto 14px;font-size:12px;line-height:1.7;color:#4b5271;text-wrap:balance}

/* Shared hierarchy for the benefits and the agency funding explanation. */
.live-card h2,.manager-card h2,.live2d-card h2,.support-card h2{
  font-size:clamp(1.75rem,3.5vw,2.5rem);line-height:1.55;letter-spacing:-.035em;
}
.live-card .feature-copy,.manager-copy>p,.live2d-copy .feature-copy,.support-copy .feature-copy{
  margin-top:16px;font-size:1.0625rem;line-height:1.95;
}
.support-card{background:linear-gradient(130deg,#fff 50%,#f8f5ff)}
.support-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:24px;align-items:center}
.support-copy strong{font-weight:800}
.support-visual{width:100%;max-width:420px;margin:0 auto}
.support-visual img{display:block;width:100%;height:auto}
.fees-caption{font-size:.875rem;text-align:center;font-weight:700;margin:32px 0 12px;color:#515978;letter-spacing:.03em}
.fee-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;gap:12px;margin:0}
.fee-grid>div{
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:7px;min-height:126px;padding:18px 8px;
  background:#fff;border:1px solid #d4d6f1;border-radius:12px;box-shadow:0 4px 0 #eae7f8;
}
.fee-grid dt{font-size:.875rem;font-weight:700;line-height:1.5;text-align:center}
.fee-grid dd{margin:0;color:#7334cf;font-family:Arial,var(--font);font-size:2.5rem;font-weight:800;line-height:1.25}
.fee-grid dd span{font-family:var(--font);font-size:1.125rem;margin-left:4px}
.fee-grid dd.fee-none{font-family:var(--font);font-size:1.75rem;font-weight:900;line-height:1.79}
.support-message{margin-top:28px;font-size:1rem;line-height:1.9;text-align:center}
.support-message strong{font-weight:800}
@media(max-width:700px){
  .live-card h2,.manager-card h2,.live2d-card h2,.support-card h2{font-size:clamp(1.4375rem,6.4vw,2.125rem);line-height:1.6}
  .live-card .feature-copy,.manager-copy>p,.live2d-copy .feature-copy,.support-copy .feature-copy{font-size:1rem;line-height:1.9;margin-top:14px}
  .support-layout{grid-template-columns:minmax(0,1fr);gap:18px}
  .support-visual{max-width:360px}
  .fees-caption{margin-top:26px}
  .fee-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .fee-grid>div{min-height:112px;padding:14px 5px;gap:5px}
  .fee-grid dd{font-size:2.25rem}
  .fee-grid dd.fee-none{font-size:1.625rem;line-height:1.73}
  .support-message{margin-top:24px;text-wrap:balance}
}




/* Supplied LiveSpark overlays; the original stream character and UI remain. */
.stream-piggy-bank{position:absolute;z-index:1;width:80%;height:auto;max-height:45%;left:18%;bottom:48px;object-fit:contain;pointer-events:none}
.visual-slime{position:absolute;z-index:2;top:142px;left:-4px;width:166px;height:auto;object-fit:contain;pointer-events:none}
@media(max-width:700px){
  .stream-piggy-bank{width:84%;left:15%;bottom:47px}
  .visual-slime{top:143px;left:-9px;width:112px;max-width:calc(100% + 9px)}
}
@media(min-width:480px) and (max-width:700px){.visual-slime{top:179px;width:146px}.stream-piggy-bank{bottom:57px}}
@media(max-width:370px){.visual-slime{top:130px;width:100px}.stream-piggy-bank{bottom:45px}}

/* SPARKL wordmark: real transparent vectors, with the sparkle built into A. */
.brand.hero-brand{min-height:52px}
.brand.hero-brand img.sparkl-wordmark{width:190px;height:auto;mix-blend-mode:normal}
.section-brand{gap:10px;min-height:55px}
.section-brand img.sparkl-wordmark{width:200px;height:auto;mix-blend-mode:normal}
.footer .brand{margin-bottom:18px}
.footer .brand img.sparkl-wordmark{width:270px;height:auto;filter:none;mix-blend-mode:normal}
.stream-avatar img{object-fit:contain;padding:3px}
@media(max-width:600px){
 .brand.hero-brand{min-height:42px}
 .brand.hero-brand img.sparkl-wordmark{width:157px;height:auto}
 .section-brand{gap:8px;min-height:44px}
 .section-brand img.sparkl-wordmark{width:160px;height:auto}
 .footer .brand img.sparkl-wordmark{width:220px;height:auto}
 .stream-avatar img{padding:2px}
}
