
@font-face{
  font-family:'OpenDyslexic';
  src:url('https://cdn.jsdelivr.net/gh/madjeek-web/open-dyslexic@main/OpenDyslexic-2025/opendyslexic-regular-webfont.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap
}
@font-face{
  font-family:'OpenDyslexic';
  src:url('https://cdn.jsdelivr.net/gh/madjeek-web/open-dyslexic@main/OpenDyslexic-2025/opendyslexic-bold-webfont.woff2') format('woff2');
  font-weight:700 900;font-style:normal;font-display:swap
}
.cag-shell,.cag-shell *{box-sizing:border-box}
.cag-shell{
  --cag-ink:#17223b;--cag-blue:#149ce5;--cag-yellow:#fff200;--cag-purple:#7b2cbf;
  --cag-border:#cfd9ef;--cag-paper:#fff;--cag-good:#208847;
  font-family:'OpenDyslexic',Arial,sans-serif!important;
  max-width:1120px!important;margin:24px auto!important;padding:24px!important;background:#fff!important;
  border-radius:28px!important;box-shadow:0 8px 30px rgba(0,0,0,.13)!important;color:var(--cag-ink)!important;
}
.cag-head{text-align:center!important}.cag-head p{font-family:inherit!important;font-weight:700!important;color:#17223b!important}
.cag-brand{display:inline-flex!important;align-items:flex-start!important;max-width:min(560px,90%)!important;gap:4px!important}
.cag-brand img{display:block!important;max-width:100%!important;height:auto!important}
.cag-brand sup{font-family:Arial,sans-serif!important;font-size:16px!important;font-weight:900!important;color:#111!important;line-height:1!important}
.cag-a11ybar,.cag-game-topbar{display:flex!important;flex-wrap:wrap!important;gap:10px!important;justify-content:center!important;align-items:center!important;margin:14px 0!important}
.cag-control,.cag-back,.cag-btn,.cag-select{
  font-family:inherit!important;border:2px solid #aebddd!important;background:#fff!important;color:#17223b!important;
  border-radius:14px!important;padding:10px 14px!important;font-weight:800!important;line-height:1.25!important;
}
.cag-control,.cag-back,.cag-btn{cursor:pointer!important}
.cag-control:hover,.cag-control:focus-visible,.cag-back:hover,.cag-back:focus-visible,.cag-btn:hover,.cag-btn:focus-visible{
  background:#eef5ff!important;border-color:#5589cc!important;outline:3px solid rgba(20,156,229,.25)!important;outline-offset:2px!important
}

/* Launcher tiles: essential information is visible at all times. */
.cag-menu{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px!important;margin-top:18px!important}
.cag-shell .cag-tile{
  all:unset;box-sizing:border-box!important;display:flex!important;flex-direction:column!important;width:100%!important;
  min-height:390px!important;border:4px solid #819fd4!important;border-radius:24px!important;overflow:hidden!important;
  cursor:pointer!important;background:#149ce5!important;color:#111!important;box-shadow:0 6px 16px rgba(0,0,0,.14)!important;
  font-family:'OpenDyslexic',Arial,sans-serif!important;
}
.cag-shell .cag-tile-bsl{background:#7b2cbf!important}
.cag-shell .cag-tile-art{display:flex!important;align-items:center!important;justify-content:center!important;min-height:245px!important;background:#fff!important;padding:12px!important}
.cag-shell .cag-tile-art img{display:block!important;width:100%!important;height:235px!important;object-fit:contain!important}
.cag-shell .cag-tile-copy{display:block!important;padding:18px 20px 20px!important;color:#fff!important}
.cag-shell .cag-tile-copy strong{display:block!important;font-size:1.35rem!important;line-height:1.25!important;color:#fff!important;font-weight:900!important;margin:0 0 7px!important}
.cag-shell .cag-tile-copy span{display:block!important;color:#fff!important;font-size:1rem!important;line-height:1.45!important;font-weight:700!important}
.cag-shell .cag-tile-copy em{display:inline-block!important;margin-top:12px!important;background:#fff200!important;color:#111!important;border-radius:12px!important;padding:8px 12px!important;font-style:normal!important;font-weight:900!important}
.cag-shell .cag-tile:hover,.cag-shell .cag-tile:focus-visible{
  transform:translateY(-2px)!important;box-shadow:0 12px 26px rgba(0,0,0,.20)!important;outline:4px solid #fff200!important;outline-offset:3px!important
}

/* Selected game expands beyond the normal content column on desktop. */
.cag-shell.cag-expanded{
  width:min(95vw,1680px)!important;max-width:min(95vw,1680px)!important;
  margin-left:50%!important;transform:translateX(-50%)!important;padding:22px!important
}
.cag-panel{margin-top:8px!important}
.cag-tools{display:flex!important;flex-wrap:wrap!important;gap:10px!important;justify-content:center!important;align-items:center!important;margin:10px 0 14px!important}
.cag-status{text-align:center!important;font-weight:900!important;min-height:26px!important;margin:8px!important}
.cag-grid{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:10px!important}
.cag-grid.cag-dense{grid-template-columns:repeat(8,minmax(0,1fr))!important}
.cag-card{position:relative!important;aspect-ratio:3/4!important;border:0!important;background:transparent!important;padding:0!important;perspective:900px!important;cursor:pointer!important;min-width:0!important}
.cag-inner{position:absolute!important;inset:0!important;transform-style:preserve-3d!important;transition:transform .38s ease!important}
.cag-card.flip .cag-inner,.cag-card.match .cag-inner{transform:rotateY(180deg)!important}
.cag-face{position:absolute!important;inset:0!important;border-radius:14px!important;overflow:hidden!important;backface-visibility:hidden!important;-webkit-backface-visibility:hidden!important;border:2px solid #d4dceb!important;box-shadow:0 3px 10px rgba(0,0,0,.16)!important;background:#fff!important}
.cag-face.back img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}
.cag-face.front{transform:rotateY(180deg)!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:6px!important}
.cag-face.front img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important}
.cag-name{position:absolute!important;left:5px!important;right:5px!important;bottom:5px!important;background:rgba(255,255,255,.93)!important;color:#111!important;border-radius:8px!important;padding:3px 5px!important;font-size:.76rem!important;font-weight:900!important;text-align:center!important}
.cag-letter{font-family:'OpenDyslexic',Arial,sans-serif!important;font-size:clamp(38px,5vw,68px)!important;font-weight:900!important;color:#111!important;line-height:1!important}
.cag-card.match .cag-face{box-shadow:0 0 0 4px #45a665,0 4px 12px rgba(0,0,0,.14)!important}
.cag-card.cag-correct-pop{animation:cag-pop .36s ease}
@keyframes cag-pop{0%{transform:scale(1)}45%{transform:scale(1.075)}100%{transform:scale(1)}}
.cag-done{background:#eefaf2!important;border:2px solid #8fc4a0!important;border-radius:15px!important;padding:12px!important;color:#173a26!important}
.cag-celebrate{position:fixed!important;inset:0!important;pointer-events:none!important;z-index:999999!important;overflow:hidden!important}
.cag-star{position:absolute!important;font-size:28px!important;animation:cag-star 900ms ease-out forwards!important}
@keyframes cag-star{0%{opacity:0;transform:translateY(10px) scale(.5) rotate(0)}20%{opacity:1}100%{opacity:0;transform:translateY(-140px) scale(1.25) rotate(160deg)}}
.cag-learn{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:10px!important}
.cag-learn>div{border:2px solid #dbe3ef!important;border-radius:15px!important;padding:8px!important;text-align:center!important;background:#fff!important}
.cag-learn img{display:block!important;width:100%!important;aspect-ratio:1!important;object-fit:contain!important}
.cag-learn b{font-size:1.35rem!important;color:#111!important}
.cag-shell:fullscreen,.cag-shell:-webkit-full-screen{width:100vw!important;max-width:none!important;height:100vh!important;overflow:auto!important;margin:0!important;transform:none!important;border-radius:0!important;padding:18px!important}

@media(max-width:1100px){
  .cag-grid,.cag-learn{grid-template-columns:repeat(5,minmax(0,1fr))!important}
  .cag-grid.cag-dense{grid-template-columns:repeat(6,minmax(0,1fr))!important}
}
@media(max-width:800px){
  .cag-menu{grid-template-columns:1fr!important}
  .cag-shell.cag-expanded{width:96vw!important;max-width:96vw!important}
  .cag-grid,.cag-learn{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .cag-grid.cag-dense{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
@media(max-width:560px){
  .cag-shell{padding:14px!important;border-radius:18px!important}
  .cag-shell .cag-tile{min-height:330px!important}
  .cag-shell .cag-tile-art{min-height:205px!important}.cag-shell .cag-tile-art img{height:195px!important}
  .cag-grid,.cag-grid.cag-dense,.cag-learn{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:400px){.cag-grid,.cag-grid.cag-dense,.cag-learn{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(prefers-reduced-motion:reduce){
  .cag-inner{transition:none!important}.cag-card.cag-correct-pop{animation:none!important}.cag-star{display:none!important}
}


/* ===== Version 7.2: Abi's BSL Word Race prototype ===== */
.cag-menu{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.cag-shell .cag-tile-race{background:#ed3d8f!important}

.cag-race-wrap{max-width:1500px!important;margin:0 auto!important}
.cag-race-hud{display:grid!important;grid-template-columns:auto 1fr auto!important;gap:12px!important;align-items:center!important;margin-bottom:10px!important}
.cag-race-score,.cag-race-wordbox,.cag-race-level{
  background:#fff!important;border:3px solid #d5def0!important;border-radius:18px!important;
  padding:10px 14px!important;font-weight:900!important;box-shadow:0 3px 10px rgba(0,0,0,.08)!important
}
.cag-race-score,.cag-race-level{white-space:nowrap!important}
.cag-race-wordbox{text-align:center!important}
.cag-race-word{font-size:clamp(25px,3vw,48px)!important;letter-spacing:.12em!important;text-transform:uppercase!important;color:#54238b!important}
.cag-race-word .done{color:#228a47!important}
.cag-race-word .current{text-decoration:underline!important;text-decoration-thickness:5px!important;text-decoration-color:#f0b400!important}

.cag-race-stage{
  position:relative!important;overflow:hidden!important;min-height:610px!important;border-radius:26px!important;
  border:4px solid #c8d5ef!important;background:
    linear-gradient(#53bdf2 0 24%,#bfe78d 24% 42%,#c8753a 42% 100%)!important;
  box-shadow:inset 0 0 80px rgba(255,255,255,.24),0 8px 25px rgba(0,0,0,.14)!important;
  touch-action:none!important
}
.cag-race-stage:before{
  content:""!important;position:absolute!important;left:7%!important;right:7%!important;top:37%!important;bottom:-4%!important;
  background:linear-gradient(90deg,transparent 0 31.7%,rgba(255,255,255,.75) 31.7% 32.5%,transparent 32.5% 66%,
    rgba(255,255,255,.75) 66% 66.8%,transparent 66.8%)!important;
  clip-path:polygon(35% 0,65% 0,100% 100%,0 100%)!important;opacity:.95!important
}
.cag-race-banner{
  position:absolute!important;top:15px!important;left:50%!important;transform:translateX(-50%)!important;
  background:rgba(255,255,255,.94)!important;border-radius:16px!important;padding:8px 16px!important;
  font-weight:900!important;color:#51227f!important;z-index:6!important;text-align:center!important
}
.cag-race-lanes{position:absolute!important;inset:0!important;z-index:3!important}
.cag-race-hurdle{
  position:absolute!important;top:175px!important;width:22%!important;max-width:270px!important;min-width:135px!important;
  transform:translateX(-50%) scale(.82)!important;transition:transform .12s linear,top .12s linear!important;
  border:0!important;background:transparent!important;padding:0!important;z-index:4!important
}
.cag-race-hurdle[data-lane="0"]{left:24%!important}
.cag-race-hurdle[data-lane="1"]{left:50%!important}
.cag-race-hurdle[data-lane="2"]{left:76%!important}
.cag-hurdle-frame{
  display:flex!important;align-items:center!important;justify-content:center!important;
  min-height:145px!important;background:#fff!important;border:11px solid #e34d73!important;border-bottom-width:18px!important;
  border-radius:12px!important;box-shadow:0 8px 12px rgba(0,0,0,.18)!important;padding:6px!important
}
.cag-race-hurdle:nth-child(2) .cag-hurdle-frame{border-color:#f3b12c!important}
.cag-race-hurdle:nth-child(3) .cag-hurdle-frame{border-color:#6532a5!important}
.cag-hurdle-frame img{width:100%!important;height:120px!important;object-fit:contain!important;display:block!important}
.cag-hurdle-label{
  display:block!important;margin:5px auto 0!important;width:max-content!important;max-width:100%!important;
  padding:4px 9px!important;background:#fff!important;border-radius:10px!important;color:#111!important;font-weight:900!important
}

.cag-runner{
  position:absolute!important;bottom:42px!important;left:50%!important;width:190px!important;height:230px!important;
  transform:translateX(-50%)!important;transition:left .18s ease,transform .18s ease!important;z-index:5!important;
  display:flex!important;align-items:flex-end!important;justify-content:center!important
}
.cag-runner[data-lane="0"]{left:31%!important}.cag-runner[data-lane="1"]{left:50%!important}.cag-runner[data-lane="2"]{left:69%!important}
.cag-runner img{display:block!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;filter:drop-shadow(0 8px 4px rgba(0,0,0,.18))!important}
.cag-runner.running img{animation:cag-run-bob .32s ease-in-out infinite alternate!important}
.cag-runner.jumping{animation:cag-jump .58s cubic-bezier(.2,.75,.35,1)!important}
.cag-runner.stumble{animation:cag-stumble .62s ease!important}
.cag-runner.boost img{animation:cag-boost .22s ease-in-out infinite alternate!important;filter:drop-shadow(0 8px 4px rgba(0,0,0,.18)) drop-shadow(0 0 16px #ffe600)!important}
@keyframes cag-run-bob{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-6px) rotate(1deg)}}
@keyframes cag-jump{0%{bottom:42px}45%{bottom:205px;transform:translateX(-50%) scale(1.06)}100%{bottom:42px}}
@keyframes cag-stumble{0%{transform:translateX(-50%) rotate(0)}25%{transform:translateX(-50%) rotate(-14deg) translateY(10px)}55%{transform:translateX(-50%) rotate(8deg) translateY(14px)}100%{transform:translateX(-50%) rotate(0)}}
@keyframes cag-boost{from{transform:translateY(-2px) scale(1.01)}to{transform:translateY(-10px) scale(1.05)}}

.cag-race-feedback{
  position:absolute!important;left:50%!important;bottom:275px!important;transform:translateX(-50%)!important;
  z-index:8!important;background:rgba(255,255,255,.95)!important;border-radius:15px!important;padding:8px 14px!important;
  font-weight:900!important;font-size:1.15rem!important;opacity:0!important;transition:opacity .2s!important
}
.cag-race-feedback.show{opacity:1!important}
.cag-race-feedback.good{color:#18753b!important;border:3px solid #5db77a!important}
.cag-race-feedback.bad{color:#a12c3a!important;border:3px solid #e4818d!important}

.cag-race-controls{display:flex!important;justify-content:center!important;gap:12px!important;flex-wrap:wrap!important;margin-top:12px!important}
.cag-race-control{
  min-width:115px!important;min-height:54px!important;border:3px solid #7b91bd!important;border-radius:16px!important;
  background:#fff!important;color:#17223b!important;font-family:inherit!important;font-weight:900!important;font-size:1rem!important;cursor:pointer!important
}
.cag-race-control:hover,.cag-race-control:focus-visible{background:#fff6b8!important;outline:3px solid rgba(20,156,229,.25)!important}
.cag-race-instructions{text-align:center!important;font-weight:700!important;margin:9px 0!important}
.cag-race-meters{display:flex!important;justify-content:center!important;gap:14px!important;flex-wrap:wrap!important;margin:10px 0!important}
.cag-meter{display:flex!important;gap:7px!important;align-items:center!important;font-weight:900!important}
.cag-meter-track{width:150px!important;height:16px!important;border-radius:99px!important;background:#e5eaf4!important;overflow:hidden!important;border:2px solid #bcc8df!important}
.cag-meter-fill{height:100%!important;width:0;background:#73c93e!important;transition:width .25s!important}
.cag-meter-stumble .cag-meter-fill{background:#ef765d!important}

@media(max-width:1050px){.cag-menu{grid-template-columns:1fr 1fr!important}.cag-race-stage{min-height:550px!important}}
@media(max-width:760px){
  .cag-menu{grid-template-columns:1fr!important}
  .cag-race-hud{grid-template-columns:1fr 1fr!important}.cag-race-wordbox{grid-column:1/-1!important;grid-row:1!important}
  .cag-race-stage{min-height:500px!important}
  .cag-runner{width:145px!important;height:185px!important}
  .cag-hurdle-frame{min-height:115px!important}.cag-hurdle-frame img{height:92px!important}
  .cag-race-hurdle{min-width:105px!important;top:170px!important}
}
@media(max-width:520px){
  .cag-race-stage{min-height:440px!important}
  .cag-race-hurdle{width:27%!important;min-width:88px!important;top:150px!important}
  .cag-hurdle-frame{border-width:7px!important;border-bottom-width:12px!important;min-height:90px!important}.cag-hurdle-frame img{height:70px!important}
  .cag-runner{width:115px!important;height:150px!important;bottom:35px!important}
  .cag-race-control{min-width:90px!important}
}
@media(prefers-reduced-motion:reduce){
  .cag-runner.running img,.cag-runner.jumping,.cag-runner.stumble,.cag-runner.boost img{animation:none!important}
}

/* Version 7.2.1 Catrin voice playback */
.cag-catrin-audio{position:absolute!important;width:1px!important;height:1px!important;opacity:.001!important;pointer-events:none!important}
.cag-voice-status{display:inline-block!important;min-height:1.2em!important;margin-left:6px!important;font-size:.9rem!important;font-weight:800!important;color:#283452!important}

/* Version 7.5 Word Race runner upgrade */
.cag-race-tools{display:flex!important;justify-content:center!important;align-items:center!important;gap:10px!important;flex-wrap:wrap!important;margin:10px 0!important}
.cag-race-stage{background:#68c7f2!important}
.cag-race-sky{position:absolute!important;inset:0 0 52% 0!important;background:linear-gradient(#5bbef0,#d9f4ff)!important;z-index:0!important}
.cag-race-road{position:absolute!important;left:6%!important;right:6%!important;top:34%!important;bottom:-2%!important;background:linear-gradient(#c67d46,#b86b37)!important;clip-path:polygon(39% 0,61% 0,100% 100%,0 100%)!important;z-index:1!important}
.cag-road-stripes{position:absolute!important;inset:0!important;background:repeating-linear-gradient(to bottom,transparent 0 32px,rgba(255,255,255,.76) 32px 44px,transparent 44px 78px)!important;opacity:.75!important}
.cag-race-stage.is-running .cag-road-stripes{animation:cag-road-scroll .52s linear infinite!important}.cag-race-stage.is-boosting .cag-road-stripes{animation-duration:.25s!important}
@keyframes cag-road-scroll{from{background-position-y:-78px}to{background-position-y:0}}
.cag-race-scenery{position:absolute!important;inset:18% 0 0!important;z-index:2!important;pointer-events:none!important}.cag-tree,.cag-balloon{position:absolute!important;filter:drop-shadow(0 4px 3px #0002)!important}.cag-tree{font-size:56px!important;bottom:20%!important}.t1{left:4%!important}.t2{right:5%!important;bottom:27%!important}.t3{left:11%!important;bottom:42%!important;font-size:42px!important}.cag-balloon{font-size:34px!important;top:8%!important}.b1{left:8%!important}.b2{right:10%!important;top:3%!important}
.cag-race-stage.is-running .cag-tree{animation:cag-scenery 2.2s linear infinite!important}.cag-race-stage.is-running .cag-balloon{animation:cag-balloon 2.6s ease-in-out infinite alternate!important}
@keyframes cag-scenery{from{transform:translateY(-4px) scale(.96)}to{transform:translateY(22px) scale(1.05)}}@keyframes cag-balloon{from{transform:translateY(0)}to{transform:translateY(-14px)}}
.cag-race-hurdle{top:120px!important;transform:translateX(-50%) scale(var(--cag-hurdle-scale,.45))!important;transform-origin:center top!important;transition:none!important}.cag-race-hurdle[data-lane="0"]{left:29%!important}.cag-race-hurdle[data-lane="1"]{left:50%!important}.cag-race-hurdle[data-lane="2"]{left:71%!important}
.cag-runner[data-lane="0"]{left:31%!important}.cag-runner[data-lane="1"]{left:50%!important}.cag-runner[data-lane="2"]{left:69%!important}.cag-runner{transition:left .2s cubic-bezier(.2,.8,.2,1),transform .18s ease!important}
.cag-speed-lines{position:absolute!important;inset:0!important;z-index:3!important;pointer-events:none!important;opacity:0!important;background:repeating-linear-gradient(100deg,transparent 0 28px,#ffffff61 28px 31px,transparent 31px 72px)!important}.cag-race-stage.is-boosting .cag-speed-lines{opacity:.7!important;animation:cag-speed .22s linear infinite!important}@keyframes cag-speed{from{transform:translateY(-16px)}to{transform:translateY(16px)}}
.cag-jump-button{background:#fff4a8!important;border-color:#e6b400!important}.cag-race-score small,.cag-race-level small{font-size:.82rem!important}
@media(max-width:760px){.cag-race-hurdle[data-lane="0"]{left:26%!important}.cag-race-hurdle[data-lane="1"]{left:50%!important}.cag-race-hurdle[data-lane="2"]{left:74%!important}}
@media(prefers-reduced-motion:reduce){.cag-race-stage.is-running .cag-road-stripes,.cag-race-stage.is-running .cag-tree,.cag-race-stage.is-running .cag-balloon,.cag-race-stage.is-boosting .cag-speed-lines{animation:none!important}}


/* Version 7.5.1 hurdle hit-area fix */
.cag-race-hurdle{
  pointer-events:auto!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
.cag-race-hurdle .cag-hurdle-frame,
.cag-race-hurdle .cag-hurdle-frame img,
.cag-race-hurdle .cag-hurdle-label{
  pointer-events:none!important;
}
.cag-race-hurdle:before{
  content:""!important;
  position:absolute!important;
  inset:-12px!important;
  border-radius:18px!important;
  pointer-events:auto!important;
}
.cag-race-hurdle.cag-hurdle-selected .cag-hurdle-frame{
  box-shadow:0 0 0 6px #fff200,0 8px 16px rgba(0,0,0,.22)!important;
}
.cag-race-hurdle:focus-visible .cag-hurdle-frame{
  outline:5px solid #fff200!important;
  outline-offset:4px!important;
}


/* Version 7.5.2 - stable full-hurdle hit zones */
.cag-race-hurdle{
  width:20%!important;
  min-width:0!important;
  max-width:none!important;
  height:235px!important;
  padding:0!important;
  margin:0!important;
  transform:translateX(-50%)!important;
  transform-origin:center top!important;
  background:transparent!important;
  border:0!important;
  overflow:visible!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
}
.cag-race-hurdle:before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  border-radius:18px!important;
  background:transparent!important;
  pointer-events:auto!important;
}
.cag-hurdle-visual{
  position:absolute!important;
  left:50%!important;
  top:0!important;
  width:100%!important;
  transform:translateX(-50%) scale(.45)!important;
  transform-origin:center top!important;
  pointer-events:none!important;
}
.cag-hurdle-visual .cag-hurdle-frame,
.cag-hurdle-visual .cag-hurdle-frame img,
.cag-hurdle-visual .cag-hurdle-label{
  pointer-events:none!important;
}
.cag-race-hurdle.cag-hurdle-selected:before{
  box-shadow:inset 0 0 0 3px rgba(255,242,0,.45)!important;
}
.cag-race-hurdle.cag-hurdle-selected .cag-hurdle-frame{
  box-shadow:0 0 0 6px #fff200,0 8px 16px rgba(0,0,0,.22)!important;
}
@media(max-width:760px){
  .cag-race-hurdle{width:22%!important;height:210px!important}
}
@media(max-width:520px){
  .cag-race-hurdle{width:24%!important;height:180px!important}
}


/* ===== Version 7.6 Word Race progression ===== */
.cag-race-countdown{
  position:absolute!important;left:50%!important;top:46%!important;transform:translate(-50%,-50%) scale(.7)!important;
  z-index:20!important;font-size:clamp(54px,9vw,110px)!important;font-weight:900!important;color:#fff!important;
  text-shadow:0 5px 0 #54238b,0 8px 22px rgba(0,0,0,.3)!important;opacity:0!important;pointer-events:none!important
}
.cag-race-countdown.show{opacity:1!important;transform:translate(-50%,-50%) scale(1)!important;transition:transform .18s ease!important}
.cag-race-checkpoint{
  position:absolute!important;left:50%!important;top:42%!important;transform:translate(-50%,-50%) scale(.8)!important;
  z-index:19!important;background:#fff!important;border:6px solid #f0b400!important;border-radius:24px!important;
  padding:18px 30px!important;text-align:center!important;box-shadow:0 10px 30px #0003!important;opacity:0!important;pointer-events:none!important
}
.cag-race-checkpoint strong{display:block!important;font-size:clamp(26px,4vw,46px)!important;color:#54238b!important}
.cag-race-checkpoint span{font-weight:900!important;color:#26324c!important}
.cag-race-checkpoint.show{opacity:1!important;transform:translate(-50%,-50%) scale(1)!important;transition:.22s ease!important}
.cag-race-demo{
  position:absolute!important;right:18px!important;top:70px!important;z-index:18!important;width:150px!important;
  background:#fff!important;border:4px solid #f0b400!important;border-radius:18px!important;padding:8px!important;
  text-align:center!important;box-shadow:0 6px 18px #0003!important;opacity:0!important;transform:translateY(-10px)!important;pointer-events:none!important
}
.cag-race-demo strong{display:block!important;color:#54238b!important;margin-bottom:4px!important}.cag-race-demo img{display:block!important;width:100%!important;height:100px!important;object-fit:contain!important}
.cag-race-demo.show{opacity:1!important;transform:translateY(0)!important;transition:.2s ease!important}
.cag-hurdle-cleared .cag-hurdle-visual{animation:cag-hurdle-pass .48s ease-in forwards!important}
@keyframes cag-hurdle-pass{to{transform:scale(1.45) translateY(170px)!important;opacity:0!important}}
@media(max-width:620px){.cag-race-demo{width:105px!important;right:8px!important;top:62px!important}.cag-race-demo img{height:70px!important}}
@media(prefers-reduced-motion:reduce){.cag-hurdle-cleared .cag-hurdle-visual{animation:none!important;opacity:0!important}}


/* ===== Version 7.7 Word Race polish ===== */
.cag-word-progress{
  width:min(420px,86%)!important;height:13px!important;margin:8px auto 0!important;
  border-radius:99px!important;background:#e6e9f2!important;overflow:hidden!important;border:2px solid #c2c9da!important
}
.cag-word-progress span{display:block!important;height:100%!important;width:0;background:linear-gradient(90deg,#43b15d,#8bd449)!important;transition:width .28s ease!important}

.cag-word-complete{
  position:absolute!important;left:50%!important;top:43%!important;transform:translate(-50%,-50%) scale(.75)!important;
  z-index:25!important;background:#fff!important;border:6px solid #49a961!important;border-radius:26px!important;
  padding:20px 34px!important;box-shadow:0 12px 34px rgba(0,0,0,.28)!important;text-align:center!important;
  opacity:0!important;pointer-events:none!important
}
.cag-word-complete strong{display:block!important;font-size:clamp(28px,4vw,48px)!important;color:#208847!important}
.cag-complete-word{display:block!important;margin-top:8px!important;font-size:clamp(30px,5vw,58px)!important;font-weight:900!important;color:#54238b!important;letter-spacing:.12em!important}
.cag-word-complete.show{opacity:1!important;transform:translate(-50%,-50%) scale(1)!important;transition:.22s ease!important}

.cag-section-transition{
  position:absolute!important;left:50%!important;top:63%!important;transform:translate(-50%,-50%) translateY(12px)!important;
  z-index:24!important;background:#54238b!important;color:#fff!important;border:4px solid #fff200!important;border-radius:20px!important;
  padding:13px 24px!important;text-align:center!important;opacity:0!important;pointer-events:none!important;box-shadow:0 9px 24px #0003!important
}
.cag-section-transition strong{display:block!important;font-size:1.35rem!important;color:#fff200!important}
.cag-section-transition span{display:block!important;font-weight:900!important;margin-top:3px!important}
.cag-section-transition.show{opacity:1!important;transform:translate(-50%,-50%) translateY(0)!important;transition:.2s ease!important}

.cag-race-word .done{position:relative!important}
.cag-race-word .done:after{content:"✓"!important;font-size:.42em!important;position:absolute!important;right:-.38em!important;top:-.3em!important;color:#248a47!important}

@media(max-width:560px){
  .cag-word-complete{padding:14px 18px!important;width:84%!important}
  .cag-section-transition{width:78%!important}
}
@media(prefers-reduced-motion:reduce){
  .cag-word-progress span,.cag-word-complete.show,.cag-section-transition.show{transition:none!important}
}

/* Version 7.8 race finish */
.cag-race-finish{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%) scale(.82)!important;z-index:40!important;width:min(620px,88%)!important;background:#fff!important;border:7px solid #54238b!important;border-radius:30px!important;padding:26px!important;text-align:center!important;box-shadow:0 18px 50px #0005!important;opacity:0!important;pointer-events:none!important}
.cag-race-finish.show{opacity:1!important;pointer-events:auto!important;transform:translate(-50%,-50%) scale(1)!important;transition:.24s ease!important}
.cag-race-finish>strong{display:block!important;font-size:clamp(30px,5vw,54px)!important;color:#54238b!important}
.cag-finish-stars{font-family:Arial,sans-serif!important;font-size:clamp(44px,7vw,78px)!important;letter-spacing:.08em!important;color:#f0b400!important;text-shadow:0 2px 0 #996e00!important;margin:8px 0 14px!important}
.cag-finish-stats{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:10px!important}.cag-finish-stats span{background:#eef5ff!important;border:2px solid #c7d4ed!important;border-radius:15px!important;padding:10px!important;font-weight:800!important}.cag-finish-stats b{display:block!important;font-size:1.35rem!important;color:#208847!important;margin-top:4px!important}
.cag-finish-actions{display:flex!important;gap:10px!important;justify-content:center!important;flex-wrap:wrap!important;margin-top:18px!important}
@media(max-width:540px){.cag-finish-stats{grid-template-columns:1fr!important}.cag-race-finish{padding:18px!important}}
@media(prefers-reduced-motion:reduce){.cag-race-finish.show{transition:none!important}}


/* =========================================================
   VERSION 7.9 — CATRIN & ABI® WORD RACE VISUAL PASS
   Visual-only upgrade. Gameplay/hit zones remain unchanged.
   ========================================================= */

/* Make the race the visual focus */
.cag-race-wrap{
  max-width:1180px!important;
  margin:0 auto!important;
  padding:12px!important;
  border-radius:30px!important;
  background:#f7f0df!important;
  border:4px solid #43266d!important;
  box-shadow:0 12px 0 rgba(67,38,109,.12)!important;
}
.cag-race-stage{
  min-height:620px!important;
  border:6px solid #43266d!important;
  border-radius:28px!important;
  overflow:hidden!important;
  box-shadow:inset 0 0 0 5px rgba(255,255,255,.65),0 10px 24px rgba(48,32,70,.18)!important;
}

/* Softer illustrated sky */
.cag-race-sky{
  background:
    radial-gradient(ellipse at 14% 17%,rgba(255,255,255,.95) 0 5%,transparent 5.5%),
    radial-gradient(ellipse at 20% 18%,rgba(255,255,255,.9) 0 7%,transparent 7.5%),
    radial-gradient(ellipse at 78% 12%,rgba(255,255,255,.92) 0 6%,transparent 6.5%),
    radial-gradient(ellipse at 84% 13%,rgba(255,255,255,.88) 0 8%,transparent 8.5%),
    linear-gradient(#73c9ef 0%,#c8effb 76%,#e8f8fd 100%)!important;
}

/* Grass verges beside the running track */
.cag-race-stage:before{
  content:""!important;
  position:absolute!important;
  left:0!important;right:0!important;top:31%!important;bottom:0!important;
  background:
    linear-gradient(102deg,#69a94c 0 25%,transparent 25.5% 74.5%,#69a94c 75% 100%)!important;
  z-index:1!important;
  pointer-events:none!important;
}
.cag-race-stage:after{
  content:""!important;
  position:absolute!important;
  left:0!important;right:0!important;top:34%!important;bottom:0!important;
  background:
    linear-gradient(102deg,rgba(255,255,255,.22) 0 1.5%,transparent 1.8% 98.2%,rgba(255,255,255,.22) 98.5% 100%)!important;
  z-index:2!important;
  pointer-events:none!important;
}

/* Running track */
.cag-race-road{
  left:5%!important;right:5%!important;top:31%!important;bottom:-4%!important;
  background:
    repeating-linear-gradient(to bottom,rgba(255,255,255,.04) 0 2px,transparent 2px 13px),
    linear-gradient(#c47a45,#a85d35)!important;
  clip-path:polygon(39% 0,61% 0,98% 100%,2% 100%)!important;
  border-left:5px solid rgba(255,255,255,.8)!important;
  border-right:5px solid rgba(255,255,255,.8)!important;
}
.cag-road-stripes{
  background:
    linear-gradient(90deg,transparent 0 32%,rgba(255,255,255,.78) 32% 33%,transparent 33% 66%,rgba(255,255,255,.78) 66% 67%,transparent 67%),
    repeating-linear-gradient(to bottom,transparent 0 36px,rgba(255,255,255,.52) 36px 41px,transparent 41px 84px)!important;
  opacity:.72!important;
}

/* Replace emoji scenery with simple C&A-like cut-paper landscape shapes */
.cag-race-scenery{
  inset:22% 0 0!important;
  z-index:3!important;
}
.cag-tree,.cag-balloon{
  font-size:0!important;
  filter:none!important;
}
.cag-tree:before{
  content:""!important;
  position:absolute!important;
  width:34px!important;height:82px!important;
  background:#765236!important;
  border-radius:14px 14px 5px 5px!important;
  left:50%!important;bottom:0!important;transform:translateX(-50%)!important;
  box-shadow:inset -7px 0 rgba(0,0,0,.08)!important;
}
.cag-tree:after{
  content:""!important;
  position:absolute!important;
  width:108px!important;height:108px!important;
  border-radius:46% 54% 48% 52%!important;
  background:#4e9a4e!important;
  border:4px solid #36763a!important;
  left:50%!important;bottom:58px!important;transform:translateX(-50%) rotate(-5deg)!important;
  box-shadow:32px 12px 0 -14px #65ad56,-30px 15px 0 -18px #79bb61!important;
}
.t1{left:5%!important;bottom:18%!important}.t2{right:6%!important;bottom:23%!important}.t3{left:13%!important;bottom:42%!important;transform:scale(.72)!important}
.cag-balloon:before{
  content:""!important;
  position:absolute!important;
  width:40px!important;height:52px!important;
  border-radius:52% 48% 50% 50%!important;
  background:#e5bb39!important;
  border:3px solid #9d7620!important;
}
.cag-balloon:after{
  content:""!important;
  position:absolute!important;
  width:2px!important;height:62px!important;
  background:#6f6357!important;
  left:19px!important;top:48px!important;
}
.b2:before{background:#b86aa1!important;border-color:#78476b!important}

/* HUD now resembles chunky handmade game cards */
.cag-race-hud{
  gap:12px!important;
  align-items:stretch!important;
}
.cag-race-score,.cag-race-level,.cag-race-wordbox{
  background:#fffdf6!important;
  border:4px solid #43266d!important;
  border-radius:20px!important;
  box-shadow:0 5px 0 rgba(67,38,109,.13)!important;
}
.cag-race-score,.cag-race-level{
  padding:12px 18px!important;
  color:#34204f!important;
}
.cag-race-wordbox{
  padding:10px 22px 12px!important;
}
.cag-race-wordbox>div:first-child{
  color:#43266d!important;
  letter-spacing:.12em!important;
}
.cag-race-word{
  color:#262238!important;
  text-shadow:none!important;
}
.cag-race-word .current{
  display:inline-block!important;
  background:#f5d84e!important;
  color:#2e2140!important;
  border:3px solid #8b6b13!important;
  border-radius:12px!important;
  padding:1px 7px!important;
  transform:rotate(-1deg)!important;
}
.cag-race-word .done{
  color:#287743!important;
}

/* Controls: tactile but not arcade/gambling-like */
.cag-race-tools{
  background:#fffdf6!important;
  border:3px solid #d9c9ad!important;
  border-radius:18px!important;
  padding:10px!important;
}
.cag-race-tools label{
  color:#34204f!important;
  font-weight:800!important;
}
.cag-race-tools .cag-select{
  background:#fff!important;
  border:3px solid #43266d!important;
  border-radius:12px!important;
  color:#2f2440!important;
}
.cag-race-tools .cag-btn,.cag-race-control{
  border:3px solid #43266d!important;
  border-radius:14px!important;
  box-shadow:0 4px 0 #43266d!important;
  transform:translateY(-2px)!important;
}
.cag-race-tools .cag-btn:active,.cag-race-control:active{
  box-shadow:0 1px 0 #43266d!important;
  transform:translateY(1px)!important;
}

/* Meters */
.cag-race-meters{
  background:#fffdf6!important;
  border:3px solid #d9c9ad!important;
  border-radius:16px!important;
  padding:8px 12px!important;
}
.cag-meter-track{
  border:2px solid #6d5b82!important;
  background:#e9e3ee!important;
  border-radius:99px!important;
}
.cag-meter-fill{
  border-radius:99px!important;
}

/* Stage banner becomes a proper race marker */
.cag-race-banner{
  top:18px!important;
  left:50%!important;
  transform:translateX(-50%) rotate(-.5deg)!important;
  width:auto!important;
  min-width:220px!important;
  padding:8px 18px!important;
  background:#fff8d9!important;
  color:#43266d!important;
  border:4px solid #43266d!important;
  border-radius:12px!important;
  box-shadow:0 5px 0 rgba(67,38,109,.15)!important;
  z-index:12!important;
}

/* Hurdle artwork framed like physical Catrin & Abi learning cards.
   Hit-zone dimensions are deliberately untouched. */
.cag-hurdle-frame{
  background:#fffdf7!important;
  border:5px solid #43266d!important;
  border-radius:18px!important;
  padding:7px!important;
  box-shadow:0 7px 0 rgba(67,38,109,.2),0 10px 16px rgba(0,0,0,.12)!important;
}
.cag-hurdle-frame img{
  background:#fff!important;
  border-radius:11px!important;
}
.cag-hurdle-label{
  margin-top:7px!important;
  display:inline-block!important;
  min-width:54px!important;
  background:#f4d64f!important;
  color:#2c2140!important;
  border:3px solid #7d6215!important;
  border-radius:12px!important;
  padding:3px 10px!important;
  font-weight:900!important;
  box-shadow:0 3px 0 rgba(125,98,21,.25)!important;
}

/* Runner: stronger separation from track */
.cag-runner img{
  filter:drop-shadow(0 7px 4px rgba(52,32,79,.25))!important;
}
.cag-runner.boost img{
  filter:drop-shadow(0 0 9px rgba(245,216,78,.95)) drop-shadow(0 8px 4px rgba(52,32,79,.25))!important;
}

/* Feedback speech-bubble feel */
.cag-race-feedback{
  border-radius:20px!important;
  border:4px solid #43266d!important;
  box-shadow:0 6px 0 rgba(67,38,109,.16)!important;
  font-weight:900!important;
}
.cag-race-feedback.good{background:#eef9e9!important;color:#23633b!important}
.cag-race-feedback.bad{background:#fff1ed!important;color:#8a3d32!important}

/* End screens harmonised with the visual language */
.cag-word-complete,.cag-race-checkpoint,.cag-race-finish{
  background:#fffdf6!important;
  border-color:#43266d!important;
  box-shadow:0 10px 0 rgba(67,38,109,.14),0 18px 40px rgba(0,0,0,.22)!important;
}
.cag-race-finish>strong,.cag-word-complete strong,.cag-race-checkpoint strong{
  color:#43266d!important;
}
.cag-finish-stars{color:#e6b933!important}

/* Mobile visual simplification */
@media(max-width:760px){
  .cag-race-wrap{padding:7px!important;border-width:3px!important;border-radius:22px!important}
  .cag-race-stage{min-height:540px!important;border-width:4px!important;border-radius:20px!important}
  .cag-race-score,.cag-race-level{padding:8px!important}
  .cag-race-wordbox{padding:8px 10px!important}
  .cag-race-banner{top:10px!important;min-width:180px!important;padding:6px 10px!important}
  .t3,.b2{display:none!important}
}
@media(max-width:520px){
  .cag-race-stage{min-height:500px!important}
  .cag-race-tools{padding:7px!important}
  .cag-race-banner{font-size:.8rem!important}
}


/* =========================================================
   VERSION 8.0 — MAJOR WORD RACE VISUAL / MOTION PROTOTYPE
   ========================================================= */

.cag-race-stage{
  perspective:900px!important;
  perspective-origin:50% 42%!important;
  min-height:680px!important;
  background:#bfeafa!important;
  isolation:isolate!important;
}

/* Deep sky */
.cag-race-sky{inset:0 0 48%!important;overflow:hidden!important}
.cag-cloud{
  position:absolute!important;width:120px!important;height:38px!important;background:#fff!important;border-radius:50px!important;
  opacity:.88!important;box-shadow:35px -15px 0 8px #fff,70px 0 0 2px #fff!important
}
.cloud-a{left:8%!important;top:22%!important;transform:scale(.7)!important}
.cloud-b{right:13%!important;top:12%!important;transform:scale(.5)!important}
.cloud-c{left:48%!important;top:28%!important;transform:scale(.38)!important}
.cag-race-stage.is-running .cloud-a{animation:cag-cloud-drift 18s linear infinite!important}
.cag-race-stage.is-running .cloud-b{animation:cag-cloud-drift 25s linear infinite reverse!important}
@keyframes cag-cloud-drift{from{translate:-30px 0}to{translate:70px 0}}

/* Far hills create depth */
.cag-world-far{position:absolute!important;left:0!important;right:0!important;top:24%!important;height:30%!important;z-index:1!important;pointer-events:none!important;overflow:hidden!important}
.cag-hill{position:absolute!important;bottom:-35%!important;width:46%!important;height:95%!important;border-radius:50% 50% 0 0!important;background:#7dbb67!important;border-top:4px solid #5f9853!important}
.hill-a{left:-8%!important;transform:rotate(4deg)!important}.hill-b{left:30%!important;width:52%!important;background:#91c777!important}.hill-c{right:-12%!important;background:#6fa85e!important}
.cag-race-stage.is-running .cag-world-far{animation:cag-far-bob 2.2s ease-in-out infinite!important}
@keyframes cag-far-bob{50%{transform:translateY(2px)}}

/* Mid-depth bushes */
.cag-world-mid{position:absolute!important;inset:36% 0 10% 0!important;z-index:3!important;pointer-events:none!important}
.cag-bush{position:absolute!important;width:82px!important;height:48px!important;background:#4f984e!important;border:3px solid #39743b!important;border-radius:55% 45% 35% 40%!important;box-shadow:35px 8px 0 -7px #65a858!important}
.bush-a{left:4%!important;top:12%!important}.bush-b{right:7%!important;top:21%!important}.bush-c{left:11%!important;top:48%!important;transform:scale(1.25)!important}.bush-d{right:12%!important;top:58%!important;transform:scale(1.35)!important}
.cag-race-stage.is-running .cag-bush{animation:cag-mid-rush 1.45s linear infinite!important}
.cag-race-stage.is-boosting .cag-bush{animation-duration:.72s!important}
@keyframes cag-mid-rush{0%{translate:0 -8px;scale:.88}100%{translate:0 36px;scale:1.14}}

/* Strong perspective track */
.cag-race-road{
  top:33%!important;left:0!important;right:0!important;bottom:-8%!important;
  clip-path:polygon(46% 0,54% 0,96% 100%,4% 100%)!important;
  transform-origin:50% 0!important;
  background:
    repeating-linear-gradient(to bottom,rgba(255,255,255,.035) 0 3px,transparent 3px 18px),
    linear-gradient(#bd7040,#9c5131)!important;
  z-index:4!important;
}
.cag-road-stripes{
  background:
    linear-gradient(90deg,transparent 0 32.7%,rgba(255,255,255,.92) 32.7% 33.5%,transparent 33.5% 66.5%,rgba(255,255,255,.92) 66.5% 67.3%,transparent 67.3%),
    repeating-linear-gradient(to bottom,transparent 0 50px,rgba(255,255,255,.34) 50px 56px,transparent 56px 112px)!important;
  transform-origin:center top!important;
}
.cag-race-stage.is-running .cag-road-stripes{animation:cag-road-fast .62s linear infinite!important}
.cag-race-stage.is-boosting .cag-road-stripes{animation-duration:.29s!important}
@keyframes cag-road-fast{from{background-position-y:-112px}to{background-position-y:0}}

.cag-track-shadow{position:absolute!important;inset:0!important;box-shadow:inset 120px 0 90px -120px #0004,inset -120px 0 90px -120px #0004!important}

/* Fast foreground verge streaks */
.cag-trackside{position:absolute!important;top:45%!important;bottom:0!important;width:21%!important;z-index:5!important;pointer-events:none!important;opacity:.72!important;
 background:repeating-linear-gradient(to bottom,transparent 0 48px,rgba(255,255,255,.55) 48px 53px,transparent 53px 100px)!important}
.cag-trackside-left{left:0!important;transform:skewY(-12deg)!important}.cag-trackside-right{right:0!important;transform:skewY(12deg)!important}
.cag-race-stage.is-running .cag-trackside{animation:cag-verge-rush .52s linear infinite!important}
.cag-race-stage.is-boosting .cag-trackside{animation-duration:.22s!important}
@keyframes cag-verge-rush{from{background-position-y:-100px}to{background-position-y:0}}

/* Hurdles now emerge from the vanishing point.
   Existing large invisible hit boxes are preserved. */
.cag-race-lanes{z-index:11!important}
.cag-hurdle-visual{
  transform-origin:50% 12%!important;
  will-change:transform,opacity!important;
  filter:drop-shadow(0 7px 6px rgba(0,0,0,.18))!important;
}
.cag-hurdle-frame{
  border-width:4px!important;
  background:#fffdf6!important;
}
.cag-race-stage.is-running .cag-hurdle-frame{animation:cag-hurdle-float .45s ease-in-out infinite alternate!important}
@keyframes cag-hurdle-float{from{translate:0 -1px}to{translate:0 2px}}

/* Runner motion */
.cag-runner{z-index:14!important;bottom:30px!important;transform-origin:50% 100%!important;will-change:left,transform!important}
.cag-runner.running img{animation:cag-abi-run .24s ease-in-out infinite alternate!important}
@keyframes cag-abi-run{
  from{transform:translateY(0) rotate(-1.3deg) scaleY(1)}
  to{transform:translateY(-7px) rotate(1.3deg) scaleY(.985)}
}
.cag-runner[data-lane="0"]{transform:rotate(-4deg)!important}.cag-runner[data-lane="2"]{transform:rotate(4deg)!important}
.cag-runner.jumping{animation:cag-abi-real-jump .64s cubic-bezier(.18,.75,.25,1)!important}
@keyframes cag-abi-real-jump{
  0%{translate:0 0;scale:1}
  42%{translate:0 -145px;scale:1.06}
  72%{translate:0 -110px;scale:1.04}
  100%{translate:0 0;scale:1}
}
.cag-runner.stumble{animation:cag-abi-stumble2 .52s ease!important}
@keyframes cag-abi-stumble2{
  0%{transform:rotate(0) translateX(0)}
  25%{transform:rotate(10deg) translateX(16px) translateY(5px)}
  48%{transform:rotate(-7deg) translateX(-9px) translateY(10px)}
  72%{transform:rotate(4deg) translateX(5px)}
  100%{transform:rotate(0) translateX(0)}
}
.cag-runner.boost{animation:cag-boost-pulse .28s ease-in-out infinite alternate!important}
@keyframes cag-boost-pulse{to{filter:brightness(1.08);scale:1.035}}

/* Camera language */
.cag-race-stage.is-running{animation:cag-camera-run .34s ease-in-out infinite alternate!important}
@keyframes cag-camera-run{from{background-position:0 0}to{background-position:0 2px}}
.cag-race-stage.camera-jump .cag-world-far,
.cag-race-stage.camera-jump .cag-world-mid,
.cag-race-stage.camera-jump .cag-race-road{translate:0 10px!important}
.cag-race-stage.camera-land{animation:cag-camera-land .18s ease!important}
@keyframes cag-camera-land{50%{transform:translateY(5px) scaleY(.995)}}
.cag-race-stage.camera-stumble{animation:cag-camera-shake .1s linear 4!important}
@keyframes cag-camera-shake{0%{transform:translateX(-4px)}100%{transform:translateX(4px)}}
.cag-race-stage.camera-boost .cag-world-mid{filter:blur(.5px)!important}

/* Speed streaks from sides, leaving learning content readable */
.cag-speed-lines{
  background:
    linear-gradient(100deg,transparent 0 10%,rgba(255,255,255,.7) 10.5% 11%,transparent 11.5% 89%,rgba(255,255,255,.7) 89.5% 90%,transparent 90.5%)!important;
  mix-blend-mode:screen!important;
}

/* Cleaner HUD floats over world */
.cag-race-hud{position:relative!important;z-index:30!important}
.cag-race-wordbox{transform:translateY(2px)!important}
.cag-race-score,.cag-race-level{min-width:130px!important}

/* Start / finish line feeling during countdown */
.cag-race-countdown:after{
  content:""!important;position:absolute!important;left:50%!important;top:115%!important;width:260px!important;height:20px!important;transform:translateX(-50%) perspective(200px) rotateX(55deg)!important;
  background:repeating-linear-gradient(90deg,#fff 0 20px,#43266d 20px 40px)!important;border:2px solid #43266d!important
}

/* Tablet/mobile preserve depth but reduce motion load */
@media(max-width:760px){
  .cag-race-stage{min-height:590px!important;perspective:700px!important}
  .cag-world-mid{opacity:.78!important}
  .cag-runner{bottom:22px!important}
}
@media(max-width:520px){
  .cag-race-stage{min-height:550px!important}
  .bush-c,.bush-d,.cloud-c{display:none!important}
}
@media(prefers-reduced-motion:reduce){
  .cag-race-stage.is-running,.cag-runner.running img,.cag-race-stage.is-running .cag-bush,.cag-race-stage.is-running .cag-trackside,.cag-race-stage.is-running .cag-hurdle-frame{animation:none!important}
  .cag-runner.jumping{animation-duration:.01ms!important}
}

/* v8.0.1 runner asset correction */
.cag-runner img{
  width:auto!important;
  max-width:230px!important;
  max-height:315px!important;
  object-fit:contain!important;
  object-position:center bottom!important;
}
.cag-runner[data-lane="0"] img,.cag-runner[data-lane="2"] img{max-width:245px!important}
@media(max-width:760px){.cag-runner img{max-width:190px!important;max-height:270px!important}}
@media(max-width:520px){.cag-runner img{max-width:160px!important;max-height:235px!important}}


/* =========================================================
   VERSION 8.2 — FINAL-DIRECTION WORD RACE VISUAL MILESTONE
   Catrin & Abi tactile / felt / storybook runner aesthetic
   ========================================================= */

/* Main stage: larger, cleaner, much closer to a game canvas */
.cag-race-stage{
  min-height:760px!important;
  border:8px solid #fff!important;
  border-radius:32px!important;
  box-shadow:
    inset 0 0 0 4px rgba(72,38,110,.28),
    inset 0 -18px 30px rgba(67,38,109,.10)!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 82% 12%,rgba(255,255,255,.48),transparent 22%),
    linear-gradient(#bfeafb 0 42%,#86c86f 42% 100%)!important;
}

/* Subtle tactile grain, like paper/felt rather than flat vector graphics */
.cag-race-stage:before{
  content:""!important;
  position:absolute!important;inset:0!important;z-index:28!important;pointer-events:none!important;
  opacity:.09!important;
  background-image:
    repeating-radial-gradient(circle at 0 0,rgba(70,40,20,.45) 0 0.7px,transparent .8px 3px)!important;
  mix-blend-mode:multiply!important;
}

/* Storybook sun */
.cag-sun{
  position:absolute!important;right:7%!important;top:9%!important;width:88px!important;height:88px!important;
  border-radius:50%!important;background:#f7ce3c!important;border:5px solid #e5ad19!important;
  box-shadow:0 0 0 9px rgba(255,226,88,.30)!important;
}

/* Softer felt clouds */
.cag-cloud{
  background:#f9fbff!important;border:3px solid rgba(93,133,159,.16)!important;
  box-shadow:34px -14px 0 8px #f9fbff,68px 0 0 2px #f9fbff,0 5px 0 rgba(81,120,145,.10)!important;
}

/* Welsh-storybook rolling hills with sewn edge */
.cag-world-far{top:25%!important;height:33%!important}
.cag-hill{
  bottom:-40%!important;
  background:#76b86b!important;
  border-top:5px dashed rgba(255,255,255,.72)!important;
  box-shadow:inset 0 10px 0 rgba(42,103,52,.15)!important;
}
.hill-b{background:#98c77e!important}.hill-c{background:#64a95d!important}

/* Stylised felt trees instead of emoji scenery */
.cag-felt-tree{
  position:absolute!important;bottom:8%!important;width:34px!important;height:72px!important;z-index:2!important;
  background:#6d432b!important;border-radius:8px!important;
  box-shadow:0 3px 0 rgba(0,0,0,.08)!important;
}
.cag-felt-tree:before,.cag-felt-tree:after{
  content:""!important;position:absolute!important;left:50%!important;transform:translateX(-50%)!important;border-radius:50%!important;
  background:#438348!important;border:3px dashed rgba(255,255,255,.35)!important;
}
.cag-felt-tree:before{width:86px!important;height:70px!important;bottom:34px!important}
.cag-felt-tree:after{width:64px!important;height:58px!important;bottom:61px!important;background:#57995b!important}
.far-tree-a{left:10%!important;transform:scale(.58)!important}
.far-tree-b{right:11%!important;transform:scale(.70)!important}
.far-tree-c{left:23%!important;transform:scale(.46)!important}

/* Branded start/route gantry */
.cag-race-gantry{
  position:absolute!important;z-index:6!important;left:50%!important;top:25%!important;width:34%!important;height:112px!important;
  transform:translateX(-50%) scale(.58)!important;transform-origin:center top!important;pointer-events:none!important;
}
.cag-gantry-post{
  position:absolute!important;top:36px!important;width:22px!important;height:110px!important;border-radius:9px!important;
  background:#6b3f27!important;border:3px solid #4d2d1d!important;
  box-shadow:inset 5px 0 rgba(255,255,255,.12)!important;
}
.cag-gantry-left{left:6%!important}.cag-gantry-right{right:6%!important}
.cag-gantry-sign{
  position:absolute!important;left:50%!important;top:0!important;transform:translateX(-50%)!important;
  width:72%!important;height:74px!important;border-radius:20px!important;background:#fff!important;
  border:5px solid #603b80!important;box-shadow:0 7px 0 rgba(64,34,89,.18)!important;
  display:flex!important;align-items:center!important;justify-content:center!important;padding:8px 16px!important;
}
.cag-gantry-sign img{max-width:92%!important;max-height:54px!important;object-fit:contain!important}
.cag-bunting{position:absolute!important;left:12%!important;right:12%!important;top:76px!important;display:flex!important;justify-content:space-between!important}
.cag-bunting i{
  width:0!important;height:0!important;border-left:10px solid transparent!important;border-right:10px solid transparent!important;
  border-top:22px solid #ef5d94!important;filter:drop-shadow(0 2px 0 rgba(0,0,0,.08))!important
}
.cag-bunting i:nth-child(2),.cag-bunting i:nth-child(6){border-top-color:#efbf24!important}
.cag-bunting i:nth-child(3),.cag-bunting i:nth-child(7){border-top-color:#4dbac9!important}
.cag-bunting i:nth-child(4){border-top-color:#6f4691!important}
.cag-bunting i:nth-child(5){border-top-color:#61a962!important}

/* Branded track signs */
.cag-track-sign{
  position:absolute!important;min-width:94px!important;padding:9px 13px!important;border-radius:12px!important;
  background:#fff!important;border:4px solid #69418c!important;color:#4b2c68!important;
  font-weight:800!important;text-align:center!important;box-shadow:0 5px 0 rgba(47,33,56,.13)!important;
  transform:scale(.72)!important
}
.track-sign-a{left:4%!important;top:31%!important;rotate:-4deg!important}
.track-sign-b{right:6%!important;top:42%!important;rotate:5deg!important;color:#d23e79!important}

/* Felt bushes */
.cag-bush{
  background:#4f9852!important;border:4px dashed rgba(255,255,255,.42)!important;
  box-shadow:34px 8px 0 -7px #65a858, inset 0 7px rgba(255,255,255,.08)!important;
}

/* Track: stitched rust-orange felt with clear white lanes */
.cag-race-road{
  top:34%!important;
  clip-path:polygon(47.5% 0,52.5% 0,92% 100%,8% 100%)!important;
  background:
    repeating-linear-gradient(to bottom,rgba(255,255,255,.035) 0 3px,transparent 3px 16px),
    linear-gradient(90deg,#9d4b35,#b96343 18%,#c66c49 50%,#b96343 82%,#9d4b35)!important;
  border-top:3px solid rgba(255,255,255,.35)!important
}
.cag-road-stripes{
  background:
    linear-gradient(90deg,transparent 0 33%,rgba(255,255,255,.95) 33% 33.7%,transparent 33.7% 66.3%,rgba(255,255,255,.95) 66.3% 67%,transparent 67%),
    repeating-linear-gradient(to bottom,transparent 0 52px,rgba(255,255,255,.33) 52px 57px,transparent 57px 108px)!important;
}
.cag-track-stitch{
  position:absolute!important;top:0!important;bottom:0!important;width:3px!important;z-index:2!important;
  border-left:3px dashed rgba(255,239,215,.78)!important
}
.cag-track-stitch-left{left:6%!important}.cag-track-stitch-right{right:6%!important}

/* Grass verges with fast stitched rush marks */
.cag-trackside{
  width:23%!important;
  background:
    repeating-linear-gradient(to bottom,transparent 0 55px,rgba(255,255,255,.26) 55px 59px,transparent 59px 110px),
    linear-gradient(90deg,#4b9a50,#69b967)!important;
  opacity:.92!important;
}

/* Spectator strips: abstract tactile crowd, intentionally not literal people */
.cag-spectator-strip{
  position:absolute!important;z-index:7!important;bottom:6%!important;width:9%!important;height:30%!important;pointer-events:none!important;
  opacity:.84!important;
  background:
    radial-gradient(circle at 50% 12%,#f0b897 0 9px,transparent 10px),
    radial-gradient(circle at 25% 28%,#8b5f43 0 8px,transparent 9px),
    radial-gradient(circle at 75% 30%,#d59a76 0 9px,transparent 10px),
    repeating-linear-gradient(to bottom,#6d4590 0 18px,#ef5d94 18px 34px,#4dbac9 34px 50px,#f0c531 50px 66px)!important;
  border-radius:40px 40px 12px 12px!important;border:3px dashed rgba(255,255,255,.55)!important;
}
.cag-spectator-left{left:1.5%!important;transform:rotate(6deg)!important}
.cag-spectator-right{right:1.5%!important;transform:rotate(-6deg)!important}

/* Hurdles: designed as physical BSL learning boards */
.cag-race-hurdle{height:215px!important}
.cag-hurdle-visual{
  filter:drop-shadow(0 12px 8px rgba(60,37,34,.22))!important;
}
.cag-hurdle-frame{
  width:122px!important;height:122px!important;border-radius:22px!important;
  border:6px solid #fff!important;
  outline:4px solid #654182!important;
  background:
    radial-gradient(circle at 20% 15%,rgba(255,255,255,.9),transparent 25%),
    #fffdf8!important;
  box-shadow:inset 0 0 0 3px rgba(238,93,148,.18)!important;
}
.cag-hurdle-frame:after{
  content:""!important;position:absolute!important;left:10px!important;right:10px!important;bottom:-25px!important;height:24px!important;
  border-left:9px solid #6b412c!important;border-right:9px solid #6b412c!important;border-bottom:7px solid #6b412c!important;
  border-radius:0 0 7px 7px!important
}
.cag-hurdle-frame img{max-width:102px!important;max-height:102px!important}
.cag-hurdle-label{
  margin-top:38px!important;
  min-width:76px!important;
  background:#4b2c68!important;color:#fff!important;border:4px solid #fff!important;outline:2px solid #4b2c68!important;
  border-radius:18px!important;font-size:27px!important;font-weight:900!important;padding:5px 13px!important;
}
.cag-race-hurdle.cag-hurdle-selected .cag-hurdle-frame{
  outline-color:#ef4f90!important;
  box-shadow:0 0 0 8px rgba(239,79,144,.20), inset 0 0 0 3px rgba(239,79,144,.18)!important;
}

/* Wrong hurdle physically recoils rather than merely showing text */
.cag-race-hurdle.wrong-impact .cag-hurdle-visual{animation:cag-hurdle-crash .48s ease!important}
@keyframes cag-hurdle-crash{
  0%{transform:scale(1) rotate(0)}
  22%{transform:scale(1.08) rotate(8deg)}
  48%{transform:scale(.96) rotate(-9deg)}
  74%{transform:scale(1.02) rotate(4deg)}
  100%{transform:scale(1) rotate(0)}
}

/* Abi runner is now the visual hero */
.cag-runner{
  bottom:24px!important;
  z-index:18!important;
  filter:drop-shadow(0 8px 7px rgba(60,34,31,.19))!important;
}
.cag-runner img{
  max-width:270px!important;
  max-height:360px!important;
  image-rendering:auto!important;
}
.cag-runner.lane-left img{transform-origin:50% 90%!important}
.cag-runner.lane-right img{transform-origin:50% 90%!important}
.cag-runner.running img{animation:cag-abi-final-run .20s cubic-bezier(.35,0,.65,1) infinite alternate!important}
@keyframes cag-abi-final-run{
  from{transform:translateY(0) rotate(-1deg) scale(1)}
  to{transform:translateY(-9px) rotate(1deg) scale(1.015,.985)}
}

/* Ground shadow anchors Abi in the world */
.cag-runner-shadow{
  position:absolute!important;z-index:13!important;left:50%!important;bottom:34px!important;width:125px!important;height:28px!important;
  transform:translateX(-50%)!important;border-radius:50%!important;background:rgba(57,37,29,.23)!important;filter:blur(4px)!important;
  transition:left .2s ease,width .2s ease,opacity .2s ease,transform .2s ease!important
}
.cag-race-stage[data-camera-lane="0"] .cag-runner-shadow{left:25%!important}
.cag-race-stage[data-camera-lane="2"] .cag-runner-shadow{left:75%!important}
.cag-race-stage.camera-jump .cag-runner-shadow{width:76px!important;opacity:.10!important;transform:translateX(-50%) scale(.75)!important}
.cag-race-stage.is-boosting .cag-runner-shadow{width:145px!important;opacity:.27!important}

/* Stronger jump */
.cag-runner.jumping{animation:cag-abi-final-jump .66s cubic-bezier(.16,.8,.28,1)!important}
@keyframes cag-abi-final-jump{
  0%{translate:0 0;scale:1}
  18%{translate:0 -45px;scale:1.02}
  50%{translate:0 -190px;scale:1.08}
  72%{translate:0 -128px;scale:1.05}
  100%{translate:0 0;scale:1}
}

/* Better lane motion */
.cag-runner[data-lane="0"]{left:22%!important}
.cag-runner[data-lane="1"]{left:50%!important}
.cag-runner[data-lane="2"]{left:78%!important}
.cag-runner{transition:left .22s cubic-bezier(.2,.7,.25,1),filter .2s ease!important}

/* Speed tunnel during boost */
.cag-race-stage.camera-boost{
  animation:cag-camera-boost .30s ease-in-out infinite alternate!important;
}
@keyframes cag-camera-boost{
  from{filter:saturate(1) brightness(1)}
  to{filter:saturate(1.08) brightness(1.025)}
}
.cag-race-stage.camera-boost .cag-trackside{
  filter:blur(.8px)!important;
}
.cag-race-stage.camera-boost .cag-world-mid{
  filter:blur(1px)!important;
}

/* Correct answer: patchwork celebration burst behind Abi */
.cag-success-burst{
  position:absolute!important;z-index:17!important;left:50%!important;bottom:145px!important;width:20px!important;height:20px!important;
  transform:translateX(-50%)!important;pointer-events:none!important;opacity:0!important
}
.cag-success-burst i{
  position:absolute!important;width:15px!important;height:15px!important;border-radius:3px!important;background:#ef5d94!important;
  transform-origin:50% 80px!important
}
.cag-success-burst i:nth-child(2){background:#f2c52f!important;rotate:45deg!important}
.cag-success-burst i:nth-child(3){background:#4dbac9!important;rotate:90deg!important}
.cag-success-burst i:nth-child(4){background:#6d4590!important;rotate:135deg!important}
.cag-success-burst i:nth-child(5){background:#5aa75a!important;rotate:180deg!important}
.cag-success-burst i:nth-child(6){background:#ef5d94!important;rotate:225deg!important}
.cag-success-burst i:nth-child(7){background:#f2c52f!important;rotate:270deg!important}
.cag-success-burst i:nth-child(8){background:#4dbac9!important;rotate:315deg!important}
.cag-success-burst.play{opacity:1!important}
.cag-success-burst.play i{animation:cag-patch-pop .62s ease-out forwards!important}
@keyframes cag-patch-pop{
  0%{transform:translateY(0) scale(.5);opacity:0}
  20%{opacity:1}
  100%{transform:translateY(-115px) scale(1.25) rotate(100deg);opacity:0}
}

/* Wrong answer collision cue */
.cag-collision-flash{
  position:absolute!important;z-index:19!important;left:50%!important;bottom:180px!important;width:110px!important;height:110px!important;
  transform:translateX(-50%) scale(.2)!important;border-radius:50%!important;border:12px solid rgba(228,67,75,.0)!important;
  pointer-events:none!important
}
.cag-collision-flash.play{animation:cag-collision-ring .45s ease-out!important}
@keyframes cag-collision-ring{
  0%{transform:translateX(-50%) scale(.2);border-color:rgba(228,67,75,.85);opacity:1}
  100%{transform:translateX(-50%) scale(1.3);border-color:rgba(228,67,75,0);opacity:0}
}

/* HUD: move toward finished game interface */
.cag-race-hud{
  gap:14px!important;margin-bottom:10px!important;
}
.cag-race-score,.cag-race-level,.cag-race-wordbox{
  border:4px solid #fff!important;outline:2px solid #634081!important;
  box-shadow:0 5px 0 rgba(54,34,68,.11)!important;
}
.cag-race-wordbox{
  background:linear-gradient(#fff,#fff9fb)!important;
  border-radius:20px!important;
}
.cag-race-word span{
  border-radius:12px!important;padding:3px 7px!important
}
.cag-race-word span.current{
  background:#fff0f7!important;box-shadow:0 0 0 3px #ef5d94!important
}

/* Controls should look like a game console, not form controls */
.cag-race-controls{
  margin-top:12px!important;padding:12px!important;border-radius:24px!important;
  background:rgba(255,255,255,.92)!important;border:3px solid rgba(100,64,129,.25)!important;
}
.cag-race-control{
  border:4px solid #fff!important;outline:2px solid #604080!important;
  box-shadow:0 5px 0 rgba(60,39,74,.15)!important;
  font-weight:900!important
}
.cag-jump-button{
  background:#ef5d94!important;color:#fff!important
}

/* Make the selected game significantly wider to reduce scrolling */
.cag-game-area,.cag-expanded .cag-game-area{
  max-width:1480px!important;
}
.cag-expanded .cag-panel{
  max-width:1540px!important;
}
.cag-race-wrap{max-width:1450px!important;margin-inline:auto!important}

/* Responsive */
@media(max-width:980px){
  .cag-race-stage{min-height:690px!important}
  .cag-runner img{max-width:235px!important;max-height:325px!important}
  .cag-race-gantry{width:42%!important}
}
@media(max-width:760px){
  .cag-race-stage{min-height:610px!important;border-width:5px!important}
  .cag-runner img{max-width:190px!important;max-height:270px!important}
  .cag-spectator-strip{display:none!important}
  .cag-track-sign{transform:scale(.60)!important}
  .cag-race-gantry{width:52%!important}
  .cag-race-hurdle{height:185px!important}
  .cag-hurdle-frame{width:104px!important;height:104px!important}
  .cag-hurdle-frame img{max-width:88px!important;max-height:88px!important}
}
@media(max-width:520px){
  .cag-race-stage{min-height:560px!important}
  .cag-runner img{max-width:160px!important;max-height:230px!important}
  .cag-race-gantry{display:none!important}
  .cag-track-sign{display:none!important}
  .cag-hurdle-frame{width:88px!important;height:88px!important}
  .cag-hurdle-frame img{max-width:74px!important;max-height:74px!important}
  .cag-hurdle-label{font-size:21px!important}
}

/* Reduced motion: keep the visual identity without movement overload */
@media(prefers-reduced-motion:reduce){
  .cag-success-burst.play i,.cag-collision-flash.play,.cag-race-hurdle.wrong-impact .cag-hurdle-visual{animation:none!important}
  .cag-success-burst.play{opacity:.65!important}
}

/* v8.3 reward run + touch controls */
.cag-reward-lanes{position:absolute;inset:0;z-index:11;pointer-events:none;display:none}.cag-reward-lanes.show{display:block}.cag-collectible{position:absolute;top:80px;left:50%;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:32px;font-weight:900;filter:drop-shadow(0 5px 4px #0005);will-change:top,left,transform,opacity}.cag-collectible.coin{color:#ffd83d;background:radial-gradient(circle at 35% 30%,#fff5a5 0 8%,#ffd83d 22%,#e89b08 72%);border:4px solid #fff0a0;box-shadow:inset 0 0 0 3px #d48b00}.cag-collectible.jewel{font-size:38px;background:transparent}.cag-collectible.collected{animation:cag-collect .28s ease-out forwards}@keyframes cag-collect{to{transform:translate(-50%,-50%) scale(2);opacity:0}}.cag-reward-hud{position:absolute;z-index:20;top:12px;right:12px;background:#fffdf3eF;border:3px solid #7b3cb5;border-radius:18px;padding:8px 14px;font-size:18px;font-weight:900;box-shadow:0 5px 15px #0003;display:none}.cag-reward-hud.show{display:block}.cag-race-control{min-width:120px;min-height:58px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.cag-race-stage{touch-action:none;overscroll-behavior:contain}.cag-race-hurdle{touch-action:manipulation}.cag-race-hurdle:before{pointer-events:auto}@media(max-width:760px){.cag-race-controls{position:sticky;bottom:6px;z-index:40}.cag-race-control{flex:1;min-width:88px;min-height:64px;font-size:18px}.cag-collectible{width:42px;height:42px;font-size:27px}.cag-reward-hud{font-size:15px;top:8px;right:8px}}

/* v8.4.0 — still-frame Abi animation prototype */
.cag-runner.sprite-jump{
  transform:translateX(-50%) translateY(var(--cag-sprite-jump-y,0px)) scale(var(--cag-sprite-jump-scale,1))!important;
  transition:none!important;
}
.cag-runner.sprite-landing{
  transform:translateX(-50%) translateY(var(--cag-sprite-land-y,0px))!important;
  transition:none!important;
}
.cag-runner.sprite-jump img,.cag-runner.sprite-landing img{animation:none!important}
.cag-race-stage.is-running .cag-runner:not(.sprite-jump):not(.sprite-landing) img{animation:none!important}
.cag-runner.sprite-jump img{filter:drop-shadow(0 9px 5px rgba(0,0,0,.16)) blur(.15px)!important}
.cag-runner.sprite-landing img{filter:drop-shadow(0 8px 4px rgba(0,0,0,.2))!important}
@media (prefers-reduced-motion:reduce){.cag-runner.sprite-jump,.cag-runner.sprite-landing{transform:translateX(-50%)!important}}
