.ce-app{max-width:1100px;margin:25px auto;padding:18px;background:linear-gradient(145deg,#fff,#fff9fc);border:1px solid #f2d9eb;border-radius:28px;box-shadow:0 15px 50px rgba(88,50,105,.10);font-family:system-ui,-apple-system,"Segoe UI",Tahoma,Arial,sans-serif;color:#29243a}
.ce-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 8px 20px}.ce-brand{display:flex;align-items:center;gap:12px}.ce-brand-mark{font-size:38px}.ce-brand strong{display:block;font-size:25px;background:linear-gradient(90deg,#ef268d,#ff9c22,#22a6e8,#884be8);-webkit-background-clip:text;background-clip:text;color:transparent}.ce-brand small{display:block;color:#777;font-size:13px;margin-top:3px}.ce-status,.ce-score{background:#fff;border:1px solid #eadff0;border-radius:999px;padding:9px 14px;font-size:13px;color:#6a5b78}
.ce-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}.ce-tab,.ce-btn{border:1px solid #ecdde8;background:#fff;border-radius:16px;padding:12px 14px;font:inherit;cursor:pointer;transition:.2s}.ce-tab:hover,.ce-btn:hover{transform:translateY(-1px)}.ce-tab.is-active{background:linear-gradient(90deg,#f62a93,#a64be8);color:#fff;border-color:transparent;box-shadow:0 8px 20px rgba(210,53,160,.18)}
.ce-panel{display:none;background:#fff;border:1px solid #eee2eb;border-radius:22px;padding:18px}.ce-panel.is-active{display:block}.ce-activity-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:16px}.ce-activity-head h2{margin:0 0 5px;font-size:24px}.ce-activity-head p{margin:0;color:#777;font-size:14px}.ce-actions{display:flex;gap:8px;flex-wrap:wrap}.ce-primary{background:linear-gradient(90deg,#f52b91,#a849e8);color:#fff;border-color:transparent}.ce-color-palette,.ce-number-palette{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0 16px}.ce-swatch{width:40px;height:40px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.16);cursor:pointer}.ce-swatch.is-selected{outline:3px solid #2e2541;outline-offset:2px}.ce-canvas-wrap{display:flex;justify-content:center;background:radial-gradient(circle at 50% 20%,#fff,#fff7fb);border-radius:18px;padding:10px;overflow:auto}.ce-art{width:min(100%,720px);height:auto;touch-action:manipulation}.ce-art [data-ce-free],.ce-art [data-ce-number]{cursor:pointer;transition:filter .15s}.ce-art [data-ce-free]:hover,.ce-art [data-ce-number]:hover{filter:brightness(.96)}.ce-progress{min-width:170px}.ce-progress>span{display:block;text-align:center;font-weight:700;margin-bottom:5px}.ce-progress div{height:9px;background:#eee;border-radius:99px;overflow:hidden}.ce-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ff3296,#8a48e8);transition:.25s}
.ce-number-palette{justify-content:center}.ce-number-swatch{min-width:62px;height:48px;border:0;border-radius:14px;color:#fff;font-weight:800;font-size:17px;cursor:pointer;box-shadow:0 5px 12px rgba(0,0,0,.12)}.ce-number-swatch small{display:block;font-size:10px;opacity:.9}.ce-message{min-height:25px;text-align:center;font-weight:700;margin:12px 0;color:#6c4a82}.ce-listen{display:flex;align-items:center;justify-content:center;gap:15px;margin:12px auto 20px;padding:15px;max-width:430px;background:#fff8fb;border:1px solid #f3dbe9;border-radius:20px}.ce-speak{width:65px;height:65px;border-radius:50%;border:0;background:linear-gradient(135deg,#f42d92,#8e48ea);color:#fff;font-size:30px;cursor:pointer;box-shadow:0 8px 20px rgba(184,55,155,.2)}.ce-listen small{display:block;color:#8b7b91}.ce-listen strong{font-size:28px}.ce-match-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.ce-match-card{min-height:155px;border:2px solid #eee2eb;background:#fff;border-radius:20px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font:inherit;transition:.2s}.ce-match-card:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(75,50,90,.10)}.ce-match-card.is-correct{border-color:#24b47e;background:#effcf6}.ce-match-card.is-wrong{animation:ce-shake .25s}.ce-match-icon{font-size:64px;line-height:1}.ce-match-label{font-weight:800}.ce-next{display:block;margin:18px auto 0}.ce-footer{text-align:center;color:#9a8ea0;font-size:12px;padding:16px 0 4px}
@keyframes ce-shake{25%{transform:translateX(-6px)}50%{transform:translateX(6px)}75%{transform:translateX(-4px)}}
@media(max-width:700px){.ce-app{margin:10px;padding:10px;border-radius:20px}.ce-header,.ce-activity-head{align-items:flex-start;flex-direction:column}.ce-status{align-self:stretch;text-align:center}.ce-tabs{grid-template-columns:1fr}.ce-panel{padding:12px}.ce-match-grid{grid-template-columns:repeat(2,1fr)}.ce-match-card{min-height:130px}.ce-match-icon{font-size:52px}.ce-actions{width:100%}.ce-actions .ce-btn{flex:1}.ce-brand strong{font-size:21px}}
.ce-match-image{width:86px;height:86px;object-fit:contain;border-radius:14px;display:block}
@media(max-width:700px){.ce-match-image{width:72px;height:72px}}