.abacus-play-layout{--abacus-question-font-size:clamp(36px,7.5vh,90px);--abacus-option-font-size:clamp(16px,3vh,28px);--abacus-next-font-size:clamp(16px,2.5vh,20px);--abacus-total-font-size:clamp(12px,1.5vh,16px);--abacus-answer-main-char-size:clamp(24px,4vh,46px);--abacus-answer-bpm-size:clamp(12px,2vh,20px);--bead-size:clamp(30px,5vh,46px);--bead-gap:200px}.abacus-header-right{align-items:center;gap:12px;display:flex}.abacus-difficulty-toggle{background:#fff5f5cc;border:1px solid #ffcdd2;border-radius:999px;align-items:center;gap:8px;padding:4px 8px;display:flex}.abacus-difficulty-label{color:#165321;font-size:14px}.abacus-difficulty-pill{color:#1e4f27;cursor:pointer;background:#fff;border:2px solid #1e4f27;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;padding:0;font-size:16px;font-weight:700;display:flex}.abacus-difficulty-pill--active{color:#fff;background:#0d2607;box-shadow:0 0 0 2px #7a504d59}.abacus-play-layout{box-sizing:border-box;flex-direction:row;gap:24px;width:100%;height:100%;padding-bottom:16px;display:flex;overflow:hidden}.abacus-left{flex:1.8;align-items:stretch;min-width:0;display:flex}.abacus-left-inner{box-sizing:border-box;background:#fff;border:1px solid #ddd;border-radius:16px;justify-content:center;align-items:stretch;width:100%;height:100%;padding:8px;display:flex}.abacus-right{flex-direction:column;flex:1;gap:16px;min-width:0;display:flex}.abacus-question-panel{box-sizing:border-box;color:#000;background:#fff;border:1px solid #ddd;border-radius:16px;flex-direction:column;flex:4.5;justify-content:center;align-items:center;gap:16px;min-height:0;padding:16px;display:flex}.abacus-question-text{font-size:var(--abacus-question-font-size);color:#000;text-align:center;font-weight:800;line-height:1.2}.abacus-question-illustration{object-fit:contain;max-width:100%;height:auto;max-height:60%;display:block}.abacus-options-panel{box-sizing:border-box;color:#000;background:#fff;border:1px solid #ddd;border-radius:16px;flex-direction:column;flex:5.5;justify-content:flex-start;gap:12px;min-height:0;padding:16px;display:flex}.abacus-options{flex-direction:column;flex-grow:1;justify-content:center;gap:12px;display:flex}.abacus-option-button{width:100%;font-size:var(--abacus-option-font-size);text-align:center;color:#000;background:#fff;border:1px solid #ccc;border-radius:12px;justify-content:center;align-items:center;height:3em;padding:.6em 0;transition:all .2s;display:flex}.abacus-option-button:active{transform:scale(.98)}.abacus-option-button--correct{background:#c8e6c9;border-color:#66bb6a}.abacus-option-button--incorrect{background:#ffcdd2;border-color:#ef5350}.abacus-option-button--disabled,.abacus-option-button:disabled{color:#999;cursor:default;pointer-events:none;opacity:.7;background:#f5f5f5;border-color:#ddd}.abacus-next-button-slot{justify-content:center;align-items:center;min-height:4em;margin-top:auto;display:flex}.abacus-next-button{width:100%;height:100%;font-size:var(--abacus-next-font-size);color:#fff;cursor:pointer;background:#42a5f5;border:none;border-radius:12px;transition:transform .1s;box-shadow:0 4px 6px #42a5f533}.abacus-next-button:active{transform:scale(.98)}.abacus-next-button-inner{justify-content:center;align-items:center;gap:1em;line-height:1;display:flex}.abacus-next-button-inner .bpm-main-char{font-size:1.5em}.abacus-next-button-inner .bpm-column{transform:translateY(0)}.abacus-next-button-inner .bpm-tone{right:-.4em}.abacus-next-arrow{margin-left:4px;font-size:1.2em}.abacus-board{box-sizing:border-box;touch-action:none;background:#fdf6e9;border:6px solid #d2a673;border-radius:16px;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:16px 24px;display:flex;overflow:hidden}.abacus-row{flex:1;align-items:center;width:100%;min-height:0;display:flex;container-type:inline-size}.abacus-row-track{touch-action:none;align-items:center;width:100%;height:100%;display:flex;position:relative}.abacus-row-line{background:#00000026;border-radius:999px;height:6px;margin:0 auto;position:absolute;left:.5%;right:.5%}.abacus-row-beads{justify-content:flex-start;align-items:center;gap:calc(var(--bead-size)*.2);box-sizing:border-box;z-index:1;--bead-gap:calc(100cqw - (var(--bead-size)*13));width:99%;height:100%;padding-left:1%;padding-right:1%;display:flex;position:relative}.abacus-bead{width:var(--bead-size);height:var(--bead-size);transform:translateX(calc(var(--bead-size)*.25));background:#eee;border:1px solid #00000026;border-radius:50%;flex-shrink:0;transition:transform .16s ease-out}.abacus-bead--right{transform:translateX(var(--bead-gap))}.abacus-bead--active{transform:scale(1.05)translateX(calc(var(--bead-size)*.025));z-index:2;box-shadow:0 0 0 3px #42a5f58c}.abacus-bead--right.abacus-bead--active{transform:scale(1.05)translateX(var(--bead-gap))}.abacus-row-color-0 .abacus-bead{background:#f8bbd0}.abacus-row-color-1 .abacus-bead{background:#ef9a9a}.abacus-row-color-2 .abacus-bead{background:#fff59d}.abacus-row-color-3 .abacus-bead{background:#ffe082}.abacus-row-color-4 .abacus-bead{background:#c5e1a5}.abacus-row-color-5 .abacus-bead{background:#81c784}.abacus-row-color-6 .abacus-bead{background:#90caf9}.abacus-row-color-7 .abacus-bead{background:#b39ddb}.abacus-total-label{font-size:var(--abacus-total-font-size);text-align:right;color:#000;margin-top:4px}.abacus-answer-label{font-size:var(--abacus-answer-main-char-size);justify-content:center;align-items:flex-end;gap:.5em;margin-top:4px;margin-bottom:8px;display:flex}.abacus-entry-container{box-sizing:border-box;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:24px;width:100%;height:100%;padding:20px;display:flex}.abacus-entry-visual{justify-content:center;align-items:center;margin-bottom:40px;display:flex;position:relative}.abacus-entry-image{border-radius:20px;width:400px;max-width:100%;height:auto;transition:transform .3s;box-shadow:0 8px 24px #00000026}.abacus-entry-image:hover{transform:scale(1.05)}.abacus-entry-content{flex-direction:column;align-items:center;gap:24px;width:100%;max-width:400px;display:flex}.abacus-entry-subtitle{color:#5d4037;margin:0;font-size:clamp(18px,4vw,28px);font-weight:600}.abacus-start-button-large{color:#fff;cursor:pointer;background:linear-gradient(135deg,#66bb6a,#43a047);border:none;border-radius:999px;justify-content:center;align-items:center;gap:12px;width:100%;padding:16px 32px;font-size:clamp(24px,5vw,32px);font-weight:800;transition:all .2s cubic-bezier(.175,.885,.32,1.275);display:flex;box-shadow:0 8px 16px #43a0474d}.abacus-start-button-large:active{transform:scale(.95);box-shadow:0 4px 8px #43a04733}.start-icon{font-size:.8em}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes sparkle{0%{opacity:.8;transform:scale(.8)rotate(-10deg)}to{opacity:1;transform:scale(1.2)rotate(10deg)}}@media (max-aspect-ratio:1) or (max-width:768px){.abacus-play-layout{flex-direction:column}.abacus-left{flex:1.2;width:100%}.abacus-right{flex-direction:row;flex:1;gap:12px;width:100%}.abacus-question-panel{flex:1;height:100%;max-height:none}.abacus-options-panel{flex:1;height:100%}.abacus-play-layout{--abacus-question-font-size:clamp(30px,6vw,54px);--abacus-option-font-size:clamp(14px,3vw,20px);--bead-size:clamp(24px,6vh,40px)}}@media (min-width:768px) and (min-height:501px) and (orientation:landscape){.abacus-question-panel{flex:3.5;gap:8px;padding:12px}.abacus-options-panel{flex:6.5;padding:12px}.abacus-question-text{font-size:clamp(36px,7vh,72px)}.abacus-question-illustration{max-height:50%}}@media (max-width:480px) and (orientation:portrait){.abacus-play-layout{flex-direction:column;gap:16px;padding-bottom:8px}.abacus-left{flex:auto;min-height:0}.abacus-right{flex-direction:column;flex:none;gap:16px;width:100%}.abacus-question-panel{flex-direction:row;flex:none;justify-content:center;gap:12px;height:auto;padding:8px}.abacus-question-text{margin:0;font-size:36px}.abacus-question-illustration{width:auto;max-height:60px;display:block}.abacus-options-panel{flex:none;height:auto;padding:8px}.abacus-options{flex-direction:row;gap:12px}.abacus-option-button{height:48px;padding:0;font-size:22px}.abacus-answer-label,.abacus-difficulty-label{display:none}.page-title{font-size:16px}.abacus-difficulty-pill{width:24px;height:24px;font-size:14px}.abacus-play-layout{--bead-size:clamp(14px,5.5vw,22px)}.abacus-board{padding:4px 8px}.abacus-row-beads{padding-left:.5%;padding-right:.5%}.abacus-entry-emoji{font-size:100px}.abacus-start-button-large{padding:12px 24px;font-size:24px}}@media (max-height:500px) and (orientation:landscape){.abacus-play-layout{flex-direction:row;gap:12px;padding-bottom:4px}.abacus-left{flex:1.5;height:100%}.abacus-right{flex-direction:column;flex:1;justify-content:center;gap:8px;height:100%}.abacus-question-panel{flex-direction:row;flex:1;gap:8px;padding:4px}.abacus-question-text{font-size:30px}.abacus-question-illustration{width:auto;max-height:50px}.abacus-options-panel{flex:1.2;padding:4px}.abacus-options{flex-flow:wrap;gap:6px}.abacus-option-button{flex:1;min-width:60px;height:36px;font-size:16px}.abacus-play-layout{--bead-size:clamp(16px,9vh,28px)}.abacus-board{padding:4px 12px}.abacus-answer-label,.abacus-difficulty-label{display:none}.page-title{font-size:16px}.abacus-difficulty-pill{width:24px;height:24px;font-size:14px}.abacus-entry-container{flex-direction:row;gap:40px}.abacus-entry-emoji{font-size:100px}}.abacus-entry-title{color:#333;text-align:center;margin-bottom:24px;font-size:clamp(24px,5vw,36px)}.abacus-mode-selection{grid-template-columns:repeat(2,1fr);gap:24px;width:100%;max-width:600px;display:grid}.abacus-mode-btn{cursor:pointer;border:none;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;min-height:200px;padding:32px 24px;transition:transform .2s,box-shadow .2s;display:flex}.abacus-mode-btn:hover{transform:scale(1.05)}.abacus-mode-btn:active{transform:scale(.98)}.abacus-mode-btn--abacus{background:linear-gradient(135deg,#66bb6a,#43a047);box-shadow:0 8px 20px #43a0474d}.abacus-mode-btn--math{background:linear-gradient(135deg,#42a5f5,#1e88e5);box-shadow:0 8px 20px #1e88e54d}.abacus-mode-icon{margin-bottom:16px;font-size:clamp(48px,10vw,80px)}.abacus-mode-label{color:#fff;margin-bottom:8px;font-size:clamp(20px,4vw,28px);font-weight:700}.abacus-mode-sublabel{color:#ffffffe6;font-size:clamp(14px,3vw,18px)}.abacus-mode-switch-btn{color:#666;cursor:pointer;white-space:nowrap;background-color:#0000;border:2px solid #666;border-radius:20px;padding:8px 16px;font-size:14px;font-weight:700;transition:all .2s}.abacus-mode-switch-btn:hover{color:#333;background-color:#f5f5f5;border-color:#333}.pure-math-container{box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:32px;width:100%;height:100%;padding:24px;display:flex}.pure-math-question-section{flex-direction:column;flex:none;align-items:center;gap:24px;display:flex}.pure-math-avatar{object-fit:contain;width:auto;max-width:200px;height:auto;max-height:200px}.pure-math-expression{color:#000;text-align:center;font-size:clamp(48px,10vw,96px);font-weight:800;line-height:1.2}.pure-math-options-section{flex-direction:column;flex:none;align-items:center;gap:20px;width:100%;max-width:600px;display:flex}.pure-math-answer-label{justify-content:center;align-items:flex-end;gap:.5em;font-size:clamp(24px,5vw,36px);display:flex}.pure-math-options-grid{grid-template-columns:repeat(2,1fr);gap:16px;width:100%;display:grid}.pure-math-option-btn{color:#000;cursor:pointer;background:#fff;border:2px solid #ccc;border-radius:16px;justify-content:center;align-items:center;min-height:80px;padding:24px;font-size:clamp(32px,6vw,56px);font-weight:700;transition:all .2s;display:flex}.pure-math-option-btn:hover{background:#f5f5f5;transform:scale(1.02)}.pure-math-option-btn:active{transform:scale(.98)}.pure-math-option-btn--correct{background:#c8e6c9;border-color:#66bb6a}.pure-math-option-btn--incorrect{background:#ffcdd2;border-color:#ef5350}.pure-math-option-btn--disabled,.pure-math-option-btn:disabled{color:#999;cursor:default;pointer-events:none;opacity:.7;background:#f5f5f5;border-color:#ddd}.pure-math-next-button-slot{justify-content:center;align-items:center;width:100%;min-height:60px;display:flex}.pure-math-next-button{color:#fff;cursor:pointer;background:#42a5f5;border:none;border-radius:999px;width:100%;max-width:400px;padding:16px 32px;font-size:clamp(18px,4vw,24px);transition:transform .1s;box-shadow:0 4px 12px #42a5f54d}.pure-math-next-button:active{transform:scale(.98)}.pure-math-next-button-inner{justify-content:center;align-items:center;gap:1em;line-height:1;display:flex}.pure-math-next-button-inner .bpm-main-char{font-size:1.3em}.pure-math-next-arrow{margin-left:4px;font-size:1.2em}@media (max-width:480px) and (orientation:portrait){.pure-math-container{gap:24px;padding:16px}.pure-math-avatar{max-width:120px;max-height:120px}.pure-math-expression{font-size:clamp(36px,12vw,64px)}.pure-math-options-grid{gap:12px}.pure-math-option-btn{min-height:60px;padding:16px;font-size:clamp(28px,8vw,48px)}.abacus-mode-selection{grid-template-columns:1fr;gap:16px}.abacus-mode-btn{min-height:160px;padding:24px 16px}}@media (min-width:768px) and (max-width:1024px) and (orientation:portrait){.pure-math-container{gap:40px;padding:32px}.pure-math-avatar{max-width:250px;max-height:250px}.pure-math-expression{font-size:clamp(64px,10vw,120px)}.pure-math-options-grid{gap:20px;max-width:700px}.pure-math-option-btn{min-height:100px;padding:32px;font-size:clamp(48px,7vw,72px)}}@media (min-width:768px) and (orientation:landscape){.pure-math-container{flex-direction:row;justify-content:space-around;gap:48px;padding:24px 48px}.pure-math-question-section{flex:1;justify-content:center}.pure-math-avatar{max-width:280px;max-height:280px}.pure-math-expression{font-size:clamp(56px,8vw,100px)}.pure-math-options-section{flex:1;justify-content:center;max-width:500px}.pure-math-options-grid{gap:20px}.pure-math-option-btn{min-height:90px;padding:28px;font-size:clamp(40px,6vw,64px)}}.abacus-progress-bar{justify-content:center;align-items:center;gap:12px;margin-bottom:16px;padding:16px;display:flex}.abacus-progress-circle{color:#999;background:#fff;border:3px solid #e0e0e0;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:18px;font-weight:700;transition:all .3s;display:flex}.abacus-progress-circle--current{color:#1976d2;background:#e3f2fd;border-color:#42a5f5;transform:scale(1.1);box-shadow:0 0 0 4px #42a5f533}.abacus-progress-circle--correct{color:#2e7d32;background:#c8e6c9;border-color:#66bb6a}.abacus-progress-circle--incorrect{color:#c62828;background:#ffcdd2;border-color:#ef5350}.abacus-progress-circle--unanswered{color:#bdbdbd;background:#f5f5f5;border-color:#e0e0e0}.abacus-end-screen{box-sizing:border-box;justify-content:center;align-items:center;width:100%;height:100%;padding:40px;display:flex}.abacus-end-content{background:#fff;border-radius:24px;flex-direction:column;align-items:center;gap:32px;width:100%;max-width:600px;padding:48px;display:flex;box-shadow:0 8px 32px #0000001a}.abacus-end-image{object-fit:contain;border-radius:16px;width:100%;max-width:400px;height:auto}.abacus-end-emoji{font-size:120px;animation:.6s ease-out bounce}@keyframes bounce{0%{transform:translateY(0)rotate(0)}to{transform:translateY(-10px)rotate(0)}}.abacus-end-title{color:#333;text-align:center;margin:0;font-size:36px;font-weight:700}.abacus-end-score{color:#666;align-items:baseline;gap:8px;font-size:24px;display:flex}.abacus-end-score-number{color:#66bb6a;font-size:72px;font-weight:700}.abacus-end-score-divider{color:#999;font-size:48px}.abacus-end-score-total{color:#999;font-size:48px;font-weight:700}.abacus-end-score-label{color:#666;margin-left:8px;font-size:24px}.abacus-end-restart-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#42a5f5,#1976d2);border:none;border-radius:999px;padding:16px 48px;font-size:24px;font-weight:700;transition:all .2s;box-shadow:0 4px 16px #42a5f54d}.abacus-end-restart-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #42a5f566}.abacus-end-restart-btn:active{transform:translateY(0)}.abacus-history-modal{z-index:1000;background:#00000080;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.abacus-history-content{background:#fff;border-radius:16px;flex-direction:column;width:100%;max-width:600px;max-height:80vh;display:flex;box-shadow:0 8px 32px #0003}.abacus-history-header{border-bottom:1px solid #e0e0e0;justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.abacus-history-header h2{color:#333;margin:0;font-size:24px}.abacus-history-close{color:#999;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;padding:0;font-size:28px;transition:all .2s;display:flex}.abacus-history-close:hover{color:#666;background:#f5f5f5}.abacus-history-table-container{flex:1;padding:16px 24px;overflow-y:auto}.abacus-history-table{border-collapse:collapse;width:100%}.abacus-history-table th{text-align:left;color:#666;border-bottom:2px solid #e0e0e0;padding:12px 8px;font-size:14px;font-weight:600}.abacus-history-table td{color:#333;border-bottom:1px solid #f5f5f5;padding:12px 8px;font-size:14px}.abacus-history-score{color:#66bb6a;font-weight:700}.abacus-history-empty{text-align:center;color:#999;padding:40px;font-size:16px}.abacus-history-clear-btn{color:#ef5350;cursor:pointer;background:#fff;border:1px solid #ef5350;border-radius:8px;margin:16px 24px;padding:12px 24px;font-size:14px;font-weight:600;transition:all .2s}.abacus-history-clear-btn:hover{background:#ffebee}.abacus-history-clear-btn:active{transform:scale(.98)}.abacus-history-btn{cursor:pointer;background:#fff;border:2px solid #e0e0e0;border-radius:8px;justify-content:center;align-items:center;padding:6px 12px;font-size:20px;transition:all .2s;display:flex}.abacus-history-btn:hover{background:#f5f5f5;border-color:#bdbdbd}.abacus-history-btn:active{transform:scale(.95)}@media (max-width:600px){.abacus-progress-circle{width:40px;height:40px;font-size:16px}.abacus-end-content{padding:32px 24px}.abacus-end-emoji{font-size:80px}.abacus-end-title{font-size:28px}.abacus-end-score-number{font-size:56px}.abacus-end-score-divider,.abacus-end-score-total{font-size:36px}.abacus-end-restart-btn{padding:14px 36px;font-size:20px}.abacus-history-table{font-size:12px}.abacus-history-table th,.abacus-history-table td{padding:8px 4px}}.cm-modal-overlay{z-index:3000;background-color:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.cm-modal{text-align:center;background:#fff;border-radius:24px;width:90%;max-width:500px;padding:40px;animation:.3s ease-out cm-modal-appear;box-shadow:0 8px 32px #0000004d}.cm-modal-message{color:#333;white-space:pre-line;margin-bottom:40px;font-size:1.8rem;font-weight:700;line-height:1.5}.cm-modal-buttons{justify-content:center;gap:20px;display:flex}.cm-modal-btn{cursor:pointer;text-transform:uppercase;letter-spacing:2px;border:none;border-radius:50px;min-width:160px;padding:20px 60px;font-size:2rem;font-weight:700;transition:all .2s;box-shadow:0 4px 12px #0003}.cm-modal-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px #0000004d}.cm-modal-btn:active{transform:translateY(0);box-shadow:0 2px 8px #0003}.cm-modal-confirm{color:#fff;background:linear-gradient(135deg,#4caf50,#66bb6a)}.cm-modal-confirm:hover{background:linear-gradient(135deg,#66bb6a,#4caf50)}.cm-modal-cancel{color:#fff;background:linear-gradient(135deg,#f44336,#e57373)}.cm-modal-cancel:hover{background:linear-gradient(135deg,#e57373,#f44336)}@keyframes cm-modal-appear{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@media (max-width:600px){.cm-modal{padding:30px 20px}.cm-modal-message{margin-bottom:30px;font-size:1.4rem}.cm-modal-buttons{flex-direction:column;gap:15px}.cm-modal-btn{width:100%;padding:18px 40px;font-size:1.6rem}}.audio-loading-overlay{z-index:9999;background:#000000b3;justify-content:center;align-items:center;animation:.3s ease-out fadeIn;display:flex;position:fixed;inset:0}.audio-loading-content{background:#fff;border-radius:24px;flex-direction:column;align-items:center;gap:20px;padding:40px;animation:.3s ease-out scaleIn;display:flex;box-shadow:0 8px 32px #0003}.audio-loading-spinner{border:6px solid #e0e0e0;border-top-color:#4dd0e1;border-radius:50%;width:60px;height:60px;animation:1s linear infinite spin}.audio-loading-message{color:#333;margin:0;font-size:18px;font-weight:600}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width:768px){.audio-loading-content{padding:32px}.audio-loading-spinner{border-width:5px;width:50px;height:50px}.audio-loading-message{font-size:16px}}.pm-game-container{box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;height:100%;padding:20px;display:flex}.pm-header-controls{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.pm-difficulty-select{color:#333;cursor:pointer;background-color:#fff;border:2px solid #ff9800;border-radius:20px;outline:none;padding:8px 12px;font-size:14px;font-weight:700;transition:all .2s}.pm-difficulty-select:hover{background-color:#fff3e0}.pm-difficulty-select:focus{border-color:#f57c00;box-shadow:0 0 0 3px #ff98001a}.pm-mode-switch-btn{color:#666;cursor:pointer;white-space:nowrap;background-color:#0000;border:2px solid #666;border-radius:20px;padding:8px 16px;font-size:14px;font-weight:700}.pm-card-grid{grid-template-columns:repeat(2,1fr);gap:24px;width:100%;max-width:600px;margin-top:20px;display:grid}.pm-stimulus-container{flex-direction:column;align-items:center;gap:16px;margin-bottom:40px;display:flex}.pm-stimulus-card{color:#333;background-color:#fff;border-radius:20px;align-items:center;gap:16px;padding:20px 40px;font-weight:700;transition:all .3s;display:flex;box-shadow:0 4px 12px #0000001a}.pm-stimulus-card--playing{box-shadow:0 0 20px #4caf50}.pm-stimulus-card--clickable{cursor:pointer}.pm-stimulus-label{color:#666;font-size:1.5rem}.pm-next-btn{color:#fff;cursor:pointer;background-color:#4caf50;border:none;border-radius:50px;margin-top:32px;padding:16px 32px;font-size:24px;animation:.3s cubic-bezier(.175,.885,.32,1.275) popIn;box-shadow:0 4px 12px #4caf504d}@keyframes popIn{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.pm-start-overlay{z-index:100;cursor:pointer;background-color:#fffc;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.pm-start-image{width:100%;max-width:400px;height:auto;animation:.5s cubic-bezier(.175,.885,.32,1.275) popIn}.pm-ready-go-container{cursor:pointer;justify-content:center;align-items:center;min-height:300px;display:flex}.pm-ready-go-inline{flex-direction:column;align-items:center;gap:16px;animation:.5s cubic-bezier(.175,.885,.32,1.275) popIn;display:flex}.pm-ready-go-inline-image{width:100%;max-width:350px;height:auto;transition:transform .2s}.pm-ready-go-inline-image:hover{transform:scale(1.05)}.pm-ready-go-hint{color:#666;margin:0;font-size:1.5rem;font-weight:700;animation:2s infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@media (max-width:480px) and (orientation:portrait){.pm-game-container{justify-content:flex-start;padding:10px}.pm-header-controls{flex-wrap:wrap;justify-content:flex-start;gap:6px;width:100%}.pm-difficulty-select{flex:none;padding:6px 10px;font-size:12px}.pm-mode-switch-btn{flex:none;padding:6px 12px;font-size:12px}.pm-stimulus-container{gap:8px;margin-bottom:20px}.pm-stimulus-card{padding:12px 24px}.pm-stimulus-label{font-size:1.2rem}.pm-card-grid{gap:12px;margin-top:12px}.pm-next-btn{margin-top:16px;padding:12px 24px;font-size:20px}.pm-start-image{max-width:280px}}@media (max-height:500px) and (orientation:landscape){.pm-game-container{flex-direction:row;gap:24px;padding:4px 20px}.pm-stimulus-container{flex:none;margin-bottom:0}.pm-stimulus-card{padding:10px 20px}.pm-stimulus-label{display:none}.pm-card-grid{flex:1;grid-template-columns:repeat(4,1fr);align-items:center;gap:12px;height:auto;margin-top:0}.pm-next-btn{margin-top:0;padding:8px 24px;font-size:18px;position:absolute;bottom:10px;right:20px}}.pm-entry-container{flex-direction:column;justify-content:flex-start;align-items:center;gap:24px;height:100%;padding:20px;display:flex}.pm-entry-visual{justify-content:center;align-items:center;margin-bottom:20px;display:flex}.pm-entry-image{border-radius:20px;width:400px;max-width:100%;height:auto;transition:transform .3s;box-shadow:0 8px 24px #00000026}.pm-entry-image:hover{transform:scale(1.05)}.pm-image-card{perspective:1000px}.pm-card-face{backface-visibility:hidden}.pm-card-face--back{transform:rotateY(180deg)}.pm-entry-title{color:#333;text-align:center;margin-bottom:0;font-size:2rem}.pm-entry-options{grid-template-columns:repeat(2,1fr);justify-content:center;gap:40px;max-width:600px;display:grid}.pm-entry-btn{color:#fff;cursor:pointer;border:none;border-radius:30px;flex-direction:column;justify-content:center;align-items:center;width:280px;height:280px;transition:transform .2s;display:flex}.pm-entry-btn:hover{transform:scale(1.05)}.pm-entry-btn--english{background-color:#4caf50;box-shadow:0 8px 20px #4caf504d}.pm-entry-btn--zhuyin{background-color:#ff9800;box-shadow:0 8px 20px #ff98004d}.pm-entry-btn--dinosaur{background-color:#9c27b0;box-shadow:0 8px 20px #9c27b04d}.pm-entry-icon{margin-bottom:10px;font-size:5rem}.pm-entry-label{font-size:2rem;font-weight:700}.pm-entry-sublabel{opacity:.9;margin-top:8px;font-size:1.2rem}@media (orientation:portrait){.pm-entry-container{gap:20px;padding:12px}.pm-entry-title{font-size:1.5rem}.pm-entry-options{grid-template-columns:repeat(2,1fr);gap:16px;width:100%;max-width:100%}.pm-entry-btn{aspect-ratio:1;width:100%;max-width:170px;height:auto;padding:10px}.pm-entry-icon{font-size:3rem}.pm-entry-label{font-size:1.2rem}.pm-entry-sublabel{font-size:.9rem}}@media (min-width:768px) and (max-width:1024px) and (orientation:portrait){.pm-entry-container{gap:24px;padding:20px}.pm-entry-title{font-size:1.8rem}.pm-entry-options{width:100%;max-width:90vw;grid-template-columns:repeat(3,1fr)!important;gap:20px!important}.pm-entry-btn{aspect-ratio:1;width:100%;max-width:none;height:auto;padding:16px}.pm-entry-icon{font-size:3.5rem}.pm-entry-label{font-size:1.4rem}.pm-entry-sublabel{font-size:1rem}}@media (orientation:landscape){.pm-entry-container{justify-content:flex-start;gap:12px;padding:8px 20px}.pm-entry-title{margin:0;font-size:1.3rem}.pm-entry-options{grid-template-columns:repeat(3,1fr);gap:12px;width:100%;max-width:90vw}.pm-entry-btn{aspect-ratio:1;width:100%;height:auto;max-height:50vh;padding:12px}.pm-entry-icon{font-size:clamp(2rem,5vh,3.5rem)}.pm-entry-label{font-size:clamp(1rem,2.5vh,1.4rem)}.pm-entry-sublabel{font-size:clamp(.8rem,2vh,1rem)}.pm-reset-progress-btn{padding:6px 16px;font-size:.9rem}}@media (min-width:768px) and (min-height:600px) and (orientation:landscape){.pm-card-grid{grid-template-columns:repeat(4,1fr);gap:20px;max-width:960px}.pm-game-container{padding:20px 60px}}.pm-progress-container{width:100%;max-width:600px;margin-bottom:20px;padding:0 10px}.pm-progress-track{justify-content:space-between;align-items:center;gap:8px;display:flex}.pm-progress-step{background-color:#e0e0e0;border-radius:4px;flex:1;height:8px;transition:background-color .3s}.pm-progress-step.correct{background-color:#4caf50}.pm-progress-step.incorrect{background-color:#f44336}.pm-progress-step.current{background-color:#ff9800;transform:scaleY(1.5)}.pm-end-screen{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;animation:.5s fadeIn;display:flex}.pm-end-content{text-align:center;background-color:#fff;border-radius:20px;width:90%;max-width:500px;padding:30px;box-shadow:0 10px 30px #0003}.pm-end-image{object-fit:cover;border-radius:10px;width:100%;max-height:300px;margin-bottom:20px}.pm-end-title{color:#4caf50;margin:0 0 10px;font-size:2.5rem}.pm-end-score{color:#333;margin-bottom:30px;font-size:1.5rem}.pm-score-value{color:#2196f3;font-size:2rem;font-weight:700}.pm-restart-btn{color:#fff;cursor:pointer;background-color:#ff9800;border:none;border-radius:50px;padding:12px 32px;font-size:1.2rem;font-weight:700;transition:transform .2s,background-color .2s}.pm-restart-btn:hover{background-color:#f57c00;transform:scale(1.05)}.pm-history-btn{cursor:pointer;background:0 0;border:none;border-radius:50%;padding:5px;font-size:1.5rem;transition:background-color .2s}.pm-history-btn:hover{background-color:#0000000d}.pm-modal-overlay{z-index:1000;background-color:#00000080;justify-content:center;align-items:center;width:100%;height:100%;animation:.3s fadeIn;display:flex;position:fixed;top:0;left:0}.pm-modal-content{background-color:#fff;border-radius:20px;flex-direction:column;width:90%;max-width:500px;max-height:80vh;display:flex;overflow:hidden;box-shadow:0 10px 30px #0000004d}.pm-modal-header{border-bottom:1px solid #eee;justify-content:space-between;align-items:center;padding:20px;display:flex}.pm-modal-header h2{color:#333;margin:0}.pm-close-btn{cursor:pointer;color:#999;background:0 0;border:none;font-size:2rem;line-height:1}.pm-history-list{flex:1;padding:20px;overflow-y:auto}.pm-no-history{text-align:center;color:#999;padding:40px 0}.pm-history-table{border-collapse:collapse;width:100%}.pm-history-table th{text-align:left;color:#666;border-bottom:2px solid #eee;padding:10px}.pm-history-table td{color:#333;border-bottom:1px solid #f5f5f5;padding:12px 10px}.pm-score-cell{font-weight:700}.pm-score-badge{background-color:#eee;border-radius:12px;padding:4px 8px;font-size:.9rem}.pm-score-badge.perfect{color:#2e7d32;background-color:#e8f5e9}.pm-modal-footer{text-align:right;border-top:1px solid #eee;padding:15px 20px}.pm-clear-btn{color:#666;cursor:pointer;background:0 0;border:1px solid #ddd;border-radius:6px;padding:8px 16px;font-size:.9rem}.pm-clear-btn:hover:not(:disabled){color:#f44336;background-color:#f5f5f5;border-color:#f44336}.pm-clear-btn:disabled{opacity:.5;cursor:not-allowed}.ac-entry-container{box-sizing:border-box;flex-direction:column;justify-content:flex-start;align-items:center;gap:16px;width:100%;height:100%;padding:8px 16px 16px;display:flex}.ac-entry-header{text-align:center;width:100%}.ac-entry-visual{justify-content:center;gap:16px;margin-bottom:16px;display:flex}.ac-entry-emoji{font-size:64px;animation:3s ease-in-out infinite float}.ac-entry-emoji:nth-child(2){animation-delay:.5s}.ac-entry-subtitle{color:#666;margin:0;font-size:18px}.ac-character-selection{text-align:center;margin-bottom:16px}.ac-section-title{color:#444;margin-top:0;margin-bottom:12px;font-size:clamp(18px,4vw,24px)}.ac-character-options{justify-content:center;gap:20px;display:flex}.ac-character-card{cursor:pointer;background:#fff;border:3px solid #eee;border-radius:16px;flex-direction:column;align-items:center;gap:8px;width:140px;padding:16px;transition:all .2s;display:flex}.ac-character-card.selected{background:#e0f7fa;border-color:#4dd0e1;transform:scale(1.05);box-shadow:0 4px 12px #4dd0e14d}.ac-character-img{object-fit:contain;width:80px;height:80px}.ac-character-name{color:#555;font-size:clamp(14px,3vw,18px);font-weight:700}.ac-adventure-section{text-align:center;margin-bottom:24px}.ac-adventure-buttons{justify-content:center;gap:16px;margin-top:12px;display:flex}.ac-adventure-btn{color:#fff;cursor:pointer;border:none;border-radius:16px;padding:16px 24px;font-size:1.2rem;font-weight:700;transition:transform .2s;box-shadow:0 4px 6px #0000001a}.ac-adventure-btn:active{transform:scale(.95)}.ac-adventure-btn.daily{background:linear-gradient(135deg,#ff6b6b,#ff8e53)}.ac-adventure-btn.normal{background:linear-gradient(135deg,#4facfe,#00f2fe)}.ac-difficulty-selector{background:#f0f0f0;border-radius:12px;justify-content:center;gap:8px;width:fit-content;margin-bottom:20px;margin-left:auto;margin-right:auto;padding:4px;display:flex}.ac-diff-btn{color:#666;cursor:pointer;background:0 0;border:none;border-radius:8px;padding:8px 16px;font-weight:700;transition:all .2s}.ac-diff-btn.selected{color:#333;background:#fff;box-shadow:0 2px 4px #0000001a}.ac-free-play-section{margin-top:32px}.ac-mode-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;width:100%;max-width:900px;display:grid}.ac-mode-card{cursor:pointer;text-align:center;background:#fff;border:3px solid #4dd0e1;border-radius:16px;flex-direction:column;gap:8px;padding:20px;transition:all .3s;display:flex}.ac-mode-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px #00000026}.ac-mode-card:active{transform:translateY(-2px)}.ac-mode-number{color:#00acc1;font-size:14px;font-weight:600}.ac-mode-name{color:#00695c;font-size:18px;font-weight:700}.ac-mode-desc{color:#757575;font-size:14px;line-height:1.4}.ac-mode-info{color:#9e9e9e;margin-top:4px;font-size:12px}.ac-mode-1{border-color:#4caf50}.ac-mode-1 .ac-mode-number{color:#4caf50}.ac-mode-1 .ac-mode-name{color:#2e7d32}.ac-mode-2{border-color:#2196f3}.ac-mode-2 .ac-mode-number{color:#2196f3}.ac-mode-2 .ac-mode-name{color:#1565c0}.ac-mode-3{border-color:#ff9800}.ac-mode-3 .ac-mode-number{color:#ff9800}.ac-mode-3 .ac-mode-name{color:#e65100}.ac-mode-4{border-color:#f44336}.ac-mode-4 .ac-mode-number{color:#f44336}.ac-mode-4 .ac-mode-name{color:#c62828}.ac-selection-section{text-align:center;width:100%;max-width:800px;margin-bottom:24px}.ac-game-type-buttons{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.ac-game-type-btn{color:#666;cursor:pointer;background:#fff;border:3px solid #e0e0e0;border-radius:16px;min-width:140px;padding:16px 24px;font-size:18px;font-weight:700;transition:all .2s}.ac-game-type-btn.selected{color:#00838f;background:#e0f7fa;border-color:#4dd0e1;transform:scale(1.05);box-shadow:0 4px 12px #4dd0e14d}.ac-game-type-btn:hover:not(.selected){background:#f5f5f5;border-color:#bdbdbd}.ac-mode-buttons{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.ac-control-mode-btn{cursor:pointer;text-align:center;background:#fff;border:3px solid #e0e0e0;border-radius:16px;flex-direction:column;gap:6px;min-width:200px;max-width:240px;padding:16px;transition:all .2s;display:flex}.ac-control-mode-btn.selected{background:#e8f5e9;border-color:#4caf50;transform:translateY(-4px);box-shadow:0 6px 16px #4caf504d}.ac-control-mode-btn:hover:not(.selected){border-color:#bdbdbd;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.ac-control-mode-btn .ac-mode-number{color:#4caf50;font-size:14px;font-weight:600}.ac-control-mode-btn .ac-mode-name{color:#2e7d32;font-size:16px;font-weight:700}.ac-control-mode-btn .ac-mode-desc{color:#757575;font-size:13px;line-height:1.3}.ac-difficulty-buttons{justify-content:center;gap:12px;display:flex}.ac-difficulty-buttons .ac-diff-btn{color:#666;cursor:pointer;background:#fff;border:3px solid #e0e0e0;border-radius:12px;min-width:100px;padding:12px 32px;font-size:16px;font-weight:700;transition:all .2s}.ac-difficulty-buttons .ac-diff-btn.selected{color:#e65100;background:#fff3e0;border-color:#ff9800;transform:scale(1.05);box-shadow:0 4px 12px #ff98004d}.ac-difficulty-buttons .ac-diff-btn:hover:not(.selected){background:#f5f5f5;border-color:#bdbdbd}.ac-start-section{width:100%;max-width:400px;margin-top:32px}.ac-start-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#4dd0e1 0%,#00bcd4 100%);border:none;border-radius:16px;width:100%;padding:20px 40px;font-size:24px;font-weight:700;transition:all .2s;box-shadow:0 6px 20px #4dd0e166}.ac-start-btn:hover{transform:translateY(-3px);box-shadow:0 8px 24px #4dd0e180}.ac-start-btn:active{transform:translateY(0);box-shadow:0 4px 16px #4dd0e166}@media (max-width:768px){.ac-entry-container{justify-content:flex-start;gap:12px;padding:8px}.ac-entry-header{margin-top:0}.ac-entry-visual{gap:12px;margin-bottom:8px}.ac-entry-emoji{font-size:36px}.ac-entry-subtitle{font-size:15px}.ac-character-selection{margin-bottom:12px}.ac-section-title{margin-bottom:10px;font-size:16px}.ac-character-options{gap:12px}.ac-character-card{width:110px;padding:12px}.ac-character-img{width:60px;height:60px}.ac-character-name{font-size:14px}.ac-mode-grid{grid-template-columns:1fr;gap:10px;max-width:100%}.ac-mode-card{border-width:2px;border-radius:12px;gap:4px;padding:12px}.ac-mode-number{font-size:12px}.ac-mode-name{font-size:16px}.ac-mode-desc{font-size:13px;line-height:1.3}.ac-mode-info{margin-top:2px;font-size:11px}}@media (min-width:768px) and (max-width:1024px) and (orientation:portrait){.ac-entry-container{gap:20px;padding:12px 20px 20px}.ac-section-title{font-size:22px}.ac-character-card{width:160px;padding:20px}.ac-character-img{width:100px;height:100px}.ac-character-name{font-size:18px}.ac-mode-grid{grid-template-columns:repeat(2,1fr);gap:16px}}@media (min-width:768px) and (orientation:landscape){.ac-entry-container{gap:24px;padding:16px 24px 24px}.ac-section-title{font-size:24px}.ac-character-options{gap:32px}.ac-character-card{width:180px;padding:24px}.ac-character-img{width:120px;height:120px}.ac-character-name{font-size:20px}.ac-mode-grid{grid-template-columns:repeat(2,1fr);gap:20px}}.ac-mode-switcher-btn{color:#666;cursor:pointer;white-space:nowrap;background:#fff;border:2px solid #e0e0e0;border-radius:8px;padding:8px 16px;font-size:14px;font-weight:600;transition:all .2s}.ac-mode-switcher-btn:hover{background:#f5f5f5;border-color:#bdbdbd}.ac-mode-switcher-btn:active{transform:scale(.98)}.ac-game-layout{box-sizing:border-box;gap:16px;width:100%;height:100%;padding:8px;display:flex;overflow:hidden}.ac-left-panel{flex-direction:column;flex:1;justify-content:center;align-items:center;min-width:0;display:flex;overflow:hidden}.ac-right-panel{flex-direction:column;flex:none;width:280px;min-width:0;display:flex;overflow:hidden}.ac-command-section{flex-direction:column;gap:8px;height:100%;display:flex;overflow:hidden}.ac-sequence-wrapper{flex-direction:column;flex:1;gap:8px;min-height:0;display:flex;overflow:hidden}.ac-grid-container{aspect-ratio:1;background:#fff;border:3px solid #4dd0e1;border-radius:12px;gap:4px;width:90vw;max-width:350px;padding:4px;display:grid;box-shadow:0 4px 12px #0000001a}.ac-grid-cell{aspect-ratio:1;background:#f5f5f5;border-radius:8px;justify-content:center;align-items:center;min-width:36px;min-height:36px;display:flex;position:relative}.ac-grid-item{font-size:24px;transition:transform .3s}.ac-player{transform-origin:50%}.ac-player-win{animation:.6s ease-in-out infinite bounce;z-index:9999!important}.ac-player-lost{animation:.5s ease-in-out shake}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}.ac-tutorial-bubble{color:#e65100;text-align:center;background:#fff3e0;border:2px solid #ffb74d;border-radius:12px;margin-top:8px;padding:8px 12px;font-size:14px;font-weight:600}.ac-win-modal{z-index:1000;background:#000000b3;justify-content:center;align-items:center;animation:.3s ease-out fade-in;display:flex;position:fixed;inset:0}.ac-win-content{text-align:center;background:#fff;border-radius:24px;width:90%;max-width:400px;padding:32px;box-shadow:0 8px 32px #0003}.ac-win-content h2{color:#333;margin:0 0 16px;font-size:32px}.ac-win-content p{color:#666;margin:0 0 24px;font-size:18px}.ac-win-actions{flex-direction:column;gap:12px;display:flex}.ac-btn-primary,.ac-btn-secondary{cursor:pointer;border:none;border-radius:12px;padding:16px 24px;font-size:18px;font-weight:700;transition:transform .2s,box-shadow .2s}.ac-btn-primary{color:#fff;background:linear-gradient(135deg,#4dd0e1 0%,#00bcd4 100%);box-shadow:0 4px 12px #4dd0e166}.ac-btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px #4dd0e180}.ac-btn-primary:active{transform:translateY(0)}.ac-btn-secondary{color:#666;background:#f5f5f5;box-shadow:0 2px 8px #0000001a}.ac-btn-secondary:hover{background:#e0e0e0}.ac-btn-secondary:active{transform:scale(.98)}.ac-celebration-content{z-index:2000;background:0 0;flex-direction:column;align-items:center;gap:24px;max-width:90vw;max-height:90vh;display:flex;position:relative}.ac-celebration-img{border-radius:24px;width:100%;max-width:800px;height:auto;animation:.6s ease-out celebration-zoom;box-shadow:0 8px 32px #0000004d}.ac-celebration-actions{gap:16px;display:flex}.ac-celebration-actions .ac-btn-primary{padding:16px 48px;font-size:20px}@keyframes celebration-zoom{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.ac-hidden{display:none!important}.ac-win-menu{box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:16px;width:100%;height:100%;padding:16px;animation:.5s ease-out fade-in;display:flex}.ac-win-btn{cursor:pointer;text-transform:uppercase;border:none;border-radius:16px;justify-content:center;align-items:center;gap:12px;width:100%;height:80px;font-size:24px;font-weight:800;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 4px 8px #0000001a}.ac-win-btn:active{transform:scale(.95)}.ac-win-btn-next{color:#fff;background:linear-gradient(135deg,#4dd0e1 0%,#00bcd4 100%);border-bottom:6px solid #0097a7}.ac-win-btn-mode{color:#fff;background:linear-gradient(135deg,#ffb74d 0%,#ff9800 100%);border-bottom:6px solid #f57c00}@keyframes fade-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (orientation:portrait) and (max-width:768px){.ac-game-layout{flex-direction:column;gap:8px;height:100%;padding:8px;overflow:hidden}.ac-left-panel{z-index:10;flex:none;justify-content:center;width:100%;height:auto;display:flex;overflow:visible}.ac-right-panel{flex:1;width:100%;max-width:none;overflow:hidden auto}.ac-grid-item{font-size:40px!important}.ac-player-img{width:120px!important;height:120px!important}}.ac-sequence-container{flex:none;width:90vw;max-width:350px;height:auto;min-height:80px;margin:0 auto}.ac-sequence-list{flex-direction:row;justify-content:flex-start;gap:4px;padding:4px;display:flex;overflow:auto hidden}.dc-buttons{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.ac-palette{box-sizing:border-box!important;grid-template-columns:repeat(4,1fr)!important;gap:4px!important;width:85vw!important;max-width:350px!important;margin:0 auto!important;padding:8px!important;display:grid!important}.ac-command-btn{aspect-ratio:1!important;width:100%!important;height:auto!important}.ac-tutorial-bubble{margin-top:4px;padding:4px 8px;font-size:12px}@media (orientation:landscape) and (max-height:500px){.ac-game-layout{flex-direction:row;justify-content:center;align-items:center;gap:12px;height:100%;padding:4px 16px}.ac-left-panel{flex:none;justify-content:center;align-items:center;width:auto;max-width:45vw;display:flex}.ac-right-panel{flex-direction:column;flex:1;justify-content:center;gap:8px;width:auto;min-width:0;max-width:40vw;display:flex}.ac-right-panel.ac-mode-direct{justify-content:flex-start;max-width:35vw}.ac-grid-container{gap:2px;width:75vh;max-width:none;height:75vh;padding:4px}.ac-grid-cell{min-width:0;min-height:0}.ac-grid-item{font-size:clamp(16px,6vh,32px)}.ac-command-section{gap:8px;height:auto;max-height:100%;overflow-y:auto}.ac-palette{grid-template-columns:repeat(2,1fr);gap:8px;width:100%;display:grid}.ac-sequence-container{flex-direction:column;height:auto;max-height:50vh;display:flex}.ac-sequence-list{flex-wrap:wrap;grid-template-columns:repeat(5,1fr);gap:4px;min-height:0;display:grid;overflow-x:hidden}.ac-seq-slot{aspect-ratio:1;width:100%;height:auto}.dc-buttons{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.ac-controls{flex-shrink:0;margin-top:4px}.ac-tutorial-bubble{margin-top:2px;padding:2px 6px;font-size:11px}}@media (orientation:portrait) and (min-width:769px) and (max-width:1024px){.ac-game-layout{flex-direction:column;gap:16px;height:100%;padding:16px;overflow:hidden}.ac-left-panel{z-index:10;flex:none;justify-content:center;align-items:center;width:100%;height:auto;display:flex;overflow:visible}.ac-map-section{justify-content:center;align-items:center;width:100%;display:flex}.ac-right-panel{flex:1;width:100%;max-width:none;overflow:hidden auto}.ac-right-panel.ac-mode-direct{flex:none;height:auto;max-height:40vh}.ac-grid-container{aspect-ratio:1;width:80vw;max-width:600px;height:auto;padding:8px}.ac-grid-cell{min-width:40px;min-height:40px}.ac-grid-item{font-size:32px}.ac-player-img{width:150px!important;height:150px!important}.ac-palette{grid-template-columns:repeat(4,1fr);gap:12px;width:80vw;max-width:600px;margin:0 auto;padding:4px;display:grid;overflow:visible}.ac-sequence-container{flex:none;width:80vw;max-width:600px;height:auto;min-height:150px;margin:0 auto}.ac-sequence-list{flex-direction:row;justify-content:flex-start;gap:8px;padding:8px;display:flex;overflow:auto hidden}.ac-controls{grid-template-columns:1fr 1fr;gap:20px;width:80vw;max-width:600px;margin:0 auto;padding-bottom:30px;display:grid}.ac-control-btn{height:80px;font-size:24px}.dc-buttons{grid-template-columns:repeat(2,1fr);gap:16px}}@media (min-width:768px) and (orientation:landscape){.ac-game-layout{flex-direction:row;justify-content:center;align-items:center;gap:32px;height:100%;padding:24px}.ac-left-panel{flex:none;justify-content:center;align-items:center;height:100%;display:flex}.ac-right-panel{flex-direction:column;flex:0 0 340px;justify-content:center;gap:12px;width:340px;height:100%;display:flex;overflow-y:auto}.ac-right-panel.ac-mode-direct{background:#f5f5f5;border-radius:24px;flex:0 0 400px;width:400px;height:auto;max-height:85vh;padding:24px;box-shadow:0 4px 12px #0000001a}.ac-grid-container{aspect-ratio:1!important;gap:2px!important;width:min(70vh,60vw)!important;max-width:none!important;height:min(70vh,60vw)!important;max-height:none!important;padding:8px!important}.ac-player-img{width:150px!important;height:150px!important}.ac-palette{background:0 0!important;border:none!important;grid-template-columns:repeat(2,1fr)!important;gap:16px!important;width:100%!important;margin-bottom:16px!important;padding:0!important;display:grid!important}.ac-command-btn{aspect-ratio:auto!important;height:150px!important}.ac-sequence-container{background:#f5f5f5!important;border:2px solid #e0e0e0!important;border-radius:16px!important;flex-direction:column!important;height:auto!important;min-height:150px!important;margin-bottom:16px!important;padding:16px!important;display:flex!important}.ac-sequence-list{grid-template-columns:repeat(5,1fr)!important;gap:8px!important;min-height:0!important;display:grid!important}.ac-seq-slot{aspect-ratio:1!important;width:100%!important;height:auto!important}.ac-controls{grid-template-columns:1fr 1fr!important;gap:16px!important;width:100%!important;display:grid!important}.ac-control-btn{height:60px!important;font-size:20px!important}.dc-buttons{grid-template-columns:repeat(2,1fr);gap:20px;width:100%;display:grid}.dc-buttons .ac-control-btn{border-radius:24px;flex-direction:column;gap:8px;height:120px;font-size:32px;display:flex}.ac-command-section,.ac-sequence-wrapper{gap:12px}}@media (min-width:1024px) and (max-height:800px) and (orientation:landscape){.ac-entry-container{gap:16px;padding:16px}.ac-entry-visual{margin-bottom:12px}.ac-entry-emoji{font-size:56px}.ac-mode-grid{gap:12px;max-width:700px}.ac-mode-card{padding:16px}}.ac-grid-container{aspect-ratio:1;box-sizing:border-box;background:#e0f7fa;border:4px solid #4dd0e1;border-radius:16px;gap:4px;width:100%;max-width:500px;padding:8px;display:grid}.ac-grid-container.shake{animation:.5s ease-in-out grid-shake}@keyframes grid-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-8px)}20%,40%,60%,80%{transform:translate(8px)}}.ac-grid-cell{background:#fff;border-radius:8px;justify-content:center;align-items:center;display:flex;position:relative;box-shadow:inset 0 2px 4px #0000000d}.ac-grid-item{font-size:clamp(24px,5vw,48px);transition:transform .3s;position:absolute;background:0 0!important}.ac-player-img{object-fit:contain;width:clamp(40px,14vmin,140px);height:clamp(40px,14vmin,140px);image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;background:0 0!important}@media (min-width:768px) and (max-width:1366px) and (orientation:landscape){.ac-player-img{width:clamp(40px,12vmin,120px);height:clamp(40px,12vmin,120px)}}.ac-player{z-index:10;transition:transform .3s,left .3s,top .3s;background:0 0!important}.ac-player-win{z-index:100;animation:.5s cubic-bezier(.175,.885,.32,1.275) forwards win-scale!important}@keyframes win-scale{0%{transform:scale(1)}to{transform:scale(2)}}.ac-player-collision{animation:.5s ease-in-out collision-flash}@keyframes collision-flash{0%,to{filter:drop-shadow(0 0 red)}50%{filter:drop-shadow(0 0 10px red)}}@keyframes ac-win-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}@keyframes ac-lost-shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.ac-jump-right{z-index:10;animation:1s ease-in-out forwards jump-right}.ac-jump-left{z-index:10;animation:1s ease-in-out forwards jump-left}.ac-jump-up{z-index:10;animation:1s ease-in-out forwards jump-up}.ac-jump-down{z-index:10;animation:1s ease-in-out forwards jump-down}@keyframes jump-right{0%{transform:translate(0)scale(1)}25%{transform:translate(25%,-25%)scale(1.1)}50%{transform:translate(50%,-35%)scale(1.15)}75%{transform:translate(75%,-15%)scale(1.1)}90%{transform:translate(100%)scale(1.05)}95%{transform:translate(100%,-3%)scale(1.02)}to{transform:translate(100%)scale(1)}}@keyframes jump-left{0%{transform:translate(0)scale(1)}25%{transform:translate(-25%,-25%)scale(1.1)}50%{transform:translate(-50%,-35%)scale(1.15)}75%{transform:translate(-75%,-15%)scale(1.1)}90%{transform:translate(-100%)scale(1.05)}95%{transform:translate(-100%,-3%)scale(1.02)}to{transform:translate(-100%)scale(1)}}@keyframes jump-down{0%{transform:translate(0)scale(1)}25%{transform:translateY(25%)scale(1.1)}50%{transform:translateY(50%)scale(1.15)}75%{transform:translateY(75%)scale(1.1)}90%{transform:translateY(100%)scale(1.05)}95%{transform:translateY(100%)scale(1.02)}to{transform:translateY(100%)scale(1)}}@keyframes jump-up{0%{transform:translate(0)scale(1)}25%{transform:translateY(-25%)scale(1.1)}50%{transform:translateY(-50%)scale(1.15)}75%{transform:translateY(-75%)scale(1.1)}90%{transform:translateY(-100%)scale(1.05)}95%{transform:translateY(-100%)scale(1.02)}to{transform:translateY(-100%)scale(1)}}.dc-panel{box-sizing:border-box;background:#e8f5e9;border:2px solid #81c784;border-radius:16px;flex-direction:column;gap:8px;height:100%;padding:8px;display:flex}.dc-title{color:#2e7d32;text-align:center;margin-bottom:12px;font-size:16px;font-weight:700}.dc-buttons .dc-btn{cursor:pointer;background:#fff;border:none;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:60px;padding:8px;transition:all .2s;display:flex;position:relative;box-shadow:0 4px #e0e0e0}.dc-btn:active:not(:disabled){transform:scale(.95);box-shadow:0 1px 3px #00000026}.dc-btn:disabled{opacity:.5;cursor:not-allowed}.dc-btn-icon{color:#fff;background:linear-gradient(135deg,#fff,#fff);border-radius:12px;justify-content:center;align-items:center;width:56px;height:56px;font-size:32px;display:flex;box-shadow:0 2px 4px #0003}.dc-btn-label{color:#424242;text-align:center;width:100%;font-size:24px;font-weight:800}.dc-btn-forward{border-left:6px solid #4caf50}.dc-btn-left,.dc-btn-right{border-left:6px solid #2196f3}.ac-palette{box-sizing:border-box;background:#fff3e0;border:2px solid #ffe0b2;border-radius:12px;grid-template-columns:repeat(4,1fr);gap:8px;width:100%;padding:8px;display:grid}.ac-command-btn{cursor:pointer;aspect-ratio:1;background:#fff;border:none;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:100%;padding:8px;transition:all .2s;display:flex;box-shadow:0 2px 4px #0000001a}.ac-command-btn:active:not(:disabled){transform:scale(.95)}.ac-command-btn:disabled{opacity:.5;cursor:not-allowed}.ac-cmd-icon{font-size:40px}.ac-cmd-label{color:#5d4037;font-size:16px;font-weight:600}@media (orientation:portrait) and (min-width:769px) and (max-width:1024px){.ac-cmd-icon{font-size:48px}.ac-cmd-label{font-size:18px}}.ac-btn-forward{border-left:4px solid #4caf50}.ac-btn-left,.ac-btn-right{border-left:4px solid #2196f3}.ac-btn-jump{border-left:4px solid #ff9800}.ac-sequence-container{box-sizing:border-box;background:#f5f5f5;border:2px solid #e0e0e0;border-radius:16px;width:100%;padding:12px}.ac-sequence-label{color:#757575;margin-bottom:8px;font-size:14px;font-weight:600}.ac-sequence-list{min-height:60px;padding-bottom:4px}.ac-seq-slot{cursor:pointer;background:#e0e0e0;border:2px solid #0000;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:50px;height:50px;transition:all .2s;display:flex}.ac-slot-empty{background:#eee;border:2px dashed #bdbdbd}.ac-slot-active{background:#fff3e0;border-color:#ff9800;transform:scale(1.1);box-shadow:0 4px 8px #ff98004d}.ac-seq-icon{font-size:32px}.ac-slot-number{color:#9e9e9e;font-size:20px;font-weight:600}@media (orientation:portrait) and (min-width:769px) and (max-width:1024px){.ac-sequence-label{font-size:18px}.ac-seq-slot{width:60px;height:60px}.ac-seq-icon{font-size:40px}.ac-slot-number{font-size:24px}}.ac-controls{flex:1;grid-template-columns:1fr 1fr;align-items:end;gap:12px;width:80vw;max-width:350px;margin:0 auto;padding-bottom:20px;display:grid}.ac-control-btn{color:#fff;cursor:pointer;border:none;border-radius:16px;justify-content:center;align-items:center;gap:8px;width:100%;height:60px;padding:12px;font-size:20px;font-weight:700;transition:all .2s;display:flex;box-shadow:0 4px #0003}.ac-control-btn:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px #0003}.ac-control-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.ac-control-icon{font-size:28px}.ac-btn-start{background:#4caf50}.ac-btn-stop{background:#f44336}.ac-btn-reset{background:#2196f3}.cg-entry-container{flex-direction:column;justify-content:flex-start;align-items:center;gap:24px;height:100%;padding:20px;display:flex}.cg-entry-title{color:#333;text-align:center;margin-bottom:0;font-size:2rem}.cg-entry-options{grid-template-columns:repeat(2,1fr);justify-content:center;gap:40px;max-width:600px;display:grid}.cg-entry-btn{color:#fff;cursor:pointer;border:none;border-radius:30px;flex-direction:column;justify-content:center;align-items:center;width:280px;height:280px;transition:transform .2s;display:flex;position:relative;overflow:hidden}.cg-entry-btn:hover{transform:scale(1.05)}.cg-entry-btn--free{background-color:#4caf50;box-shadow:0 8px 20px #4caf504d}.cg-entry-btn--learning{background-color:#2196f3;box-shadow:0 8px 20px #2196f34d}.cg-entry-btn--disabled{box-shadow:none;cursor:not-allowed;opacity:.7;background-color:#bdbdbd}.cg-entry-btn--disabled:hover{transform:none}.cg-entry-icon{margin-bottom:10px;font-size:5rem}.cg-entry-label{font-size:2rem;font-weight:700}.cg-entry-sublabel{opacity:.9;margin-top:8px;font-size:1.2rem}.cg-header-controls{align-items:center;gap:12px;display:flex}.cg-mode-switch-btn{color:#666;cursor:pointer;white-space:nowrap;background-color:#fff;border:2px solid #666;border-radius:20px;padding:8px 16px;font-size:14px;font-weight:700;transition:all .2s}.cg-mode-switch-btn:hover{background-color:#f0f0f0}.cg-game-layout{box-sizing:border-box;background-color:#f0f0f0;gap:16px;width:100%;height:100%;padding:16px;display:flex;overflow:hidden}.cg-canvas-area{flex:1;justify-content:center;align-items:center;min-width:0;height:100%;display:flex}.cg-canvas-container{background-color:#fff;border-radius:20px;width:100%;height:100%;position:relative;overflow:hidden;box-shadow:0 4px 12px #0000001a}.cg-canvas-wrapper{background-color:#fff;border:4px solid #e0e0e0;border-radius:20px;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.cg-canvas-layer{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cg-canvas-image{pointer-events:none;-webkit-user-select:none;user-select:none;z-index:20;object-fit:contain;mix-blend-mode:multiply}.cg-canvas-drawing{touch-action:none;z-index:10;cursor:crosshair}.cg-toolbar{box-sizing:border-box;background:linear-gradient(#fff8e1,#ffe082);border:2px solid #ffd54f;border-radius:24px;flex-direction:column;align-items:center;gap:8px;width:14%;min-width:80px;max-width:140px;padding:12px 8px;display:flex;box-shadow:inset 0 2px 4px #fffc,inset 0 -2px 4px #0000001a,0 4px 12px #00000026}.cg-toolbar-row{justify-content:center;gap:8px;width:100%;margin-bottom:4px;display:flex}.cg-toolbar-bottom{margin-top:auto}.cg-btn-small{width:48%}@media (max-width:1023px),(orientation:portrait){.cg-toolbar-row{flex-direction:column;gap:8px}.cg-btn-small{width:100%}}.cg-tool-btn{aspect-ratio:1;cursor:pointer;border:none;border-radius:16px;justify-content:center;align-items:center;width:100%;padding:0;transition:all .1s;display:flex;position:relative;box-shadow:0 4px #0003,0 6px 6px #0000001a,inset 0 2px #fff6}.cg-tool-btn:active,.cg-tool-btn.active{transform:translateY(4px);box-shadow:0 0 #0003,inset 0 2px 4px #0003}.cg-btn-img{box-shadow:none;background:0 0;border-radius:0}.cg-btn-img img{object-fit:contain;filter:drop-shadow(0 4px 4px #0003);width:100%;height:100%;transition:transform .1s}.cg-btn-img:active,.cg-btn-img.active{box-shadow:none;transform:none}.cg-btn-img:active img,.cg-btn-img.active img{filter:drop-shadow(0 1px 1px #0003);transform:scale(.95)translateY(4px)}.cg-btn-small{border-radius:12px;width:48%}@media (max-height:700px){.cg-toolbar{gap:4px;padding:8px 4px}.cg-tool-btn{border-radius:12px}.cg-btn-icon{font-size:1.5rem}.cg-btn-small .cg-btn-icon{font-size:1.2rem}}.cg-palette-popover{z-index:100;background-color:#e3f2fd;border:4px solid #bbdefb;border-radius:16px;grid-template-columns:repeat(2,1fr);gap:12px;width:160px;padding:16px;display:grid;position:absolute;top:50%;right:110%;transform:translateY(-50%);box-shadow:0 4px 12px #0003}.cg-palette-color{cursor:pointer;border:3px solid #0000001a;border-radius:10px;width:55px;height:55px;transition:transform .1s}.cg-palette-color:hover{transform:scale(1.1)}.cg-palette-color.selected{border:4px solid #fff;transform:scale(1.1);box-shadow:0 0 0 3px #2196f3}.cg-palette-arrow{border-top:12px solid #0000;border-bottom:12px solid #0000;border-left:12px solid #bbdefb;width:0;height:0;position:absolute;top:50%;right:-12px;transform:translateY(-50%)}.cg-slider-popover{z-index:100;background-color:#e3f2fd;border:4px solid #bbdefb;border-radius:16px;justify-content:center;align-items:center;width:60px;height:200px;padding:16px 12px;display:flex;position:absolute;top:50%;right:110%;transform:translateY(-50%);box-shadow:0 4px 12px #0003}.cg-vertical-range{writing-mode:vertical-lr;direction:rtl;background:0 0;outline:none;width:12px;height:100%;padding:0 5px}@media (min-width:1024px) and (orientation:landscape){.cg-header-controls{align-items:center;height:100%}}.cg-image-selector-overlay{z-index:1000;background-color:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.cg-image-selector-modal{z-index:1001;background:linear-gradient(#fff8e1,#ffe082);border:4px solid #ffd54f;border-radius:24px;flex-direction:column;width:90%;max-width:900px;max-height:80vh;padding:24px;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 8px 24px #0000004d}.cg-image-selector-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;display:flex}.cg-image-selector-title{color:#333;flex:1;margin:0;font-size:1.5rem;font-weight:700}.cg-image-selector-sync{color:#fff;cursor:pointer;white-space:nowrap;background:linear-gradient(#64b5f6,#1e88e5);border:2px solid #1565c0;border-radius:12px;padding:8px 16px;font-size:.9rem;font-weight:700;transition:all .2s;box-shadow:0 2px #0003}.cg-image-selector-sync:hover{background:linear-gradient(#42a5f5,#1976d2);transform:translateY(-2px);box-shadow:0 4px #0003}.cg-image-selector-sync:active{transform:translateY(1px);box-shadow:0 1px #0003}.cg-image-grid-container{flex:1;margin-bottom:20px;padding-right:8px;overflow-y:auto}.cg-image-grid-container::-webkit-scrollbar{width:8px}.cg-image-grid-container::-webkit-scrollbar-track{background:#0000001a;border-radius:4px}.cg-image-grid-container::-webkit-scrollbar-thumb{background:#ffd54f;border-radius:4px}.cg-image-grid-container::-webkit-scrollbar-thumb:hover{background:#ffc107}.cg-image-grid{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.cg-image-item{cursor:pointer;background-color:#fff;border:3px solid #e0e0e0;border-radius:12px;flex-direction:column;align-items:center;padding:8px;transition:all .2s;display:flex}.cg-image-item:hover{border-color:#2196f3;transform:scale(1.05);box-shadow:0 4px 12px #2196f34d}.cg-image-item.selected{background-color:#e8f5e9;border-width:4px;border-color:#4caf50;box-shadow:0 0 0 3px #4caf504d}.cg-image-thumbnail{aspect-ratio:1;background-color:#f5f5f5;border-radius:8px;justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.cg-image-thumbnail img{object-fit:contain;width:100%;height:100%}.cg-image-name{color:#333;text-align:center;word-break:break-word;margin-top:8px;font-size:.85rem;font-weight:700;line-height:1.2}.cg-image-selector-close{color:#fff;cursor:pointer;background:linear-gradient(#f48fb1,#ec407a);border:2px solid #d81b60;border-radius:12px;flex-shrink:0;width:100%;padding:12px;font-size:1.1rem;font-weight:700;transition:all .2s;box-shadow:0 4px #0003}.cg-image-selector-close:hover{transform:translateY(-2px);box-shadow:0 6px #0003}.cg-image-selector-close:active{transform:translateY(2px);box-shadow:0 2px #0003}.cg-slots-grid{grid-template-columns:repeat(2,1fr);gap:24px;padding:20px;display:grid}.cg-save-slot{aspect-ratio:4/3;cursor:pointer;background-color:#fff;border:4px solid #e0e0e0;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;transition:all .2s;display:flex;position:relative;overflow:hidden}.cg-save-slot:hover{border-color:#2196f3;box-shadow:0 4px 12px #2196f34d}.cg-save-slot.empty{background-color:#f5f5f5;border-style:dashed}.cg-slot-preview{object-fit:cover;width:100%;height:100%;position:absolute;top:0;left:0}.cg-slot-info{color:#fff;text-align:center;background:#0009;padding:4px 8px;font-size:.8rem;position:absolute;top:0;left:0;right:0}.cg-slot-actions{opacity:0;background:linear-gradient(#0000,#000c);justify-content:center;gap:8px;padding:12px;transition:opacity .2s;display:flex;position:absolute;bottom:0;left:0;right:0}.cg-save-slot:hover .cg-slot-actions{opacity:1}.cg-slot-empty-content{flex-direction:column;align-items:center;gap:12px;display:flex}.cg-slot-empty-text{color:#999;font-size:1.2rem;font-weight:700}.cg-slot-btn{cursor:pointer;border:none;border-radius:20px;padding:8px 16px;font-weight:700;transition:transform .1s;box-shadow:0 2px 4px #0003}.cg-slot-btn:hover{transform:scale(1.05)}.cg-slot-btn:active{transform:scale(.95)}.cg-slot-btn.save{color:#fff;background-color:#4caf50}.cg-slot-btn.load{color:#fff;background-color:#2196f3}.cg-slot-btn.delete{color:#fff;background-color:#f44336}.cg-slot-btn:disabled{opacity:.5;cursor:not-allowed}.cl-game-container{box-sizing:border-box;flex-direction:column;gap:24px;height:100%;padding:20px;display:flex}.cl-submode-nav{background:#fffc;border-radius:50px;justify-content:center;gap:16px;width:fit-content;margin:0 auto;padding:8px;display:flex;box-shadow:0 4px 12px #0000000d}.cl-nav-btn{color:#666;cursor:pointer;background:0 0;border:none;border-radius:40px;align-items:center;gap:8px;padding:12px 24px;font-size:1.1rem;font-weight:700;transition:all .2s;display:flex}.cl-nav-btn:hover{color:#333;background:#0000000d}.cl-nav-btn.active{color:#fff;background:#4caf50;box-shadow:0 4px 8px #4caf504d}.cl-nav-icon{font-size:1.4rem}.cl-content-area{background:#fff;border-radius:24px;flex:1;justify-content:center;padding:24px;display:flex;overflow-y:auto;box-shadow:0 8px 24px #0000000d}.cl-names-container{width:100%;max-width:1000px}.cl-names-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));place-items:start center;gap:32px;padding:20px;display:grid}.cl-names-chip{flex-direction:column;align-items:center;display:flex}.cl-names-chip.active .color-chip-circle{transform:scale(1.1);box-shadow:0 8px 24px #0003!important}.cl-teaching-container{text-align:center}.cl-sorting-game{flex-direction:column;gap:24px;width:100%;max-width:900px;display:flex}.cl-game-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.cl-back-btn{cursor:pointer;color:#555;background:#fff;border:1px solid #ddd;border-radius:20px;padding:8px 16px;font-size:1rem}.cl-game-instruction{color:#333;font-size:1.5rem;font-weight:700}.cl-game-menu{flex-direction:column;align-items:center;gap:32px;padding-top:40px;display:flex}.cl-game-menu h3{color:#333;margin:0;font-size:2rem}.cl-game-options{flex-wrap:wrap;justify-content:center;gap:24px;display:flex}.cl-game-opt-btn{cursor:pointer;background:#fff;border:2px solid #eee;border-radius:24px;flex-direction:column;align-items:center;gap:16px;min-width:160px;padding:32px;transition:all .2s;display:flex}.cl-game-opt-btn:hover{border-color:#4caf50;transform:translateY(-4px);box-shadow:0 8px 24px #0000001a}.cl-opt-icon{font-size:3rem}.cl-slots-container{background:#f5f5f5;border-radius:20px;flex-wrap:wrap;justify-content:center;gap:16px;min-height:140px;padding:20px;display:flex}.cl-slot{cursor:pointer;background:#fff;border:3px dashed #ccc;border-radius:50%;justify-content:center;align-items:center;width:100px;height:100px;transition:all .2s;display:flex}.cl-slot.empty:hover{background:#e8f5e9;border-color:#4caf50}.cl-slot-placeholder{color:#ddd;font-size:2rem;font-weight:700}.cl-pool-container{flex-wrap:wrap;justify-content:center;gap:20px;min-height:120px;padding:20px;display:flex}.cl-pool-item{border-radius:50%;padding:8px;transition:all .2s}.cl-pool-item.selected{background:#e3f2fd;transform:scale(1.1);box-shadow:0 0 0 2px #2196f3}.cl-game-success{flex-direction:column;align-items:center;gap:24px;padding-top:40px;animation:.5s popIn;display:flex}.cl-success-icon{font-size:5rem;animation:1s infinite bounce}.cl-success-grid{gap:16px;margin:20px 0;display:flex}.cl-retry-btn{color:#fff;cursor:pointer;background:#4caf50;border:none;border-radius:50px;padding:12px 32px;font-size:1.2rem;box-shadow:0 4px 12px #4caf504d}.cl-retry-btn:hover{background:#43a047;transform:scale(1.05)}.cl-submit-container{justify-content:center;padding:20px 0;display:flex}.cl-submit-btn{color:#fff;cursor:pointer;background:#4caf50;border:none;border-radius:50px;padding:16px 48px;font-size:1.5rem;font-weight:700;transition:all .2s;box-shadow:0 4px 12px #4caf504d}.cl-submit-btn:hover:not(.disabled){background:#43a047;transform:scale(1.05)}.cl-submit-btn:active:not(.disabled){transform:scale(.95)}.cl-submit-btn.disabled{cursor:not-allowed;box-shadow:none;background:#ccc}.cl-slot.error{background:#ffebee;border-color:#f44336}.shake{animation:.5s cubic-bezier(.36,.07,.19,.97) both shake}.cl-mixing-game-container{flex-direction:column;align-items:center;gap:32px;max-width:800px;margin:0 auto;padding:20px;display:flex}.cl-mixing-instruction{color:#333;text-align:center;font-size:1.5rem;font-weight:700}.cl-mixing-stage{justify-content:center;align-items:center;width:100%;min-height:200px;display:flex;position:relative}.cl-mixing-colors{align-items:center;gap:40px;transition:all 1s ease-in-out;display:flex}.cl-mixing-colors.merging{gap:0}.cl-mixing-colors.merging .cl-mixing-color-left,.cl-mixing-colors.merging .cl-mixing-color-right{opacity:0;transition:all 1s ease-in-out;transform:scale(.5)}.cl-mixing-plus-sign{color:#666;text-align:center;min-width:40px;font-size:2rem;font-weight:700}.cl-mixing-result-center{animation:.5s ease-out popIn}.cl-mixing-options{justify-content:center;gap:24px;display:flex}.cl-mixing-option{cursor:pointer;background:#fff;border:3px solid #ddd;border-radius:50%;padding:8px;transition:all .2s}.cl-mixing-option:hover:not(:disabled){border-color:#4caf50;transform:scale(1.1)}.cl-mixing-option.selected{border-color:#2196f3;box-shadow:0 0 0 3px #2196f34d}.cl-mixing-option:disabled{cursor:not-allowed;opacity:.6}.cl-mixing-option-circle{border-radius:50%;width:80px;height:80px;box-shadow:0 4px 12px #0000001a}.cl-mixing-success,.cl-mixing-failure{flex-direction:column;align-items:center;gap:24px;padding:40px;animation:.5s popIn;display:flex}.cl-failure-icon{font-size:5rem}.cl-mixing-result-display{align-items:center;gap:16px;margin:20px 0;display:flex}.cl-mixing-plus,.cl-mixing-equals,.cl-mixing-question{color:#666;font-size:2rem;font-weight:700}@media (max-width:768px){.cl-nav-btn{padding:8px 16px;font-size:.9rem}.cl-nav-icon{font-size:1.2rem}.cl-names-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:20px}.cl-slot{width:70px;height:70px}.cl-pool-item{transform:scale(.8)}.cl-submit-btn{padding:12px 32px;font-size:1.2rem}}.settings-container{box-sizing:border-box;flex-direction:column;align-items:center;gap:24px;width:100%;max-width:600px;margin:0 auto;padding:24px;display:flex}.settings-section{background:#fff;border:1px solid #eee;border-radius:16px;flex-direction:column;gap:16px;width:100%;padding:24px;display:flex;box-shadow:0 4px 12px #0000000d}.settings-title{color:#333;border-bottom:1px solid #eee;margin:0;padding-bottom:12px;font-size:20px;font-weight:700}.settings-info{color:#666;font-size:16px;line-height:1.5}.settings-status{color:#555;background:#f5f5f5;border-radius:8px;align-items:center;gap:12px;padding:12px;font-size:14px;display:flex}.status-icon{font-size:20px}.settings-actions{flex-direction:column;gap:12px;display:flex}.settings-btn{cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:16px;font-size:16px;font-weight:700;transition:all .2s;display:flex}.btn-download{color:#fff;background:#4caf50}.btn-download:hover{background:#43a047}.btn-download:disabled{cursor:not-allowed;background:#a5d6a7}.btn-clear{color:#ef5350;background:#fff;border:2px solid #ef5350}.btn-clear:hover{background:#ffebee}.progress-bar-container{background:#eee;border-radius:4px;width:100%;height:8px;margin-top:8px;overflow:hidden}.progress-bar-fill{background:#4caf50;height:100%;transition:width .3s}.cache-stats{grid-template-columns:repeat(2,1fr);gap:12px;margin-top:8px;display:grid}.stat-item{text-align:center;background:#f9f9f9;border-radius:8px;padding:12px}.stat-value{color:#333;font-size:24px;font-weight:700;display:block}.stat-label{color:#888;font-size:12px}:root{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400;line-height:1.5}body{color:#000;touch-action:pan-x pan-y;-webkit-user-select:none;user-select:none;background-color:#fff;margin:0}input,textarea{-webkit-user-select:text;user-select:text;touch-action:manipulation}body{color:#000;touch-action:manipulation;width:100vw;height:100vh;margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;position:fixed;overflow:hidden}html,body,#root{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;width:100%;height:100%;overflow:hidden}.app-layout-root *{-webkit-user-select:none;user-select:none}.text-selectable{-webkit-user-select:text!important;user-select:text!important}:root{--font-size-page-title:24px;--font-size-game-card-title:16px;--font-size-game-card-desc:14px;--safe-area-top:env(safe-area-inset-top,0px);--safe-area-bottom:env(safe-area-inset-bottom,0px);--safe-area-left:env(safe-area-inset-left,0px);--safe-area-right:env(safe-area-inset-right,0px);--page-padding-top:12px;--page-padding-horizontal:16px;--page-padding-bottom:12px;--abacus-question-font-size:clamp(52px,6vw,60px);--abacus-status-font-size:14px;--abacus-option-font-size:20px;--abacus-next-font-size:18px;--abacus-total-font-size:14px;--abacus-answer-main-char-size:46px;--abacus-answer-bpm-size:20px}.app-layout-root{background:#f6f6f6;justify-content:center;align-items:center;gap:12px;width:100%;height:100%;display:flex;overflow:hidden}.back-to-home-button{cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:8px;font-size:48px;line-height:1;transition:transform .2s;display:flex}.back-to-home-button:active{transform:scale(.9)}.app-layout-safe-area,.app-shell{width:100%;height:100%;overflow:hidden}.page-header-right{align-items:center;gap:12px;display:flex}.page-container{box-sizing:border-box;width:100%;height:100%;padding-top:calc(var(--safe-area-top) + var(--page-padding-top));padding-left:calc(var(--safe-area-left) + var(--page-padding-horizontal));padding-right:calc(var(--safe-area-right) + var(--page-padding-horizontal));padding-bottom:calc(var(--safe-area-bottom) + var(--page-padding-bottom));flex-direction:column;display:flex;overflow:hidden}.page-content{box-sizing:border-box;color:#000;flex-direction:column;flex:1;min-height:0;padding:0 4px 4px;display:flex;overflow:hidden}.page-container.scrollable{-webkit-overflow-scrolling:touch;overflow-y:auto}.page-container.scrollable .page-content{-webkit-overflow-scrolling:touch;min-height:auto;overflow-y:auto}.page-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.page-title{font-size:var(--font-size-page-title);white-space:nowrap;margin:0}@media (max-width:600px){.page-header{flex-direction:row;align-items:center;gap:8px}.page-header-right{flex-shrink:0;order:-1}.page-title{white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:18px;overflow:hidden}.back-to-home-button{padding:4px;font-size:36px}}@media (orientation:landscape) and (max-height:500px){.page-header{gap:6px;margin-bottom:6px}.page-title{font-size:16px}.back-to-home-button{padding:2px;font-size:28px}.page-header-right{gap:6px}}.bpm-word{align-items:center;display:flex}.bpm-main-char{font-size:1em;font-weight:700;line-height:1}.bpm-column{flex-direction:column;justify-content:center;align-items:center;margin-left:.15em;font-size:.45em;line-height:1;display:flex;position:relative}.bpm-onset,.bpm-rime{display:block}.bpm-tone{color:#d32f2f;justify-content:center;align-items:center;height:1em;font-size:1.2em;font-weight:900;line-height:1;display:flex;position:absolute;top:85%;right:-.55em;transform:translateY(-50%)scale(1.5,1.8)}.bpm-tone-dot{color:#d32f2f;font-size:1.4em;font-weight:900;position:absolute;top:-.6em;right:0}.bpm-tilde{margin-left:.2em;font-size:1em}.home-game-grid{box-sizing:border-box;flex:1;grid-template-columns:repeat(2,1fr);place-content:center;align-items:center;gap:16px;width:100%;max-width:800px;margin:0 auto;padding:0 16px;display:grid;overflow:hidden}@media (min-width:1024px) and (max-height:800px) and (orientation:landscape){.home-game-grid{gap:32px;max-width:640px;padding:0 48px}}
