.games-hero{position:relative;overflow:hidden}.game-cards{display:grid;grid-gap:16;gap:16;grid-template-columns:1fr}@media (min-width:860px){.game-cards{grid-template-columns:1fr 1fr}}.game-card{position:relative;overflow:hidden;padding:22px;display:grid;grid-gap:12;gap:12;align-content:start;min-height:340px}.game-card.glass{background:linear-gradient(135deg,hsla(0,0%,100%,.09),hsla(0,0%,100%,.02) 45%,rgba(210,255,0,.05));backdrop-filter:blur(18px) saturate(1.35);-webkit-backdrop-filter:blur(18px) saturate(1.35);border:1px solid hsla(0,0%,100%,.14);box-shadow:0 8px 32px rgba(0,0,0,.35),inset 0 1px 0 hsla(0,0%,100%,.12)}.game-card.glass:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,hsla(0,0%,100%,.09) 45%,transparent 60%);background-size:250% 100%;background-position:120% 0;transition:background-position 1s ease}.game-card.glass:hover:before{background-position:-20% 0}.game-card.glass:hover{border-color:var(--accent-border);box-shadow:0 16px 48px rgba(0,0,0,.5),0 0 32px rgba(210,255,0,.12),inset 0 1px 0 hsla(0,0%,100%,.18)}.game-card:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(420px 200px at 50% 0,rgba(210,255,0,.08),transparent 70%);transition:opacity .3s}.game-card:hover:after{opacity:1}.game-card-num{font-family:var(--display);font-size:44px;font-weight:800;line-height:1;color:transparent;-webkit-text-stroke:1.5px var(--accent);opacity:.9}.game-preview{display:grid;grid-template-columns:repeat(16,1fr);grid-gap:3px;gap:3px;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}.game-preview i{display:block;height:14px;border-radius:3px;background:hsla(0,0%,100%,.07)}.game-preview i.on-p{background:var(--accent);box-shadow:0 0 8px rgba(210,255,0,.4)}.eq-live i.on-d1,.eq-live i.on-d2,.eq-live i.on-d3,.eq-live i.on-p{animation:eqPulse 1.4s ease-in-out infinite;transform-origin:center}.eq-live i:nth-child(4n).on-d1,.eq-live i:nth-child(4n).on-d2,.eq-live i:nth-child(4n).on-d3,.eq-live i:nth-child(4n).on-p{animation-delay:0s}.eq-live i:nth-child(4n+1).on-d1,.eq-live i:nth-child(4n+1).on-d2,.eq-live i:nth-child(4n+1).on-d3,.eq-live i:nth-child(4n+1).on-p{animation-delay:.35s}.eq-live i:nth-child(4n+2).on-d1,.eq-live i:nth-child(4n+2).on-d2,.eq-live i:nth-child(4n+2).on-d3,.eq-live i:nth-child(4n+2).on-p{animation-delay:.7s}.eq-live i:nth-child(4n+3).on-d1,.eq-live i:nth-child(4n+3).on-d2,.eq-live i:nth-child(4n+3).on-d3,.eq-live i:nth-child(4n+3).on-p{animation-delay:1.05s}@keyframes eqPulse{0%,to{opacity:.55;transform:scaleY(.7)}50%{opacity:1;transform:scaleY(1.15)}}.game-card-icon{display:inline-block;color:var(--accent);line-height:0;animation:iconFloat 3.2s ease-in-out infinite}@keyframes iconFloat{0%,to{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-7px) rotate(5deg)}}.game-card .btn-primary{box-shadow:0 0 16px rgba(210,255,0,.14),0 4px 16px rgba(0,0,0,.4);animation:playGlow 2.6s ease-in-out infinite}.game-card .btn-primary:hover{animation-play-state:paused}@keyframes playGlow{0%,to{box-shadow:0 0 12px rgba(210,255,0,.12),0 4px 16px rgba(0,0,0,.4)}50%{box-shadow:0 0 26px rgba(210,255,0,.35),0 4px 16px rgba(0,0,0,.4)}}.game-workspace{animation:wsIn .45s cubic-bezier(.22,1,.36,1) both}@keyframes wsIn{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.game-preview.drum i{height:10px}.game-preview i.on-d1{background:#d2ff00}.game-preview i.on-d2{background:#f2b9d2}.game-preview i.on-d3{background:#b7dff2}.game-learn{display:grid;grid-gap:4;gap:4;list-style:none;font-size:12.5px;color:var(--muted)}.game-learn li:before{content:"✓ ";color:var(--accent);font-weight:800}.game-workspace{display:grid;grid-gap:12;gap:12}.game-transport{display:flex;gap:8;flex-wrap:wrap;align-items:center}.game-selectrow{display:flex;gap:12;flex-wrap:wrap;align-items:flex-end}.game-hint{font-size:12px;color:var(--muted)}.game-sidegrid{display:grid;grid-gap:12;gap:12;grid-template-columns:1fr}@media (min-width:900px){.game-sidegrid{grid-template-columns:1fr 1fr}}.drum-scroll,.piano-scroll{overflow-x:auto;padding-bottom:4px;border:1px solid var(--border);border-radius:12px;background:#0a0a0a}.piano-grid{display:grid;grid-template-columns:52px repeat(16,minmax(34px,1fr));grid-gap:3px;gap:3px;min-width:680px;padding:10px}.piano-corner{font-size:12px;color:var(--muted);display:grid;place-items:center}.piano-beatnum{font-size:10px;font-weight:800;color:var(--muted);text-align:center;padding:2px 0;border-radius:4px;font-family:JetBrains Mono,monospace}.piano-beatnum.bar,.piano-beatnum.now{color:var(--accent)}.piano-beatnum.now{background:rgba(210,255,0,.15)}.piano-label{font-size:10px;font-weight:800;color:var(--muted2);display:flex;align-items:center;padding:0 6px;border-radius:6px;background:var(--surface);border:1px solid var(--border);cursor:pointer;min-height:34px;font-family:JetBrains Mono,monospace}.piano-label:hover{border-color:var(--accent-border);color:var(--accent)}.piano-cell{min-height:34px;border-radius:6px;cursor:pointer;position:relative;background:hsla(0,0%,100%,.045);border:1px solid var(--border);transition:background .12s,transform .08s,box-shadow .12s;touch-action:manipulation}.piano-cell.bar{background:hsla(0,0%,100%,.09)}.piano-cell:hover{border-color:var(--accent-border);transform:scale(1.03)}.piano-cell.on{background:rgba(210,255,0,.2);border-color:var(--accent);box-shadow:0 0 10px rgba(210,255,0,.25)}.piano-cell.now{outline:2px solid hsla(0,0%,100%,.75);outline-offset:-1px}.piano-dot{position:absolute;inset:6px;border-radius:5px;background:var(--accent);box-shadow:0 0 8px rgba(210,255,0,.5);animation:notePop .18s ease;display:block}@keyframes notePop{0%{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}.drum-grid{display:grid;grid-template-columns:76px repeat(16,minmax(30px,1fr));grid-gap:4px;gap:4px;min-width:640px;padding:10px}.drum-label{font-size:10px;font-weight:800;color:var(--muted2);display:flex;align-items:center;padding:0 8px;text-transform:uppercase;letter-spacing:.06em}.drum-cell{aspect-ratio:1;border-radius:7px;cursor:pointer;background:hsla(0,0%,100%,.05);border:1px solid var(--border);transition:background .1s,transform .08s,box-shadow .1s;touch-action:manipulation;min-width:30px}.drum-cell.bar{background:hsla(0,0%,100%,.1)}.drum-cell:hover{transform:scale(1.06);border-color:var(--border-strong)}.drum-cell.on{background:var(--row-color,var(--accent));border-color:#fff3;box-shadow:0 0 10px var(--row-color,rgba(210,255,0,.4));animation:notePop .15s ease}.drum-cell.now{outline:2px solid #fff;outline-offset:-1px}@media (max-width:640px){.drum-grid,.piano-grid{gap:4px}.piano-cell{min-height:40px}.game-selectrow .input{font-size:14px}}@media (prefers-reduced-motion:reduce){.drum-cell.on,.eq-live i.on-d1,.eq-live i.on-d2,.eq-live i.on-d3,.eq-live i.on-p,.game-card .btn-primary,.game-card-icon,.game-workspace,.piano-dot{animation:none}}.lifewalk{animation:lifewalk .32s ease-in-out infinite;transform-box:fill-box}@keyframes lifewalk{50%{transform:translateY(-5px)}}@media (prefers-reduced-motion:reduce){.lifewalk{animation:none}}.lifefloat{animation:lifefloat 5s ease-in-out infinite}@keyframes lifefloat{0%,to{transform:translateY(0);opacity:.25}50%{transform:translateY(-14px);opacity:.6}}.lifespot-hl{animation:lifespotHl 1.1s ease-in-out infinite}@keyframes lifespotHl{0%,to{opacity:.9}50%{opacity:.35}}@media (prefers-reduced-motion:reduce){.lifefloat,.lifespot-hl{animation:none}}.lifemenu{animation:limenupop .18s cubic-bezier(.2,1.4,.4,1) both;transform-origin:top left}@keyframes limenupop{0%{opacity:0;transform:scale(.85) translateY(-4px)}}.lifemenu .btn:active{transform:scale(.96)}.liact-bubble{animation:liactbubble 2.6s ease-out both;transform-box:fill-box;transform-origin:bottom center}@keyframes liactbubble{0%{opacity:0;transform:translateY(6px) scale(.6)}12%{opacity:1;transform:translateY(0) scale(1.1)}22%{transform:scale(1)}80%{opacity:1}to{opacity:0;transform:translateY(-10px)}}.liact-beat{animation:liactbeat .4s ease-in-out infinite;transform-box:fill-box;transform-origin:bottom center}@keyframes liactbeat{0%,to{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-6px) rotate(3deg)}}.liact-eat{animation:liacteat .3s ease-in-out infinite;transform-box:fill-box;transform-origin:bottom center}@keyframes liacteat{0%,to{transform:scale(1)}50%{transform:scale(1.06,.88)}}.liact-rest{animation:liactrest 2s ease-in-out infinite;transform-box:fill-box;transform-origin:bottom center}@keyframes liactrest{0%,to{transform:scale(1)}50%{transform:scale(1.03,.97)}}.liact-sell{animation:liactsell .45s ease-in-out 6;transform-box:fill-box;transform-origin:bottom center}@keyframes liactsell{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}.lifequeue-pop{animation:notePop .25s ease-out}@media (prefers-reduced-motion:reduce){.liact-beat,.liact-bubble,.liact-eat,.liact-rest,.liact-sell,.lifemenu,.lifemenu .btn,.lifequeue-pop{animation:none}}