/* RAPID FIRE — neon arcade. Dark, glowing, fast. */
.neon{--bg:#07061A;--pink:#FF2E93;--cyan:#19E3FF;--lime:#B8FF3C;--yel:#FFE14D;--ink:#EAF0FF;--dim:#7F86B8;
  background:#000;color:var(--ink);font-family:'Chakra Petch',system-ui,sans-serif;font-weight:700}
.neon #app{background:radial-gradient(120% 70% at 50% 0%,#1B0F4A 0%,var(--bg) 60%)}
.neon .screen{animation:fade .25s both}
.neon h1,.neon .bung{font-family:'Bungee','Impact',sans-serif;font-weight:400;letter-spacing:.02em}
.neon a.ib,.neon .ib{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;border:2px solid var(--cyan);color:var(--cyan);font-size:18px;box-shadow:0 0 12px -2px var(--cyan),inset 0 0 8px -4px var(--cyan)}
.neon .btn{display:inline-flex;justify-content:center;align-items:center;font-family:'Bungee';font-size:22px;padding:16px 26px;border-radius:12px;border:3px solid var(--pink);color:#fff;background:linear-gradient(#FF2E93,#C4106B);box-shadow:0 0 24px -2px var(--pink),0 5px 0 #6E0A3C;text-shadow:0 0 10px rgba(255,255,255,.6);transition:transform .08s}
.neon .btn:active{transform:translateY(4px);box-shadow:0 0 24px -2px var(--pink),0 1px 0 #6E0A3C}
.neon .btn.ghost{background:transparent;border-color:var(--cyan);box-shadow:0 0 14px -4px var(--cyan);font-size:16px;text-shadow:none;color:var(--cyan)}
/* title */
.t-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;position:relative}
.sun{position:absolute;top:6%;width:220px;height:220px;border-radius:50%;background:linear-gradient(#FFE14D 0 30%,#FF2E93 70%);filter:drop-shadow(0 0 40px #FF2E93);mask:repeating-linear-gradient(#000 0 14px,transparent 14px 18px);-webkit-mask:repeating-linear-gradient(#000 0 14px,transparent 14px 18px);opacity:.9}
.floor{position:absolute;left:-20%;right:-20%;bottom:0;height:38%;background:linear-gradient(transparent,rgba(25,227,255,.18));transform:perspective(220px) rotateX(58deg);transform-origin:bottom;
  background-image:linear-gradient(rgba(25,227,255,.55) 2px,transparent 2px),linear-gradient(90deg,rgba(25,227,255,.55) 2px,transparent 2px);background-size:46px 46px;animation:scroll 1.2s linear infinite;pointer-events:none}
@keyframes scroll{to{background-position:0 46px}}
.t-title{font-size:54px;line-height:.95;color:#fff;text-shadow:0 0 6px #fff,0 0 18px var(--pink),0 0 40px var(--pink);margin-top:150px;position:relative}
.t-title span{color:var(--cyan);text-shadow:0 0 6px #fff,0 0 18px var(--cyan),0 0 40px var(--cyan)}
.t-sub{color:var(--ink);max-width:290px;line-height:1.35;position:relative}
.rules{list-style:none;padding:0;margin:0;display:flex;gap:8px;position:relative}
.rules li{font-size:12px;padding:8px 10px;border:1px solid var(--dim);border-radius:10px;color:var(--dim);max-width:100px;line-height:1.2}
.rules li b{display:block;color:var(--yel);font-size:20px;font-family:'Bungee'}
.hi{color:var(--yel);letter-spacing:.14em;font-size:13px;position:relative}
.t-cta{position:relative;display:flex;flex-direction:column;gap:10px;align-items:center;padding-bottom:6px}
.blink{animation:bl 1s steps(2) infinite}@keyframes bl{50%{opacity:.25}}
/* hud */
.hud{display:flex;align-items:center;gap:12px;position:relative;z-index:5}
.hud .sc{flex:1;text-align:center;line-height:1}.hud .sc small{display:block;font-size:11px;letter-spacing:.2em;color:var(--dim)}
.hud .sc b{font-family:'Bungee';font-size:34px;color:#fff;text-shadow:0 0 12px var(--cyan)}
.lives{font-size:22px;letter-spacing:2px;color:var(--pink);text-shadow:0 0 10px var(--pink);min-width:78px;text-align:right}
.lives .x{color:#3A2A5C;text-shadow:none}
.field{position:relative;flex:1;min-height:0;margin:10px -16px 0;overflow:hidden}
.field:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(transparent 0 38px,rgba(25,227,255,.07) 38px 40px);animation:rain 1.5s linear infinite}
@keyframes rain{to{background-position:0 40px}}
.dl{position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--pink);box-shadow:0 0 14px 2px var(--pink),0 -30px 40px -10px rgba(255,46,147,.5)}
.dl span{position:absolute;right:12px;bottom:6px;font-size:10px;letter-spacing:.3em;color:var(--pink)}
.fcard{position:absolute;left:14px;right:14px;top:0;will-change:transform;z-index:3}
.rcard{background:linear-gradient(#171447,#0F0D33);border:2px solid var(--cyan);border-radius:16px;padding:14px 16px;box-shadow:0 0 22px -4px var(--cyan),inset 0 0 22px -12px var(--cyan);touch-action:none;cursor:grab;position:relative}
.rcard .em{font-size:30px;display:block;margin-bottom:6px}
.rcard p{margin:0 0 8px;font-size:16.5px;line-height:1.3;color:var(--ink)}
.rcard h2{margin:0;font-family:'Bungee';font-weight:400;font-size:19px;color:var(--yel);text-shadow:0 0 10px rgba(255,225,77,.5);line-height:1.15}
.fcard.ok .rcard{animation:zapout .32s ease-in both;border-color:var(--lime);box-shadow:0 0 30px 2px var(--lime)}
.fcard.ok.r .rcard{--d:1}.fcard.ok.l .rcard{--d:-1}
@keyframes zapout{to{transform:translateX(calc(var(--d)*130%)) rotate(calc(var(--d)*14deg)) scale(.7);opacity:0}}
.fcard.bad .rcard{animation:crack .5s ease-out both;border-color:var(--pink);box-shadow:0 0 30px 2px var(--pink)}
@keyframes crack{0%{transform:none}15%{transform:translateX(-8px) rotate(-2deg)}30%{transform:translateX(8px) rotate(2deg)}100%{transform:translateY(60px) scale(.8);opacity:0}}
.pts{position:absolute;z-index:6;font-family:'Bungee';font-size:26px;color:var(--lime);text-shadow:0 0 12px var(--lime);pointer-events:none;animation:pts .8s ease-out both}
.pts.neg{color:var(--pink);text-shadow:0 0 12px var(--pink)}
@keyframes pts{from{opacity:1;transform:translateY(0) scale(.8)}to{opacity:0;transform:translateY(-70px) scale(1.3)}}
.combo{position:absolute;left:14px;top:10px;font-family:'Bungee';font-size:20px;color:var(--yel);text-shadow:0 0 12px var(--yel);z-index:4}
.combo.fire{color:#FF8A1A;text-shadow:0 0 14px #FF4B1A;animation:fl .3s infinite alternate}
@keyframes fl{to{transform:scale(1.12)}}
.neon.shake #app{animation:shk .35s}
@keyframes shk{20%{transform:translate(-6px,3px)}40%{transform:translate(6px,-3px)}60%{transform:translate(-4px,2px)}}
.ticker{min-height:44px;margin:8px 0;font-size:13.5px;line-height:1.3;color:var(--ink);display:flex;align-items:center;gap:8px;padding:6px 10px;border-left:3px solid var(--dim);background:rgba(255,255,255,.04);border-radius:0 8px 8px 0;transition:border-color .2s}
.ticker.ok{border-color:var(--lime)}.ticker.bad{border-color:var(--pink)}.ticker small{color:var(--dim);display:block}
.pads{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pad{height:78px;border-radius:14px;font-family:'Bungee';font-size:20px;line-height:1;display:flex;flex-direction:column;gap:2px;align-items:center;justify-content:center;border:3px solid;transition:transform .06s;background:rgba(255,255,255,.03)}
.pad small{font-family:'Chakra Petch';font-size:11px;color:var(--dim);letter-spacing:.2em}
.pad.L{border-color:var(--cyan);color:var(--cyan);box-shadow:0 0 18px -4px var(--cyan),inset 0 0 18px -10px var(--cyan)}
.pad.R{border-color:var(--pink);color:var(--pink);box-shadow:0 0 18px -4px var(--pink),inset 0 0 18px -10px var(--pink)}
.pad:active,.pad.hot{transform:scale(.95);background:rgba(255,255,255,.12)}
/* game over */
.over{align-items:center;text-align:center;overflow:auto;gap:8px}
.over h1{font-size:46px;color:var(--pink);text-shadow:0 0 6px #fff,0 0 22px var(--pink);margin-top:14px}
.big{font-family:'Bungee';font-size:64px;color:#fff;text-shadow:0 0 18px var(--cyan);line-height:1}
.over .meta{color:var(--dim);letter-spacing:.1em;font-size:13px}
.over .row{display:flex;gap:10px;width:100%}.over .row div{flex:1;border:1px solid var(--dim);border-radius:12px;padding:10px 4px}
.over .row b{display:block;font-family:'Bungee';font-size:22px;color:var(--yel)}.over .row small{font-size:11px;color:var(--dim);letter-spacing:.14em}
.rev{width:100%;text-align:left;display:flex;flex-direction:column;gap:6px}
.rev h4{margin:6px 0 0;font-size:12px;color:var(--cyan);letter-spacing:.2em}
.rev div{background:rgba(255,255,255,.05);border-left:3px solid var(--pink);padding:8px 10px;border-radius:0 8px 8px 0;font-size:14px;line-height:1.3}
.rev small{display:block;color:var(--dim);margin-top:2px}
.over .acts{width:100%;display:flex;flex-direction:column;gap:10px;margin-top:auto;padding-top:8px}
