.mechanics-exhibit{padding:68px 6.5%;background:#dde5d7;color:#203e38;border-top:1px solid #b6c4ae;border-bottom:1px solid #b6c4ae}
.mechanics-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:7%;margin-bottom:32px}
.mechanics-heading h2{font:400 var(--type-section,40px)/1.6 var(--song);letter-spacing:.035em;margin:0}
.mechanics-heading>p{font-size:15px;line-height:2;color:#4b634d;max-width:48ch;margin:0 0 5px}
.mechanics-layout{display:grid;grid-template-columns:1.25fr 1fr;gap:7%;align-items:center}
[data-mechanics-stage]{height:510px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 44%,#f0f0df,#cedcc7);border-bottom:1px solid #9eb393}
[data-mechanics-stage] canvas{display:block;pointer-events:none;width:100%;height:100%}
[data-mechanics-poster]{position:absolute;inset:0;display:grid;place-items:center;padding:30px;pointer-events:none}
[data-mechanics-poster] svg{height:85%;width:80%;max-width:400px;stroke:#365745;stroke-width:2;fill:none}
.mechanics-copy [role=group]{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:30px;border-bottom:1px solid #aabea1;margin-bottom:26px}
.mechanics-copy button{background:transparent;border:1px solid #8da486;color:#254835;padding:12px 16px;font:400 13px/1.5 'PingFang SC','Microsoft YaHei',sans-serif;border-radius:0;min-height:44px}
.mechanics-copy button:hover{background:#eaf0df}
.mechanics-copy [data-mechanics-mode][aria-pressed=true]{background:#355244;color:#f3f0e6;border-color:#355244}
.mechanics-copy button[disabled]{opacity:.55;cursor:default}
.mechanics-copy h3{font:400 var(--type-subsection,28px)/1.6 var(--song);margin:0 0 18px;letter-spacing:.025em}
.mechanics-copy>p{font-size:15px;line-height:2;color:#48634a;max-width:50ch;margin:0 0 24px;min-height:6em}
.mechanics-controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}
.mechanics-copy .mechanics-note{font-size:12px;line-height:1.9;color:#50684e;margin:20px 0 0;min-height:0}
.mechanics-copy .text-link{font-size:13px;margin-top:22px}
.mechanics-copy .mechanics-terms{font-family:var(--song);font-size:14px;letter-spacing:.1em;margin:24px 0 0;padding-top:22px;border-top:1px solid #b6c4ae;min-height:0}
body[data-page=technology] .mechanics-exhibit{margin-top:30px}
[data-mechanics-state=loading] [data-mechanics-stage]{opacity:.75}
@media(max-width:800px){
 .mechanics-exhibit{padding:45px 6%}
 .mechanics-heading{grid-template-columns:1fr;gap:18px;margin-bottom:26px}
 .mechanics-heading h2{font-size:var(--type-section,29px);line-height:1.6}
 .mechanics-heading>p{font-size:14px;line-height:1.9}
 .mechanics-layout{grid-template-columns:1fr;gap:18px}
 .mechanics-copy{display:contents}
 [data-mechanics-stage]{height:370px;grid-row:2}
 .mechanics-copy [role=group]{grid-row:1;padding:0;margin:0;border:0}
 .mechanics-copy h3{grid-row:4;font-size:var(--type-subsection,22px);line-height:1.6;margin:10px 0 0}
 .mechanics-copy>p{font-size:14px;line-height:1.95;min-height:0}
 .mechanics-copy>p:not(.mechanics-note):not(.mechanics-terms){grid-row:5;margin:0}
 .mechanics-copy button{padding:12px 15px;font-size:13px}
 .mechanics-controls{grid-row:3;margin:0}
 .mechanics-copy .mechanics-note{grid-row:6;font-size:12px;margin:0}
 .mechanics-copy .mechanics-terms{grid-row:7;font-size:14px;margin:0}
 .mechanics-copy .text-link{grid-row:8;justify-self:start;margin:0}
}
@media(prefers-reduced-motion:reduce){[data-mechanics-stage]{background:#e1e6d8}}