/* Circular content balloons; the footer keeps its original oval balloon. */




.visual-bubble{display:grid;place-items:center;width:116px;height:116px;aspect-ratio:1;padding:0;text-align:center;top:8px;left:-70px}
.visual-bubble>span{max-width:80%;line-height:1.6}
.response-bubble,.is-scrollable .response-bubble{width:25%;height:auto;aspect-ratio:1;padding:0;gap:8px}
.response-bubble>strong{max-width:88%;white-space:normal;text-align:center;text-wrap:balance;line-height:1.35}
.response-voice{left:14%}.response-use{left:37.5%}.response-insight{left:61%}
.contact-art-note{display:grid;place-items:center;width:132px;height:132px;aspect-ratio:1;padding:20px;text-align:center;white-space:normal;text-wrap:balance;line-height:1.6;left:auto;right:2%;bottom:4%;transform:rotate(-4deg)}
.contact-play[data-contact-scene=interactive] .contact-art-note{bottom:2%}
.v-choice-note,.v-use-tag,.v-hello-sticker,.t-editor-sticker{box-sizing:border-box;display:grid;place-items:center;aspect-ratio:1;padding:0;text-align:center;line-height:1.6}
.v-choice-note{width:146px;height:146px;right:-12px;top:-38px}
.v-choice-note>span{max-width:80%}
.v-use-tag{width:126px;height:126px;padding:20px;right:-12px;bottom:10px;text-wrap:balance}
.v-hello-sticker{width:166px;height:166px;padding:20px}
.t-editor-sticker{width:152px;height:152px;top:-28px;right:-5px}

@media(max-width:700px){


 .visual-bubble{width:94px;height:94px;top:3px;left:-50px;padding:0}
 .response-bubble,.is-scrollable .response-bubble{width:29%;height:auto;gap:5px}.response-voice{left:5%}.response-use{left:35.5%}.response-insight{left:66%}
 .contact-art-note{width:104px;height:104px;padding:16px;font-size:12px}
 .v-choice-note{width:114px;height:114px;top:-27px;right:-4px;font-size:10px}
 .v-use-tag{width:104px;height:104px;padding:17px;right:0;font-size:11px}
 .v-hello-sticker{width:132px;height:132px;padding:16px}
 .t-editor-sticker{width:122px;height:122px;top:-18px;right:-3px;font-size:11px}
}
@media(max-width:359px){.v-choice-note{width:104px;height:104px;font-size:9px}}



.is-scrollable .response-use{top:calc(max(24%,calc(var(--outcome-height,60px) + 14px)) + 4%)}

.v-use-illustration{padding-bottom:154px}
@media(max-width:700px){.v-use-illustration{padding-bottom:132px}}

@media(max-width:700px){.is-scrollable .response-use{top:calc(max(24%,calc(var(--outcome-height,60px) + 14px)) + 2%)}}

/* Only DATA points straight up. Keep the closing copy tied to the circle row. */
.response-use .response-shape{transform:none}
.is-scrollable .approach-scene>.improvement-card{top:calc(var(--feedback-end,70%) - 12px)}