/* FIGHT NIGHT — the site skin, layered on top of style.css (html.fn on every game page): near-black, dull gold, one crimson accent,
   square corners, flat buttons, upright Anton instead of the comic font. Only colours / shapes / type change. */
html.fn{
  --bg:#0e0d10; --bg2:#151318; --panel:#17151a; --panel2:#1d1b21; --line:#2e2a33;
  --ink:#050506; --text:#f2ede4; --muted:#9b958c;
  --yellow:#c9a227; --orange:#c9a227; --pink:#c8102e; --red:#c8102e;
  --gold:#c9a227; --gold2:#e2c466; --crim:#c8102e;
  --comic:'Anton', Impact, 'Arial Narrow', sans-serif;
}
html.fn body{background:radial-gradient(ellipse 60% 40% at 50% 0%,#24201a 0,transparent 70%),var(--bg) fixed}
html.fn h2,html.fn h3{font-style:normal;letter-spacing:1.5px;text-shadow:none}

/* header */
html.fn .logo{font-family:var(--head);letter-spacing:2px;transform:none;
  background:linear-gradient(#f3e3a6 0,#c9a227 55%,#8a6a12);-webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 2px 0 #000)}
html.fn .logo .lk{background:linear-gradient(#e0475c,#c8102e);-webkit-background-clip:text;background-clip:text;letter-spacing:4px}
html.fn .logo .rays{display:none}
html.fn .nav-tile{border-radius:0;border:1px solid var(--line);border-bottom:2px solid var(--gold);background:var(--panel)!important;
  font-style:normal;letter-spacing:2px;text-shadow:none;box-shadow:none}
html.fn .nav-tile:hover{border-color:var(--gold);transform:none}
html.fn .nav-tile .sparkle{display:none}
html.fn .hot-tag{transform:none}
html.fn .hot-tag b{background:var(--crim);border:0;border-radius:0;font-size:10px;letter-spacing:1.5px}
html.fn .hot-tag i{background:none;border:1px solid var(--crim);border-radius:0;font-style:normal;font-size:14px;letter-spacing:1px;color:#e8a0a8}
html.fn .profile{border-radius:0;background:var(--panel);border:1px solid var(--line);box-shadow:none}
html.fn .profile .ava{border:2px solid var(--gold);box-shadow:none}

/* buttons: flat, square, gold (main) / crimson (hot) */
html.fn .btn,html.fn .g-cta{border-radius:0;border:0;font-style:normal;letter-spacing:2px;color:#0e0d10;text-shadow:none;
  background:var(--gold);box-shadow:none}
html.fn .btn:hover,html.fn .g-cta:hover{filter:none;background:var(--gold2);transform:none}
html.fn .btn:active{transform:translateY(1px);box-shadow:none}
html.fn .btn.hot{background:var(--crim);color:#f6e9eb}
html.fn .btn.hot:hover{background:#de1f3d}
html.fn .btn.ghost,html.fn .btn.settings-btn,html.fn .settings-btn,html.fn .wallet-chip{background:var(--panel);color:var(--text);border:1px solid var(--line)}
html.fn .btn.ghost:hover,html.fn .btn.settings-btn:hover,html.fn .wallet-chip:hover{background:var(--panel2);border-color:var(--gold)}
html.fn .btn.ghost .gear{color:var(--text)}
html.fn .pill{border-radius:0;background:#000;border:1px solid var(--line);letter-spacing:1px}
html.fn .pill.soon{background:none;border-color:#4a4550;color:var(--muted)}
html.fn .pill.ok{background:none;border-color:#3c7a43;color:#9fd3a4}

/* panels: one dark surface, hairline border, no frames */
html.fn .panel{border-radius:0;background:var(--panel);border:1px solid var(--line);box-shadow:0 10px 28px #0008}
html.fn .roster,html.fn .gym,html.fn .coach{margin:0;border-radius:0;border:1px solid var(--line);background:var(--panel);box-shadow:0 10px 28px #0008}
html.fn .roster::before{display:none}
html.fn .rivet{display:none}
html.fn .gym .muted{background:none;text-shadow:none;color:var(--muted);padding:0}
html.fn .gym-art{border-radius:0;border:1px solid var(--line);filter:saturate(.75)}
html.fn .led{border-radius:0;border:1px solid var(--line);background:#000;color:var(--crim);text-shadow:none;font-family:var(--head);font-weight:400;letter-spacing:3px}
html.fn .mini-grid canvas{border-radius:0;border:1px solid #3a3640!important;box-shadow:none;background:#26232b}
html.fn .games{background:var(--panel);border:1px solid var(--line);box-shadow:0 10px 28px #0008}
html.fn .game{border-radius:0;border:1px solid var(--line)}
html.fn .game.hot{box-shadow:none;border-left:3px solid var(--gold);
  background:linear-gradient(90deg,#0e0d10e6 0,#0e0d1099 40%,transparent 68%),linear-gradient(0deg,#0e0d10cc 0,transparent 45%),
    url(../img/box-royale-bg.jpg) 72% 50%/cover no-repeat,#17151a}
html.fn .game.hot::before{display:none}
html.fn .game.hot:hover{transform:none;border-left-color:var(--gold2)}
html.fn .g-title{font-style:normal;letter-spacing:2px;text-shadow:none}
html.fn .g-sub{font-weight:400;color:#d6d0c6;letter-spacing:.3px}
html.fn .g-cta{font-size:22px;padding:7px 22px}
html.fn .game.locked{background:var(--panel2);box-shadow:none}
html.fn .game.locked .g-title{color:#6e6872;text-shadow:none}
html.fn .game.locked .chain{opacity:.35}
html.fn .game.locked .lock,html.fn .game.locked .g-ico{filter:grayscale(1) brightness(.7)}

/* ticker: thin gold rules instead of the neon band */
html.fn .ticker{background:#0a090c;border-block:1px solid #3a3226;border-image:none;box-shadow:none}
html.fn .tk-item{font-family:var(--head);font-size:22px;letter-spacing:2px;text-shadow:none;color:#e6e0d6}
html.fn .tk-item::after{content:"";display:inline-block;width:6px;height:6px;background:var(--crim);transform:rotate(45deg);margin:0 28px;vertical-align:5px}
html.fn .tk-item b{color:var(--gold)}
html.fn .tk-item .tk-cd{color:var(--crim);text-shadow:none}

/* showcase */
html.fn .showcase{border:1px solid var(--line);border-top:3px solid var(--gold);background:var(--panel);box-shadow:0 10px 28px #0008}
html.fn .showcase:focus-visible{box-shadow:0 0 0 2px var(--gold)}
html.fn .sc-kick{letter-spacing:3px;color:var(--gold)}
html.fn .sc-kick .dm{border-radius:0;background:none;border:1px solid var(--crim);color:#e8a0a8}
html.fn .sc-title{font-family:var(--head);color:var(--text);letter-spacing:2px;text-shadow:none}
html.fn .sc-cdbox{letter-spacing:2.5px}
html.fn .sc-cdbox b{font-family:var(--head);font-weight:400;font-size:30px;letter-spacing:3px;color:var(--text);background:none;border:0;box-shadow:none;text-shadow:none;padding:0}
html.fn .sc-fill .dr-bar,html.fn .dr-bar{height:3px!important;border-radius:0;background:#2a272e;border:0;box-shadow:none}
html.fn .dr-bar>i,html.fn .dr-bar>span,html.fn .dr-bar>div{border-radius:0;background:var(--crim)!important;box-shadow:none}
html.fn .sc-nft{border-radius:0;border:1px solid #4a4030;box-shadow:none}
html.fn .sc-nft:hover{transform:translateY(-2px);border-color:var(--gold)}
html.fn .sc-text{color:#cfc9bf}
html.fn .sc-steps li::before{border-radius:0;border:1px solid var(--gold);background:none;color:var(--gold)}
html.fn .sc-screen{border-radius:0;border:1px solid var(--line);box-shadow:none;background:linear-gradient(#1b1920 0 58%,#2b2830 58% 100%)}
html.fn .sc-ring{background:linear-gradient(#0000 0 12%,#8e1424 12% 19%,#0000 19% 46%,#bdb6aa 46% 53%,#0000 53% 80%,#5a5560 80% 87%,#0000 87%)}
html.fn .sc-arrow{border-radius:0;border:1px solid var(--line);background:#0e0d10cc;color:var(--gold);box-shadow:none}
html.fn .sc-arrow:hover{border-color:var(--gold)}
html.fn .sc-dots button{border-radius:0;height:3px;width:16px;border:0;background:#3a3640}
html.fn .sc-dots button.on{width:32px;background:var(--gold)}

/* sponsor + pack */
html.fn .sponsor{background:var(--panel);border-color:var(--line)}
html.fn .pack-banner{border-radius:0;border:1px solid var(--line)}
html.fn .pack-banner:hover{transform:none;box-shadow:0 0 0 1px var(--gold)}
html.fn .buy-pack{background:var(--gold);color:#0e0d10;box-shadow:none}
html.fn .buy-pack .buy-glove,html.fn .buy-l,html.fn .buy-r{display:none}

/* details */
html.fn .logo .lk{margin:0 0 4px 2px;font-size:.42em}
html.fn .p-txt b{font-style:normal;letter-spacing:1.5px}
html.fn .p-txt span{color:var(--muted)}
html.fn .status.ok{color:#9fbf8a}
html.fn .sp-img{border-radius:0;border:1px solid var(--line);box-shadow:none}
html.fn .sp-tag{border-radius:0;background:none;border:1px solid var(--gold);color:var(--gold);letter-spacing:2px}
html.fn .sp-auction b{color:var(--gold)}
html.fn .admin-fab{border-radius:0;box-shadow:none;background:var(--gold);border:0}
html.fn .sp-empty{border:1px dashed #4a4030;border-radius:0;font-style:normal;letter-spacing:1.5px;color:var(--gold);background:repeating-linear-gradient(45deg,#c9a22708 0 10px,transparent 10px 20px)}
html.fn .sp-timer{letter-spacing:2.5px}
html.fn .sp-timer b{font-family:var(--head);font-weight:400;letter-spacing:3px;color:var(--text);background:none;border:0;box-shadow:none;text-shadow:none;padding:0}

/* ================= inner screens ================= */
/* no comic italics anywhere */
html.fn :not(em){font-style:normal!important}
html.fn .step{border-radius:0;border:1px solid var(--line);background:var(--panel);color:var(--text);box-shadow:none;letter-spacing:1.5px}
html.fn .toast{border-radius:0;border:0;background:var(--gold);color:#0e0d10;box-shadow:none;letter-spacing:1.5px}
html.fn .drop{border-radius:0;border:1px solid var(--line);background:#121014f7}
html.fn .modal,html.fn .settings-modal{background:#050506d9}

/* weight classes */
html.fn .play-switch button{border-radius:0;border:1px solid var(--line);background:var(--panel);box-shadow:none}
html.fn .play-switch button.on,html.fn .play-switch button[data-play="bots"].on{border-color:var(--gold);box-shadow:inset 0 -2px 0 var(--gold)}
html.fn .play-switch b{letter-spacing:1.5px}
html.fn .pt-tile{border-radius:0;border:0;box-shadow:none;text-shadow:none;filter:saturate(.7) brightness(.85)}
html.fn .div-card{border-radius:0;background:var(--panel);border:1px solid var(--line);box-shadow:0 10px 24px #0008}
html.fn .div-card::before{height:3px;filter:saturate(.7)}
html.fn .div-card.d-open::before{background:repeating-linear-gradient(90deg,var(--gold) 0 14px,transparent 14px 28px)}
html.fn .div-card.on,html.fn #division.bots-mode .div-card.on{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 10px 24px #0008}
html.fn .d-name{letter-spacing:1.5px;text-shadow:none}
html.fn .d-cap{border-radius:0;background:none;border:1px solid #4a4030;color:var(--gold);letter-spacing:1px}
html.fn .rp{border-radius:0;border:0;filter:saturate(.75)}
html.fn .d-round,html.fn .d-bots{border-radius:0;background:#0e0d10;border:1px solid var(--line)}
html.fn .dr-top b{color:var(--gold);letter-spacing:1px}
html.fn .dr-bar{height:3px;margin:6px 0}
html.fn .dr-bar i,html.fn .lb-bar i,html.fn .col-bar i{background:var(--crim)}
html.fn .btn.locked{background:#1d1b21;color:#6e6872;border:1px dashed #3a3640}

/* builder */
html.fn .filters button{border-radius:0;border:1px solid var(--line);background:#0e0d10;color:var(--muted)}
html.fn .filters button.on{background:var(--gold);color:#0e0d10;border-color:var(--gold)}
html.fn .fc{border-radius:0;border:1px solid var(--line);background:var(--panel);box-shadow:none}
html.fn .fc:hover{border-color:#5a5460;transform:translateY(-2px)}
html.fn .fc.sel{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
html.fn .fc canvas{border-radius:0}
html.fn .fc .nm{letter-spacing:1px}
html.fn .fc .rr,html.fn .fc .pt,html.fn .fc .cnt{border-radius:0;border:0}
html.fn .fc .ov{border-radius:0;border:0;background:var(--gold);color:#0e0d10}
html.fn .fc .cnt{background:var(--crim)}
html.fn .stats i{border-radius:0;height:4px}
html.fn .stats i b{background:var(--gold)}
html.fn .slot{border-radius:0;border:1px dashed #3a3640;background:#0e0d1099}
html.fn .slot.filled{border:1px solid var(--line);background:var(--panel)}
html.fn .slot.cap{border-color:var(--gold);box-shadow:none}
html.fn .slot.cap.empty{border-color:#6a5a2a;background:#c9a22708}
html.fn .slot img,html.fn .slot canvas{border-radius:0;border:1px solid var(--line)}
html.fn .slot .nm{letter-spacing:1px}
html.fn .slot-no{border-radius:0;background:#0e0d10;border:1px solid var(--line);color:var(--muted)}
html.fn .slot.cap .slot-no{background:var(--gold);color:#0e0d10;border:0}
html.fn .slot .acts button{border-radius:0;border:1px solid var(--line);background:#0e0d10}
html.fn .slot.cap .acts .mk{background:var(--gold);border-color:var(--gold);color:#0e0d10}
html.fn .b-bar i{border-radius:0;border:0;height:6px;background:#2a272e}
html.fn .b-bar i.on{background:var(--gold)}
html.fn .b-bar i.bad{background:var(--crim)}
html.fn .drag-ghost{border-radius:0;border:2px solid var(--gold)}

/* plan */
html.fn #plan-map{border:2px solid #3a3640;box-shadow:0 0 30px #000a}
html.fn .opt{border-radius:0;border:1px solid var(--line);background:var(--panel);box-shadow:none}
html.fn .opt:hover{border-color:#5a5460}
html.fn .opt b{letter-spacing:1.5px}
html.fn .opt.on{background:var(--gold);color:#0e0d10;border-color:var(--gold);box-shadow:none}
html.fn .opt.on span{color:#3a2f10}

/* lobby */
html.fn .lb-bar{border-radius:0;height:20px;border:1px solid var(--line);background:#0e0d10}
html.fn .lb-status.go{color:#9fbf8a;text-shadow:none}
html.fn .lb-slot,html.fn .po{border-radius:0}
html.fn .lb-slot small,html.fn .co-name small{border-radius:0;background:var(--crim)}
html.fn .lb-slot.me{background:#c9a22714;border-color:#c9a22766}
html.fn .po:first-child{border-color:#6a5a2a;background:linear-gradient(90deg,#2a2210,#0e0d10)}
html.fn .po:first-child b{color:var(--gold)}

/* fight HUD + results */
html.fn .clock{font-family:var(--head);letter-spacing:3px;text-shadow:0 2px 6px #000}
html.fn .alive,html.fn .replay-tag{border-radius:0;background:#0e0d10e6;border:1px solid var(--line);letter-spacing:1.5px}
html.fn .feed div{border-radius:0;background:#0e0d10e0;border-left:3px solid var(--gold)}
html.fn .feed div.me{border-left-color:var(--crim);background:#2a0c12eb}
html.fn .coaches{border-radius:0;background:#0e0d10e6;border:1px solid var(--line)}
html.fn .co-head{background:var(--panel);letter-spacing:1.5px}
html.fn .co-head b{border-radius:0}
html.fn .co.me{background:#c9a22714}
html.fn .hs{border-radius:0;background:var(--panel);border:1px solid var(--line);box-shadow:none}
html.fn .hs canvas,html.fn .hs .bar,html.fn .hs .st{border-radius:0}
html.fn .hs.down{border-color:var(--crim);background:#2a0c12}
html.fn #minimap{border:2px solid #3a3640;box-shadow:0 6px 18px #000a}
html.fn .banner{font-family:var(--head);letter-spacing:3px;color:var(--gold);transform:translate(-50%,-50%);text-shadow:0 4px 18px #000,0 2px 0 #000}
html.fn .res,html.fn .settings{border:1px solid var(--line);border-top:3px solid var(--gold);box-shadow:0 20px 50px #000c}
html.fn .res-place{font-family:var(--head);color:var(--gold);text-shadow:0 4px 18px #000}
html.fn .res-title{letter-spacing:2px}
html.fn .res-stats div,html.fn .res-top{border-radius:0;border:1px solid var(--line);background:#0e0d10}
html.fn .res-stats b{color:var(--gold)}
html.fn .res-prize{border-radius:0}
html.fn .res-prize.won{background:var(--gold);color:#0e0d10;border:0;box-shadow:none}

/* settings */
html.fn .seg-b{border-radius:0;border:1px solid var(--line);background:#0e0d10;box-shadow:none}
html.fn .seg-b.on{background:var(--gold);color:#0e0d10;border-color:var(--gold)}
html.fn .toggle{border-radius:0;border:1px solid var(--line);background:#1d1b21}
html.fn .toggle.on{background:var(--gold);color:#0e0d10}
html.fn #set-volume{accent-color:var(--gold)}
html.fn .set-row{border-bottom:1px solid var(--line)}

/* arena, profile, collection */
html.fn .tabs button{border-radius:0;border:1px solid var(--line);background:var(--panel);letter-spacing:1.5px}
html.fn .tabs button.on{background:var(--gold);color:#0e0d10;border-color:var(--gold)}
html.fn .ar-table tr.gold td,html.fn .pf-table tr.gold td{background:#c9a2270f}
html.fn .pf-head,html.fn .col-hero{border:1px solid var(--line);border-top:3px solid var(--gold);background:var(--panel)}
html.fn .pf-ava{border-radius:0;border:2px solid var(--gold);box-shadow:none}
html.fn .pf-stat{border-radius:0;border:1px solid var(--line);background:var(--panel);box-shadow:none}
html.fn .pf-stat b{color:var(--gold);text-shadow:none;letter-spacing:1px}
html.fn .pf-team canvas{border-radius:0;border:1px solid #3a3640}
html.fn .col-bar,html.fn .col-filters .seg,html.fn .col-filters .seg button{border-radius:0}
html.fn .col-filters .seg button.on{background:var(--gold);color:#0e0d10}
html.fn .col-card{border-radius:0;background:var(--panel);box-shadow:none}
html.fn .cc-n{border-radius:0;border:0;background:var(--gold);color:#0e0d10}
html.fn .cm-img{border-radius:0;box-shadow:none}
html.fn .cm-bar i{background:var(--gold)}
html.fn .sc-place{border-radius:0;background:#0e0d1099;border-color:var(--line)}
html.fn .sc-pl{letter-spacing:1px}

/* LIVE */
html.fn .live-fab{border-radius:0;background:var(--crim);border:0;letter-spacing:2px}
html.fn .live-btn{background:var(--crim)!important;box-shadow:none!important}

/* inputs, backdrop, small chips */
html.fn input[type=text],html.fn input:not([type]),html.fn input[type=email],html.fn input[type=number],html.fn .col-sort select{border-radius:0;border:1px solid #3a3640;background:#0b0a0d}
html.fn input:focus{border-color:var(--gold);box-shadow:0 0 0 2px #c9a22733}
html.fn .arena-bg .spot{background:linear-gradient(180deg,#fff4 0,#e8dcc022 45%,transparent 80%);opacity:.35}
html.fn .arena-bg .ropes{opacity:.45;background:linear-gradient(#0000 0 22%,#3a3530 22% 24.5%,#1c1a1e 24.5% 26%,#0000 26%),linear-gradient(#0000 0 46%,#3a3530 46% 48.5%,#1c1a1e 48.5% 50%,#0000 50%),linear-gradient(#0000 0 70%,#5a1420 70% 72.5%,#2a0c12 72.5% 74%,#0000 74%),linear-gradient(90deg,#0000 0 6%,#222024 6% 8.5%,#0000 8.5% 91.5%,#222024 91.5% 94%,#0000 94%),linear-gradient(#0000 0 76%,#121114 76%)}
html.fn .col-rchip,html.fn .cc-r{border-radius:0}