:root{--motion-grid:rgba(17,78,67,.055);--motion-panel:#fffdf8;--motion-green:#155c4f;--motion-red:#a94335;--motion-gold:#a77b4d}
.motion-home{background:#eef0e9;position:relative;overflow:hidden}
.motion-home:before,.motion-hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--motion-grid) 1px,transparent 1px),linear-gradient(90deg,var(--motion-grid) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(to bottom,#000,transparent);pointer-events:none}
.motion-home .container,.motion-hero .container{position:relative}
.motion-home-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:42px}
.motion-home-card{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(250px,.8fr);min-height:430px;background:var(--motion-panel);overflow:hidden;border-top:3px solid var(--motion-green);box-shadow:0 18px 46px rgba(13,56,47,.08)}
.motion-home-card figure{margin:0;min-height:100%;overflow:hidden;background:#dfe5df}.motion-home-card img{width:100%;height:100%;object-fit:cover}
.motion-home-card.is-portrait img{object-position:center 24%}
.motion-home-copy{padding:clamp(28px,3.2vw,48px);display:flex;flex-direction:column;justify-content:center}
.motion-tag{display:inline-flex;width:max-content;align-items:center;gap:8px;color:var(--motion-green);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.motion-tag:before{content:"";width:22px;height:1px;background:var(--motion-gold)}
.motion-home-copy h3{font:700 clamp(30px,3vw,43px)/1.25 var(--display);margin:16px 0 14px}.motion-home-copy p{color:var(--ink-soft);margin-bottom:24px}
.motion-facts-inline{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}.motion-facts-inline span{padding:5px 10px;border:1px solid rgba(21,92,79,.2);color:var(--motion-green);font-size:12px;background:#f7f7f1}
.motion-arrow{color:var(--motion-green);font-weight:700;border-bottom:1px solid var(--motion-gold);width:max-content}
.motion-hero{position:relative;padding:clamp(68px,8vw,116px) 0;background:#edf0e9;border-bottom:1px solid var(--line);overflow:hidden}
.motion-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.68fr);gap:8vw;align-items:end}
.motion-hero h1{font:700 clamp(46px,6vw,78px)/1.12 var(--display);letter-spacing:.035em;margin:12px 0 22px}.motion-hero .lead{font-size:clamp(17px,1.6vw,21px);color:var(--ink-soft);max-width:720px}
.motion-hero-note{border-left:2px solid var(--motion-gold);padding:6px 0 6px 24px;color:var(--ink-soft)}
.motion-index-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.motion-index-card{background:#fff;padding:0 0 34px;border-top:3px solid var(--motion-green);box-shadow:0 20px 54px rgba(13,56,47,.07);overflow:hidden}.motion-index-card img{width:100%;height:420px;object-fit:cover;background:#dfe5df}.motion-index-card.is-portrait img{object-position:center 25%}.motion-index-card>div{padding:34px 38px 0}.motion-index-card h2{font:700 36px/1.3 var(--display);margin:12px 0}.motion-index-card p{color:var(--ink-soft)}
.motion-process{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.motion-process article{padding:34px 24px;position:relative;border-right:1px solid var(--line)}.motion-process article:last-child{border-right:0}.motion-process span{color:var(--motion-red);font-size:12px;letter-spacing:.16em}.motion-process h3{font:700 22px var(--display);margin:10px 0 4px}.motion-process article:not(:last-child):after{content:"→";position:absolute;right:-10px;top:50%;z-index:1;color:var(--motion-gold);background:var(--paper);padding:2px}
.motion-boundary{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;align-items:start}.motion-boundary h2{font:700 clamp(34px,4vw,50px)/1.25 var(--display)}.motion-boundary-list{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line)}.motion-boundary-list div{padding:24px 18px;border-bottom:1px solid var(--line)}.motion-boundary-list b{display:block;color:var(--motion-green);font-size:18px}.motion-boundary-list span{color:var(--ink-soft);font-size:14px}
.motion-workbench{padding:clamp(44px,5vw,74px) 0;background:#e9ede7}.motion-workbench-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:28px}.motion-workbench-head h1{font:700 clamp(39px,4.5vw,64px)/1.12 var(--display);margin:7px 0}.motion-workbench-head p{color:var(--ink-soft);margin:0}.motion-status{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.motion-status span{font-size:12px;padding:6px 11px;background:rgba(255,255,255,.72);border:1px solid rgba(21,92,79,.18);color:var(--motion-green)}
.motion-mode-tabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:12px}.motion-mode-tabs button{border:1px solid rgba(21,92,79,.22);background:transparent;color:var(--motion-green);padding:10px 16px;cursor:pointer;font-weight:700}.motion-mode-tabs button[aria-pressed="true"]{background:var(--motion-green);color:#fff}
.motion-viewer{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(310px,.82fr);gap:18px}.motion-stage{background:#102f29;position:relative;min-height:570px;display:grid;place-items:center;overflow:hidden}.motion-stage video,.motion-stage canvas{width:100%;height:100%;max-height:650px;object-fit:contain}.motion-stage canvas{position:absolute;inset:0}.motion-stage .motion-canvas[hidden],.motion-stage video[hidden]{display:none}.motion-stage-label{position:absolute;z-index:2;left:18px;top:18px;padding:6px 10px;background:rgba(246,241,231,.92);color:var(--motion-green);font-size:12px;letter-spacing:.08em}
.motion-side{background:var(--motion-panel);padding:clamp(25px,3vw,42px);display:flex;flex-direction:column}.motion-side h2{font:700 clamp(28px,3vw,40px)/1.3 var(--display)}.motion-side>p{color:var(--ink-soft)}.motion-meta{display:grid;grid-template-columns:repeat(2,1fr);margin-top:auto;border-top:1px solid var(--line)}.motion-meta div{padding:16px 8px;border-bottom:1px solid var(--line)}.motion-meta span{display:block;color:var(--ink-soft);font-size:12px}.motion-meta b{font-size:15px;color:var(--motion-green)}
.motion-timeline{grid-column:1/-1;background:var(--motion-panel);padding:18px 22px;display:grid;grid-template-columns:auto minmax(120px,1fr) auto;gap:16px;align-items:center}.motion-play{border:0;background:var(--motion-green);color:#fff;min-width:76px;padding:9px 14px;cursor:pointer}.motion-time{font-variant-numeric:tabular-nums;color:var(--ink-soft);font-size:13px}.motion-scrubber{accent-color:var(--motion-red);width:100%}
.motion-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.motion-chart-card{background:#fff;padding:26px;border-top:2px solid var(--motion-gold);min-width:0}.motion-chart-card h3{font:700 23px var(--display);margin-bottom:3px}.motion-chart-card p{font-size:13px;color:var(--ink-soft)}.motion-chart-card canvas{width:100%;height:260px;display:block}.motion-chart-readout{min-height:22px;font-size:12px;color:var(--motion-green);font-variant-numeric:tabular-nums}
.motion-data-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line)}.motion-data-grid div{padding:24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.motion-data-grid div:nth-child(4n){border-right:0}.motion-data-grid span{display:block;color:var(--ink-soft);font-size:12px}.motion-data-grid b{font:700 19px var(--display);color:var(--motion-green)}
.motion-caution{padding:24px 28px;border-left:3px solid var(--motion-red);background:#efe7da;color:var(--ink-soft)}.motion-caution strong{color:var(--ink)}
.motion-project-entry{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;padding:32px 36px;background:#edf0e9;border-left:3px solid var(--motion-green);margin:34px 0}.motion-project-entry h3{font:700 26px var(--display);margin:0 0 6px}.motion-project-entry p{margin:0;color:var(--ink-soft)}
@media(max-width:1100px){.motion-home-card{grid-template-columns:1fr}.motion-home-card figure{height:330px}.motion-viewer{grid-template-columns:1fr}.motion-stage{min-height:500px}.motion-side{min-height:360px}.motion-home-grid,.motion-index-grid{grid-template-columns:1fr}.motion-process{grid-template-columns:repeat(3,1fr)}.motion-process article:nth-child(3){border-right:0}.motion-charts{grid-template-columns:1fr}.motion-data-grid{grid-template-columns:repeat(2,1fr)}.motion-data-grid div:nth-child(2n){border-right:0}}
@media(max-width:700px){.motion-home-card figure{height:270px}.motion-home-copy{padding:28px 24px}.motion-hero-grid,.motion-boundary{grid-template-columns:1fr}.motion-hero-note{margin-top:10px}.motion-index-card img{height:300px}.motion-process{grid-template-columns:1fr}.motion-process article{border-right:0;border-bottom:1px solid var(--line)}.motion-process article:after{display:none}.motion-workbench-head{display:block}.motion-status{justify-content:flex-start;margin-top:18px}.motion-stage{min-height:390px}.motion-stage video,.motion-stage canvas{max-height:560px}.motion-side{min-height:0}.motion-meta{margin-top:24px}.motion-timeline{grid-template-columns:auto 1fr}.motion-time{grid-column:1/-1;text-align:right}.motion-chart-card{padding:20px 14px}.motion-chart-card canvas{height:230px}.motion-data-grid{grid-template-columns:1fr}.motion-data-grid div,.motion-data-grid div:nth-child(2n){border-right:0}.motion-project-entry{grid-template-columns:1fr;padding:27px 24px}.motion-project-entry .button{width:100%}}

/* Observation workbench: the media frame follows the source, never crops. */
.motion-workbench{padding:32px 0 48px}.motion-workbench-head h1{font-size:clamp(32px,3.5vw,48px)}
.motion-viewer{grid-template-columns:minmax(0,1.65fr) minmax(290px,1fr);align-items:start}
.motion-stage{aspect-ratio:var(--source-ratio,16/9);min-height:0;width:100%;display:block}
.motion-stage video,.motion-stage canvas{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:contain}
.motion-stage-label{left:8px;top:8px;font-size:12px;padding:3px 7px;pointer-events:none}
.is-portrait .motion-viewer{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.is-portrait .motion-stage{max-width:310px;justify-self:center}
.motion-side{padding:24px;gap:12px;min-width:0;min-height:0}.motion-side h2{font:700 clamp(24px,2.3vw,32px)/1.4 var(--display);margin:0}.motion-side p{margin:0}
.motion-side select,.motion-side textarea{width:100%;border:1px solid var(--line);background:#fff;padding:10px;font:inherit;color:var(--ink);box-sizing:border-box}
.motion-side label{font-size:14px;font-weight:700}.motion-guide{padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:14px}.motion-guide p{margin-top:8px}
.motion-tools{grid-column:1/-1;background:#fffdf8;padding:18px 22px;display:grid;gap:12px}
.motion-tools>div,.observation-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.motion-tools label{display:flex;gap:8px;align-items:center}
.motion-tools button,.motion-tools select,.observation-actions button{font:inherit;font-size:14px;padding:9px 12px;border:1px solid #a5b9b0;background:#fff;color:#155c4f;cursor:pointer}
.motion-tools button[aria-pressed=true],.observation-actions button:first-child{background:#155c4f;color:#fff}.motion-small,.side-legend{font-size:13px;color:#53665e;line-height:1.7}.motion-tools p{margin:0}
.motion-note-list{display:grid;gap:6px}.motion-note-list button{padding:10px;text-align:left;border:0;border-left:2px solid #a77b4d;background:#edf1ec;color:#155c4f;cursor:pointer;overflow-wrap:anywhere}
.motion-timeline{margin-top:0}.motion-chart-card canvas{touch-action:pan-y;cursor:crosshair}.motion-index-card img{height:auto;max-height:440px;object-fit:contain}
.motion-value{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}.motion-value article{border-top:2px solid #a77b4d;padding-top:20px}.motion-value h3{font-size:22px}.motion-value p{color:var(--ink-soft)}
.motion-workbench button:focus-visible,.motion-workbench select:focus-visible{outline:3px solid #a77b4d;outline-offset:3px}
@media(max-width:1000px){.motion-viewer{grid-template-columns:minmax(0,1.3fr) minmax(260px,1fr)}.motion-side{padding:18px}.motion-status{max-width:220px}}
@media(max-width:760px){.motion-viewer,.is-portrait .motion-viewer{grid-template-columns:minmax(0,1fr)}.is-portrait .motion-stage{max-width:240px}.motion-stage{min-height:0}.motion-side{grid-row:auto}.motion-timeline{grid-row:2}.motion-tools{grid-row:3}.motion-side{grid-row:4}.motion-value{grid-template-columns:1fr}.motion-status{max-width:none}.motion-time{font-size:12px}.motion-timeline{padding:14px;gap:10px}.motion-tools{padding:16px}.motion-mode-tabs button{padding:9px 12px}.motion-workbench{padding-top:24px}}

@media(min-width:761px){.motion-workbench:not(.is-portrait) .motion-stage{grid-column:1;grid-row:1}.motion-workbench:not(.is-portrait) .motion-side{grid-column:2;grid-row:1/4}.motion-workbench:not(.is-portrait) .motion-timeline{grid-column:1;grid-row:2;grid-template-columns:auto minmax(0,1fr)}.motion-workbench:not(.is-portrait) .motion-time{grid-column:1/-1;text-align:right}.motion-workbench:not(.is-portrait) .motion-tools{grid-column:1;grid-row:3}}
.motion-workbench-head{align-items:center}.motion-status span{font-size:13px}
