/* Case-only editorial diagrams; no simulated game animation. */
.motion-study {scroll-margin-top:100px;color:#eeeaf5;margin-top:80px;padding-top:64px;border-top:1px solid #ffffff26}
.motion-artifacts,.motion-decisions {scroll-margin-top:110px}
.motion-heading {max-width:900px}
.motion-study .motion-heading h3 {margin:0 0 20px;font-size:clamp(28px,3.1vw,40px);line-height:1.4;letter-spacing:-.025em;color:#fff}
.motion-study .motion-heading > p {color:#cbc6d8}
.motion-study .motion-heading .motion-eyebrow {color:#67e1db;margin:0 0 12px}
.motion-study h4,.motion-study h5 {color:#f5f1fc}
#collaboration .final-gallery {margin-top:40px}
.motion-study p {font-size:16px;line-height:1.85}
.motion-study h4 {font-size:clamp(25px,2.6vw,34px);line-height:1.45;letter-spacing:-.025em;margin:8px 0 16px}
.motion-study h5 {font-size:19px;line-height:1.6;margin:10px 0}
.motion-study .motion-caption {font-size:12px;line-height:1.8;color:#b3a9c1}
.motion-priorities {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:40px}
.motion-priorities article {padding:18px 0;border-top:2px solid #a987cf66}
.motion-priorities article:first-child {border-color:#b994e0}
.motion-priorities article > span,.motion-eyebrow {font-size:12px!important;color:#bda4d6;letter-spacing:.07em;font-weight:700}
.motion-priorities strong {display:block;font-size:48px;line-height:1.2;font-weight:600;margin:12px 0;color:#c5a3e6}
.motion-priorities small {font-size:14px;font-weight:400}
.motion-priorities p {font-size:14px;margin:0;color:#cbc6d8}
.motion-experience-tiers article {display:flex;flex-direction:column;min-width:0}
.motion-study .motion-experience-tiers h4 {font-size:24px;margin:12px 0 14px}
.motion-tier-example {margin:22px 0 14px;padding:16px;background:#ffffff05;border:1px solid #ffffff18;border-radius:12px}
.motion-study .motion-tier-example h5 {font-size:15px;margin:0 0 8px}
.motion-experience-tiers .motion-tier-loss {font-size:13px;color:#bdb5c9;margin-bottom:20px}
.motion-experience-tiers .motion-tier-count {margin-top:auto;padding-top:14px;border-top:1px solid #ffffff18;font-size:12px;color:#c6b5dd;letter-spacing:.04em}
@media(max-width:700px) {
  .motion-priorities.motion-experience-tiers {grid-template-columns:1fr;gap:20px}
  .motion-priorities.motion-experience-tiers article > span {min-height:0;font-size:12px!important}
  .motion-priorities.motion-experience-tiers p {font-size:14px}
}
.motion-scenario {margin:52px 0;padding:34px;border:1px solid #ffffff26;border-radius:22px;background:#ffffff03;scroll-margin-top:100px}
.motion-scenario-heading {max-width:780px}
.motion-scenario-heading > p:last-child {color:#cbc6d8;font-size:15px}
.motion-track-key {display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin:28px 0 20px;font-size:12px;color:#b3a9c1}
.motion-track-key span {display:flex;align-items:center;gap:8px}
.motion-track-key span::before {content:"";height:8px;width:8px;border-radius:50%;background:#67e1db}
.motion-track-key span:nth-child(2)::before {background:#b994e0}
.motion-track-key small {margin-left:auto;font-size:11px}
.motion-sequence-board {list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:0;margin:0}
.motion-sequence-board li {min-width:0;position:relative}
.motion-step-number {display:block;font-size:12px;font-weight:700;color:#c6b5dd;margin-bottom:16px}
.motion-sequence-board li:not(:last-child) .motion-step-number::after {content:"→";float:right;color:#b3a9c1}
.motion-data,.motion-visible {padding:16px 14px;border-radius:10px;min-height:135px;display:flex;flex-direction:column;gap:8px}
.motion-data {background:#153932;border-top:2px solid #67caba;color:#b0e8d9}
.motion-visible {background:#30233f;border-top:2px solid #b994e0;margin-top:14px;color:#e0c8f5}
.motion-data small,.motion-visible small {font-size:11px;font-weight:600}
.motion-data strong,.motion-visible strong {font-size:16px;line-height:1.5}
.motion-data > span,.motion-visible > span {font-size:12px;line-height:1.7}
.motion-conflict-step .motion-visible {background:#403124;border-color:#d7ae72;color:#f2d8ad}
.motion-resolution {display:flex;gap:24px;align-items:baseline;border-top:1px solid #ffffff26;margin-top:26px;padding-top:22px}
.motion-resolution strong {font-size:18px;flex-shrink:0}
.motion-resolution > span {font-size:14px;line-height:1.8;color:#cbc6d8}
.motion-artifacts {display:grid;grid-template-columns:.85fr 2fr;gap:42px;align-items:center;margin:52px 0}
.motion-artifact-intro > p {font-size:14px;color:#cbc6d8}
.motion-artifact-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.motion-study figure {margin:0;min-width:0}
.motion-artifact-grid figure > img {display:block;width:100%;height:auto;aspect-ratio:1080/2340;object-fit:contain;border-radius:10px;box-shadow:0 8px 22px #28113816}
.motion-artifact-grid figcaption {font-size:12px;color:#b3a9c1;line-height:1.7;margin-top:14px}
.motion-artifact-grid figcaption b {display:block;font-size:14px;color:#ddd0ee;margin-bottom:5px}
.case-page main .motion-study figure[data-lightbox-ready]::after {position:static;display:block;width:auto;padding:6px 0 0;text-align:right;border:0;border-radius:0;background:transparent;box-shadow:none;color:#b9a4d6;font-size:11px;opacity:1;transform:none;pointer-events:none}
.motion-decisions {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin:44px 0}
.motion-decisions article {border-top:1px solid #a987cf66;padding-top:20px}
.motion-decisions article > span {font-size:12px;color:#b9a4e4}
.motion-decisions p {font-size:14px;color:#cbc6d8;margin-bottom:0}
.motion-details {border-top:1px solid #ffffff26;padding:20px 0}
.motion-details summary {cursor:pointer;font-size:14px;color:#c6b5dd;line-height:1.8}
.motion-details summary:focus-visible,.motion-details a:focus-visible {outline:2px solid #67e1db;outline-offset:5px}
.motion-study .motion-runtime-order {padding:18px;background:#30233f;border-radius:10px;font-size:14px;color:#e0c8f5}
.motion-details dl {margin-bottom:0}
.motion-details dl > div {display:grid;grid-template-columns:240px 1fr;gap:22px;padding:16px 0;border-top:1px solid #ffffff12;font-size:14px;line-height:1.8}
.motion-details dt {font-weight:600;color:#ddd0ee}
.motion-details dd {margin:0;color:#bdb5c9}
.motion-details a {text-decoration:underline;color:#cdb2ea}
.motion-requirement-grid {display:grid;grid-template-columns:1fr 1fr;gap:40px}
.motion-requirement-grid li,.motion-requirement-grid p {font-size:14px;line-height:1.9;color:#bdb5c9}
.motion-requirement-grid ul {padding-left:20px}
.motion-evidence {padding-top:22px;border-top:1px solid #ffffff26;margin-top:8px}
.motion-evidence p {font-size:14px;color:#bdb5c9;max-width:940px}
.motion-evidence strong {color:#ddd0ee}
@media(max-width:1000px) {
  .motion-scenario {padding:26px}
  .motion-sequence-board {gap:10px}
  .motion-data,.motion-visible {padding:12px 10px;min-height:158px}
  .motion-resolution {display:block}
  .motion-resolution > span {display:block;margin-top:10px}
  .motion-artifacts {gap:26px;grid-template-columns:.8fr 2fr}
  .motion-artifact-grid {gap:14px}
}
@media(max-width:700px) {
  .motion-priorities {gap:15px;margin-top:26px}
  .motion-priorities article > span {display:block;min-height:40px;font-size:11px;line-height:1.8}
  .motion-priorities strong {font-size:38px}
  .motion-priorities p {font-size:12px}
  .motion-scenario {padding:22px 18px;margin:34px 0}
  .motion-track-key {gap:12px}
  .motion-track-key small {margin:0;width:100%}
  .motion-sequence-board {grid-template-columns:1fr;gap:22px}
  .motion-sequence-board li {display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .motion-step-number {grid-column:1/-1;margin:0}
  .motion-sequence-board li:not(:last-child) .motion-step-number::after {content:"↓"}
  .motion-visible {margin-top:0}
  .motion-data,.motion-visible {min-height:146px;padding:13px 11px}
  .motion-data strong,.motion-visible strong {font-size:15px}
  .motion-artifacts {grid-template-columns:1fr;margin:36px 0}
  .motion-artifact-intro h4 br {display:none}
  .motion-artifact-grid {gap:24px;grid-template-columns:1fr}
  .motion-artifact-grid figure {width:210px;max-width:100%;margin:auto}
  .motion-decisions {grid-template-columns:1fr;gap:22px}
  .motion-details dl > div {grid-template-columns:1fr;gap:7px}
  .motion-requirement-grid {grid-template-columns:1fr;gap:12px}
}
