*,:before,:after{box-sizing:border-box}:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}body{color:#fff;background:#0a0812;min-height:100svh;margin:0}#root{min-height:100svh}button{font-family:inherit}h1,h2,p{margin:0}.app{flex-direction:column;align-items:center;min-height:100svh;display:flex;position:relative;overflow:hidden}.bg-orbs{pointer-events:none;z-index:0;position:fixed;inset:0}.orb{filter:blur(80px);opacity:.35;border-radius:50%;animation:12s ease-in-out infinite alternate drift;position:absolute}.orb-1{background:radial-gradient(circle,#7c3aed,#4f46e5);width:500px;height:500px;animation-duration:14s;top:-150px;left:-100px}.orb-2{background:radial-gradient(circle,#ec4899,#f43f5e);width:400px;height:400px;animation-duration:10s;animation-delay:-4s;bottom:-100px;right:-80px}.orb-3{background:radial-gradient(circle,#06b6d4,#3b82f6);width:350px;height:350px;animation-duration:16s;animation-delay:-8s;top:40%;left:60%}@keyframes drift{0%{transform:translate(0)scale(1)}50%{transform:translate(30px,-40px)scale(1.1)}to{transform:translate(-20px,20px)scale(.95)}}.header{z-index:1;text-align:center;padding:40px 20px 0;position:relative}.title{background:linear-gradient(135deg,#a78bfa,#f472b6,#38bdf8);-webkit-text-fill-color:transparent;letter-spacing:-1px;-webkit-background-clip:text;background-clip:text;margin:0 0 8px;font-size:clamp(2.5rem,6vw,4rem);font-weight:800}.subtitle{color:#ffffff80;margin:0;font-size:.95rem}kbd{color:#fffc;background:#ffffff1f;border:1px solid #fff3;border-radius:4px;padding:1px 6px;font-family:inherit;font-size:.85em}.main{z-index:1;box-sizing:border-box;flex-direction:column;flex:1;align-items:center;gap:32px;width:100%;max-width:600px;padding:40px 20px;display:flex;position:relative}.stage{cursor:pointer;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff0f;border:1px solid #ffffff1f;border-radius:28px;justify-content:center;align-items:center;width:180px;height:180px;transition:transform .15s,box-shadow .15s;display:flex;position:relative;box-shadow:0 8px 32px #0000004d}.stage:hover{transform:scale(1.04);box-shadow:0 12px 40px #7c3aed66}.stage:active{transform:scale(.97)}.emoji-display{-webkit-user-select:none;user-select:none;font-size:90px;line-height:1;transition:transform .3s cubic-bezier(.34,1.56,.64,1),opacity .15s;display:block}.emoji-display.flipping{animation:.3s forwards flipOut}@keyframes flipOut{0%{opacity:1;transform:rotateY(0)scale(1)}50%{opacity:0;transform:rotateY(90deg)scale(.6)}to{opacity:1;transform:rotateY(0)scale(1)}}.pulse-ring{pointer-events:none;border:2px solid #a78bfa66;border-radius:32px;animation:2.5s ease-in-out infinite pulse;position:absolute;inset:-4px}.pulse-ring.hot{border-color:#fb923cb3;animation:1s ease-in-out infinite pulse-hot}@keyframes pulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:.2;transform:scale(1.06)}}@keyframes pulse-hot{0%,to{opacity:.8;transform:scale(1);box-shadow:0 0 20px #fb923c66}50%{opacity:.4;transform:scale(1.08);box-shadow:0 0 40px #fb923cb3}}.flip-btn{color:#fff;cursor:pointer;letter-spacing:.5px;background:linear-gradient(135deg,#7c3aed,#ec4899);border:none;border-radius:50px;align-items:center;gap:10px;padding:14px 36px;font-size:1.1rem;font-weight:700;transition:transform .15s,box-shadow .15s,opacity .15s;display:flex;box-shadow:0 4px 24px #7c3aed80}.flip-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 32px #7c3aeda6}.flip-btn:active:not(:disabled){transform:translateY(0)}.flip-btn:disabled{opacity:.5;cursor:not-allowed}.stats{gap:16px;width:100%;display:flex}.stat-card{text-align:center;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff0f;border:1px solid #ffffff1a;border-radius:16px;flex:1;padding:16px 12px;transition:border-color .3s,background .3s}.stat-hot{background:#fb923c1f;border-color:#fb923c66;animation:1.5s ease-in-out infinite alternate glow-hot}@keyframes glow-hot{0%{box-shadow:0 0 8px #fb923c33}to{box-shadow:0 0 24px #fb923c80}}.stat-value{color:#fff;margin-bottom:4px;font-size:1.8rem;font-weight:800;line-height:1.1;display:block}.stat-label{text-transform:uppercase;letter-spacing:1px;color:#ffffff73;font-size:.75rem;font-weight:600;display:block}.history-section{width:100%}.history-title{text-transform:uppercase;letter-spacing:2px;color:#ffffff59;text-align:center;margin:0 0 16px;font-size:.85rem;font-weight:600}.history-grid{grid-template-columns:repeat(5,1fr);gap:10px;display:grid}.history-item{aspect-ratio:1;animation:.35s cubic-bezier(.34,1.56,.64,1) both popIn;animation-delay:var(--delay);background:#ffffff0d;border:1px solid #ffffff14;border-radius:14px;justify-content:center;align-items:center;font-size:1.8rem;transition:transform .2s,background .2s;display:flex}.history-item:hover{background:#ffffff1a;transform:scale(1.12)}@keyframes popIn{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.footer{z-index:1;color:#ffffff4d;text-align:center;padding:20px;font-size:.85rem;position:relative}@media (width<=480px){.stage{width:150px;height:150px}.emoji-display{font-size:70px}.stats{gap:10px}.stat-value{font-size:1.4rem}.history-grid{grid-template-columns:repeat(5,1fr);gap:8px}.history-item{font-size:1.4rem}}