:root{--bg-gradient: linear-gradient(135deg, #f5f2eb 0%, #e6dfd3 100%);--wood-bg: radial-gradient(circle, #ecdcc4 0%, #c4a482 100%);--glass-bg: rgba(255, 255, 255, .65);--glass-border: rgba(255, 255, 255, .8);--glass-shadow: 0 8px 32px 0 rgba(142, 126, 98, .2);--primary-color: #8c6a5c;--secondary-color: #f77ca4;--text-dark: #3e322d;--text-light: #fefcf9;--font-heading: "Dancing Script", cursive;--font-arcade: "Press Start 2P", monospace;--font-sans: "Outfit", sans-serif;--transition-fast: .2s ease;--transition-normal: .3s cubic-bezier(.25, .8, .25, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--bg-gradient);color:var(--text-dark);min-height:100vh;display:flex;flex-direction:column;align-items:center;overflow-x:hidden;position:relative;touch-action:manipulation}.heart-particles{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:0;overflow:hidden}.heart-particle{position:absolute;bottom:-20px;color:var(--secondary-color);font-size:20px;opacity:.5;animation:floatUp 8s linear infinite;pointer-events:none}@keyframes floatUp{0%{transform:translateY(0) rotate(0) scale(.6);opacity:0}10%{opacity:.5}90%{opacity:.5}to{transform:translateY(-105vh) rotate(360deg) scale(1.2);opacity:0}}.game-header{width:100%;max-width:900px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;z-index:10;gap:12px}.back-btn{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);color:var(--text-dark);padding:8px 16px;border-radius:20px;text-decoration:none;font-weight:600;font-size:14px;display:flex;align-items:center;gap:8px;box-shadow:var(--glass-shadow);transition:transform var(--transition-fast),background var(--transition-fast)}.back-btn:hover{transform:translateY(-2px);background:#ffffffe6}.back-btn .icon{width:18px;height:18px}.header-title{font-family:var(--font-heading);font-size:32px;color:var(--primary-color);display:flex;align-items:center;gap:10px;text-shadow:1px 1px 0 rgba(255,255,255,.8)}.header-title .badge{font-family:var(--font-arcade);font-size:11px;background:var(--primary-color);color:var(--text-light);padding:4px 10px;border-radius:12px;letter-spacing:1px}.header-actions{display:flex;gap:10px}.action-btn{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--glass-border);color:var(--text-dark);padding:8px 14px;border-radius:20px;font-family:var(--font-sans);font-size:13px;font-weight:600;cursor:pointer;box-shadow:var(--glass-shadow);display:flex;align-items:center;gap:6px;transition:transform var(--transition-fast),background var(--transition-fast)}.action-btn:hover{transform:translateY(-2px);background:#ffffffe6}.game-wrapper{width:100%;max-width:860px;padding:0 16px;margin-top:10px;display:flex;flex-direction:column;align-items:center;z-index:10}.canvas-container{width:100%;position:relative;background:#fff;border:4px solid var(--primary-color);border-radius:16px;box-shadow:0 16px 40px #3e322d33;overflow:hidden}#gameCanvas{width:100%;height:auto;aspect-ratio:800 / 220;display:block;image-rendering:pixelated;image-rendering:crisp-edges;background-color:#f7f7f7}.game-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#f7f2e9e0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:20;padding:20px;transition:opacity var(--transition-normal)}.game-overlay.hidden{opacity:0;pointer-events:none}.overlay-card{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);padding:24px 32px;border-radius:20px;text-align:center;max-width:440px;width:100%;display:flex;flex-direction:column;align-items:center;gap:10px;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275)}@keyframes popIn{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}.dino-avatar,.dead-avatar{font-size:44px;margin-bottom:4px}.dead-avatar{animation:shake .5s ease}@keyframes shake{0%,to{transform:rotate(0)}25%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}}.overlay-card h2{font-family:var(--font-arcade);font-size:16px;color:var(--primary-color)}.overlay-card p{font-size:14px;color:var(--text-dark);opacity:.8}kbd{background:#fff;border:1px solid #ccc;border-radius:4px;padding:2px 6px;font-family:var(--font-arcade);font-size:11px;box-shadow:0 2px #bbb}.instruction-mobile{display:none}.high-score-notify{color:#d4af37!important;font-weight:700;font-size:16px!important;animation:pulse 1s infinite alternate}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.05)}}.play-btn{background:var(--primary-color);color:var(--text-light);border:none;border-radius:30px;padding:12px 28px;font-family:var(--font-sans);font-size:15px;font-weight:700;cursor:pointer;margin-top:8px;box-shadow:0 4px 12px #00000026;transition:transform var(--transition-fast),background var(--transition-fast)}.play-btn:hover{background:#735144;transform:translateY(-2px)}.mobile-controls{display:none;width:100%;gap:16px;margin-top:16px}.mobile-btn{flex:1;background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:2px solid var(--primary-color);color:var(--primary-color);padding:16px;border-radius:16px;font-family:var(--font-sans);font-size:16px;font-weight:700;cursor:pointer;box-shadow:var(--glass-shadow);touch-action:manipulation;user-select:none;-webkit-user-select:none}.mobile-btn:active{background:var(--primary-color);color:var(--text-light);transform:scale(.96)}@media (max-width: 768px){.header-title{font-size:22px}.header-title .badge,.back-btn span,.instruction-desktop{display:none}.instruction-mobile{display:block}.mobile-controls{display:flex}}