/* Flo shares the island guide's soft sphere, dark eyes and quiet halo. */
.hero-field.flo-stage{margin-right:0;display:flex;flex-direction:column;align-items:center;justify-content:center;height:560px;gap:12px}
.flo-greeting{position:relative;max-width:290px;min-height:78px;padding:17px 24px;border:1px solid #ffffff24;border-radius:22px 22px 22px 4px;background:#121418c9;box-shadow:0 12px 40px #0002}
.flo-greeting p{font-size:17px;line-height:1.55;white-space:pre-line;color:#e8e7e2;transition:opacity .25s}
.flo-greeting::after{content:"";position:absolute;bottom:-6px;left:44px;width:10px;height:10px;border-right:1px solid #ffffff24;border-bottom:1px solid #ffffff24;background:#121418;transform:rotate(45deg)}
.flo-character{display:block;position:relative;width:min(100%,380px);padding:0;background:transparent;border-radius:50%;cursor:pointer;line-height:0}
.flo-character svg{width:100%;height:auto;overflow:visible}
.flo-character:focus-visible{outline:1px solid var(--sand);outline-offset:6px}
.flo-body{animation:flo-float 4s ease-in-out infinite;transform-origin:180px 186px}
.flo-wave{transform-origin:248px 193px;animation:flo-wave 3.4s ease-in-out infinite}
.flo-eyes{transform-origin:180px 171px;animation:flo-blink 6s infinite}
.flo-mouth-open{opacity:0;transform-origin:180px 200px}
.is-speaking .flo-mouth-open{opacity:1;animation:flo-talk .38s ease-in-out infinite alternate}
.is-speaking .flo-mouth-smile{opacity:0}
.flo-shadow{animation:flo-shadow 4s ease-in-out infinite;transform-origin:180px 312px}
.flo-spark{animation:flo-spark 4.5s ease-in-out infinite alternate}.flo-spark:nth-of-type(2){animation-delay:-2s}
.flo-controls{display:flex;align-items:center;justify-content:center;gap:23px;flex-wrap:wrap;font-size:12px}
.flo-controls button{padding:9px 0;min-height:40px;color:#d6d5d0}
.flo-controls button:first-child{border-bottom:1px solid #96938a80}
.flo-listen{display:flex;align-items:center;gap:7px;color:var(--muted)!important}
.flo-listen svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.5;fill:none}
.flo-listen[aria-pressed=true]{color:var(--sand)!important}
.flo-resting .flo-body,.flo-resting .flo-wave,.flo-resting .flo-eyes,.flo-resting .flo-mouth-open,.flo-resting .flo-shadow,.flo-resting .flo-spark{animation-play-state:paused}
.flo-credit{font-size:10px;letter-spacing:.1em;color:#8b8d94;margin-top:4px}
.tesla-portrait{margin:0;justify-self:center;width:min(100%,410px)}
.tesla-photo{overflow:hidden;aspect-ratio:4/5;background:#1a1b1d}
.tesla-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 38%;filter:grayscale(1);opacity:.9}
.tesla-portrait figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:18px;margin-top:17px;font-size:11px;color:var(--muted);line-height:1.7}
.tesla-portrait figcaption span{color:#d6d5d0;font-size:13px}
.tesla-portrait figcaption a{text-decoration:underline;text-underline-offset:3px;font-size:10px;text-align:right}
.work-views{display:grid;gap:10px}.work-card .work-view{position:relative;display:block;width:100%;padding:0;text-align:left;overflow:hidden;aspect-ratio:16/9;background:var(--surface)}
.work-view:focus-visible{outline:2px solid var(--sand);outline-offset:3px}
.work-card .work-view img{width:100%;height:100%;display:block;object-fit:contain;transition:transform .65s cubic-bezier(.2,.65,.3,1)}
.work-card:hover img{transform:none}.work-card .work-view:hover img,.work-card .work-view:focus-visible img{transform:scale(1.04)}
.work-view-label{position:absolute;right:14px;bottom:14px;display:flex;align-items:center;gap:14px;padding:10px 13px;background:#0b0c10db;border:1px solid #ffffff28;backdrop-filter:blur(8px);color:#f0efe9;font-size:10px;letter-spacing:.075em;line-height:1.3;pointer-events:none}
.work-view-label span{font-size:15px}.work-caption{margin-top:18px}
.work-card .work-detail-image{object-fit:contain}
.work-caption .views-note{font-size:10px;color:var(--muted)}
@keyframes flo-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-12px) rotate(2deg)}}
@keyframes flo-wave{0%,48%,100%{transform:rotate(-6deg)}10%,30%{transform:rotate(19deg)}20%,40%{transform:rotate(-13deg)}}
@keyframes flo-blink{0%,44%,48%,100%{transform:scaleY(1)}46%{transform:scaleY(.12)}}
@keyframes flo-talk{from{transform:scaleY(.35)}to{transform:scaleY(1)}}
@keyframes flo-shadow{0%,100%{transform:scaleX(1);opacity:.28}50%{transform:scaleX(.82);opacity:.18}}
@keyframes flo-spark{from{opacity:.15;transform:translateY(0)}to{opacity:.6;transform:translateY(-9px)}}
@media(max-width:1050px){.hero-field.flo-stage{height:480px}.flo-character{width:320px}.flo-greeting p{font-size:15px}.energy{gap:7%}.tesla-portrait{width:min(100%,350px)}}
@media(max-width:800px){.hero-field.flo-stage{height:auto;min-height:430px;margin:45px 0 35px;gap:8px}.flo-character{width:300px}.flo-greeting{min-height:73px;padding:15px 22px}.energy{gap:40px}.tesla-portrait{width:min(100%,370px)}}
@media(max-width:520px){.hero-field.flo-stage{min-height:400px;margin-top:40px}.flo-character{width:280px}.flo-greeting{max-width:260px}.flo-greeting p{font-size:15px}.flo-controls{gap:22px}.tesla-portrait{width:min(100%,320px)}.work-view-label{right:10px;bottom:10px;padding:8px 10px;font-size:9px}.work-views{gap:8px}}
@media(prefers-reduced-motion:reduce){html:not(.motion-on) .work-card .work-view:hover img,html:not(.motion-on) .work-card .work-view:focus-visible img{transform:none}html:not(.motion-on) .flo-greeting p{transition:none}}
.motion-off .work-card .work-view:hover img,.motion-off .work-card .work-view:focus-visible img{transform:none}

/* The historical portrait now stands directly in the gravitational field. */
.tesla-portrait{width:min(115%,550px);max-width:none}.tesla-photo{overflow:visible;aspect-ratio:auto;background:none}.tesla-photo img{height:auto;object-fit:contain;opacity:1;filter:grayscale(1);mask-image:linear-gradient(#000 0 84%,transparent 100%)}.energy{gap:6%}.tesla-portrait figcaption{padding-inline:38px;margin-top:-12px;position:relative}
@media(max-width:800px){.tesla-portrait{width:min(100%,440px)}.tesla-portrait figcaption{padding-inline:24px}}
@media(max-width:520px){.tesla-portrait{width:110%;margin-inline:-5%}.tesla-portrait figcaption{padding-inline:28px}.energy{overflow:hidden}}
