/* Approved Option A: colorful title on the sky-blue interface. */
.app .top .brand { display: flex; align-items: center; gap: 9px; flex-shrink: 0; }
.app .top .story-wordmark { display: inline-block; flex-shrink: 0; line-height: 0; }
.app .top .story-wordmark svg { display: block; overflow: visible; }
.app .top .story-word { transform-box: fill-box; transform-origin: center 75%; }
.app .top .story-word text { font-family: 'Arial Black','Trebuchet MS','Segoe UI',sans-serif; font-size: 31px; font-weight: 950; stroke: #542b12; stroke-width: 2.5px; stroke-linejoin: round; paint-order: stroke fill; filter: drop-shadow(0 1.4px 0 #542b12); }
.app:not(.wire) .top .brand::before { background: radial-gradient(circle,#ffd65c77,#f2a33b33 45%,transparent 74%); }
.app:not(.wire) .top .brand::after { background: linear-gradient(90deg,transparent,#efb531,#df5423,#4e893d,transparent); }
.app:not(.wire) .top .brand .i-book { filter: brightness(0) saturate(100%) invert(29%) sepia(37%) saturate(870%) hue-rotate(81deg) brightness(93%) contrast(91%); }
@media(prefers-reduced-motion:no-preference) {
 .app:not(.wire) .story-word { animation: story-title-bob 7.6s ease-in-out infinite; }
 .app:not(.wire) .story-quiz { animation-delay: .2s; }
 .app:not(.wire) .story-plus { animation-delay: .4s; }
}
@keyframes story-title-bob { 0%,55%,100% { transform: translateY(0) rotate(0); } 19% { transform: translateY(-1.5px) rotate(-.6deg); } 33% { transform: translateY(.4px) rotate(.3deg); } }
.app.wire .story-word { animation: none; }
.app.wire .story-word text { fill: #222; stroke: none; filter: none; }


@media(max-width:1100px) { .app .top .story-wordmark svg { width:225px; height:41px; } }
@media(max-width:760px) { .app .top { column-gap:8px; } .app .top .story-wordmark svg { width:193px; height:35px; } .app .top .brand { gap:6px; } .app .top .brand .ui-icon { width:25px; height:25px; } }
@media(max-width:380px) { .app .top .story-wordmark svg { width:170px; height:31px; } }
@media(max-width:340px) { .app .top .story-wordmark svg { width:140px; height:27px; } }
@media(prefers-reduced-motion:reduce) { .app:not(.wire) .story-word { animation:none; transform:none; } }
