#viewHome .creation-starters{min-height:0!important;margin-top:12px;padding-bottom:0}
/* Keep the expanded footprint while closed, so the feed never shifts. */
.starter-contents[hidden]{display:block!important;visibility:hidden;pointer-events:none;animation:none}
body.home-composer-pinned #viewHome .creation-starters{display:none}
.starter-toggle{display:inline-flex;align-items:center;gap:8px;border:0;background:transparent;color:#e1edf4;padding:3px 5px 3px 0;cursor:pointer;font:inherit;font-size:11px;border-radius:20px}
.starter-toggle>svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.3;transition:transform .2s}
.starter-toggle[aria-expanded=true]>svg{transform:rotate(180deg)}
.starter-toggle-label{opacity:.65;transition:opacity .2s}.starter-toggle:hover .starter-toggle-label{opacity:1}
.starter-creature{position:relative;display:inline-block;width:34px;height:32px;border:1px solid #ffffff78;border-radius:46% 54% 50% 45%;background:radial-gradient(ellipse at 25% 12%,#fff9,transparent 48%),linear-gradient(135deg,#ffdf7290,#54dce775 55%,#819bff95);box-shadow:inset 1px 1px 3px #ffffffb0,inset -2px -3px 5px #5e95de65,0 3px 12px #121d4230;backdrop-filter:blur(5px) saturate(160%);animation:starter-morph 5.6s ease-in-out infinite;transition:transform .2s}
.starter-creature-eyes{position:absolute;inset:11px 0 auto;display:flex;justify-content:center;gap:5px;animation:starter-blink 6.2s infinite}.starter-creature-eyes i{width:3px;height:8px;background:#18323ed9;border-radius:3px;box-shadow:0 1px 0 #fff5}
.starter-toggle:hover .starter-creature{transform:rotate(-7deg) scale(1.08)}
.starter-contents{padding-top:5px;animation:starter-reveal .22s ease-out}
#viewHome .starter-row button,#viewHome .starter-row a,#viewHome .starter-skill-badge{position:relative;background:radial-gradient(ellipse at 15% 0%,#ffffff35,transparent 55%),linear-gradient(130deg,#ffffff16,#bfe4ff06 48%,#ffffff24);border:1px solid #ffffff4b;box-shadow:inset 0 1px 1px #ffffff75,inset 0 -1px 2px #8acbff38,0 2px 7px #061f3520;backdrop-filter:blur(4px) saturate(165%);-webkit-backdrop-filter:blur(4px) saturate(165%);transition:background .18s,box-shadow .18s}
#viewHome .starter-row button:hover,#viewHome .starter-row a:hover{box-shadow:inset 0 1px 2px #ffffffa0,0 2px 10px #9feaff25;background-color:#ffffff16}
#viewHome .starter-row .starter-icon[data-colored]{color:var(--starter-tint);fill:color-mix(in srgb,var(--starter-tint) 25%,transparent);filter:drop-shadow(0 1px 2px color-mix(in srgb,var(--starter-tint) 35%,transparent));stroke-width:1.6}
#viewHome .starter-skill-badge .starter-icon{color:#a3dce9;fill:#a3dce922}
.starter-toggle:focus-visible,#viewHome .starter-row button:focus-visible{outline:2px solid #9adfff;outline-offset:3px}
@keyframes starter-morph{0%,100%{border-radius:46% 54% 50% 45%}40%{border-radius:55% 45% 42% 58%}70%{border-radius:43% 57% 56% 44%}}
@keyframes starter-blink{0%,42%,46%,100%{transform:scaleY(1)}44%{transform:scaleY(.12)}}
@keyframes starter-reveal{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.starter-creature,.starter-creature-eyes,.starter-contents{animation:none}.starter-toggle>svg{transition:none}}
body:not(.view-home) .starter-creature,body:not(.view-home) .starter-creature-eyes{animation-play-state:paused}
