/* One painted visual language; controls and text remain the primary navigation. */
.painted-story{width:100%;position:relative;isolation:isolate;pointer-events:none}
.story-frame[hidden]{display:none}
.story-illustration{display:block;width:100%;height:100%;overflow:visible}
.story-frame{width:100%;height:100%;aspect-ratio:4/3}
.story-nut,.story-pass{opacity:0}
.story-ink{stroke-dasharray:1;stroke-dashoffset:0}
.flow-art{display:flex;align-self:center;width:100%;max-width:520px;margin:auto}
.flow-art>span{margin-top:18px;font-size:1rem;color:var(--forest)}
.flow-panel{gap:clamp(32px,5vw,72px);align-items:center}
.flow-art .painted-story{max-width:470px}
.path-visual{width:100%;height:auto;max-width:520px;margin:auto}
.path-layout{align-items:center}
.people-path{background:#f5ecd9}
.map-stage .painted-story{position:absolute;z-index:1;left:8%;top:19%;width:43%;height:56%}
.map-stage .story-frame{height:100%;aspect-ratio:auto}
.map-stage .story-illustration{overflow:hidden}
.map-stage .sicily-shape .island{fill:#d9e1bc;stroke:#18593b;stroke-width:1.5;stroke-linejoin:round}
.map-stage .map-route{stroke:#18593b;opacity:.75}
.map-stage .city-point{fill:#f54627;stroke:#fff4e0;stroke-width:2}
.map-stage .city-point.active{fill:#18593b}
.map-stage .map-leader{stroke:#18593b;stroke-width:1.7}
.map-stage .map-pin{background:#fff4e0;border:1.5px solid #18593b;color:#18593b}
.map-stage .map-pin[aria-pressed=true]{background:#18593b;color:#fff4e0;box-shadow:0 0 0 4px #fff4e0}
.territory-explorer{background:#f1edda}
#almond-character{transform-origin:50% 85%}
#almond-arm-right{transform-box:view-box;transform-origin:252px 247px}
#almond-arm-left{transform-box:view-box;transform-origin:151px 250px}
.studio-canvas{background:transparent;box-shadow:none}
@media(max-width:760px){
 .flow-panel{grid-template-columns:1fr;gap:14px;padding-top:22px;min-height:0}
 .flow-art{display:flex;max-width:310px;height:210px;align-self:auto}
 .flow-art .painted-story{height:100%}
 .flow-art .story-frame{height:100%;aspect-ratio:auto}
 .flow-art>span{display:none}
 .flow-copy{padding-top:0}
 .path-visual{height:210px;max-width:310px;width:100%}
 .path-visual .painted-story,.path-visual .story-frame{height:100%;aspect-ratio:auto}
 .path-layout{gap:22px}
 .path-tabs{margin-bottom:22px}
 .map-stage .painted-story{left:7%;top:21%;width:41%;height:54%}
}
@media(max-width:360px){
 .flow-art,.path-visual{height:180px;max-width:280px}
}
@media(prefers-reduced-motion:reduce){
 .story-frame{animation:none;transition:none}
}
