*{margin:0;padding:0;box-sizing:border-box;}html,body{width:100%;height:100%;overflow:hidden;background:#000;font-family:sans-serif;} .screen{display:none;position:fixed;inset:0;align-items:center;justify-content:center;flex-direction:column;background:linear-gradient(135deg,#0a001a 0%,#050010 100%);}.screen.active{display:flex;animation:screenIn .2s ease;} @keyframes screenIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}} .gtitle{ font-family:'Bangers',Impact,cursive; font-size:clamp(3.2rem,11vw,7rem); background:linear-gradient(135deg,#ffd700 0%,#ff9900 30%,#ff3e6c 60%,#00d4ff 100%); -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; letter-spacing:5px;filter:drop-shadow(0 0 24px rgba(255,180,0,.4)); animation:titlePop .55s cubic-bezier(.34,1.56,.64,1); } @keyframes titlePop{0%{transform:scale(.7) translateY(20px);opacity:0}100%{transform:scale(1) translateY(0);opacity:1}} @keyframes gradShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}} .gsub{font-family:'Bangers',Impact,cursive;font-size:1rem;color:#aaa;letter-spacing:2px;margin:-8px 0 24px;} .mbtn{font-family:'Bangers',Impact,cursive;font-size:1.1rem;letter-spacing:2px;padding:10px 28px;border:none;border-radius:10px;cursor:pointer;transition:all .12s;min-width:140px;max-width:260px;width:90%;} .b1{background:linear-gradient(135deg,#ffd700,#ff9900);color:#1a0800;}.b2{background:linear-gradient(135deg,#00d4ff,#0044cc);color:#fff;}.b3{background:linear-gradient(135deg,#39ff14,#00aa00);color:#000;}.b4{background:linear-gradient(135deg,#ff3e6c,#aa0033);color:#fff;}.b5{background:rgba(255,255,255,.08);color:#aaa;border:1px solid rgba(255,255,255,.15);} .mbtn:hover{transform:translateY(-2px) scale(1.04);filter:brightness(1.18);box-shadow:0 8px 24px rgba(0,0,0,.4);}.mbtn:active{transform:translateY(1px) scale(.97);filter:brightness(.95);} .ctitle{font-family:'Bangers',Impact,cursive;font-size:2.2rem;color:#ffd700;letter-spacing:3px;margin-bottom:16px;} .menu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;max-width:440px;width:90%;margin-bottom:14px;} .menu-card{background:rgba(255,255,255,.06);border:2px solid rgba(255,255,255,.12);border-radius:14px;padding:16px 10px;cursor:pointer;text-align:center;transition:all .14s;}.menu-card:hover,.menu-card.selected{border-color:#ffd700;background:rgba(255,215,0,.12);transform:translateY(-3px);box-shadow:0 8px 24px rgba(255,215,0,.15);}.menu-card .mc-icon{font-size:2rem;margin-bottom:6px;}.menu-card .mc-label{font-family:'Bangers',Impact,cursive;font-size:.85rem;color:#ffd700;letter-spacing:1px;}.menu-card .mc-desc{font-size:.62rem;color:#888;margin-top:2px;} .char-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:480px;width:92%;margin-bottom:12px;}.ccard{background:rgba(0,0,0,.45);border:2px solid rgba(255,255,255,.15);border-radius:10px;padding:8px 4px;cursor:pointer;text-align:center;transition:all .13s;backdrop-filter:blur(4px);}.ccard:hover{border-color:#00d4ff;background:rgba(0,212,255,.08);transform:translateY(-2px);}.ccard canvas{display:block;margin:0 auto;}.ccard .cn{font-family:'Bangers',Impact,cursive;font-size:.75rem;color:#fff;letter-spacing:.5px;margin-top:4px;}.ccard .cs{font-size:.55rem;color:#888;} .map-thumb{background:rgba(255,255,255,.04);border:2px solid rgba(255,255,255,.14);border-radius:10px;cursor:pointer;overflow:hidden;transition:all .14s;display:inline-block;}.map-thumb:hover{border-color:#00d4ff;transform:scale(1.03);}.map-thumb.selected{border-color:#ffd700;box-shadow:0 0 12px rgba(255,215,0,.4);}#mapGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:520px;width:92%;max-height:55vh;overflow-y:auto;margin-bottom:12px;} .room-panel{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:12px 14px;margin-bottom:10px;width:100%;}.room-panel h3{font-family:'Bangers',Impact,cursive;font-size:1rem;letter-spacing:2px;margin-bottom:10px;} .setting-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;flex-wrap:wrap;gap:4px;}.setting-label{font-size:.75rem;color:#ccc;min-width:110px;}.setting-options{display:flex;gap:4px;flex-wrap:wrap;} .sbtn{font-family:'Bangers',Impact,cursive;font-size:.72rem;padding:4px 10px;border-radius:6px;border:1.5px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);color:#aaa;cursor:pointer;letter-spacing:.5px;transition:all .1s;}.sbtn.active{background:rgba(255,215,0,.18);border-color:#ffd700;color:#ffd700;}.sbtn:hover{background:rgba(255,255,255,.1);} .rinput{background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.18);border-radius:8px;color:#fff;font-size:.82rem;padding:6px 10px;width:100%;max-width:300px;outline:none;}.rinput:focus{border-color:#00d4ff;} .overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:100;align-items:center;justify-content:center;flex-direction:column;padding:12px;}.overlay.open{display:flex;}.ov-title{font-family:'Bangers',Impact,cursive;font-size:1.6rem;color:#ffd700;margin-bottom:14px;letter-spacing:2px;}.ov-grid{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;max-height:70vh;overflow-y:auto;width:100%;max-width:600px;}.ov-panel{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:12px;min-width:200px;flex:1;}.ov-panel h4{font-family:'Bangers',Impact,cursive;font-size:.95rem;color:#00d4ff;margin-bottom:8px;}.ov-panel .move-row{font-size:.68rem;color:#ccc;margin-bottom:3px;display:flex;gap:6px;}.ov-panel .move-key{background:rgba(255,255,255,.12);border-radius:4px;padding:1px 5px;font-family:monospace;color:#ffd700;font-size:.65rem;} #hud{position:absolute;top:8px;left:50%;transform:translateX(-50%);display:none;gap:8px;z-index:10;pointer-events:none;}.hcard{background:rgba(0,0,0,.65);border:1.5px solid rgba(255,255,255,.2);border-radius:12px;padding:6px 12px;min-width:96px;text-align:center;backdrop-filter:blur(8px);box-shadow:0 4px 16px rgba(0,0,0,.4);}.hname{font-family:'Bangers',Impact,cursive;font-size:.72rem;letter-spacing:1px;}.hdmg{font-family:'Bangers',Impact,cursive;font-size:1.4rem;line-height:1.1;}.hbar{height:4px;background:rgba(255,255,255,.12);border-radius:2px;margin-top:3px;}.hbarf{height:100%;border-radius:2px;transition:width .12s;}.hstk{font-size:.65rem;margin:2px 0;}.life-pip{display:inline-block;width:7px;height:7px;border-radius:50%;margin:0 1px;}.life-pip.alive{background:#ff3e6c;}.life-pip.dead{background:rgba(255,255,255,.15);} #coinDisplay{position:absolute;top:8px;right:10px;font-family:'Bangers',Impact,cursive;font-size:.9rem;color:#ffd700;z-index:10;pointer-events:none;} .coinf,.dmgf,.cmbf{position:fixed;pointer-events:none;z-index:30;font-family:'Bangers',Impact,cursive;animation:floatUp .9s ease forwards;}.coinf{color:#ffd700;font-size:1rem;}.dmgf{font-size:1.1rem;}.cmbf{color:#ff8800;font-size:1.3rem;}@keyframes floatUp{0%{transform:translateY(0);opacity:1}100%{transform:translateY(-60px);opacity:0}} .win-title{font-family:'Bangers',Impact,cursive;font-size:3rem;background:linear-gradient(135deg,#ffd700,#ff9900);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:4px;}.win-sub{font-size:.9rem;color:#aaa;margin:6px 0 16px;}.stats-box{background:rgba(255,255,255,.06);border-radius:12px;padding:12px 18px;margin-bottom:16px;font-size:.78rem;color:#ccc;text-align:left;max-width:340px;width:90%;} #topBtns{position:absolute;top:8px;right:10px;display:flex;gap:5px;z-index:15;pointer-events:all;}.topbtn{background:rgba(0,0,0,.6);border:1.5px solid rgba(255,255,255,.22);border-radius:9px;color:#fff;font-size:.85rem;padding:5px 9px;cursor:pointer;font-family:'Bangers',Impact,cursive;letter-spacing:.5px;backdrop-filter:blur(6px);transition:all .1s;}.topbtn:hover{background:rgba(255,255,255,.18);transform:scale(1.08);} #battleControls{position:absolute;top:45px;right:10px;background:rgba(0,0,0,.75);border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:8px 10px;display:none;z-index:14;max-width:200px;font-size:.65rem;color:#ccc;}.bc-title{font-family:'Bangers',Impact,cursive;color:#ffd700;font-size:.8rem;margin-bottom:5px;} .skin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;max-width:520px;width:92%;max-height:55vh;overflow-y:auto;margin-bottom:10px;}.scard{background:rgba(255,255,255,.05);border:2px solid rgba(255,255,255,.1);border-radius:8px;padding:6px;cursor:pointer;text-align:center;transition:all .12s;}.scard:hover{border-color:#00d4ff;}.scard.owned{border-color:#39ff14;}.scard.equipped{border-color:#ffd700;background:rgba(255,215,0,.1);}.scard .sk-n{font-size:.6rem;color:#ffd700;font-family:'Bangers',Impact,cursive;margin-top:3px;}.scard .sk-p{font-size:.55rem;color:#888;} .plog{max-width:480px;width:92%;max-height:65vh;overflow-y:auto;}.pver{background:rgba(255,215,0,.07);border-left:3px solid #ffd700;border-radius:0 8px 8px 0;padding:8px 12px;margin-bottom:8px;}.pver-h{font-family:'Bangers',Impact,cursive;font-size:.9rem;color:#ffd700;letter-spacing:1px;}.pver-i{font-size:.65rem;color:#bbb;margin-top:3px;} .lb-row{display:flex;gap:10px;align-items:center;padding:5px 10px;border-bottom:1px solid rgba(255,255,255,.06);font-size:.75rem;} #kbGrid{display:grid;grid-template-columns:1fr 1fr;gap:6px;max-width:520px;width:100%;margin-bottom:12px;overflow-y:auto;max-height:65vh;} #devConsole{position:fixed;bottom:0;left:0;right:0;background:rgba(0,20,0,.95);border-top:2px solid #39ff14;z-index:500;display:none;flex-direction:column;max-height:220px;}#devConsole.open{display:flex;}#devOutput{flex:1;overflow-y:auto;padding:6px 8px;font-family:monospace;font-size:.7rem;color:#39ff14;white-space:pre-wrap;min-height:60px;max-height:140px;}#devInput{background:transparent;border:none;border-top:1px solid #39ff1455;color:#39ff14;font-family:monospace;font-size:.75rem;padding:5px 8px;outline:none;}#devInput::placeholder{color:#39ff1466;} #mobileCtrl{display:none;position:fixed;inset:0;pointer-events:none;z-index:20;}#joyZone{position:absolute;bottom:18px;left:14px;width:154px;height:154px;pointer-events:all;touch-action:none;}#joyBase{position:absolute;inset:0;border-radius:50%;background:rgba(0,0,0,.35);border:3px solid rgba(255,255,255,.25);}#joyKnob{position:absolute;width:62px;height:62px;border-radius:50%;background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.55),rgba(255,255,255,.2));border:2.5px solid rgba(255,255,255,.7);top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 2px 12px rgba(0,0,0,.4);}#actionBtns{position:absolute;bottom:14px;right:10px;display:flex;flex-direction:column-reverse;gap:7px;pointer-events:all;align-items:flex-end;}.actrow{display:flex;gap:7px;align-items:center;justify-content:flex-end;}.abtn{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Bangers',Impact,cursive;font-size:1rem;color:#fff;cursor:pointer;touch-action:manipulation;pointer-events:all;border:2.5px solid;user-select:none;-webkit-user-select:none;background:rgba(0,0,0,.35);box-shadow:0 3px 10px rgba(0,0,0,.5);transition:transform .06s,filter .06s;}.abtn:active,.abtn.pr{transform:scale(.86);filter:brightness(1.6);}.aa{border-color:#ff3e6c;}.ab{border-color:#c77dff;}.aj{border-color:#00c3ff;}.ag{border-color:#39ff14;} @keyframes sdFlash{from{color:#ff2020}to{color:#ffcc00}} /* ── PATCH NOTES ─────────────────────────────────────────── */ .patch-entry{background:rgba(255,215,0,.05);border-left:3px solid #ffd700;border-radius:0 10px 10px 0;padding:10px 14px;margin-bottom:8px;} .patch-ver{font-family:'Bangers',Impact,cursive;font-size:1rem;color:#ffd700;letter-spacing:2px;} .patch-date{font-size:.62rem;color:#777;margin-bottom:4px;} .patch-item{font-size:.65rem;color:#bbb;margin:2px 0;padding-left:8px;line-height:1.4;} .patch-item::before{content:'▸ ';color:#ffd700;} /* ── CHAR SELECT ─────────────────────────────────────────── */ .cname{font-family:'Bangers',Impact,cursive;font-size:.74rem;color:#fff;margin-top:3px;letter-spacing:.5px;text-shadow:0 1px 4px rgba(0,0,0,.9);} .cstats{font-size:.52rem;color:#777;margin-top:1px;} .ccard.selected{border-color:#ffd700 !important;background:rgba(255,215,0,.12);transform:scale(1.05);} /* ── SKIN SCREEN ─────────────────────────────────────────── */ .skinlabel{font-family:'Bangers',Impact,cursive;font-size:1rem;color:#ffd700;margin-bottom:4px;letter-spacing:2px;} /* ── ACCOUNT ─────────────────────────────────────────────── */ .acct-stat{font-size:.72rem;color:#aaa;margin:2px 0;}.acct-stat b{color:#ffd700;} /* ── BATTLE CONTROLS ─────────────────────────────────────── */ #battleControls{position:absolute;top:45px;right:10px;background:rgba(0,0,0,.85);border:1.5px solid rgba(255,255,255,.2);border-radius:12px;padding:8px 12px;display:none;z-index:14;max-width:215px;font-size:.62rem;color:#ccc;backdrop-filter:blur(8px);} #battleControls.show{display:block;} .bc-title{font-family:'Bangers',Impact,cursive;color:#ffd700;font-size:.85rem;margin-bottom:5px;letter-spacing:1px;} .bc-row{display:flex;justify-content:space-between;align-items:center;margin:2px 0;} .bc-act{color:#aaa;}.bc-key{background:rgba(255,215,0,.15);border:1px solid rgba(255,215,0,.3);border-radius:4px;padding:1px 5px;color:#ffd700;font-family:monospace;font-size:.58rem;} /* ── MOVES OVERLAY ───────────────────────────────────────── */ .overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:100;align-items:center;justify-content:center;flex-direction:column;padding:12px;overflow-y:auto;} .overlay.open{display:flex;} .ov-title{font-family:'Bangers',Impact,cursive;font-size:1.6rem;color:#ffd700;margin-bottom:12px;letter-spacing:2px;} .ov-grid{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;max-width:620px;width:100%;} .ov-panel{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:12px;min-width:180px;flex:1;} .ov-panel h4{font-family:'Bangers',Impact,cursive;font-size:.9rem;color:#00d4ff;margin-bottom:7px;} .move-row{font-size:.65rem;color:#ccc;margin-bottom:3px;display:flex;gap:6px;align-items:center;} .move-key{background:rgba(255,255,255,.12);border-radius:4px;padding:1px 5px;font-family:monospace;color:#ffd700;font-size:.62rem;white-space:nowrap;} /* ── DEV CONSOLE ─────────────────────────────────────────── */ #devConsole{position:fixed;bottom:0;left:0;right:0;background:rgba(0,12,0,.97);border-top:2px solid #39ff14;z-index:500;display:none;flex-direction:column;max-height:260px;} #devConsole.open{display:flex;} #devOutput{flex:1;overflow-y:auto;padding:6px 10px;font-family:'Courier New',monospace;font-size:.68rem;color:#39ff14;white-space:pre-wrap;min-height:80px;max-height:180px;line-height:1.4;} #devInput{background:rgba(0,25,0,.8);border:none;border-top:1px solid #39ff1433;color:#39ff14;font-family:'Courier New',monospace;font-size:.72rem;padding:5px 10px;outline:none;} #devInput::placeholder{color:#39ff1455;} /* ── EXPORT/IMPORT ───────────────────────────────────────── */ #exportSection{margin-top:6px;}.codebox{background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.12);border-radius:6px;padding:6px;font-family:monospace;font-size:.58rem;color:#aaa;word-break:break-all;max-height:60px;overflow-y:auto;}
JAYJBONK
THE ULTIMATE BRAWLER
🪙 0  |  👤 PLAYER
🗺️ STAGE SELECT
⚔️ PICK YOUR FIGHTER
🪙 0
↑
B
A
🛡
🎯
DROP
TAUNT
🛡
🛡 LEFT=SHIELD • DROP • SWIPE A=DIR.ATK
YOUR MOVES
WINNER!
📖 HOW TO PLAY

🎮 KEYBOARD (P1)

A / DMove left/right
W / SpaceJump
SFast fall / Drop through
JAttack
KSpecial
LShield / Parry
VRanged attack
TTaunt (–3% damage)
` (backtick)Dev console
P / EscPause

⚔️ ATTACKS

Jab — A (neutral)
Jab 2 — A again quickly
Side smash — ←/→ + A
Dash attack — run + A
Up smash — ↑ + A
Down smash — ↓ + A
Neutral air — A in air
Back air — away + A in air
Up air — ↑ + A in air
Down air — ↓ + A in air (spike)
Charge smash — hold A, release

🛡️ DEFENCE & MOVEMENT

Shield — hold L
Parry — L within 8 frames of hit
Dodge roll — L + ←/→
DI — hold direction in knockback
Combo break — mash J × 3
Drop through — S on platform
Edge grab — fall past ledge
Wall jump — jump at a wall
Grab — G key (then A=pummel, J=throw)
Escape grab — mash J/A × 12
500%+ = ultra launch on any hit 💀

✨ YOUR CHARACTER

⚙️ SETTINGS

🎮 MATCH RULES

Stocks
Time Limit
Powerups
Hazards
No Knockback
Infinite Jumps
Start Damage

⚡ PHYSICS

Gravity
KB Scale

🎵 AUDIO

Music
Sound FX

🖥️ DISPLAY

Screen Shake
Particles
Show FPS

🤖 BOT OPTIONS

Difficulty
CPU Count
CPU Character
Bot Aggression
Bot Teams

📱 CONTROLS

Touch Controls

🔐 DEV MODE

⌨️ KEYBINDS
Click a button then press a key to remap.
🌐 ONLINE
🏠 HOST A ROOM
Code: —
🔗 JOIN A ROOM
🎨 SKINS
← Pick a character
🪙 0
🏆 LEADERBOARD
📋 PATCH NOTES
👤 PROFILE