:root{--sky-top:#5ec9d8;--sky-bot:#bdeef0;--ground:#ded895;--ground-dark:#caa85a;--ink:#3a2e1f;--accent:#ffd23f;--accent-dark:#e8a400;--panel:#fff7e6;--pipe:#62c44f;--pipe-dark:#4a9e3a}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{font-family:"Baloo 2",system-ui,sans-serif;background:linear-gradient(180deg,#7ee0ec,#46b6c4 55%,#2a8f9e);display:flex;align-items:center;justify-content:center;min-height:100%;overflow:hidden;color:var(--ink);-webkit-user-select:none;user-select:none}.bg-clouds{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:0}.bg-clouds span{position:absolute;font-size:64px;opacity:.35;filter:blur(.3px);animation:drift linear infinite}@keyframes drift{0%{transform:translate(-20vw)}to{transform:translate(120vw)}}.stage-wrap{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:16px;padding:18px}.title-bar{font-family:"Press Start 2P",monospace;color:#fff;text-align:center;line-height:1.5;text-shadow:0 3px 0 #1d6b76,0 6px 0 rgba(0,0,0,.15);letter-spacing:1px}.title-bar .big{font-size:clamp(18px,3.4vw,30px)}.title-bar .sub{font-family:"Baloo 2";font-weight:700;font-size:14px;letter-spacing:0;opacity:.9;margin-top:8px;text-shadow:0 2px 0 #1d6b76}.frame{position:relative;border:6px solid #2e2417;border-radius:18px;box-shadow:0 14px #1c1610,0 24px 40px #00000059,inset 0 0 0 4px #fff8;overflow:hidden;background:#bdeef0}canvas{display:block;image-rendering:pixelated;touch-action:manipulation}#hud{position:absolute;top:14px;left:0;right:0;text-align:center;z-index:3;pointer-events:none}#score{font-family:"Press Start 2P",monospace;font-size:40px;color:#fff;text-shadow:0 3px 0 #2e2417,3px 0 0 #2e2417,-3px 0 0 #2e2417,0 -3px 0 #2e2417,0 7px 10px rgba(0,0,0,.3)}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:4;background:#14282d47;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.overlay.hidden{display:none}.panel{width:min(82%,300px);background:var(--panel);border:5px solid #2e2417;border-radius:16px;box-shadow:0 9px #1c1610,0 18px 30px #0000004d;padding:22px 20px;text-align:center;animation:pop .3s cubic-bezier(.18,1.4,.5,1) both}@keyframes pop{0%{transform:scale(.7) translateY(10px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.panel h2{font-family:"Press Start 2P";font-size:16px;color:var(--accent-dark);margin-bottom:4px;text-shadow:0 2px 0 #fff}.panel .hint{font-weight:600;font-size:14px;color:#6b5a3e;margin:10px 0 16px}.scores{display:flex;gap:12px;justify-content:center;margin:14px 0 18px}.score-card{flex:1;background:#fff;border:3px solid #2e2417;border-radius:12px;padding:10px 6px}.score-card .lbl{font-size:11px;font-weight:700;color:#9a8a6b;letter-spacing:1px}.score-card .val{font-family:"Press Start 2P";font-size:20px;color:var(--ink);margin-top:6px}.medal{font-size:46px;line-height:1;margin:2px 0 6px}.btn{font-family:"Baloo 2";font-weight:800;font-size:18px;cursor:pointer;border:4px solid #2e2417;border-radius:14px;padding:12px 22px;color:#2e2417;background:var(--accent);box-shadow:0 5px 0 var(--accent-dark);transition:transform .08s,box-shadow .08s;display:inline-flex;align-items:center;gap:8px}.btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--accent-dark)}.btn.ghost{background:#fff;box-shadow:0 5px #c9bfa6}.btn.ghost:active{box-shadow:0 1px #c9bfa6}.upload{position:absolute;top:12px;right:12px;z-index:5}.upload .btn{font-size:13px;padding:9px 12px;border-radius:12px;box-shadow:0 4px 0 var(--accent-dark)}.upload input{display:none}#resetImgBtn{position:absolute;top:12px;left:12px;z-index:5;font-size:13px;padding:9px 12px;border-radius:12px}.bird-preview{position:absolute;top:54px;right:12px;z-index:5;width:42px;height:42px;border:3px solid #2e2417;border-radius:10px;background:#fff;object-fit:cover;box-shadow:0 3px #1c1610}.tip{font-weight:600;font-size:13px;color:#eaffff;text-shadow:0 1px 2px rgba(0,0,0,.3);opacity:.9}.tip kbd{background:#fff;color:#2e2417;border-radius:5px;padding:1px 7px;border:2px solid #2e2417;font-family:"Baloo 2";font-weight:700;box-shadow:0 2px #c9bfa6}
