.p24-cards,.cl-keypad{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:18px 0}
.p24-card{font-size:30px;min-width:60px;min-height:68px;background:#fff;color:#176b63;border:2px solid #bdd7c7;box-shadow:0 3px 0 #dce5dd}
.p24-card:disabled{opacity:.35}.p24-builder{background:#f2f5ed;border-radius:16px;padding:16px;margin:14px 0}.p24-expression{min-height:56px;padding:10px;background:white;border-radius:10px;font-size:23px;word-break:break-word}.p24-op{min-width:48px;font-size:20px}
.hanoi-pegs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0;align-items:stretch}.hanoi-peg{min-height:230px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:9px;background:#eff3ea;color:#28554b;border:2px solid transparent;padding:10px 4px}.hanoi-peg.selected{border-color:#d89435;background:#fff8e9}.hanoi-peg.illegal{animation:hn-shake .24s linear 2}.hanoi-stack{height:175px;width:100%;display:flex;flex-direction:column-reverse;align-items:center;justify-content:flex-start;border-bottom:7px solid #8b765e;background:linear-gradient(90deg,transparent 49%,#b79a72 49%,#b79a72 51%,transparent 51%);padding-bottom:5px}.hanoi-disk{display:block;height:19px;border-radius:12px;border:2px solid #ffffff99;color:#123e3a;text-align:center;font-size:12px;line-height:15px;cursor:grab;max-width:96%}.hanoi-disk:active{cursor:grabbing}@keyframes hn-shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.nim-piles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}.nim-pile{background:#f0f4eb;color:#28554b;min-height:112px;border:2px solid transparent}.nim-pile.selected{border-color:#d89435}.nim-pile strong{display:block}.nim-dots{display:flex;justify-content:center;align-items:center;align-content:center;gap:5px;flex-wrap:wrap;margin-top:9px;min-height:32px}.nim-dots i{width:12px;height:12px;border-radius:50%;background:#d89435;box-shadow:inset -2px -2px 0 #9d6727}
.cl-keypad{max-width:280px;margin-inline:auto}.cl-keypad button{width:68px;min-height:52px;font-size:21px}.cl-candidates{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}.life-board{display:grid;grid-template-columns:repeat(24,minmax(0,1fr));gap:2px;max-width:780px;margin:16px auto;background:#dce5dd;padding:6px;border-radius:9px;touch-action:none;user-select:none}.life-cell{min-width:0;padding:0;aspect-ratio:1;border-radius:3px;background:#fff;color:transparent}.life-cell.alive{background:#176b63;box-shadow:inset 0 0 0 1px #ffffff55}.life-cell:hover{outline:2px solid #d89435;z-index:1}
@media(max-width:540px){.p24-card{min-width:54px;min-height:60px;font-size:26px}.hanoi-pegs,.nim-piles{gap:5px}.hanoi-peg{min-height:180px;padding:8px 2px;font-size:12px}.hanoi-stack{height:135px}.hanoi-disk{height:15px;font-size:10px;line-height:11px}.life-board{gap:1px;padding:3px}.life-cell{border-radius:2px}}
@keyframes phase2-reveal{0%{opacity:.45;transform:translateY(6px) scale(.985)}100%{opacity:1;transform:translateY(0) scale(1)}}
.notice:not(.hidden){animation:phase2-reveal .34s ease-out}.status.phase2-won{animation:phase2-reveal .4s ease-out;background:#eaf6e8;border-color:#75b879}
@media(prefers-reduced-motion:reduce){.notice:not(.hidden),.status.phase2-won{animation:none}}