[
  {
    "id": "codrops-31d21ace63c0-article-0",
    "source": "design-engineering/state-management/patterns/derived-state.md",
    "anchor": "state-model-and-ownership",
    "sourceSha256": "22192b2fbab970a71ec0237221dc2d35c578e59723bc0032c2347f8ef595cd6c",
    "title": "11 / Perspective ring composition · renderOrbit",
    "principle": "Card angles derive from stable indices; one parent rotation and camera scale own the entire ring.",
    "application": "Twelve CSS 3D card transforms share one orbit parent. Each card uses a fixed index-derived 30-degree angle plus a depth translation; radius, tilt, parent rotation and scene scale remain separately editable. Keyboard-operable card selection and angle controls replace any need for a custom cursor. This binding describes the authored study and does not verify the original project.",
    "code": [
      {
        "file": "vendor/codrops-article-studies/records/codrops-31d21ace63c0/script.js",
        "symbol": "renderOrbit",
        "explanation": "The named local function implements this mechanism in the downloadable standalone page; its source hash is listed in codeFiles."
      }
    ],
    "checks": [
      {
        "id": "codrops-31d21ace63c0-renderOrbit",
        "action": "Set parent rotation to 0, change radius, toggle close view, then restore the original values.",
        "expected": "All twelve cards retain their 30-degree spacing and the same values reconstruct the same composition."
      }
    ],
    "runtime_verified": false
  },
  {
    "id": "codrops-31d21ace63c0-article-1",
    "source": "design-engineering/component-contract.md",
    "anchor": "contract-template",
    "sourceSha256": "79e496160e28ab26397d2c5b68075fd14c732d13002ff6c6e41c031d86cac039",
    "title": "11 / Perspective ring composition · selectOrbitCard",
    "principle": "Visible previous/next buttons and native card buttons expose selection independently of animation or a pointer-only cursor.",
    "application": "Twelve CSS 3D card transforms share one orbit parent. Each card uses a fixed index-derived 30-degree angle plus a depth translation; radius, tilt, parent rotation and scene scale remain separately editable. Keyboard-operable card selection and angle controls replace any need for a custom cursor. This binding describes the authored study and does not verify the original project.",
    "code": [
      {
        "file": "vendor/codrops-article-studies/records/codrops-31d21ace63c0/script.js",
        "symbol": "selectOrbitCard",
        "explanation": "The named local function implements this mechanism in the downloadable standalone page; its source hash is listed in codeFiles."
      }
    ],
    "checks": [
      {
        "id": "codrops-31d21ace63c0-selectOrbitCard",
        "action": "Pause motion and use Previous card/Next card by keyboard.",
        "expected": "The selected card and angle readout change together, and the parent rotation brings the selected card forward."
      }
    ],
    "runtime_verified": false
  },
  {
    "id": "codrops-31d21ace63c0-article-2",
    "source": "motion/accessible-motion.md",
    "anchor": "preference-changes-during-work",
    "sourceSha256": "db0ad692d5bb3103a3cbe13ec08dbe5cf12552aed7ecf2c93b1d7cc0b8a34b8b",
    "title": "11 / Perspective ring composition · applyMotionPreference",
    "principle": "One effective preference owns CSS and script playback. The initial view is stationary, and manual controls retain the study values.",
    "application": "Twelve CSS 3D card transforms share one orbit parent. Each card uses a fixed index-derived 30-degree angle plus a depth translation; radius, tilt, parent rotation and scene scale remain separately editable. Keyboard-operable card selection and angle controls replace any need for a custom cursor. This binding describes the authored study and does not verify the original project.",
    "code": [
      {
        "file": "vendor/codrops-article-studies/records/codrops-31d21ace63c0/script.js",
        "symbol": "applyMotionPreference",
        "explanation": "The named local function implements this mechanism in the downloadable standalone page; its source hash is listed in codeFiles."
      }
    ],
    "checks": [
      {
        "id": "codrops-31d21ace63c0-applyMotionPreference",
        "action": "Enable Static view during playback, then adjust the visible native controls.",
        "expected": "Playback stops, its button is disabled while the preference applies, and the current values remain inspectable without continuous motion."
      }
    ],
    "runtime_verified": false
  }
]
