/* SEU BAIRRO V22 — HUD urbano noturno / pixel-tech */
@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@400;500;600;700;800&family=Rajdhani:wght@500;600;700&display=swap');
:root{
 --mb-bg:#02070D;--mb-surface:#07121C;--mb-surface2:#0B1B28;--mb-surface3:#102536;--mb-line:#1A3548;
 --mb-accent:#20FF4F;--mb-accent2:#0BCF45;--mb-accent3:#087A32;--mb-glow:rgba(32,255,79,.18);
 --mb-text:#F2F5F3;--mb-muted:#AEB8BD;--mb-dim:#66747D;--mb-gold:#FFD43B;--mb-gold2:#FFB800;
 --mb-font:'Rajdhani',system-ui,sans-serif;--mb-pixel-font:'Oxanium',monospace;
 --mb-radius:12px;--mb-shadow:0 18px 50px rgba(0,0,0,.55),inset 0 1px rgba(255,255,255,.035);
}
*{scrollbar-width:thin;scrollbar-color:#1A3548 #02070D}
html,body{background:radial-gradient(circle at 50% -20%,#102536 0,#07121C 34%,#02070D 78%);color:var(--mb-text);font-family:var(--mb-font);letter-spacing:.02em}
body{position:relative}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.14;background:linear-gradient(90deg,transparent 49%,rgba(32,255,79,.025) 50%,transparent 51%),linear-gradient(0deg,transparent 49%,rgba(32,255,79,.018) 50%,transparent 51%);background-size:32px 32px;mix-blend-mode:screen;z-index:9999}
button,input,select,textarea{font-family:var(--mb-font)}
button{border:1px solid #1A3548!important;border-radius:10px!important;background:linear-gradient(180deg,#102536,#07121C)!important;color:#F2F5F3!important;box-shadow:inset 0 1px rgba(255,255,255,.06),0 5px 14px rgba(0,0,0,.35)!important;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease,filter .18s ease}
button:hover{border-color:#20FF4F!important;background:linear-gradient(180deg,#123325,#0B1B28)!important;box-shadow:inset 0 1px rgba(255,255,255,.08),0 0 12px rgba(32,255,79,.12),0 6px 16px rgba(0,0,0,.4)!important;filter:none!important}
button:active{transform:translateY(1px)}
button.primary,.primary{border-color:#20FF4F!important;background:linear-gradient(180deg,#20FF4F,#0BCF45)!important;color:#02070D!important;box-shadow:inset 0 2px rgba(255,255,255,.35),inset 0 -3px rgba(0,80,25,.22),0 0 16px rgba(32,255,79,.18),0 7px 18px rgba(0,0,0,.42)!important}
button.primary:hover,.primary:hover{background:linear-gradient(180deg,#55FF72,#20FF4F)!important}
input,textarea,select{background:#02070D!important;color:#F2F5F3!important;border:1px solid #1A3548!important;border-radius:9px!important;box-shadow:inset 0 2px 7px rgba(0,0,0,.4)!important}
input:focus,textarea:focus,select:focus{border-color:#20FF4F!important;box-shadow:0 0 0 2px rgba(32,255,79,.08),0 0 14px rgba(32,255,79,.09),inset 0 2px 7px rgba(0,0,0,.4)!important}
.topbar{height:64px!important;background:linear-gradient(180deg,#07121C,#02070D)!important;border-bottom:1px solid #1A3548!important;box-shadow:0 8px 28px rgba(0,0,0,.55),inset 0 -1px rgba(32,255,79,.07)!important;padding:0 18px!important;position:relative;z-index:20}
.topbar:after{content:"";position:absolute;left:18px;right:18px;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,#20FF4F55,transparent)}
.logo{font-family:Oxanium,Rajdhani,sans-serif!important;font-size:19px!important;font-weight:800!important;letter-spacing:.08em;text-transform:uppercase;color:#F2F5F3;text-shadow:0 0 12px rgba(32,255,79,.08)}
.logo:before{content:"◆";color:#20FF4F;margin-right:8px;font-size:11px}
.top-actions{gap:7px!important}.top-actions button{background:#07121C!important}
.card,.profile-card,.chatbox,.side,.panel,.room-card,.editor-card,.admin-card,.admin-panel,.server-card,.stat-card,.modal-card,.custom-panel,.custom-preview,.card-surface{background:linear-gradient(180deg,#0B1B28 0%,#07121C 100%)!important;border:1px solid #1A3548!important;border-radius:12px!important;box-shadow:var(--mb-shadow)!important;position:relative}
.card:before,.profile-card:before,.chatbox:before,.side:before,.room-card:before,.editor-card:before,.admin-card:before,.custom-panel:before,.custom-preview:before{content:"";position:absolute;left:10px;right:10px;top:0;height:1px;background:linear-gradient(90deg,transparent,#55FF72aa,transparent);opacity:.55}
.small,.muted,.status,.house-note,.config-note{color:#AEB8BD!important}
.coins,.shop-coins{color:#FFD43B!important;background:linear-gradient(180deg,#102536,#07121C)!important;border:1px solid #4d3d0b!important;box-shadow:inset 0 1px rgba(255,255,255,.04),0 6px 14px #0005!important}
.game{height:calc(100vh - 64px)!important;grid-template-columns:248px minmax(0,1fr) 310px!important;background:#02070D!important}
.side{border-right:1px solid #1A3548!important;border-radius:0!important;padding:14px!important;background:linear-gradient(180deg,#07121C,#02070D)!important}
.side:after{content:"HUD / BAIRRO ONLINE";display:block;margin:18px 4px 0;color:#66747D;font:700 10px Oxanium;letter-spacing:.16em}
.profile-card{padding:14px!important}.profile-card b{font-family:Oxanium;font-size:17px;letter-spacing:.04em}.menu{gap:6px!important}.menu button{background:#07121C!important;border-color:#1A3548!important}.menu button:hover{border-color:#20FF4F!important}.map-key{margin-top:16px!important;padding:11px!important;background:#02070D;border:1px solid #102536;border-radius:10px;display:grid;gap:6px}.map-key b{font:700 11px Oxanium;color:#55FF72;letter-spacing:.12em;text-transform:uppercase}.map-key span{font-size:12px;color:#AEB8BD}
.stage{background:#02070D!important;box-shadow:inset 0 0 0 1px #1A3548!important}.stage:after{content:"";position:absolute;inset:10px;border:1px solid rgba(32,255,79,.04);pointer-events:none;z-index:2}
.hud{left:14px!important;top:14px!important;right:14px!important}.hud .card{background:rgba(2,7,13,.88)!important;border:1px solid #1A3548!important;backdrop-filter:blur(8px);font-family:Oxanium}.hud .card:last-child{color:#55FF72!important}
.chatbox{border-left:1px solid #1A3548!important;border-radius:0!important;background:linear-gradient(180deg,#07121C,#02070D)!important;padding:10px!important}.chat-bar{background:#0B1B28!important;border-color:#1A3548!important;text-transform:uppercase;font-family:Oxanium!important;letter-spacing:.06em}.chat-list{padding:4px}.msg{background:#07121C!important;border:1px solid #102536!important;color:#F2F5F3!important;border-radius:9px!important}.msg b{color:#55FF72!important}.chat-send input{background:#02070D!important}.chat-send button{min-width:74px}
.interaction,.interaction-menu,.profile-peek{background:linear-gradient(180deg,#102536,#07121C)!important;border:1px solid #20FF4F!important;color:#F2F5F3!important;box-shadow:0 12px 30px #0009,0 0 14px rgba(32,255,79,.12)!important;border-radius:10px!important}.interaction-action{background:#07121C!important}.interaction-action:hover{border-color:#20FF4F!important}.bubble{background:#F2F5F3!important;color:#02070D!important;border:2px solid #20FF4F!important;box-shadow:0 5px 18px #0008,0 0 10px rgba(32,255,79,.16)!important}
.house-page,.admin{max-width:1320px!important}.house-head,.admin-head{border-bottom:1px solid #1A3548;padding-bottom:12px}.house-head h1,.admin-head h1,.panel h1,.custom-panel h2{font-family:Oxanium,Rajdhani,sans-serif!important;text-transform:uppercase;letter-spacing:.05em}.room-stage,.house-pixel-stage{background:#02070D!important;border:1px solid #1A3548!important;border-radius:12px!important;box-shadow:inset 0 0 0 1px rgba(32,255,79,.05),0 15px 35px #0008!important}.room-actions button.selected,.tabs button.active,.choice.active,.selected{border-color:#20FF4F!important;box-shadow:0 0 0 2px rgba(32,255,79,.08),0 0 14px rgba(32,255,79,.12)!important;background:#0B2A1A!important}.item-grid button,.room-list button,.choice{background:#07121C!important;border-color:#1A3548!important;color:#F2F5F3!important}.item-grid button:hover,.room-list button:hover,.choice:hover{border-color:#20FF4F!important}
.custom-page{gap:16px!important}.avatar-wrap{background:linear-gradient(#0B1B28 0 62%,#102536 62%)!important;border:2px solid #1A3548!important;border-radius:12px!important;box-shadow:inset 0 0 0 1px rgba(85,255,114,.08),0 15px 35px #0008!important}.section-kicker{color:#55FF72!important;font-family:Oxanium!important}.custom-group{border-top:1px solid #1A3548!important}.color-line{background:#07121C!important;border:1px solid #102536}
.panel{margin:7vh auto!important;padding:28px!important}.panel pre{background:#02070D!important;border:1px solid #1A3548}.brand{font-family:Oxanium!important;text-transform:uppercase;letter-spacing:.08em}.brand span{background:#0B2A1A!important;color:#55FF72!important;border:1px solid #087A32!important}
.admin-page{background:#02070D!important}.admin-shell{min-height:calc(100vh - 64px)!important}.admin-nav{background:#07121C!important;border-right:1px solid #1A3548!important}.admin-nav button{background:#07121C!important;border-color:#1A3548!important}.admin-nav button.active{background:#0B2A1A!important;border-color:#20FF4F!important;color:#55FF72!important;box-shadow:0 0 12px rgba(32,255,79,.1)!important}.table td,.table th{border-color:#1A3548!important}.table th{font-family:Oxanium;color:#55FF72;text-transform:uppercase;font-size:11px}.admin-card{color:#F2F5F3!important}
.pill{background:#0B2A1A!important;border:1px solid #087A32!important;color:#55FF72!important;border-radius:7px!important;font-family:Oxanium!important}.status.ok,.save-msg.ok{color:#55FF72!important}.save-msg.error{color:#ff7070!important}
/* cantos cortados discretos */
.hud .card,.admin-card,.room-card,.editor-card,.profile-card,.custom-panel,.custom-preview{clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%)}
@media(max-width:950px){.game{grid-template-columns:220px 1fr!important}.chatbox{display:none!important}}
@media(max-width:650px){.game{grid-template-columns:1fr!important}.side{display:none!important}}
.submit{width:100%;border:1px solid #20FF4F!important;background:linear-gradient(180deg,#20FF4F,#0BCF45)!important;color:#02070D!important;font-weight:800;box-shadow:inset 0 2px rgba(255,255,255,.3),0 0 14px rgba(32,255,79,.14)!important}
.auth-box{background:linear-gradient(180deg,#0B1B28,#07121C)!important;border:1px solid #1A3548!important;border-radius:12px!important;box-shadow:0 22px 70px #000b, inset 0 1px rgba(255,255,255,.05)!important}.auth-box .brand-icon{filter:drop-shadow(0 0 8px rgba(32,255,79,.18))}.auth-box .tabs button.active{background:#0B2A1A!important;border-color:#20FF4F!important;color:#55FF72!important}.character-setup,.char-create{background:#07121C!important;border-color:#1A3548!important}.mini-options button.active{outline:2px solid #20FF4F!important;background:#0B2A1A!important}.config-note{background:#02070D!important;border-color:#1A3548!important}
.map-editor-tools button.active{outline:2px solid #20FF4F!important}.map-editor-card canvas{background:#07121C!important;border-color:#1A3548!important}
.shop-npc-hint{background:rgba(2,7,13,.96)!important;border-color:#20FF4F!important;color:#F2F5F3!important;box-shadow:0 8px 20px #0009,0 0 12px rgba(32,255,79,.12)!important}
/* JBL */
.mb-jbl-modal{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;padding:18px;background:rgba(0,0,0,.72);backdrop-filter:blur(7px)}.mb-jbl-modal.hidden{display:none!important}.mb-jbl-shell{width:min(980px,96vw);max-height:92vh;overflow:auto;background:linear-gradient(180deg,#0B1B28,#02070D);border:1px solid #1A3548;box-shadow:0 28px 90px #000d,0 0 30px rgba(32,255,79,.08);border-radius:14px;padding:18px;position:relative}.mb-jbl-shell:before{content:"";position:absolute;left:18px;right:18px;top:0;height:2px;background:linear-gradient(90deg,transparent,#20FF4F,transparent)}.mb-jbl-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid #1A3548;padding-bottom:12px}.mb-jbl-head h2{margin:2px 0;font:800 24px Oxanium;text-transform:uppercase;letter-spacing:.08em}.mb-jbl-kicker{color:#55FF72;font:700 10px Oxanium;letter-spacing:.16em}.mb-jbl-head>button{font-size:22px;padding:4px 11px}.mb-jbl-status{display:flex;justify-content:space-between;align-items:center;padding:10px 0;color:#AEB8BD;font:700 12px Oxanium}.mb-jbl-status span:first-child{color:#55FF72}.mb-jbl-gate{min-height:180px;display:grid;place-items:center}.mb-jbl-lock{text-align:center;max-width:560px;padding:30px;border:1px solid #1A3548;border-radius:12px;background:#07121C;box-shadow:inset 0 1px rgba(255,255,255,.04)}.mb-jbl-lock strong{font:800 20px Oxanium;color:#F2F5F3}.mb-jbl-lock p{color:#AEB8BD}.mb-jbl-lock small{display:block;margin-top:12px;color:#66747D}.mb-jbl-lock button{margin:5px}.mb-jbl-search{display:flex;gap:8px}.mb-jbl-search input{flex:1}.mb-jbl-main{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);gap:12px;margin-top:12px}.mb-jbl-results{display:grid;gap:7px;align-content:start;max-height:480px;overflow:auto}.mb-jbl-result{display:grid;grid-template-columns:94px 1fr;gap:10px;text-align:left;padding:8px;background:#07121C!important;border:1px solid #102536!important}.mb-jbl-result.active{border-color:#20FF4F!important;background:#0B2A1A!important}.mb-jbl-result img{width:94px;height:54px;object-fit:cover;background:#02070D}.mb-jbl-result b{display:block;color:#F2F5F3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mb-jbl-result small{display:block;color:#66747D;margin-top:4px}.mb-jbl-empty{padding:22px;border:1px dashed #1A3548;border-radius:10px;color:#AEB8BD}.mb-jbl-player{border:1px solid #1A3548;border-radius:12px;padding:10px;background:#02070D;position:sticky;top:0;height:max-content}.mb-jbl-now{font:700 14px Oxanium;color:#55FF72;min-height:36px;display:flex;align-items:center}.mb-jbl-frame{aspect-ratio:16/9;background:#000;margin:8px 0}.mb-jbl-frame iframe{width:100%;height:100%;border:0}.mb-jbl-controls{display:flex;align-items:center;gap:6px}.mb-jbl-controls button{min-width:54px}.mb-jbl-controls label{margin-left:auto;color:#66747D;font:700 10px Oxanium;display:flex;align-items:center;gap:6px}.mb-jbl-controls input{width:90px;accent-color:#20FF4F}.mb-jbl-sync{margin-top:9px;padding-top:8px;border-top:1px solid #102536;color:#66747D;font-size:11px}@media(max-width:760px){.mb-jbl-main{grid-template-columns:1fr}.mb-jbl-player{position:static}.mb-jbl-shell{padding:12px}}