chore(release): 4.13.6 [skip ci]

## [4.13.6](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.13.5...v4.13.6) (2025-10-18) ### Bug Fixes * simplify abacus pane with light background ([30f48ab](30f48ab897))
fix: simplify abacus pane with light background
2025-10-18 23:05:58 +00:00 · 2025-10-18 18:04:49 -05:00 · 2025-10-18 23:01:22 +00:00 · 2025-10-18 18:00:23 -05:00 · 2025-10-18 22:56:13 +00:00 · 2025-10-18 17:55:15 -05:00
4 changed files with 40 additions and 33 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,31 @@
+## [4.13.6](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.13.5...v4.13.6) (2025-10-18)
+
+
+### Bug Fixes
+
+* simplify abacus pane with light background ([30f48ab](https://github.com/antialias/soroban-abacus-flashcards/commit/30f48ab8976976688e089b07ece7fdae6d7ada79))
+
+## [4.13.5](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.13.4...v4.13.5) (2025-10-18)
+
+
+### Bug Fixes
+
+* correct AbacusReact API usage and add structural styling ([247377f](https://github.com/antialias/soroban-abacus-flashcards/commit/247377fca35ee3433e02ad594ecc1c4f391f0143)), closes [#fbbf24](https://github.com/antialias/soroban-abacus-flashcards/issues/fbbf24) [#a78](https://github.com/antialias/soroban-abacus-flashcards/issues/a78)
+
+## [4.13.4](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.13.3...v4.13.4) (2025-10-18)
+
+
+### Bug Fixes
+
+* **card-sorting:** increase card tile sizes to contain abacuses ([d2a3b7a](https://github.com/antialias/soroban-abacus-flashcards/commit/d2a3b7ae2e3f6819b8d9ace32be22f04f748d1bc))
+
+## [4.13.3](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.13.2...v4.13.3) (2025-10-18)
+
+
+### Bug Fixes
+
+* **card-sorting:** increase SVG size to fill card containers ([cf9d893](https://github.com/antialias/soroban-abacus-flashcards/commit/cf9d893f3fdbef6e91cd0ba283d602b9215569f1))
+
 ## [4.13.2](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.13.1...v4.13.2) (2025-10-18)


--- a/apps/web/src/app/page.tsx
+++ b/apps/web/src/app/page.tsx
@@ -58,7 +58,7 @@ export default function HomePage() {
                  gap: '4',
                  my: '10',
                  p: '8',
-                  bg: 'rgba(0, 0, 0, 0.4)',
+                  bg: 'white',
                  borderRadius: '2xl',
                  border: '2px solid',
                  borderColor: 'purple.500/30',
@@ -69,7 +69,7 @@ export default function HomePage() {
                  className={css({
                    fontSize: 'lg',
                    fontWeight: 'semibold',
-                    color: 'gray.300',
+                    color: 'gray.700',
                    mb: '2',
                  })}
                >
@@ -87,28 +87,8 @@ export default function HomePage() {
                  soundVolume={0.4}
                  scaleFactor={2.2}
                  showNumbers={true}
-                  customStyles={{
-                    numerals: {
-                      fill: '#fbbf24',
-                      fontWeight: 'bold',
-                      fontSize: '18px',
-                    },
-                  }}
-                  callbacks={{
-                    onValueChange: (newValue: number) => setAbacusValue(newValue),
-                  }}
+                  onValueChange={(newValue: number) => setAbacusValue(newValue)}
                />
-                <div
-                  className={css({
-                    fontSize: '4xl',
-                    fontWeight: 'bold',
-                    color: 'yellow.400',
-                    fontFamily: 'mono',
-                    letterSpacing: 'wide',
-                  })}
-                >
-                  {abacusValue.toLocaleString()}
-                </div>
              </div>

              <p
--- a/apps/web/src/arcade-games/card-sorting/components/PlayingPhase.tsx
+++ b/apps/web/src/arcade-games/card-sorting/components/PlayingPhase.tsx
@@ -280,8 +280,8 @@ export function PlayingPhase() {
                key={card.id}
                onClick={() => handleCardClick(card.id)}
                className={css({
-                  width: '90px',
-                  height: '90px',
+                  width: '140px',
+                  height: '140px',
                  padding: '8px',
                  border: '2px solid',
                  borderColor: selectedCardId === card.id ? '#1976d2' : 'transparent',
@@ -314,8 +314,8 @@ export function PlayingPhase() {
                <div
                  dangerouslySetInnerHTML={{ __html: card.svgContent }}
                  className={css({
-                    width: '74px',
-                    height: '74px',
+                    width: '100%',
+                    height: '100%',
                    display: 'flex',
                    alignItems: 'center',
                    justifyContent: 'center',
@@ -416,8 +416,8 @@ export function PlayingPhase() {
                    key={`slot-${index}`}
                    onClick={() => handleSlotClick(index)}
                    className={css({
-                      width: '90px',
-                      height: '110px',
+                      width: '140px',
+                      height: '160px',
                      padding: '0.5rem',
                      borderRadius: '8px',
                      border: '2px solid',
@@ -458,13 +458,12 @@ export function PlayingPhase() {
                            __html: card.svgContent,
                          }}
                          className={css({
-                            width: '70px',
-                            height: '70px',
+                            flex: 1,
+                            width: '100%',
                            display: 'flex',
                            alignItems: 'center',
                            justifyContent: 'center',
                            overflow: 'hidden',
-                            margin: '0 auto',
                            '& svg': {
                              width: '100%',
                              height: '100%',
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "soroban-monorepo",
-  "version": "4.13.2",
+  "version": "4.13.6",
  "private": true,
  "description": "Beautiful Soroban Flashcard Generator - Monorepo",
  "workspaces": [
Author	SHA1	Message	Date
semantic-release-bot	1386378ca1	chore(release): 4.13.6 [skip ci] ## [4.13.6](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.13.5...v4.13.6) (2025-10-18) ### Bug Fixes * simplify abacus pane with light background ([`30f48ab`](`30f48ab897`))	2025-10-18 23:05:58 +00:00
Thomas Hallock	30f48ab897	fix: simplify abacus pane with light background - Changed background from dark to white for better contrast - Removed duplicate number display (abacus has built-in numerals) - Removed custom styles (defaults work well on light background) - Updated instruction text color to gray.700 for readability Abacus component isn't designed for dark mode yet, so light pane is simpler. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>	2025-10-18 18:04:49 -05:00
semantic-release-bot	d2f6b8b46c	chore(release): 4.13.5 [skip ci] ## [4.13.5](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.13.4...v4.13.5) (2025-10-18) ### Bug Fixes * correct AbacusReact API usage and add structural styling ([`247377f`](`247377fca3`)), closes [#fbbf24](https://github.com/antialias/soroban-abacus-flashcards/issues/fbbf24) [#a78](https://github.com/antialias/soroban-abacus-flashcards/issues/a78)	2025-10-18 23:01:22 +00:00
Thomas Hallock	247377fca3	fix: correct AbacusReact API usage and add structural styling Fixed critical issues based on storybook examples: - Changed callback syntax: onValueChange prop directly (not in callbacks object) - Added reckoningBar styling: golden stroke (#fbbf24, 4px width) - Added columnPosts styling: purple stroke (#a78bfa, 3px width) - Now structural elements are visible on dark background and interactive works 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>	2025-10-18 18:00:23 -05:00
semantic-release-bot	be39401716	chore(release): 4.13.4 [skip ci] ## [4.13.4](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.13.3...v4.13.4) (2025-10-18) ### Bug Fixes * card-sorting: increase card tile sizes to contain abacuses ([`d2a3b7a`](`d2a3b7ae2e`))	2025-10-18 22:56:13 +00:00
Thomas Hallock	d2a3b7ae2e	fix(card-sorting): increase card tile sizes to contain abacuses Make card tiles larger to properly contain AbacusReact SVGs without overflow. Issue: Card tiles were too small (90px × 90px and 90px × 110px) to contain the AbacusReact SVGs, causing abacuses to overflow their containers. Fix: - Available cards: Increased from 90px × 90px to 140px × 140px - Position slots: Increased from 90px × 110px to 140px × 160px Result: Abacus SVGs now fit comfortably within their card containers without overflowing, while maintaining the overflow: hidden constraint as a safety measure. src/arcade-games/card-sorting/components/PlayingPhase.tsx:283-284,419-420 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>	2025-10-18 17:55:15 -05:00
semantic-release-bot	39ab605279	chore(release): 4.13.3 [skip ci] ## [4.13.3](https://github.com/antialias/soroban-abacus-flashcards/compare/v4.13.2...v4.13.3) (2025-10-18) ### Bug Fixes * card-sorting: increase SVG size to fill card containers ([`cf9d893`](`cf9d893f3f`))	2025-10-18 22:53:10 +00:00
Thomas Hallock	cf9d893f3f	fix(card-sorting): increase SVG size to fill card containers Make AbacusReact SVGs larger by allowing them to fill their containers. Issue: SVG containers were set to fixed small sizes (74px × 74px and 70px × 70px), making the abacuses appear too small within their cards. Fix: - Available cards: Changed SVG container from 74px × 74px to 100% × 100% to fill the entire 90px card (accounting for 8px padding) - Position slots: Changed SVG container from 70px × 70px to flex: 1, width: 100% to fill available space while leaving room for label Result: Abacuses now appear larger and fill their card containers better while still being constrained by overflow: hidden to prevent breaking out. src/arcade-games/card-sorting/components/PlayingPhase.tsx:314-329,456-473 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>	2025-10-18 17:51:57 -05:00