.animated-hero-host{aspect-ratio:auto!important;overflow:visible!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;min-width:0}.animated-hero{width:100%;color:#142138;font-family:Arial,Helvetica,sans-serif}.hero-mosaic{aspect-ratio:1;position:relative;overflow:hidden;background:#15233b;border:2px solid #15233b;border-radius:9px;box-shadow:0 18px 40px #15233b18;isolation:isolate}.hero-mosaic-tile{position:absolute;display:block;overflow:hidden;border:2px solid #15233b;border-radius:0;background:#146af3;padding:0;cursor:pointer;transition:left .85s cubic-bezier(.2,.75,.2,1),top .85s cubic-bezier(.2,.75,.2,1),filter .2s;box-sizing:border-box;min-width:0;min-height:0}.hero-mosaic-tile:hover,.hero-mosaic-tile:focus-visible{z-index:3;outline:3px solid white;outline-offset:-4px;filter:brightness(1.07)}.hero-mosaic-tile:focus-visible{outline:4px solid #fff;outline-offset:-5px}.hero-art-layer{position:absolute;inset:0;display:block;overflow:hidden}.hero-art-layer>svg,.hero-art-layer>img{display:block;width:100%;height:100%;object-fit:cover}.hero-art-layer>svg{background:inherit}.hero-tile-label{position:absolute;bottom:5px;left:5px;right:5px;padding:5px 7px;border-radius:4px;background:#142138e8;color:white;font-size:12px;font-weight:600;line-height:1.3;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.hero-mosaic-tile:hover .hero-tile-label,.hero-mosaic-tile:focus .hero-tile-label{opacity:1;transform:none}.hero-motion-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}.hero-motion-label{flex:1 1 180px;font-size:11px;color:#596779;line-height:1.5;letter-spacing:.02em}.hero-motion-controls button{border:1px solid #c5ceda;border-radius:7px;background:#fffdf7;color:#233149;font:600 11px Arial,Helvetica,sans-serif;padding:9px 11px;min-height:36px;cursor:pointer;white-space:nowrap}.hero-motion-controls button:hover{background:#eaf2ff}.hero-motion-controls button:focus-visible{outline:3px solid #146af3;outline-offset:3px}.hero-motion-controls button:disabled{cursor:default;color:#596779}.hero-motion-detail{font-size:11px!important;line-height:1.5!important;color:#596779!important;margin:8px 0 0!important;min-height:17px}.hero-art-leaving{opacity:0;transition:opacity .8s}.hero-enter-fade{animation:hero-fade .8s ease both}.hero-enter-slide{animation:hero-slide .8s cubic-bezier(.2,.7,.25,1) both}.hero-enter-pixels{animation:hero-pixels .8s steps(8,end) both}.hero-steam{animation:hero-steam 3.5s ease-in-out infinite}.hero-spark{animation:hero-spark 4s ease-in-out infinite}.hero-heart{animation:hero-beat 3.2s ease-in-out infinite;transform-origin:8px 8px}.hero-leaf,.hero-flower{animation:hero-sway 5s ease-in-out infinite;transform-origin:8px 14px}.hero-boat{animation:hero-bob 4s ease-in-out infinite;transform-origin:8px 10px}.hero-notes,.hero-cloud{animation:hero-drift 5s ease-in-out infinite}.hero-sun{animation:hero-sway 8s ease-in-out infinite;transform-origin:8px 8px}.hero-globe{animation:hero-beat 7s ease-in-out infinite;transform-origin:8px 8px}.hero-art-layer svg *{animation-delay:var(--hero-delay,0s)}.hero-art-layer svg .delay{animation-delay:1.5s}.hero-motion-stopped *{animation-play-state:paused!important}.hero-motion-stopped .hero-mosaic-tile{transition:none}.hero-published{background-color:#f1f5fb;background-image:linear-gradient(#14213808 1px,transparent 1px),linear-gradient(90deg,#14213808 1px,transparent 1px);background-size:20px 20px}.hero-published .hero-mosaic-tile{border-width:1px}.hero-ranking-demo .hero-mosaic-tile:has(.hero-sun),.hero-ranking-demo .hero-mosaic-tile:has(.hero-leaf){z-index:2}
@keyframes hero-fade{from{opacity:0}to{opacity:1}}@keyframes hero-slide{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes hero-pixels{0%{clip-path:polygon(0 0,0 0,0 100%,0 100%)}100%{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}@keyframes hero-steam{0%,100%{transform:translateY(0);opacity:.4}50%{transform:translateY(-1px);opacity:1}}@keyframes hero-spark{0%,100%{opacity:.45}50%{opacity:1}}@keyframes hero-beat{0%,70%,100%{transform:scale(1)}80%{transform:scale(1.06)}}@keyframes hero-sway{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}@keyframes hero-bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(.5px) rotate(2deg)}}@keyframes hero-drift{0%,100%{transform:translateX(0)}50%{transform:translateX(.7px)}}
@media(max-width:700px){.hero-motion-controls button{min-height:44px;font-size:12px}.hero-motion-label{flex-basis:100%;font-size:12px}.hero-motion-detail{font-size:12px!important}.hero-mosaic-tile{border-width:1.5px}.hero-tile-label{font-size:11px}.hero-mosaic{border-radius:7px}}
@media(prefers-reduced-motion:reduce){.animated-hero:not(.hero-motion-opted-in) *{animation:none!important;transition:none!important}.animated-hero:not(.hero-motion-opted-in) .hero-art-leaving{display:none}}
.hero-admin-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:28px;align-items:start}.hero-admin-layout>aside{position:sticky;top:24px}.hero-slot-editor{background:white;border:1px solid #dbe2ec;border-radius:10px;padding:16px;margin-bottom:12px}.hero-slot-editor summary{font-weight:700;cursor:pointer;padding:8px 0}.hero-slot-editor label{margin-top:12px}.hero-slot-editor ol{list-style:none;padding:0}.hero-slot-editor li{display:flex;gap:8px;align-items:center;justify-content:space-between;border-bottom:1px solid #e2e6ec;padding:8px 0;font-size:13px}.hero-slot-editor li>div{display:flex;gap:4px}.hero-slot-editor li button{min-width:36px;min-height:36px;border:1px solid #c5ceda;border-radius:6px;background:white;color:#142138}.hero-add-frame{display:flex;gap:10px;align-items:end}.hero-add-frame label{flex:1}.hero-admin-layout input[type=file]{max-width:100%;font-size:12px}
@media(max-width:900px){.hero-admin-layout{grid-template-columns:1fr}.hero-admin-layout>aside{position:static;grid-row:1}}
