.bridge-game{max-width:1000px;margin:auto;padding:24px;border:1px solid #d3e5da;border-radius:24px;background:#fffef8}.bridge-game h2{font-size:32px;margin:8px 0}.bridge-game header p{color:#64796b}.bridge-hud{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:12px;background:#edf5e9;border-radius:14px}.bridge-question{text-align:center;padding:20px}.bridge-question>span{color:#617b70}.bridge-question h3{font-size:26px;margin:12px 0}.bridge-world{height:430px;position:relative;overflow:hidden;border:3px solid #acd3cf;border-radius:22px;background:#73cbdb;direction:ltr}.bridge-water{position:absolute;inset:0;background:repeating-linear-gradient(175deg,transparent 0 38px,#c6f3f580 39px 43px,transparent 44px 72px);background-size:200% 100%}.bridge-running .bridge-water{animation:bridge-flow 10s linear infinite}.bridge-bank{position:absolute;top:0;bottom:0;width:15%;background:#accd7e;border-color:#e5d2a0;border-style:solid;border-width:0}.bank-start{left:0;border-right-width:10px;border-radius:0 48% 48% 0}.bank-end{right:0;border-left-width:10px;border-radius:48% 0 0 48%}.bridge-bank span{position:absolute;top:23%;left:12%;font-size:42px}.bridge-path{position:absolute;top:45%;left:16%;width:70%;height:70px;display:flex;align-items:center;justify-content:space-around}.bridge-path>span{width:16%;height:43px;border:2px dashed #d9fbf4aa;border-radius:9px;transform:rotate(-3deg)}.bridge-path .built{background:repeating-linear-gradient(0deg,#b8854e 0 10px,#dba463 11px 20px);border:3px solid #885a34;box-shadow:0 6px 0 #604c3644;animation:bridge-build .5s ease}.bridge-hero{position:absolute;width:48px;left:7%;top:calc(45% - 62px);transform:translateX(-50%);transition:left .8s ease;z-index:4}.bridge-hero svg{display:block;width:100%}.bridge-hop svg{animation:bridge-jump .8s ease}.bridge-arrived svg{animation:bridge-cheer .55s ease 3}.bridge-choices{position:absolute;bottom:20px;left:16%;right:16%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;z-index:3}.bridge-choice{font-family:Cairo,sans-serif;min-height:105px;border:3px solid #96703e;border-radius:15px;background:#ffebbe;padding:8px;color:#294f48;box-shadow:0 6px 0 #8d653a66;cursor:pointer}.bridge-running .bridge-choice{animation:bridge-bob 2.7s ease-in-out infinite;animation-delay:var(--float-delay)}.bridge-choice>span{display:block;font-size:32px}.bridge-choice b{font-size:16px;display:block;line-height:1.7}.bridge-choice.selected{outline:4px solid #fff7a4;outline-offset:4px}.bridge-choice.bridge-right{background:#dcf3c8;border-color:#4c915c}.bridge-choice.bridge-wobble{animation:bridge-shake .35s ease!important}.bridge-splash{position:absolute;top:28%;transform:translateX(-50%);opacity:0;font-size:28px;z-index:5;pointer-events:none}.spark-active{animation:bridge-spark .85s ease}.bridge-overlay{position:absolute;inset:0;z-index:8;background:#f5fbf1ed;display:grid;place-items:center;text-align:center;padding:25px}.bridge-overlay[hidden]{display:none}.bridge-overlay>div{max-width:460px}.bridge-intro-icon{font-size:66px}.bridge-overlay h3{font-size:26px}.bridge-key-controls{display:flex;direction:ltr;justify-content:center;gap:15px;margin:18px}.bridge-feedback{padding:18px;background:#eef6e8;border-radius:14px;text-align:center;min-height:66px}.bridge-feedback button{margin:8px}.bridge-paused *{animation-play-state:paused!important}.bridge-paused .bridge-hero{transition:none}@keyframes bridge-flow{to{background-position:200% 0}}@keyframes bridge-bob{50%{transform:translateY(-9px) rotate(1deg)}}@keyframes bridge-jump{50%{transform:translateY(-70px) rotate(8deg)}}@keyframes bridge-build{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}@keyframes bridge-shake{25%,75%{transform:translateX(-7px)}50%{transform:translateX(7px)}}@keyframes bridge-spark{30%{opacity:1;transform:translate(-50%,-25px)}100%{opacity:0;transform:translate(-50%,-50px)}}@keyframes bridge-cheer{50%{transform:translateY(-15px)}}@media(max-width:600px){.bridge-game{padding:12px}.bridge-game h2{font-size:26px}.bridge-question h3{font-size:21px}.bridge-world{height:410px}.bridge-choices{left:5%;right:5%;gap:7px;bottom:18px}.bridge-choice{padding:6px 3px;min-height:115px}.bridge-choice b{font-size:13px}.bridge-bank span{font-size:27px;top:20%}.bridge-hero{width:37px;top:calc(45% - 49px)}.bridge-path>span{height:34px}.bridge-key-controls{gap:8px;margin:14px 0}}@media(prefers-reduced-motion:reduce){.bridge-world *{animation:none!important;transition:none!important}.spark-active{opacity:1}}