:root{--primary-color: #ff6600;--secondary-color: #222;--accent-color: #e0e0e0;--text-color: #333;--success-color: #28a745;--error-color: #dc3545;--button-hover-scale: 1.05;--transition-duration: .3s}#page__index{color:inherit;font-family:sans-serif}#page__index ul{padding:0;margin:0;list-style:none}#page__index .hero{padding:2rem 1rem;text-align:center}#page__index .hero h1,#page__index .hero h2,#page__index .hero h3{margin:.5rem 0;color:inherit}#page__index .hero a.cta-button{display:inline-block;margin-top:1rem;padding:.75rem 1.5rem;background-color:var(--primary-color);color:#fff;text-decoration:none;border-radius:4px;transition:transform var(--transition-duration),box-shadow var(--transition-duration)}#page__index .hero a.cta-button:hover,#page__index .hero a.cta-button:focus{transform:scale(var(--button-hover-scale));box-shadow:0 4px 8px #00000026;outline:none}#page__index article figure{display:flex;flex-direction:column;width:100%;max-width:300px;margin:0 auto}#page__index article figure iframe{width:100%;height:200px;border:none}#page__index article figure img{width:100%;height:auto;display:block}#page__index>footer ul{display:flex;align-items:center;justify-content:center}#page__index>footer ul li{padding:1rem}#page__index .advanced-demo{padding:2rem;text-align:center}#page__index .advanced-demo h2{margin-bottom:1rem;color:var(--primary-color)}#page__index .advanced-demo article{margin-bottom:2rem}#page__index .flowchart{position:relative;margin:40px auto;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}#page__index .flowchart .node{display:inline-block;padding:10px 20px;border:2px solid var(--secondary-color);border-radius:4px;margin:10px;background:transparent;color:var(--text-color);position:relative;transition:background-color var(--transition-duration),transform var(--transition-duration)}#page__index .flowchart .node:hover,#page__index .flowchart .node:focus{background-color:var(--accent-color);transform:scale(var(--button-hover-scale));outline:none}#page__index .flowchart .node:after{content:"";position:absolute;width:40px;height:2px;background:var(--secondary-color);top:50%;right:-40px}#page__index .flowchart .node:last-child:after{display:none}#page__index .state-machine-demo button{padding:15px 30px;font-size:16px;border:none;border-radius:4px;cursor:pointer;transition:background-color var(--transition-duration),transform var(--transition-duration);color:inherit;background:transparent}#page__index .state-machine-demo button:hover,#page__index .state-machine-demo button:focus{transform:scale(var(--button-hover-scale));outline:none}#page__index .state-machine-demo button[data-state=potential]{background-color:var(--primary-color);color:#fff}#page__index .state-machine-demo button[data-state=vibration],#page__index .state-machine-demo button[data-state=ground],#page__index .state-machine-demo button[data-state=wonder],#page__index .state-machine-demo button[data-state=action],#page__index .state-machine-demo button[data-state=value],#page__index .state-machine-demo button[data-state=subject],#page__index .state-machine-demo button[data-state=perspective],#page__index .state-machine-demo button[data-state=concept],#page__index .state-machine-demo button[data-state=scene],#page__index .state-machine-demo button[data-state=mode],#page__index .state-machine-demo button[data-state=structure],#page__index .state-machine-demo button[data-state=integration],#page__index .state-machine-demo button[data-state=idle]{background-color:var(--accent-color);color:var(--text-color)}#page__index .state-machine-demo button[data-state=loading]{background-color:#6c757d;color:#fff;position:relative}#page__index .state-machine-demo button[data-state=loading]:after{content:"";border:2px solid #fff;border-top:2px solid transparent;border-radius:50%;width:20px;height:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);animation:spin 1s linear infinite}#page__index .state-machine-demo button[data-state=success]{background-color:var(--success-color);color:#fff}#page__index .state-machine-demo button[data-state=error]{background-color:var(--error-color);color:#fff;animation:shake .5s}#page__index .homebrew-rpg{padding:2rem 1rem;text-align:left}#page__index .homebrew-rpg h2{font-family:Brush Script MT,cursive;font-size:2rem;margin-bottom:1rem}#page__index .homebrew-rpg .archetype-list{font-family:Courier New,Courier,monospace;font-size:1.2rem;line-height:1.6;padding-left:.5rem}#page__index .homebrew-rpg .archetype-list li{margin:.5rem 0;position:relative}#page__index .homebrew-rpg .archetype-list li:before{content:"#";position:absolute;left:-1rem;color:var(--primary-color)}#page__index .homebrew-rpg p{margin-top:1rem}#page__index .professional-roles{padding:2rem 1rem;text-align:left}#page__index .professional-roles h2{font-weight:700;border-bottom:2px solid var(--primary-color);display:inline-block;padding-bottom:.25rem;margin-bottom:1rem}#page__index .professional-roles .roles-diagram{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}#page__index .professional-roles .role-box{padding:.75rem 1rem;border:1px solid var(--secondary-color);border-radius:4px;background-color:var(--accent-color);transition:transform var(--transition-duration)}#page__index .professional-roles .role-box:hover,#page__index .professional-roles .role-box:focus{transform:scale(var(--button-hover-scale));outline:none}#page__index .professional-roles p{margin-top:1rem}#page__index .team-dynamics{padding:2rem 1rem;background-color:#fafafa;text-align:center}#page__index .team-dynamics h2{margin-bottom:1rem}#page__index .roles-group{margin-bottom:2rem}#page__index .roles-group h3{margin-bottom:1rem}#page__index .rpg-archetypes,#page__index .professional-roles{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}#page__index .role{cursor:pointer;padding:1rem;margin:.5rem;border:1px solid var(--secondary-color);border-radius:4px;background-color:var(--accent-color);color:var(--text-color);transition:transform var(--transition-duration),background-color var(--transition-duration),box-shadow var(--transition-duration);text-align:center}#page__index .role:focus{outline:3px solid var(--primary-color);transform:scale(var(--button-hover-scale))}#page__index .role:hover{transform:scale(var(--button-hover-scale))}#page__index .role.active{border-color:var(--primary-color);box-shadow:0 0 0 3px #f60c}#page__index .active-role-display{margin-top:2rem;font-weight:700;font-size:1.2rem}#page__index .spw-sentence{position:relative;padding:0 .25rem;transition:background-color var(--transition-duration)}#page__index .spw-sentence:hover,#page__index .spw-sentence:focus{background-color:var(--primary-color);color:#fff;border-radius:3px}#page__index .interactive-heading{cursor:pointer;transition:color var(--transition-duration),transform var(--transition-duration)}#page__index .interactive-heading:hover,#page__index .interactive-heading:focus{color:var(--primary-color);transform:translate(5px)}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@media (max-width: 600px){#page__index .hero{padding:1.5rem .5rem}#page__index article figure{max-width:100%}#page__index .advanced-demo,#page__index .homebrew-rpg,#page__index .professional-roles,#page__index .team-dynamics{padding:1rem}#page__index .flowchart{flex-direction:column}}