:root{font-family:Inter,ui-rounded,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#2c241d;background:#fdf6df;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}button{font:inherit}.app-shell{min-height:100vh;display:grid;place-items:center;padding:28px;background:radial-gradient(circle at 12% 18%,rgba(255,197,91,.32),transparent 24%),radial-gradient(circle at 86% 12%,rgba(118,186,101,.28),transparent 28%),linear-gradient(145deg,#fff9e8,#f9edc8 48%,#dceec8)}.game-board{position:relative;width:min(1120px,100%);min-height:min(760px,calc(100vh - 56px));overflow:hidden;border:3px solid rgba(83,58,36,.18);border-radius:22px;padding:clamp(18px,3vw,36px);background:#fffcefe6;box-shadow:0 24px 70px #4f40262e}.gallery-board{width:min(1120px,100%);min-height:min(720px,calc(100vh - 56px));border:3px solid rgba(83,58,36,.18);border-radius:22px;padding:clamp(22px,4vw,44px);background:#fffcefe6;box-shadow:0 24px 70px #4f40262e}.gallery-header h1{margin:0 0 clamp(24px,4vw,42px);color:#b72f2f;font-size:clamp(2.4rem,5vw,5.2rem);line-height:.95;letter-spacing:0}.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,3vw,34px)}.gallery-card{min-height:430px;display:grid;align-content:start;gap:18px;padding:clamp(20px,3vw,30px);border:5px solid transparent;border-radius:22px;background:#fff0b8;box-shadow:inset 0 -10px #533a2414,0 18px 34px #4f402629;color:#2c241d;cursor:pointer;text-align:left;touch-action:manipulation;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.gallery-card:hover,.gallery-card:active{transform:translateY(-4px) scale(1.01);box-shadow:inset 0 -10px #533a2414,0 24px 38px #4f402633}.gallery-card:focus-visible,.home-button:focus-visible,.domino-answer-card:focus-visible{outline:6px solid #3478f6;outline-offset:6px}.ladybird-gallery-card{border-color:#c13b35;background:#ffe6a8}.domino-gallery-card{border-color:#3f6e42;background:#d8f0b6}.gallery-visual{position:relative;width:min(100%,330px);aspect-ratio:1.2;display:block}.ladybird-visual{justify-self:center}.ladybird-visual img{width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 12px 14px rgba(91,53,38,.18))}.ladybird-visual .dot{width:clamp(16px,3vw,25px);border-width:3px}.domino-visual{display:grid;place-items:center;justify-self:center}.domino-visual .domino-tile{width:100%}.domino-visual .dot{width:clamp(16px,3vw,28px);border-width:3px}.gallery-card strong{color:#2c241d;font-size:clamp(1.7rem,3vw,2.5rem);line-height:1.05}.gallery-card p{max-width:380px;margin:0;color:#514238;font-size:clamp(1.05rem,1.7vw,1.35rem);font-weight:700;line-height:1.3}.game-header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(14px,2vw,24px);align-items:start;margin-bottom:clamp(18px,3vw,34px)}.home-button{width:76px;min-height:64px;border:4px solid #784533;border-radius:18px;background:#ffe06b;color:#3d2c1f;box-shadow:inset 0 -6px #533a241f,0 10px 18px #4f402626;cursor:pointer;font-size:1.35rem;font-weight:900;touch-action:manipulation}.home-button svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.5}.game-header h1{margin:0;color:#b72f2f;font-size:clamp(1.7rem,3.4vw,3.15rem);line-height:1.05;letter-spacing:0;max-width:none;width:100%}.game-header p{margin:0;color:#4a5e2a;font-size:clamp(1.1rem,2.1vw,1.8rem);font-weight:800;text-align:left}.score-card{display:grid;grid-template-columns:repeat(3,minmax(54px,1fr));gap:8px;margin:0;padding:10px;border:4px solid #784533;border-radius:18px;background:#fff5c8;box-shadow:inset 0 -5px #533a241a,0 10px 18px #4f40261f}.score-card div{display:grid;justify-items:center;gap:2px}.score-card dt{color:#5c4939;font-size:.85rem;font-weight:900}.score-card dd{margin:0;color:#b72f2f;font-size:clamp(1.25rem,2.3vw,1.85rem);font-weight:900;line-height:1}.play-area{display:grid;grid-template-columns:minmax(360px,1.16fr) minmax(310px,.84fr);gap:clamp(20px,4vw,46px);align-items:center}.ladybug-card{display:grid;place-items:center;min-height:460px;border:4px solid #784533;border-radius:20px;background:linear-gradient(140deg,#ffffffb8,#fff9e47a),#ffe9a6;box-shadow:inset 0 0 0 10px #ffffff3d}.ladybug-stage{position:relative;width:min(100%,676px);aspect-ratio:1;display:grid;place-items:center}.ladybug-image{width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none;filter:drop-shadow(0 16px 18px rgba(91,53,38,.2))}.css-ladybug{position:relative;width:84%;height:84%;filter:drop-shadow(0 16px 18px rgba(91,53,38,.2))}.css-ladybug-body{position:absolute;inset:13% 7% 4%;border:8px solid #221b17;border-radius:48% 48% 42% 42%;background:radial-gradient(circle at 35% 26%,rgba(255,255,255,.45),transparent 17%),linear-gradient(90deg,#db3333 0 49%,#c72730 51% 100%)}.css-ladybug-head{position:absolute;top:0;left:31%;width:38%;height:30%;border:7px solid #221b17;border-radius:50% 50% 42% 42%;background:#211b18}.css-ladybug-line{position:absolute;top:24%;left:50%;width:7px;height:66%;border-radius:999px;background:#211b18;transform:translate(-50%)}.dot-layer{position:absolute;inset:0}.dot{position:absolute;width:clamp(20px,4.4vw,30px);aspect-ratio:1;border:4px solid #221b17;border-radius:50%;background:#11100f;box-shadow:inset -5px -6px #ffffff14,0 6px #221b1733;transform:translate(-50%,-50%)}.tap-dot{padding:0;cursor:pointer;touch-action:manipulation;transition:transform .14s ease,background-color .14s ease,border-color .14s ease}.tap-dot:focus-visible,.answer-card:focus-visible{outline:6px solid #3478f6;outline-offset:6px}.tap-dot.marked{border-color:#24543d;background:#75d177;transform:translate(-50%,-50%) scale(1.12)}.answer-grid{display:grid;grid-template-rows:repeat(3,minmax(140px,1fr));gap:clamp(14px,2vw,22px)}.answer-card{position:relative;min-height:142px;border:4px solid #3f6e42;border-radius:18px;background:linear-gradient(135deg,#ffffffbf,#ebffd57a),#c7ef96;box-shadow:inset 0 -7px #2c512c1a,0 12px 22px #364c2429;cursor:pointer;touch-action:manipulation;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.answer-card .dot{width:clamp(20px,3.3vw,30px);border-width:3px}.answer-card:hover:not(:disabled),.answer-card:active:not(:disabled){border-color:#2f8a47;transform:translateY(-3px) scale(1.01);box-shadow:inset 0 -7px #2c512c1a,0 18px 28px #364c2433}.answer-card:disabled{cursor:default}.answer-card.selected{border-color:#b55318;background:linear-gradient(135deg,#ffffffb8,#ffbe659e),#ffad5b;transform:translateY(-3px) scale(1.01);box-shadow:inset 0 -7px #533a241f,0 0 0 6px #b5531847,0 14px 24px #4f40262e}.feedback-correct .ladybug-card,.feedback-correct .domino-target-card{animation:happy-bounce .62s ease both}.feedback-wrong .ladybug-card,.feedback-wrong .domino-target-card{animation:gentle-wobble .38s ease both}.domino-play-area{display:grid;grid-template-columns:minmax(360px,1.05fr) minmax(310px,.95fr);gap:clamp(20px,4vw,46px);align-items:center}.domino-target-card{display:grid;place-items:center;min-height:460px;border:4px solid #67513b;border-radius:20px;background:linear-gradient(140deg,#ffffffb3,#fff5d87a),#f7d889;box-shadow:inset 0 0 0 10px #ffffff38}.domino-tile{position:relative;width:min(86%,340px);aspect-ratio:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:6px solid #2c241d;border-radius:24px;background:#fffaf0;overflow:hidden;box-shadow:inset 0 -9px #2c241d14,0 16px 24px #4f402629}.large-domino{width:min(88%,540px)}.domino-divider{position:absolute;left:50%;top:10%;bottom:10%;width:6px;border-radius:999px;background:#2c241d;transform:translate(-50%);z-index:2}.domino-side{position:relative}.domino-side-button{min-width:0;border:0;border-radius:0;background:transparent;color:inherit;cursor:pointer;touch-action:manipulation}.domino-side-button:disabled{cursor:default}.domino-side-button.selected{background:radial-gradient(circle at 50% 50%,rgba(255,224,107,.72),transparent 62%),#fff1a8;box-shadow:inset 0 0 0 6px #2f8a4761}.domino-side-button:focus-visible{outline:6px solid #3478f6;outline-offset:-6px;z-index:3}.feedback-wrong .domino-side-button.selected{background:radial-gradient(circle at 50% 50%,rgba(255,174,84,.8),transparent 62%),#ffb45c;box-shadow:inset 0 0 0 6px #b5531870}.domino-tile .dot{width:clamp(22px,3.6vw,40px);border-width:4px}.large-domino .dot{width:clamp(28px,4.7vw,52px)}.domino-answer-grid{display:grid;grid-template-rows:repeat(3,minmax(140px,1fr));gap:clamp(14px,2vw,22px)}.domino-answer-card{display:grid;place-items:center;min-height:142px;border:4px solid #3f6e42;border-radius:18px;background:linear-gradient(135deg,#ffffffbf,#dbf2ff7a),#b9e4f7;box-shadow:inset 0 -7px #2c512c1a,0 12px 22px #364c2429;cursor:pointer;touch-action:manipulation;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.domino-answer-card:hover:not(:disabled),.domino-answer-card:active:not(:disabled){border-color:#2f8a47;transform:translateY(-3px) scale(1.01)}.domino-answer-card:disabled{cursor:default}.domino-answer-card.selected{border-color:#2f8a47;background:linear-gradient(135deg,#ffffffbf,#ffec8a8c),#ffe679;transform:translateY(-3px) scale(1.01)}.feedback-wrong .domino-answer-card.selected{border-color:#b55318;background:linear-gradient(135deg,#ffffffb8,#ffbe659e),#ffad5b}.domino-answer-card.selected .domino-answer-dot-card{box-shadow:inset 0 -7px #2c241d14,0 0 0 6px #2f8a4757,0 12px 20px #4f402629}.feedback-wrong .domino-answer-card.selected .domino-answer-dot-card{box-shadow:inset 0 -7px #2c241d14,0 0 0 6px #b5531861,0 12px 20px #4f402629}.domino-answer-dot-card{position:relative;display:block;width:min(86%,170px);aspect-ratio:1;border:4px solid #2c241d;border-radius:20px;background:#fffaf0;box-shadow:inset 0 -7px #2c241d14,0 10px 18px #4f40261f}.domino-answer-dot-card .dot{width:clamp(18px,3vw,28px);border-width:3px}.feedback-burst{position:absolute;inset:0;pointer-events:none}.feedback-burst span{position:absolute;width:clamp(28px,4vw,46px);aspect-ratio:1;border-radius:50%;opacity:0;animation:pop .78s ease-out both}.feedback-burst.correct span{background:#ffcf4d}.feedback-burst.wrong span{background:#9fd4ff}.feedback-burst span:nth-child(1){left:16%;top:20%;animation-delay:20ms}.feedback-burst span:nth-child(2){left:40%;top:12%;animation-delay:90ms}.feedback-burst span:nth-child(3){right:15%;top:24%;animation-delay:.16s}.feedback-burst span:nth-child(4){left:24%;bottom:18%;animation-delay:.22s}.feedback-burst span:nth-child(5){right:34%;bottom:11%;animation-delay:.13s}.feedback-burst span:nth-child(6){right:12%;bottom:29%;animation-delay:.26s}@keyframes happy-bounce{0%,to{transform:translateY(0) rotate(0)}38%{transform:translateY(-16px) rotate(-1deg)}66%{transform:translateY(5px) rotate(1deg)}}@keyframes gentle-wobble{0%,to{transform:translate(0)}30%{transform:translate(-8px)}64%{transform:translate(8px)}}@keyframes pop{0%{opacity:0;transform:scale(.5)}35%{opacity:.88;transform:scale(1.18)}to{opacity:0;transform:scale(1.8)}}@media(max-width:820px){.app-shell{padding:14px}.game-board,.gallery-board{min-height:calc(100vh - 28px);border-radius:18px}.gallery-grid{grid-template-columns:1fr}.gallery-card{min-height:320px}.game-header{grid-template-columns:1fr}.score-card{width:100%;max-width:320px}.game-header p{text-align:left}.play-area,.domino-play-area{grid-template-columns:1fr}.ladybug-card,.domino-target-card{min-height:auto;aspect-ratio:1.08}.answer-grid,.domino-answer-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:minmax(132px,1fr)}.answer-card,.domino-answer-card{min-height:132px}.answer-card .dot{width:clamp(18px,5vw,26px)}}@media(max-width:560px){.answer-grid,.domino-answer-grid{grid-template-columns:1fr;grid-template-rows:repeat(3,minmax(116px,1fr))}.gallery-card{min-height:280px}}