/* Type roles shared by both concepts; concept-specific display scale. */
body{--type-body:clamp(16px,1.3vw,20px);--type-small:clamp(16px,1.1vw,18px);--type-section:clamp(32px,4.5vw,68px);--type-card:clamp(26px,3.1vw,44px);--type-label:clamp(22px,2.5vw,34px)}
body[data-concept=play]{--type-display:clamp(36px,6.8vw,104px)}
body[data-concept=flow]{--type-display:clamp(30px,7.3vw,145px);--type-section:clamp(34px,5.4vw,82px)}
body[data-concept] .hero h1{font-size:var(--type-display);font-weight:800;line-height:1.18!important;letter-spacing:-.02em!important}
body[data-concept] :is(.map-section h2,.directory-heading h2,.gallery-heading h2){font-size:var(--type-section);font-weight:800;line-height:1.22!important}
body[data-concept] :is(.story-bubble h2,.intro-copy h2,.project h2){font-size:var(--type-card);font-weight:800;line-height:1.3!important}
body[data-concept] :is(.intro-body,.story-bubble .intro-body,.project-bubble p,.project p,.value p){font-size:var(--type-body);font-weight:500;line-height:1.7!important}
body[data-concept] :is(.period,.results-meta,.map-selection,.place-hint,.place-info p,.location-row p){font-size:var(--type-small);line-height:1.6!important}
body[data-concept] .value h3,body[data-concept] .value:first-child h3{font-size:var(--type-card);font-weight:800;line-height:1.25!important}
body[data-concept] .metric>p{font-size:var(--type-label);font-weight:700;line-height:1.4!important;word-break:keep-all;max-width:none}
body[data-concept=play] .metric.primary>p{display:inline-block;padding-bottom:12px;border-bottom:2px solid currentColor;margin-bottom:18px}
body[data-concept=play] .metric:not(.primary)>p{font-size:clamp(18px,1.75vw,24px);max-width:430px;margin-inline:auto;margin-bottom:14px}
body[data-concept=flow] .metric>p{font-size:clamp(18px,1.65vw,24px)}
body[data-concept=play] .hero>.manuscript-subtitle{font-size:clamp(20px,2.2vw,32px);font-weight:650;line-height:1.5!important}
body[data-concept=play] .manuscript-subtitle .subtitle-en{display:block;font-size:.8em;line-height:1.5;margin-top:8px;font-weight:500}
body[data-concept=play] .directory-heading{display:block;text-align:left;min-height:125px;padding-right:170px}
body[data-concept=play] .directory-heading>p{margin-top:14px;font-size:var(--type-body)}
body[data-concept=play] .directory-person{height:150px;bottom:0}
/* Keep the figure's connected outline intact: no cut legs or cup fragments. */
.rig-whole{transform-origin:360px 770px;animation:figure-settle 5.8s ease-in-out infinite}
.person-sit .rig-whole{transform-origin:350px 710px;animation:figure-sip 7s ease-in-out infinite}
.person-senior .rig-whole{animation-duration:7.4s}
.character-rig:not(.playing) .rig-whole{animation-play-state:paused}
@keyframes figure-settle{0%,100%{transform:rotate(-.45deg) translateY(0)}50%{transform:rotate(.45deg) translateY(-2px)}}
@keyframes figure-sip{0%,15%,85%,100%{transform:rotate(0)}35%,60%{transform:rotate(-1.8deg)}}
body.reduced .rig-whole{animation:none}
@media(prefers-reduced-motion:reduce){.rig-whole{animation:none}}
@media(min-width:761px){
body[data-concept=play] .project-scene{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,30%);gap:12px;align-items:center;padding:45px 6vw 50px;min-height:0;margin-block:40px}
body[data-concept=play] .project-bubble{width:100%;margin:0;padding:clamp(32px,3.6vw,60px);align-self:center}
body[data-concept=play] .project-person{position:relative;right:auto;bottom:auto;width:100%;height:clamp(370px,38vw,540px);align-self:center;z-index:2}
body[data-concept=play] .project-bubble:after{left:auto;right:-30px;top:66%;bottom:auto;transform:rotate(-60deg);width:48px;height:48px}
body[data-concept=play] .project-flower{height:130px;bottom:0;left:-3%;width:15%;opacity:.7}
}
@media(max-width:760px){
body[data-concept=play] .project-scene{display:flex;flex-direction:column;align-items:flex-end;padding:30px 5% 15px;min-height:0;gap:0;margin-block:20px}
body[data-concept=play] .project-bubble{width:100%;padding:28px;z-index:3}
body[data-concept=play] .project-person{position:relative;width:48%;height:240px;right:0;bottom:auto;margin-top:-14px;margin-right:4%;z-index:2}
body[data-concept=play] .project-flower{height:100px;bottom:35px;width:22%;left:4%}
body[data-concept=play] .directory-heading{padding-right:90px;min-height:105px}
body[data-concept=play] .directory-person{height:115px;width:85px}
body[data-concept=play] .metric.primary>p{padding-bottom:9px;margin-bottom:14px}
body[data-concept=play] .metrics{gap:30px 16px}
body[data-concept] .contact-grid a{font-weight:800}
}
@media(max-width:480px){
body{--type-section:32px;--type-card:27px;--type-label:22px}
body[data-concept=play] .metrics{grid-template-columns:1fr;gap:28px}
body[data-concept=play] .metric.primary strong{font-size:clamp(64px,20vw,96px)}
body[data-concept=play] .metric:not(.primary) strong{font-size:clamp(44px,13vw,62px)}
body[data-concept=play] .metric:not(.primary)>p{font-size:18px;margin-bottom:8px}
body[data-concept=flow] .metric>p{font-size:17px}
body[data-concept=flow] .metrics{grid-template-columns:1fr}
body[data-concept=flow] .metric.primary{grid-column:auto}
body[data-concept=flow] .metric:not(.primary) strong{font-size:clamp(48px,17cqw,68px)}
}