/* FIGHT EMPIRE — boxing tycoon. Dark arena + gold. Mobile-first. */
:root{
  --bg:#0b0b10; --panel:#14141c; --panel2:#1b1b26; --line:#2a2a3a;
  --gold:#d4af37; --gold2:#f0d060; --txt:#e8e6df; --dim:#9a97a8;
  --red:#e5484d; --green:#46c46a; --blue:#4aa8e5;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;background:#050508;color:var(--txt);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
body{min-height:100dvh; display:flex; justify-content:center;}
#app{width:100%; max-width:520px; min-height:100dvh; background:var(--bg); position:relative;
  border-left:1px solid #1c1c26; border-right:1px solid #1c1c26;}
.screen{display:none; min-height:100dvh; flex-direction:column;}
.screen.active{display:flex;}
.pad{padding:14px 16px 30px;}
.bar{padding:14px 16px 10px; border-bottom:1px solid var(--line); background:linear-gradient(180deg,#15151f,#101018);}
.bar h2{margin:0; font-size:20px;}
.bar-sub{color:var(--dim); font-size:13px; margin-top:4px;}
.moneyline{display:flex; align-items:center; gap:10px; margin-top:8px;}
#dash-money{font-size:22px; font-weight:900; color:var(--gold2);}
.pill{font-size:12px; background:var(--panel2); border:1px solid var(--line); border-radius:20px; padding:4px 10px; color:var(--dim);}
.field-label{font-size:12px; text-transform:uppercase; letter-spacing:1.5px; color:var(--dim); margin:16px 0 8px;}
.field{display:block; margin-bottom:12px; font-size:14px; color:var(--dim);}
.field input{display:block; width:100%; margin-top:6px; padding:12px; background:var(--panel2);
  border:1px solid var(--line); border-radius:10px; color:var(--txt); font-size:16px;}
.field input:focus{outline:none; border-color:var(--gold);}
.btn{display:block; width:100%; padding:14px; margin:8px 0; font-size:16px; font-weight:600;
  border-radius:12px; border:1px solid var(--line); background:var(--panel2); color:var(--txt); cursor:pointer;}
.btn:active{transform:scale(.98);}
.btn-gold{background:linear-gradient(180deg,var(--gold2),var(--gold)); color:#181204; border:none;}
.btn-ghost{background:transparent; color:var(--dim);}
.btn:disabled{opacity:.35;}
.btn.wide{margin:10px 0;}
.menu{margin-top:10px;}
.tag{font-size:11px; color:var(--dim); font-weight:400;}
.title-wrap{margin:auto; text-align:center; padding:40px 24px;}
.title-kicker{font-size:11px; letter-spacing:4px; color:var(--gold); margin-bottom:14px;}
.title-logo{font-size:64px; line-height:.95; margin:0; font-weight:900; letter-spacing:2px;
  background:linear-gradient(180deg,#fff,var(--gold2) 60%,#8a6d1f);
  -webkit-background-clip:text; background-clip:text; color:transparent;}
.title-sub{color:var(--dim); margin:14px 0 26px; font-size:14px;}
.title-foot{margin-top:26px; color:var(--dim); font-size:13px;}
.ranklist{background:var(--panel); border:1px solid var(--line); border-radius:12px; overflow:hidden; margin-bottom:6px;}
.rankrow{display:flex; gap:10px; padding:9px 12px; font-size:13.5px; border-bottom:1px solid #1e1e29; align-items:center;}
.rankrow:last-child{border-bottom:none;}
.rankrow .rk{width:26px; color:var(--gold); font-weight:800;}
.rankrow .rc{margin-left:auto; color:var(--dim); font-size:12px; white-space:nowrap;}
.rankrow.me{background:rgba(212,175,55,.08);}
.news{background:#101018; border-left:3px solid var(--gold); border-radius:0 10px 10px 0;
  padding:10px 12px; margin:12px 0; font-size:13.5px; line-height:1.5; color:#d8d5c8;}
.news div{margin-bottom:6px;}
.dash-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:10px 0;}
.stat-tile{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:12px 8px; text-align:center;}
.st-v{font-size:20px; font-weight:900; color:var(--gold2);}
.st-l{font-size:11px; color:var(--dim); margin-top:4px;}
.frow{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:12px; margin-bottom:8px; cursor:pointer;}
.frow h4{margin:0 0 2px; font-size:15px;}
.frow .onic{color:var(--dim); font-size:12px;}
.frow .orow{display:flex; justify-content:space-between; font-size:13px; padding:2px 0; color:#cfccbf;}
.tale{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:6px 14px; margin:10px 0;}
.tale .trow{display:flex; justify-content:space-between; font-size:13.5px; padding:7px 0; border-bottom:1px solid #1e1e29;}
.tale .trow:last-child{border-bottom:none;}
.tale .trow .tl{color:var(--dim);}
.statbar{display:flex; align-items:center; gap:8px; font-size:12px; margin:4px 0;}
.statbar .n{width:64px; color:var(--dim);}
.statbar .t{flex:1; height:8px; background:#23232f; border-radius:4px; overflow:hidden;}
.statbar .t i{display:block; height:100%; background:linear-gradient(90deg,var(--gold),var(--gold2)); border-radius:4px;}
.statbar .v{width:30px; text-align:right; font-weight:700;}
.cards{display:grid; grid-template-columns:repeat(2,1fr); gap:8px;}
.card{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:12px 8px; text-align:center; cursor:pointer;}
.card h4{margin:0 0 4px; font-size:14px;}
.card p{margin:0; font-size:11px; color:var(--dim); line-height:1.4;}
.card.sel{border-color:var(--gold); box-shadow:0 0 0 1px var(--gold);}
.card.locked{opacity:.4;}
.modal{position:fixed; inset:0; background:rgba(0,0,0,.72); display:flex; align-items:center; justify-content:center; z-index:50; padding:20px;}
.modal.hidden{display:none;}
.modal-box{background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:20px; width:100%; max-width:440px; max-height:88dvh; overflow-y:auto;}
.modal-box h3{margin:0 0 4px;}
.slider{width:100%; margin:8px 0; accent-color:var(--gold);}
.camp-status{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:12px 14px; font-size:13.5px; line-height:1.6; margin:12px 0;}
.divtabs{display:flex; gap:6px; margin-bottom:10px; flex-wrap:wrap;}
.divtabs .card{flex:1; padding:8px 4px;}
.hidden{display:none !important;}
.boutrow{background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:10px 12px; margin-bottom:8px; font-size:13.5px;}
.boutrow .vs{color:var(--dim); font-size:12px;}
.finrow{display:flex; justify-content:space-between; font-size:13px; padding:8px 2px; border-bottom:1px solid #1e1e29;}
.finrow .pos{color:var(--green); font-weight:700;}
.finrow .neg{color:var(--red); font-weight:700;}
