.maze-cover-image { display: block; width: 100%; height: auto; }
body.elsa-game { color: #3f5268; background: #ecf7f4; }
body.elsa-game > .site-header, body.elsa-game > footer { display: none; }
body.elsa-game #app { width: calc(100% - 32px); max-width: 1100px; margin-inline: auto; min-height: 100dvh; padding-bottom: 16px; }
.elsa-game h1, .elsa-game h2, .elsa-game h3 { font-family: Library, 'Trebuchet MS', sans-serif; color: #4e566f; }
.elsa-game button, .elsa-game .button { min-height: 48px; min-width: 48px; }
.elsa-game .maze-primary { color: white; background: #a84e79; border: 2px solid #92406a; padding: 10px 18px; box-shadow: 0 3px 0 #7d365b; }
.elsa-game .maze-primary:hover { background: #943e6a; }
.elsa-game .secondary { background: #fffefd; border-color: #c5d2d5; color: #3f5268; }
.elsa-game :is(button,a,input,summary):focus-visible { outline: 3px solid #b98725; outline-offset: 3px; }
.maze-toolbar { display: grid; grid-template-columns: 135px minmax(0,1fr) auto 48px auto; gap: 8px 10px; padding: 8px 0; align-items: center; }
.maze-toolbar h1 { font-size: 20px; line-height: 1.2; margin: 0 0 4px; }
.maze-toolbar span, .maze-toolbar button, .maze-toolbar a { font-size: 14px; }
.maze-motion { display: flex; align-items: center; gap: 8px; min-height: 48px; justify-self: end; font-size: 14px; cursor: pointer; }
.maze-motion input { width: 22px; height: 22px; accent-color: #9d679b; }
.maze-cover, .maze-finish, .maze-bonus { text-align: center; }
.maze-cover h2, .maze-finish h2 { font-size: 36px; line-height: 1.2; margin: 18px 0 14px; }
.maze-cover > p, .maze-finish > p { max-width: 800px; margin: 14px auto; }
.maze-cover-world { position: relative; max-width: 840px; margin: 18px auto 0; }
.maze-cover-image { border-radius: 8px; }
.maze-cover-welcome { position: absolute; width: 150px; height: 125px; right: 3%; bottom: 3%; padding: 3px; }
.elsa-game h2[tabindex="-1"]:focus { outline: none; }
.maze-sisters { display: flex; align-items: end; height: 100%; justify-content: center; }
.maze-princess { width: 50%; height: 100%; display: block; }
.maze-learn { max-width: 800px; margin: 18px auto; padding: 20px; background: #fffefd; border: 2px solid #c5dcd6; border-radius: 8px; text-align: center; }
.maze-learn h2 { font-size: 28px; }
.maze-rule { display: grid; grid-template-columns: auto 1fr; gap: 12px; padding: 15px; background: #eff7f5; text-align: left; margin-bottom: 14px; }
.maze-rule strong { font-size: 24px; }.maze-rule span { align-self: center; font-size: 17px; }
.maze-map-heading { text-align: center; }.maze-map-heading h2 { font-size: 27px; margin: 12px 0 5px; }.maze-map-heading p { font-size: 16px; margin: 0 0 10px; }
.maze-world { position: relative; height: min(66dvh,520px); border: 2px solid #b4cdd1; border-radius: 8px; background: #e9f5f8; }
.maze-map { display: block; width: 100%; height: 100%; }
.maze-map [data-open="true"] .maze-shutter { opacity: 0; }
.maze-progress { display: grid; grid-template-columns: repeat(8,minmax(0,1fr)); max-width: 650px; gap: 8px; margin: 16px auto; }
.maze-progress > span { display: grid; place-items: center; min-height: 34px; border: 1px solid #b7cbd3; border-radius: 5px; background: white; font-size: 17px; font-weight: 700; }
.maze-progress .done { background: #cde9d6; border-color: #83ae96; }.maze-progress .current { background: #fff0bd; border-color: #c9ad66; }
.maze-task-dialog, .maze-help-dialog { box-sizing: border-box; width: min(940px,calc(100% - 24px)); max-width: none; max-height: calc(100dvh - 24px); padding: 15px 22px; border: 3px solid #94b6bd; border-radius: 8px; overflow: auto; background: #fffefd; color: #3f5268; }
.maze-task-dialog::backdrop { background: #3d526880; }.maze-help-dialog::backdrop { background: #3d526866; }
.maze-help-dialog { width: min(620px,calc(100% - 24px)); }
.maze-modal-top { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0 12px; min-height: 48px; font-size: 15px; }
.maze-modal-top > span { font-weight: 700; color: #98627c; }.maze-modal-top a { display: inline-flex; align-items: center; min-height: 48px; font-size: 14px; text-decoration: underline; }
.maze-task-dialog h2 { text-align: center; font-size: 26px; line-height: 1.2; margin: 0 0 8px; }
.maze-instruction { font-size: 18px; line-height: 1.3; min-height: 26px; margin: 0 0 12px; text-align: center; }
.maze-task-art { display: grid; place-items: center; min-height: 80px; padding: 8px; margin: 8px auto 14px; width: min(100%,650px); }
.maze-equation { font-size: 32px; line-height: 1.3; font-weight: 800; text-align: center; overflow-wrap: anywhere; }
.maze-lock { background: #f5edf8; border: 2px solid #c9b5d8; border-radius: 8px; position: relative; }
.maze-lock::before { content: ''; width: 38px; height: 18px; border: 4px solid #a08bab; border-bottom: 0; border-radius: 20px 20px 0 0; position: absolute; top: -19px; left: calc(50% - 19px); }
.maze-task-dialog:has(.maze-lock) .maze-task-art { margin-top: 25px; }
.maze-mirror { border: 5px double #b9a7d0; border-radius: 8px; background: #f2f9fc; color: #92647c; }
.maze-choices { display: grid; grid-template-columns: repeat(3,minmax(64px,160px)); gap: 18px; justify-content: center; margin: 0 auto 16px; }
.maze-choice { display: flex; flex-direction: column; gap: 3px; padding: 8px; min-height: 90px; background: #fff2c5; color: #4a5670; border: 2px solid #d0b76c; }
.maze-choice strong { font-size: 30px; }.maze-choice:hover:not(:disabled) { border-color: #9b75af; background: #f3eaf8; }
.maze-choice.correct { background: #e1f2e4; border-color: #80ad91; opacity: 1; }
.maze-key-art { width: 100%; max-width: 110px; height: 36px; display: block; }
.choices-tile .maze-choice { background: #e2f2f8; border-color: #99c0d4; min-height: 86px; }.choices-mirror .maze-choice { min-height: 86px; }
.maze-bowl { display: block; width: 100%; height: auto; }.choices-bowl .maze-bowl { max-width: 115px; height: 65px; }.choices-bowl .maze-choice { background: white; border-color: #9bc9ba; min-height: 115px; }
.maze-pairs { --pair-gap: 40px; display: grid; grid-template-columns: minmax(0,1.5fr) var(--pair-gap) minmax(80px,1fr); max-width: 650px; margin: 0 auto 16px; }
.maze-pair-expressions { grid-column: 1; grid-row: 1; }.maze-pair-answers { grid-column: 3; grid-row: 1; }
.maze-pair-lines { display: block; width: 100%; height: 152px; grid-column: 2; grid-row: 1; pointer-events: none; }
.maze-pair-expressions, .maze-pair-answers { display: grid; grid-template-rows: repeat(2,70px); gap: 12px; }
.maze-expression, .maze-pair-answer { background: #f1ecf9; border: 2px solid #c2acd7; color: #4b5670; font-size: 29px; padding: 6px 10px; font-weight: 800; }
.maze-expression[aria-pressed="true"] { border-color: #a873a3; background: #ffefb9; }
.maze-pair-answer { background: #e9f6f2; border-color: #9ac8ba; }
.maze-pairs .matched { opacity: 1; border-color: #7baa91; background: #dcefe0; position: relative; }
.maze-feedback { min-height: 116px; padding: 12px 14px; border: 1px solid #d5d9e5; border-radius: 6px; background: #f1f4f9; font-size: 18px; line-height: 1.4; display: flex; flex-direction: column; justify-content: center; gap: 7px; margin-bottom: 12px; }
.maze-feedback p { margin: 0; }.maze-feedback.success { background: #edf7f0; border-color: #bad6c5; }.maze-feedback.error { background: #fff0eb; border-color: #e6bfb5; }.maze-feedback.hint { background: #fff8e1; border-color: #decf9a; }
.maze-modal-actions { min-height: 52px; display: flex; justify-content: center; gap: 10px; align-items: center; flex-wrap: wrap; }
.maze-modal-actions button { font-size: 18px; }.maze-modal-actions > strong { color: #4b7b61; font-size: 21px; text-align: center; }
.maze-garden-link { background: transparent; color: #66788c; text-decoration: underline; display: flex; margin: 8px auto 0; border: 0; font-size: 15px; }
.maze-gazebo-scene { position: relative; max-width: 850px; height: 290px; margin: 16px auto; border: 1px solid #c4d8d5; border-radius: 8px; background: #e5f3f3; }
.maze-gazebo-back { position: absolute; inset: 0; width: 100%; height: 100%; }
.maze-garden-princesses { position: absolute; width: 37%; height: 235px; left: 8%; bottom: 10px; }
.maze-garden-kitten { position: absolute; width: 22%; height: auto; right: 23%; bottom: 16px; }
.maze-kitten { display: block; width: 100%; height: auto; }
.maze-garden-bowl { position: absolute; width: 15%; right: 8%; bottom: 16px; }
.maze-cat-to-bowl { animation: maze-cat-meal 1.8s ease-in-out forwards; }
.maze-tail { transform-origin: 140px 120px; animation: maze-tail-wag 3s ease-in-out infinite; }.maze-ears { animation: maze-ear-wiggle 5s ease-in-out infinite; transform-origin: 90px 60px; }
.cat-eat { animation: maze-nibble .6s ease-in-out infinite; }.cat-purr { animation: maze-purr 2s ease-in-out infinite; }
.maze-treat-count { font-size: 20px; color: #a46385; font-weight: 700; }
.maze-stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 20px 0; }
.maze-stats > div { display: grid; gap: 5px; padding: 14px; background: white; border: 1px solid #c4d8d0; border-radius: 6px; }
.maze-stats strong { font-size: 32px; color: #4a7e74; }.maze-stats span { font-size: 16px; }
.maze-finish-actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.maze-bonus h2 { font-size: 28px; margin: 18px 0 8px; }.maze-bonus > p { color: #a46385; font-size: 20px; }
.maze-snow { position: absolute; inset: 0; pointer-events: none; }
.maze-snow > span { position: absolute; width: 20px; height: 20px; max-width: 4%; color: #7ca9bc; opacity: .4; animation: maze-snowfall 10s linear infinite; animation-delay: calc(var(--flake)*-.9s); }
.maze-snow > span:nth-child(2n) { width: 14px; height: 14px; opacity: .3; animation-duration: 14s; }.maze-snow svg { width: 100%; height: 100%; }
.maze-crystals { animation: maze-crystal-glow 3s ease-in-out infinite; }
.maze-twirl .maze-princess { animation: maze-twirl 2.3s ease-in-out 2; transform-origin: center 70%; }.maze-twirl .princess-mira { animation-delay: .2s; }
.maze-finish .maze-twirl .maze-princess { animation-iteration-count: 2; }
.maze-twirl .maze-cape { transform-origin: center 60%; animation: maze-cape-sway 2.3s ease-in-out infinite; }
.maze-walk { animation: maze-follow-corridor 1.1s linear forwards; }
.maze-map-twirl { transform-box: fill-box; transform-origin: center 70%; animation: maze-twirl 1s ease-in-out; }
.maze-paused *, .maze-paused { animation-play-state: paused !important; }
@keyframes maze-follow-corridor { from { transform: translate(0,0); } 50% { transform: translate(var(--mx),var(--my)); } to { transform: translate(var(--dx),var(--dy)); } }
@keyframes maze-snowfall { from { transform: translate(-3px,-3px) rotate(0); opacity: .15; } to { transform: translate(3px,48px) rotate(100deg); opacity: .05; } }
@keyframes maze-twirl { 0%,100% { transform: rotate(0) scaleX(1); } 35% { transform: rotate(-6deg) scaleX(.6); } 70% { transform: rotate(6deg) scaleX(-.8); } }
@keyframes maze-cape-sway { 50% { transform: skewX(4deg); } }
@keyframes maze-tail-wag { 50% { transform: rotate(8deg); } }
@keyframes maze-ear-wiggle { 0%,85%,100% { transform: rotate(0); } 92% { transform: rotate(-4deg); } }
@keyframes maze-nibble { 50% { transform: translateY(3px); } }
@keyframes maze-purr { 50% { transform: translateY(-2px); } }
@keyframes maze-cat-meal { to { transform: translateX(55%); } }
@keyframes maze-crystal-glow { 50% { opacity: .6; } }
@media (max-width:1000px) { .maze-toolbar { grid-template-columns: 135px minmax(0,1fr) auto 48px; }.maze-motion { grid-column: 2 / -1; min-height: 30px; } }
@media (max-width:760px) {
  body.elsa-game #app { width: calc(100% - 16px); }
  .maze-toolbar { grid-template-columns: 1fr auto 48px; }.maze-toolbar > div { grid-column: 1 / -1; grid-row: 1; }.maze-toolbar h1 { font-size: 19px; }.maze-motion { grid-column: 1 / -1; justify-self: start; }
  .maze-cover h2,.maze-finish h2 { font-size: 28px; }.maze-cover-welcome { width: 110px; height: 90px; }
  .maze-task-dialog { width: calc(100% - 16px); padding: 12px; max-height: calc(100dvh - 16px); }
  .maze-task-dialog h2 { font-size: 23px; }.maze-equation { font-size: 27px; }.maze-instruction { font-size: 17px; }
  .maze-choices { gap: 10px; grid-template-columns: repeat(3,minmax(60px,130px)); }.maze-choice { min-height: 82px; padding: 6px; }.maze-choice strong { font-size: 28px; }
  .maze-pairs { --pair-gap: 18px; }.maze-expression,.maze-pair-answer { font-size: 24px; }
  .maze-feedback { font-size: 17px; min-height: 132px; padding: 10px; }
  .maze-world { height: 360px; }.maze-map-heading h2 { font-size: 24px; }.maze-map-heading p { font-size: 15px; }
  .maze-gazebo-scene { height: 230px; }.maze-garden-princesses { height: 180px; }
}
@media (max-width:420px) {
  body.elsa-game #app { width: calc(100% - 12px); }.maze-cover-welcome { display: none; }
  .maze-task-dialog { padding: 8px; }.maze-modal-top { font-size: 14px; }.maze-modal-top a { font-size: 13px; }
  .maze-task-dialog h2 { font-size: 22px; }.maze-equation { font-size: 24px; }
  .maze-pairs { --pair-gap: 12px; }.maze-expression { font-size: 22px; padding: 4px; }.maze-pair-answer { font-size: 24px; }
  .maze-feedback { font-size: 16px; min-height: 145px; }
  .maze-stats { grid-template-columns: 1fr; }.maze-stats > div { display: flex; align-items: center; gap: 14px; text-align: left; }
  .maze-gazebo-scene { height: 190px; }.maze-garden-princesses { height: 145px; left: 5%; width: 40%; }.maze-garden-kitten { width: 27%; right: 20%; }
  .maze-rule { grid-template-columns: 1fr; gap: 8px; }.maze-rule strong { font-size: 23px; }.maze-learn { padding: 14px; }
  .maze-progress { gap: 4px; }.maze-progress > span { font-size: 15px; }
}
@media (prefers-reduced-motion:reduce) { .elsa-game *, .elsa-game *::before, .elsa-game *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }