:root{--sand-50: #fbf6ec;--sand-100: #f6ead9;--sand-200: #eed5b9;--sand-300: #e4bc91;--sand-400: #d99f6b;--sand-500: #d0874c;--sand-600: #c2723f;--sand-700: #a15a35;--sand-800: #834a31;--sand-900: #6a3e2b;--sand-950: #391e13;--accent-gold: #ffc107;--accent-brown: #5d4037;--accent-red: #ff5252;--accent-ribbon: #ff6e6e;--lb-bg: #4a2e2a;--lb-border: #f8c04e;--bg-color: var(--sand-100);--text-main: var(--sand-900);--text-light: var(--sand-50)}*{box-sizing:border-box;margin:0;padding:0;touch-action:manipulation}body{font-family:Outfit,sans-serif;background-color:var(--bg-color);color:var(--text-main);height:100vh;width:100vw;overflow:hidden;display:flex;justify-content:center;align-items:center}#app{width:100%;height:100%;position:relative;display:flex;flex-direction:column;background:radial-gradient(circle at center,var(--sand-200) 0%,var(--sand-400) 100%);box-shadow:inset 0 0 50px #0000001a}.hidden{display:none!important}.screen{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;animation:fadeIn .4s ease-out forwards}h1{font-size:3rem;font-weight:900;color:var(--sand-900);text-transform:uppercase;letter-spacing:2px;text-shadow:2px 2px 0px var(--sand-200),4px 4px 0px rgba(0,0,0,.1);margin-bottom:.5rem}p.subtitle{font-size:1.25rem;color:var(--sand-800);margin-bottom:3rem;font-weight:400}.btn{background:linear-gradient(135deg,var(--sand-600),var(--sand-800));color:var(--text-light);border:none;padding:1rem 3rem;font-size:1.5rem;font-weight:700;border-radius:50px;cursor:pointer;margin:.5rem;width:100%;max-width:300px;font-family:Outfit,sans-serif;text-transform:uppercase;letter-spacing:1px;box-shadow:0 8px 15px #0003;transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}.btn:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(#fff3,#fff0);pointer-events:none}.btn:hover{transform:translateY(-2px);box-shadow:0 12px 20px #0000004d}.btn:active{transform:translateY(2px);box-shadow:0 4px 10px #0003}.btn-secondary{background:var(--sand-300);color:var(--sand-900)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.overlay{position:absolute;inset:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{background:var(--sand-100);padding:2rem;border-radius:20px;width:90%;max-width:400px;box-shadow:0 20px 40px #0000004d;text-align:center;border:4px solid var(--sand-400)}.input-field{width:100%;padding:1rem;margin:1rem 0;border:2px solid var(--sand-400);border-radius:10px;font-size:1.25rem;font-family:Outfit,sans-serif;background:var(--sand-50);color:var(--sand-900)}.input-field:focus{outline:none;border-color:var(--sand-600)}.game-header{position:absolute;top:0;left:0;width:100%;padding:1rem;display:flex;justify-content:space-between;z-index:10;pointer-events:none}.stat-box{background:#fffc;padding:.5rem 1rem;border-radius:20px;font-weight:700;font-size:1.2rem;box-shadow:0 4px 6px #0000001a;color:var(--sand-900)}#game-container{flex:1;width:100%;height:100%;position:relative;overflow:hidden;background-color:#391e13}.leaderboard-container{background:var(--lb-bg);border:6px solid var(--lb-border);border-radius:40px 40px 80px 80px;padding:3rem 1.5rem 1.5rem;position:relative;width:100%;max-width:450px;box-shadow:0 20px #0003,inset 0 0 40px #0006;margin-top:2rem}.leaderboard-ribbon{position:absolute;top:-25px;left:50%;transform:translate(-50%);background:var(--accent-ribbon);color:#fff;padding:.8rem 3rem;font-weight:900;font-size:1.8rem;text-transform:uppercase;border-radius:10px;box-shadow:0 4px #d32f2f;z-index:5;white-space:nowrap;letter-spacing:2px;text-shadow:0 2px 2px rgba(0,0,0,.3)}.leaderboard-ribbon:before,.leaderboard-ribbon:after{content:"";position:absolute;bottom:-15px;border:15px solid transparent;z-index:-1}.leaderboard-ribbon:before{left:-20px;border-right-color:#b71c1c}.leaderboard-ribbon:after{right:-20px;border-left-color:#b71c1c}.lb-list{display:flex;flex-direction:column;gap:.8rem;max-height:500px;overflow-y:auto;padding:.5rem}.lb-item{display:flex;align-items:center;padding:.8rem 1rem;border-radius:20px;background:#fdf2e9;box-shadow:inset 0 -4px #0000001a,0 4px 6px #0003;position:relative;transition:transform .2s}.lb-item:hover{transform:scale(1.02)}.lb-rank{font-size:1.5rem;font-weight:900;width:40px;flex-shrink:0;color:#8d6e63}.lb-avatar{width:40px;height:40px;border-radius:50%;background:#fff;margin-right:1rem;border:2px solid #ddd;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-shrink:0}.lb-info{flex:1;text-align:left;min-width:0}.lb-name{font-weight:700;font-size:1.1rem;color:#5d4037;text-transform:uppercase;word-wrap:break-word;overflow-wrap:anywhere}.lb-score-pill{background:#ffb74d;padding:.4rem .8rem;border-radius:50px;font-weight:800;color:#fff;display:flex;align-items:center;gap:.4rem;box-shadow:inset 0 2px 4px #0003;flex-shrink:0;margin-left:.5rem}.lb-coin{width:18px;height:18px}.lb-rank-1{background:#fee488;border:2px solid #ffca28}.lb-rank-2{background:#b2ebf2;border:2px solid #26c6da}.lb-rank-3{background:#ffcdd2;border:2px solid #ef5350}.lb-rank-1 .lb-rank{color:#f57f17}.lb-rank-2 .lb-rank{color:#00838f}.lb-rank-3 .lb-rank{color:#c62828}.lb-rank-1 .lb-score-pill{background:#f9a825}.lb-rank-2 .lb-score-pill{background:#00bcd4}.lb-rank-3 .lb-score-pill{background:#f44336}