:root{--bg: #10131a;--panel: #234234;--accent: #e0b24a;--accent-2: #ffd24f;--text: #f3eede;--muted: #8c93a8}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden;user-select:none}#app{position:relative;width:100vw;height:100vh;height:100dvh;display:flex;align-items:center;justify-content:center}canvas{display:block;background:var(--bg);touch-action:none}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#080a10d1;backdrop-filter:blur(2px);text-align:center;padding:24px}.overlay h1{font-size:clamp(28px,8vw,56px);margin:0 0 8px}.overlay p{color:var(--muted);margin:0}.btn{appearance:none;border:1px solid #9c7322;border-radius:12px;padding:14px 28px;font-size:18px;font-weight:700;color:#4a3712;background:linear-gradient(180deg,#fdeeb0,#f3d06a 30%,#d8a83a 62%,#b9842a);box-shadow:0 2px 6px #00000059,inset 0 1px #ffffffd9,inset 0 -2px 4px #78501466;cursor:pointer;min-width:200px;transition:transform .08s ease,filter .15s ease}.btn:hover{filter:brightness(1.06)}.btn:active{transform:scale(.97)}.btn.secondary{background:linear-gradient(180deg,#2f5644,#234234);color:var(--text);box-shadow:0 2px 6px #0000004d,inset 0 1px #ffffff1f}.btn.reward{background:var(--accent-2)}.hud{position:absolute;top:max(10px,env(safe-area-inset-top));left:50%;transform:translate(-50%);display:inline-flex;align-items:center;justify-content:center;gap:14px;padding:8px 18px;background:#101a159e;border:1px solid rgba(255,255,255,.13);border-radius:999px;box-shadow:0 2px 8px #0000004d;font-size:clamp(15px,4vw,19px);font-weight:700;color:var(--text);white-space:nowrap;pointer-events:none;z-index:5}.controls{position:absolute;bottom:max(10px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%);width:calc(100% - 16px);max-width:520px;display:flex;justify-content:center;gap:8px;padding:8px;background:#101a159e;border:1px solid rgba(255,255,255,.13);border-radius:16px;box-shadow:0 2px 8px #0000004d;z-index:5}.btn.small{flex:1 1 0;min-width:0;padding:11px 6px;font-size:clamp(13px,3.8vw,16px);font-weight:600;border-radius:999px;white-space:nowrap;overflow:hidden;background:linear-gradient(180deg,#36495c,#283848);color:#eef1f6;border:1px solid rgba(255,255,255,.16);box-shadow:0 1px 3px #0006,inset 0 1px #ffffff1a}.btn.settings-corner{position:absolute;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));width:40px;height:40px;min-width:0;padding:0;font-size:19px;border-radius:10px;z-index:6;background:#121c1780;border:1px solid rgba(255,255,255,.18);box-shadow:none;color:#e8e2cf;opacity:.85}