/* Flappy-only skin. Shared score fetching, validation and accessibility stay intact. */
.flappy-board{--outline:#45412a;width:min(520px,calc(100vw - 28px));padding:26px;border:4px solid var(--outline);border-radius:0;background:#f8edbb;color:#45412a;box-shadow:6px 6px 0 #263a32,0 22px 70px #123f4870;font-family:'Courier New',monospace;isolation:isolate}
.flappy-board::backdrop{background:#28555e99;backdrop-filter:blur(3px)}
.flappy-board::before{content:'';display:block;height:14px;margin:-26px -26px 24px;border-bottom:4px solid var(--outline);background:linear-gradient(90deg,#c4f16c 0 12%,#8cd12e 12% 78%,#5ca423 78%)}
.flappy-board header{align-items:flex-start;gap:8px}.flappy-board .wb-kicker{color:#58653b;letter-spacing:1px;font-size:10px;line-height:1.5;margin-bottom:8px}
.flappy-board h2{font:900 clamp(27px,7vw,38px)/1.1 'Arial Black',Impact,sans-serif;letter-spacing:-1px;color:#fff9dc;-webkit-text-stroke:1.5px #45412a;text-shadow:2px 3px 0 #45412a}
.flappy-board button{backdrop-filter:none;font-family:inherit;transition:transform .1s,box-shadow .1s}
.flappy-board .wb-close{width:34px;height:34px;padding:0;display:grid;place-items:center;line-height:1;border:3px solid var(--outline);border-radius:0;background:#fff9dd;color:var(--outline);box-shadow:3px 3px 0 #45412a;font-size:25px}
.flappy-board .wb-game{color:#657048;font-size:13px;font-weight:bold;margin:12px 0 20px}
.flappy-board .wb-clock{border:3px solid var(--outline);border-radius:0;background:#8ac5c7;padding:14px 16px;box-shadow:inset 0 3px 0 #b9e7df}
.flappy-board .wb-clock span{color:#234c50;letter-spacing:1px}.flappy-board .wb-clock strong{color:#fffbe0;text-shadow:2px 2px 0 #365957;font-size:25px;letter-spacing:-1px}.flappy-board .wb-clock small{color:#254d51;font-weight:bold;font-size:11px}
.flappy-board nav{padding:0;gap:10px;border:0;border-radius:0;background:none;margin:20px 0}
.flappy-board nav button{border:3px solid var(--outline);border-radius:0;background:#e6dbac;color:#5d613f;padding:11px 8px;box-shadow:3px 3px 0 #45412a;font-size:12px}
.flappy-board nav [aria-pressed=true]{background:#ffe33d;color:#45412a;box-shadow:inset 0 3px 0 #fff39c,3px 3px 0 #45412a}
.flappy-board form{border:3px solid var(--outline);border-radius:0;background:#fff8dc;padding:16px;box-shadow:3px 3px 0 #c8bd87}
.flappy-board label{color:#535435;font-size:12px}.flappy-board .wb-run{color:#476b22;font-size:32px;margin:7px 0 17px}.flappy-board input{border:3px solid #7c7b53;border-radius:0;background:#fffdf0;color:#343f2c;font-family:inherit}
.flappy-board input:focus-visible{outline:3px solid #268798;outline-offset:2px}.flappy-board .wb-note{color:#656447;font-size:11px}.flappy-board .wb-submit{border:3px solid var(--outline);border-radius:0;background:#8cd12e;color:#263f20;box-shadow:inset 0 3px 0 #c4f16c,3px 3px 0 #45412a;font-size:14px}
.flappy-board .wb-status{color:#735518;font-size:12px;font-weight:bold}.flappy-board .wb-list-heading{color:#596344;font-size:11px;letter-spacing:0}.flappy-board .wb-refresh{color:#32636a;padding:5px;text-decoration:underline}
.flappy-board .wb-list{border-top:3px solid #77764e}.flappy-board .wb-list li{padding:16px 8px;gap:12px;border-bottom:2px dashed #c9bd87}.flappy-board .wb-list li b{color:#6d7750;font-size:17px}.flappy-board .wb-list li span{font-size:14px}.flappy-board .wb-list li strong{font-size:17px;color:#3d6028}
.flappy-board .wb-list li:first-child{background:#ffe33d;border-radius:0;border-bottom:3px solid #bdab34;box-shadow:inset 0 3px 0 #fff29d}.flappy-board .wb-list li:first-child b,.flappy-board .wb-list li:first-child strong{color:#4a4e24}
.flappy-board .wb-empty{font-size:22px;color:#4c6739}.flappy-board .wb-empty span{display:inline-block;margin-top:10px;line-height:1.5;color:#657048;font-weight:bold}.flappy-board footer{color:#656447;font-size:10px;padding:0;visibility:visible!important}
.flappy-board button:focus-visible{outline:3px solid #268798;outline-offset:4px}.flappy-board button:active:not(:disabled){transform:translate(2px,2px);box-shadow:none}
@media(max-width:480px){.flappy-board{padding:20px 16px}.flappy-board::before{margin:-20px -16px 20px}.flappy-board .wb-list li{gap:8px}.flappy-board .wb-list li strong{font-size:14px}.flappy-board .wb-kicker{font-size:9px;letter-spacing:0}.flappy-board nav{gap:8px}}
@media(prefers-reduced-motion:reduce){.flappy-board button{transition:none}}
