.balloons-page{max-width:940px;padding-top:24px}
.balloons-page .page-heading{text-align:center;margin-bottom:16px}
.balloons-page h1{font-size:clamp(30px,4vw,42px);margin-bottom:12px}
.balloons-page .lead{max-width:750px;margin:0 auto;font-size:var(--reading);line-height:1.6}
.balloon-rounds{display:flex;justify-content:center;gap:10px;margin:20px 0}
.balloon-rounds span{display:grid;place-items:center;width:38px;height:38px;border:1px solid #c8d9cc;border-radius:50%;background:#fffdf6;color:#60767a;font-weight:700}
.balloon-rounds .now,.balloon-rounds .done{background:#6d5d95;color:white;border-color:#6d5d95}
.balloon-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.balloon-card{min-width:0;padding:12px 18px 14px;border:2px solid #d7d9cd;border-radius:25px;background:#fffdf7;box-shadow:0 5px 0 #dce5d7}
.balloon-card header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.balloon-card h2{font-size:17px;font-weight:700;color:#60767a;margin:0}
.balloon-reset{border:1px solid #d6ddd1;background:transparent;border-radius:12px;font-size:25px;width:44px;min-height:44px}
.balloon-reset:disabled{opacity:.3}
.balloon-board{position:relative;max-width:340px;width:100%;aspect-ratio:340/300;margin:8px auto 0}
.balloon-strings{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.balloon-string path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.balloon-string-edge{stroke:#fffdf7;stroke-width:7px}
.balloon-thread{stroke:#839395;stroke-width:1.8px;stroke-dasharray:3 4}
.balloon-string.connected .balloon-thread{stroke:#3d8774;stroke-width:2.8px;stroke-dasharray:none}
.balloon-source{position:absolute;left:var(--balloon-x);top:0;transform:translateX(-50%);width:23.5%;height:30.6%;min-width:48px;min-height:65px;background:none;padding:0;border:0;border-radius:50%;touch-action:none;user-select:none}
.balloon-source svg,.balloon-drag svg{display:block;width:100%;height:100%;filter:drop-shadow(0 3px 2px #294a3822)}
.balloon-source>span,.balloon-drag>span{position:absolute;left:0;top:7%;width:100%;height:68%;display:grid;place-items:center;font-size:calc(var(--reading) + 10px);font-weight:700;color:#233843}
.balloon-source[aria-pressed=true]{outline:3px solid #8051b6;outline-offset:2px}
.balloon-source.placed{opacity:.55}
.balloon-slot{position:absolute;left:var(--balloon-x);top:79.3%;transform:translateX(-50%);width:18%;height:18%;min-width:44px;min-height:44px;border:2px solid #b6c5c2;border-radius:12px;background:#fffefb;padding:0;font-size:calc(var(--reading) + 7px);font-weight:700;color:#839395}
.balloon-slot.filled{border-color:#7ca992;background:#e7f3e7;color:#276b56;opacity:1}
.balloon-slot.drop-hover{border:3px solid #8051b6;background:#f0e9f6}
.balloon-slot[aria-invalid=true]{border-color:#bd7257;border-style:dashed}
.balloon-word{min-height:30px;text-align:center;font-size:var(--reading);color:#60767a;margin:10px 0 0}
.balloon-word b{letter-spacing:.16em;color:#276b56}
.balloon-card.solved{border-color:#98b59c;background:#fbfff7}
.balloon-feedback{min-height:55px;margin:24px auto 0;text-align:center;font-size:var(--reading);max-width:750px;line-height:1.5;color:#41655d}
.balloon-drag{position:fixed;z-index:1100;width:70px;height:81px;transform:translate(-50%,-50%);pointer-events:none;opacity:.95}
@media(max-width:650px){.balloons-page{padding:18px 14px 28px}.balloon-grid{gap:16px}.balloon-card{padding:10px 12px 14px;border-radius:20px}.balloon-card h2{font-size:15px}}
@media(max-width:560px){.balloon-grid{grid-template-columns:minmax(0,1fr)}.balloon-card{max-width:400px;width:100%;margin:0 auto}.balloon-board{margin-top:12px}.balloon-word{margin-top:14px}}
