/* ==========================================================
   KIDS GAMES — IN-PLAY RESULT SCREEN v17.10.84
   Keeps each existing game design and presents the completed
   round inside the play area.
========================================================== */

body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-game-stage.is-finished{
  min-height:420px
}
body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-game-stage.is-finished::before{
  content:"";position:absolute;inset:0;z-index:1;background:rgba(239,248,255,.58);backdrop-filter:blur(2px);pointer-events:none
}
body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-game-stage.is-finished .kids-game-target{
  position:relative;z-index:8;display:grid;place-items:center;min-height:360px;pointer-events:auto
}
body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-practice-card.is-game-finished > .kids-game-message,
body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-practice-card.is-game-finished > .race-track,
body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-practice-card.is-game-finished > .kids-keyboard-wrap,
body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-practice-card.is-game-finished .kids-practice-head [data-start-game]{
  display:none!important
}

.kids-game-result-card{
  width:min(700px,calc(100% - 16px));padding:18px 20px;border:1px solid rgba(190,211,239,.94);border-radius:24px;
  background:rgba(255,255,255,.96);color:#173b6d;text-align:center;box-shadow:0 20px 48px rgba(26,73,133,.20),inset 0 0 0 1px #fff;
  backdrop-filter:blur(8px);animation:kidsGameResultArrive .32s ease-out both
}
.kids-game-result-card:focus{outline:none}
.kids-game-result-heading{display:flex;justify-content:center;gap:12px;align-items:center;height:42px}
.kids-game-result-heading span{color:#fbbf24;font-size:22px;filter:drop-shadow(0 3px 4px rgba(180,105,0,.14))}
.kids-game-result-heading b{font-size:42px;line-height:1;filter:drop-shadow(0 5px 7px rgba(23,105,255,.18))}
.kids-game-result-kicker{margin:2px 0 0;color:#1769ff;font:900 10px/1 Inter,sans-serif;letter-spacing:.14em}
.kids-game-result-card h2{margin:4px 0 3px;color:#102a72;font:900 clamp(25px,4vw,34px)/1.08 Poppins,Inter,sans-serif}
.kids-game-result-copy{margin:0 auto 10px;color:#52677f;font:700 13px/1.4 Inter,sans-serif}
.kids-game-result-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0}
.kids-game-result-metrics > div{
  display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;gap:1px 7px;align-items:center;min-width:0;padding:9px;
  border:1px solid #dce8f6;border-radius:14px;background:#eaf5ff;text-align:left
}
.kids-game-result-metrics > div:nth-child(2){background:#f3edff}
.kids-game-result-metrics > div:nth-child(3){background:#fff4e1}
.kids-game-result-metrics > div:nth-child(4){background:#effbef}
.kids-game-result-metrics span{grid-row:1/3;font-size:24px}
.kids-game-result-metrics small{overflow:hidden;color:#64748b;font:800 9px/1.1 Inter,sans-serif;text-overflow:ellipsis;white-space:nowrap}
.kids-game-result-metrics strong{color:#102a72;font:900 18px/1.15 Poppins,Inter,sans-serif}
.kids-game-result-best{display:inline-block;margin:0 0 10px;padding:6px 12px;border-radius:999px;background:#fff6ce;color:#8a4b08;font:800 12px/1.2 Inter,sans-serif}
.kids-game-result-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.kids-game-result-actions .kids-button{display:flex;justify-content:center;align-items:center;gap:6px;min-width:0;min-height:44px;padding:9px 10px;border-radius:13px;font-size:12px;line-height:1.2;text-align:center}
.kids-game-result-primary{box-shadow:0 7px 16px rgba(23,105,255,.24)}
.kids-game-result-next{background:#13a66a;box-shadow:0 7px 16px rgba(19,166,106,.20)}
.kids-game-result-next:hover{background:#0d8c59}

body[data-kids-game="falling-letters"] .kids-falling-stage.is-paused .kids-falling-letter{animation-play-state:paused}
body[data-kids-game="falling-letters"] .kids-falling-stage.is-finished{min-height:430px}
body[data-kids-game="falling-letters"] .kids-falling-stage.is-finished::before{z-index:8;background:rgba(224,246,255,.54)}
body[data-kids-game="falling-letters"] .kids-falling-stage.is-finished .kids-falling-scenery{opacity:.58;filter:saturate(.82)}
body[data-kids-game="falling-letters"] .kids-falling-stage.is-finished .kids-falling-time-badge,
body[data-kids-game="falling-letters"] .kids-falling-stage.is-finished .kids-falling-danger,
body[data-kids-game="falling-letters"] .kids-falling-stage.is-finished .kids-falling-sign{visibility:hidden;opacity:0}
body[data-kids-game="falling-letters"] .kids-falling-stage.is-finished .kids-falling-target-layer{position:absolute;inset:0;z-index:10;min-height:0;padding:12px}
body[data-kids-game="falling-letters"] .kids-falling-workspace.is-game-finished .kids-falling-controls,
body[data-kids-game="falling-letters"] .kids-falling-workspace.is-game-finished .kids-falling-message{display:none!important}

html[data-theme="dark"] .kids-game-result-card{border-color:rgba(110,145,188,.66);background:rgba(15,29,51,.96);color:#eaf2ff;box-shadow:0 20px 48px rgba(0,0,0,.35),inset 0 0 0 1px #304a6c}
html[data-theme="dark"] .kids-game-result-card h2{color:#f8fafc}
html[data-theme="dark"] .kids-game-result-copy{color:#c7d7ea}
html[data-theme="dark"] .kids-game-result-metrics > div,
html[data-theme="dark"] .kids-game-result-metrics > div:nth-child(2),
html[data-theme="dark"] .kids-game-result-metrics > div:nth-child(3),
html[data-theme="dark"] .kids-game-result-metrics > div:nth-child(4){border-color:#355071;background:#172b46}
html[data-theme="dark"] .kids-game-result-metrics strong{color:#fff}
html[data-theme="dark"] body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-game-stage.is-finished::before{background:rgba(10,22,39,.54)}

@media(prefers-color-scheme:dark){
  html[data-theme="system"] .kids-game-result-card{border-color:rgba(110,145,188,.66);background:rgba(15,29,51,.96);color:#eaf2ff;box-shadow:0 20px 48px rgba(0,0,0,.35),inset 0 0 0 1px #304a6c}
  html[data-theme="system"] .kids-game-result-card h2{color:#f8fafc}
  html[data-theme="system"] .kids-game-result-copy{color:#c7d7ea}
  html[data-theme="system"] .kids-game-result-metrics > div,
  html[data-theme="system"] .kids-game-result-metrics > div:nth-child(2),
  html[data-theme="system"] .kids-game-result-metrics > div:nth-child(3),
  html[data-theme="system"] .kids-game-result-metrics > div:nth-child(4){border-color:#355071;background:#172b46}
  html[data-theme="system"] .kids-game-result-metrics strong{color:#fff}
  html[data-theme="system"] body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-game-stage.is-finished::before{background:rgba(10,22,39,.54)}
}

@keyframes kidsGameResultArrive{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}

@media(max-width:620px){
  body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-game-stage.is-finished,
  body[data-kids-game="falling-letters"] .kids-falling-stage.is-finished{min-height:500px;padding:8px}
  .kids-game-result-card{width:calc(100% - 4px);padding:14px}
  .kids-game-result-actions{grid-template-columns:1fr 1fr}
  .kids-game-result-more{grid-column:1/-1}
}
@media(max-width:420px){
  body.kids-game-detail-page:not([data-kids-game="letter-pop"]):not([data-kids-game="typing-stack"]) .kids-game-stage.is-finished,
  body[data-kids-game="falling-letters"] .kids-falling-stage.is-finished{min-height:590px}
  .kids-game-result-metrics{grid-template-columns:1fr 1fr}
  .kids-game-result-actions{grid-template-columns:1fr}
  .kids-game-result-more{grid-column:auto}
}
@media(prefers-reduced-motion:reduce){.kids-game-result-card{animation:none}}
