/* Loading decoration only. The existing loader owns this element's lifetime. */
.home-loading-stories { display: none; }
body.index-page.home-top-page > .loader .home-loading-stories {
    box-sizing: border-box;
    position: absolute;
    right: max(28px,env(safe-area-inset-right));
    bottom: max(28px,env(safe-area-inset-bottom));
    display: flex;
    align-items: flex-end;
    gap: 14px;
    width: min(440px,calc(100% - 56px));
    max-width: 100%;
    margin: 0;
    padding: 0;
    z-index: 2;
    pointer-events: none;
    font-family: 'Meiryo','メイリオ',sans-serif;
}
.home-loading-speech { box-sizing: border-box; position: relative; flex: 1 1 0; min-width: 0; display: grid; padding: 16px 20px; border: 1px solid rgba(190,213,199,.85); border-radius: 18px 18px 5px 18px; background: rgba(255,255,255,.9); box-shadow: 0 8px 28px -15px rgba(52,92,68,.25); }
.home-loading-speech::after { content: ''; position: absolute; right: -7px; bottom: 18px; width: 12px; height: 12px; background: #fff; border-top: 1px solid #c4daca; border-right: 1px solid #c4daca; transform: rotate(45deg); }
.home-loading-quote { grid-area: 1 / 1; align-self: center; color: #4c765e; font-size: 14px; font-weight: 700; line-height: 1.9; text-align: left; overflow-wrap: anywhere; opacity: 0; visibility: hidden; animation-duration: 15s; animation-delay: 1s; animation-timing-function: steps(1,end); animation-iteration-count: infinite; }
.home-loading-avatar-face { grid-area: 1 / 1; width: 100%; height: 100%; min-width: 0; opacity: 0; visibility: hidden; animation-duration: 15s; animation-delay: 1s; animation-timing-function: steps(1,end); animation-iteration-count: infinite; }
:is(.home-loading-quote,.home-loading-avatar-face).quote-1 { animation-name: home-loading-story-1; }
:is(.home-loading-quote,.home-loading-avatar-face).quote-2 { animation-name: home-loading-story-2; }
:is(.home-loading-quote,.home-loading-avatar-face).quote-3 { animation-name: home-loading-story-3; }
:is(.home-loading-quote,.home-loading-avatar-face).quote-4 { animation-name: home-loading-story-4; }
:is(.home-loading-quote,.home-loading-avatar-face).quote-5 { animation-name: home-loading-story-5; }
.home-loading-avatar { flex: 0 0 64px; width: 64px; height: 64px; display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr; overflow: hidden; align-items: center; justify-content: center; border-radius: 50%; border: 2px solid rgba(255,255,255,.85); box-shadow: 0 5px 16px -9px rgba(58,100,74,.3); background: #e4efe7; }
.home-loading-avatar svg { display: block; width: 100%; height: 100%; border-radius: 50%; }
@keyframes home-loading-story-1 { 0% { opacity: 1; visibility: visible; } 13.333333%,100% { opacity: 0; visibility: hidden; } }
@keyframes home-loading-story-2 { 0% { opacity: 0; visibility: hidden; } 13.333333% { opacity: 1; visibility: visible; } 33.333333%,100% { opacity: 0; visibility: hidden; } }
@keyframes home-loading-story-3 { 0% { opacity: 0; visibility: hidden; } 33.333333% { opacity: 1; visibility: visible; } 53.333333%,100% { opacity: 0; visibility: hidden; } }
@keyframes home-loading-story-4 { 0% { opacity: 0; visibility: hidden; } 53.333333% { opacity: 1; visibility: visible; } 73.333333%,100% { opacity: 0; visibility: hidden; } }
@keyframes home-loading-story-5 { 0% { opacity: 0; visibility: hidden; } 73.333333%,100% { opacity: 1; visibility: visible; } }
@media (max-width: 600px) {
    body.index-page.home-top-page > .loader .home-loading-stories { right: max(16px,env(safe-area-inset-right)); bottom: max(20px,env(safe-area-inset-bottom)); width: calc(100% - 32px); gap: 11px; }
    .home-loading-speech { padding: 13px 15px; border-radius: 15px 15px 4px 15px; }
    .home-loading-quote { font-size: 12px; line-height: 1.9; }
    .home-loading-avatar { width: 52px; height: 52px; flex-basis: 52px; }
}
@media (max-height: 500px) {
    body.index-page.home-top-page > .loader .home-loading-stories { bottom: max(10px,env(safe-area-inset-bottom)); }
    .home-loading-speech { padding: 10px 13px; }
    .home-loading-quote { font-size: 11px; }
    .home-loading-avatar { width: 44px; height: 44px; flex-basis: 44px; }
}