/* gfx2.css — Ludus: The Beginning: the Roman look carried through the villa, the panels and the fight HUD (bronze, marble, oxblood; Cinzel headings). */
:root{--g2-bronze:#b8863b;--g2-gold:#ecc77e;--g2-gold2:#fff0c4;--g2-ox:#4a120c;--g2-ink:#140c09;--g2-cream:#f3e6c8;
 --g2-panel:linear-gradient(180deg,rgba(44,22,14,.86),rgba(20,10,7,.9));--g2-edge:inset 0 0 0 1px rgba(255,214,140,.16),inset 0 1px 0 rgba(255,236,190,.22),0 10px 30px rgba(0,0,0,.45)}
/* ---------- shared panel frame: double bronze rule + corner studs ---------- */
.g2p,.v-panel .r-card,.v-panel .g-slot,.v-panel .mk-card,.v-panel .ct-card,.v-panel .glad,.v-panel .g-body,.v-panel .g-train,.v-panel .s-box,.v-panel .ladder .ld{position:relative}
#board,#ct{background:var(--g2-panel)!important;border:1px solid rgba(184,134,59,.85)!important;border-radius:10px!important;box-shadow:var(--g2-edge)!important}
#board::before,#ct::before{content:'';position:absolute;inset:3px;border:1px solid rgba(236,199,126,.22);border-radius:7px;pointer-events:none}
#board h4,#ct h4{font-family:Cinzel,Georgia,serif!important;letter-spacing:.16em!important;color:var(--g2-gold)!important;text-shadow:0 1px 0 #000;border-bottom:1px solid rgba(184,134,59,.35);padding-bottom:4px}
/* ---------- the fight HUD ---------- */
#me{padding:5px 7px 6px;border-radius:12px;background:linear-gradient(180deg,rgba(36,18,12,.72),rgba(16,8,6,.62));border:1px solid rgba(184,134,59,.7);box-shadow:var(--g2-edge)}
#zone{font:700 17px Cinzel,Georgia,serif!important;letter-spacing:.1em!important;background:linear-gradient(180deg,var(--g2-gold2),var(--g2-gold) 55%,#b07a32);-webkit-background-clip:text;background-clip:text;color:transparent!important;text-shadow:none!important;filter:drop-shadow(0 1px 0 #2a0804)}
#hp{height:20px!important;border:1px solid #d6a656!important;border-radius:10px!important;background:linear-gradient(#0e0605,#2a100b)!important;box-shadow:inset 0 2px 5px rgba(0,0,0,.8),0 0 0 2px rgba(40,18,10,.9),0 0 0 3px rgba(184,134,59,.55)!important}
#hpghost{position:absolute;left:0;top:0;bottom:0;width:100%;background:linear-gradient(#ffcf8a,#d9822f);transition:width .55s cubic-bezier(.3,.7,.2,1) .3s;opacity:.85}
#hpfill{background:linear-gradient(180deg,#ff7a5a 0,#d7321f 38%,#8a140b 100%)!important;box-shadow:inset 0 1px 0 rgba(255,220,200,.55);transition:width .12s!important;border-radius:9px 0 0 9px}
#hpfill::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 9px,rgba(0,0,0,.18) 9px 10px)}
#hptxt{z-index:1;font:700 12px/18px Cinzel,Georgia,serif!important;letter-spacing:.06em;text-shadow:0 1px 2px #000,0 0 4px #000!important}
body.hp-low #hp{animation:g2low 1s ease-in-out infinite}@keyframes g2low{50%{box-shadow:inset 0 2px 5px rgba(0,0,0,.8),0 0 0 2px rgba(40,18,10,.9),0 0 12px 3px rgba(255,40,20,.7)}}
#purse{font-family:Cinzel,Georgia,serif}#purse b{color:var(--g2-gold)!important;text-shadow:0 0 8px rgba(255,200,90,.35)}
#to-villa{font:700 11px Cinzel,Georgia,serif!important;letter-spacing:.06em;border-radius:14px!important;border:1px solid var(--g2-bronze)!important;background:linear-gradient(#5a2414,#2a100a)!important;color:var(--g2-cream)!important;padding:4px 10px!important;box-shadow:inset 0 1px 0 rgba(255,220,170,.25)}
#items button{border-radius:12px!important;border:1px solid #d6a656!important;background:radial-gradient(circle at 50% 30%,#4a2c1c,#1a0d08 75%)!important;box-shadow:inset 0 1px 0 rgba(255,225,170,.25),inset 0 -6px 10px rgba(0,0,0,.5),0 4px 10px rgba(0,0,0,.55),0 0 0 2px rgba(20,10,6,.85)!important;transition:transform .08s,filter .15s}
#items button:active{transform:scale(.93)}#items button:hover{filter:brightness(1.18)}
#items em{color:var(--g2-gold)!important;font-family:Cinzel,Georgia,serif!important}#items b{min-width:16px;padding:0 4px;border-radius:8px;background:#7a1a10;border:1px solid #e0a858;text-align:center;line-height:14px;right:-4px!important;bottom:-4px!important}
#feed p{background:linear-gradient(90deg,rgba(24,11,7,.82),rgba(24,11,7,.35))!important;border-left:3px solid var(--g2-gold)!important;border-radius:2px 8px 8px 2px!important;text-shadow:0 1px 1px #000}
#feed p.chat{border-left-color:#7aa6d8!important}
#banner{pointer-events:none}
#banner b{font:700 44px/1.05 Cinzel,Georgia,serif!important;letter-spacing:.12em!important;background:linear-gradient(180deg,#fff4cf,#f0c870 46%,#b9741f 54%,#ffd88a);-webkit-background-clip:text;background-clip:text;color:transparent!important;text-shadow:none!important;filter:drop-shadow(0 3px 0 #3a0804) drop-shadow(0 0 18px rgba(0,0,0,.85))}
#banner span{display:inline-block;margin-top:6px;padding:4px 18px;font:italic 15px Georgia,serif;color:var(--g2-cream);background:linear-gradient(90deg,transparent,rgba(16,8,5,.75) 20%,rgba(16,8,5,.75) 80%,transparent);border-top:1px solid rgba(236,199,126,.45);border-bottom:1px solid rgba(236,199,126,.45)}
#banner.pop{animation:g2ban 3.8s cubic-bezier(.2,.8,.2,1) forwards!important}
@keyframes g2ban{0%{opacity:0;transform:translate(-50%,8px) scale(1.12);letter-spacing:.3em}12%{opacity:1;transform:translate(-50%,0) scale(1)}78%{opacity:1}100%{opacity:0;transform:translate(-50%,-6px)}}
#hint{font:600 14px Georgia,serif!important;padding:5px 14px;border-radius:14px;background:rgba(16,8,5,.55);border:1px solid rgba(236,199,126,.3)}#hint:empty{display:none}
#toast{font-family:Georgia,serif;background:var(--g2-panel)!important;border:1px solid var(--g2-bronze)!important;border-radius:12px!important;box-shadow:var(--g2-edge)!important;color:var(--g2-cream)!important}
.dmg{font:800 20px Cinzel,Georgia,serif!important;letter-spacing:.02em;text-shadow:0 2px 0 #000,0 0 8px rgba(0,0,0,.7)!important;animation:g2dm .95s cubic-bezier(.2,.8,.3,1) forwards!important}
.dmg.dealt{color:#ffe08a!important;text-shadow:0 2px 0 #3a1a00,0 0 10px rgba(255,170,40,.55)!important}.dmg.hurt{color:#ff5a3c!important}.dmg.blk{font-size:13px!important;color:#cfdbe6!important;letter-spacing:.08em}
.dmg.big{font-size:30px!important}.dmg.big.dealt{color:#fff1b0!important}
@keyframes g2dm{0%{transform:translate(-50%,-50%) scale(.4);opacity:0}14%{transform:translate(-50%,-70%) scale(1.25);opacity:1}30%{transform:translate(-50%,-85%) scale(1)}100%{transform:translate(-50%,-190%) scale(.9);opacity:0}}
.tag b{font:700 11.5px Cinzel,Georgia,serif!important;letter-spacing:.04em}
.tag i{height:5px!important;border-radius:3px!important;border:1px solid rgba(0,0,0,.85)!important;box-shadow:0 0 0 1px rgba(214,166,86,.45)}
.tag s{background:linear-gradient(#ff6a4a,#a8180e)!important}.tag.me s{background:linear-gradient(#9af07a,#2f8a22)!important}
#tgt{border-radius:10px!important;border:1px solid var(--g2-bronze)!important;background:var(--g2-panel)!important;box-shadow:var(--g2-edge)!important}
#dead{background:radial-gradient(ellipse at 50% 50%,rgba(40,0,0,.05),rgba(18,0,0,.78))!important;animation:g2dead 1.2s ease both}
#dead::before,#dead::after{content:'';position:absolute;left:0;right:0;height:9vh;background:#000;animation:g2bar 1s cubic-bezier(.2,.8,.2,1) both}#dead::before{top:0}#dead::after{bottom:0}
#dead b{font:700 clamp(34px,6vw,64px)/1 Cinzel,Georgia,serif!important;letter-spacing:.14em!important;background:linear-gradient(180deg,#ff8a6a,#c8200f 55%,#5a0804);-webkit-background-clip:text;background-clip:text;color:transparent!important;text-shadow:none!important;filter:drop-shadow(0 3px 0 #1a0000) drop-shadow(0 0 24px rgba(0,0,0,.9));animation:g2dt 1.4s cubic-bezier(.2,.8,.2,1) both}
#dead span{font-family:Georgia,serif;color:#f0d8c0}
@keyframes g2dead{from{opacity:0}to{opacity:1}}@keyframes g2bar{from{height:0}}@keyframes g2dt{from{opacity:0;letter-spacing:.5em}}
#pad button{border:1px solid #f0c070!important;background:radial-gradient(circle at 50% 32%,#a8341e,#5a120a 62%,#2a0806)!important;box-shadow:inset 0 2px 0 rgba(255,210,170,.35),inset 0 -8px 14px rgba(0,0,0,.45),0 0 0 3px rgba(30,12,6,.85),0 0 0 4px rgba(214,166,86,.6),0 6px 14px rgba(0,0,0,.5)!important;font:700 13px Cinzel,Georgia,serif!important;letter-spacing:.05em;text-shadow:0 1px 1px #000}
#pad button[data-pad=blk]{background:radial-gradient(circle at 50% 32%,#5a6a7a,#2a3440 62%,#12181e)!important}
#pad button:active{transform:scale(.94);filter:brightness(1.2)}
#stick{border:2px solid rgba(236,199,126,.7)!important;background:radial-gradient(circle,rgba(236,199,126,.18),rgba(0,0,0,.25) 70%)!important}
#binds{border:1px solid rgba(184,134,59,.45);background:rgba(16,8,5,.65)!important;border-radius:14px!important}
#net{font-family:Georgia,serif;opacity:.75}
#hurtfx{position:fixed;inset:0;pointer-events:none;z-index:6;opacity:0;background:radial-gradient(ellipse at 50% 50%,transparent 45%,rgba(150,0,0,.55) 100%)}
body:not(.in-arena) #hurtfx{display:none}
#zfade{position:fixed;inset:0;pointer-events:none;z-index:7;opacity:0;background:radial-gradient(ellipse at 50% 50%,#120806,#000)}
#zfade.out{animation:g2fade 1.1s ease-out both}@keyframes g2fade{0%{opacity:1}35%{opacity:.85}100%{opacity:0}}
body.mobile #me,body.mobile #board,body.mobile #ct{-webkit-backdrop-filter:none;backdrop-filter:none}
/* ---------- the villa ---------- */
#villa .v-side{background:linear-gradient(180deg,rgba(38,18,12,.82),rgba(18,9,6,.88))!important;border-right:1px solid rgba(184,134,59,.6)}
#villa .v-crest small{font-family:Cinzel,Georgia,serif;letter-spacing:.28em;color:#cfa865}
#villa .v-crest b{font-family:Cinzel,Georgia,serif;background:linear-gradient(180deg,var(--g2-gold2),var(--g2-gold) 50%,#b07a32);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #2a0804)}
#villa .v-purse{border:1px solid rgba(214,166,86,.7);border-radius:12px;background:radial-gradient(circle at 30% 20%,rgba(90,52,20,.75),rgba(24,12,6,.85));box-shadow:var(--g2-edge)}
#villa .v-purse .coin{color:var(--g2-gold);text-shadow:0 0 10px rgba(255,190,80,.6)}#villa .v-purse b{color:#ffe6a0}
#villa .v-tabs button{font-family:Cinzel,Georgia,serif;letter-spacing:.1em;position:relative;transition:color .2s,background .25s,box-shadow .25s}
#villa .v-tabs button.on{color:#fff3d0!important;background:linear-gradient(90deg,rgba(150,40,22,.55),rgba(150,40,22,.12))!important;box-shadow:inset 3px 0 0 var(--g2-gold),inset 0 0 0 1px rgba(236,199,126,.2)}
#villa .v-panel{border-left:1px solid rgba(236,199,126,.12)}
body.s3d #villa .v-panel{background:linear-gradient(180deg,rgba(26,13,9,.72),rgba(16,8,6,.8))!important}
#villa .v-panel h2{font-family:Cinzel,Georgia,serif;letter-spacing:.14em;background:linear-gradient(180deg,var(--g2-gold2),var(--g2-gold) 55%,#a86e2a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #2a0804);padding-bottom:8px;border-bottom:none;background-repeat:no-repeat}
#villa .v-panel h2::after{content:'';display:block;height:9px;margin-top:6px;background:linear-gradient(90deg,transparent,rgba(214,166,86,.85) 18%,rgba(214,166,86,.85) 82%,transparent) center/100% 1px no-repeat,radial-gradient(circle,#ecc77e 0 3px,transparent 3.5px) center/9px 9px no-repeat;-webkit-text-fill-color:initial}
#villa .v-panel h3{font-family:Cinzel,Georgia,serif;letter-spacing:.14em;color:var(--g2-gold)}
#villa .v-panel.g2tab>section{animation:g2in .42s cubic-bezier(.2,.8,.2,1)}
@keyframes g2in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#villa .v-panel button:not(:disabled){background:linear-gradient(180deg,#a8321c,#6a1409)!important;border:1px solid #e2b462!important;color:#fff3d8!important;box-shadow:inset 0 1px 0 rgba(255,210,170,.35),0 2px 6px rgba(0,0,0,.4);text-shadow:0 1px 0 #3a0804;transition:filter .15s,transform .08s}
#villa .v-panel button:not(:disabled):hover{filter:brightness(1.15)}#villa .v-panel button:not(:disabled):active{transform:translateY(1px)}
#villa .v-panel button.ghost:not(:disabled){background:linear-gradient(180deg,#4a3420,#24160c)!important}
#villa .v-panel button:disabled{background:linear-gradient(180deg,#3a2c22,#241a14)!important;border:1px solid rgba(160,130,90,.35)!important;color:#a8967e!important}
#villa .r-card,#villa .g-slot,#villa .mk-card,#villa .ct-card,#villa .s-box,#villa .g-body,#villa .g-train,#villa .glad{background:linear-gradient(180deg,rgba(58,30,18,.62),rgba(26,13,8,.72))!important;border:1px solid rgba(184,134,59,.55)!important;border-radius:12px!important;box-shadow:var(--g2-edge)!important}
#villa .r-card{overflow:hidden;transition:transform .2s,box-shadow .2s}#villa .r-card:hover{transform:translateY(-2px)}
#villa .r-card img{filter:saturate(1.05) contrast(1.05);border-bottom:1px solid rgba(214,166,86,.45)}
#villa .r-card.on{border-color:#ecc77e!important;box-shadow:0 0 0 1px #ecc77e,0 0 22px rgba(236,199,126,.35),var(--g2-edge)!important}
#villa .r-card b,#villa .mk-in b,#villa .g-in b,#villa .ct-in b{font-family:Cinzel,Georgia,serif;letter-spacing:.05em;color:#fbe8be}
#villa .g-ic,#villa .mk-ic{border-radius:50%!important;background:radial-gradient(circle at 40% 30%,#6a4426,#22120a 75%)!important;border:1px solid #d6a656!important;box-shadow:inset 0 1px 0 rgba(255,225,170,.3),0 3px 8px rgba(0,0,0,.5)!important}
#villa .glad{background:radial-gradient(ellipse at 30% 0%,rgba(236,180,90,.22),transparent 60%),linear-gradient(180deg,rgba(58,30,18,.7),rgba(22,11,7,.8))!important}
#villa .g-por canvas{filter:drop-shadow(0 8px 10px rgba(0,0,0,.55))}
#villa .cond,#villa .xpb i,#villa .ct-card i{border-radius:5px!important;box-shadow:inset 0 1px 3px rgba(0,0,0,.7),0 0 0 1px rgba(214,166,86,.35)}
#villa .xpb s,#villa .ct-card i s{background:linear-gradient(90deg,#c78a2a,#ffe08a)!important}
#villa .ladder .ld{border-radius:10px!important;border:1px solid rgba(184,134,59,.5)!important}
#villa .ladder .ld.on{box-shadow:0 0 0 1px #ecc77e,0 0 16px rgba(236,199,126,.35)!important}
#villa .lb table{border-collapse:separate;border-spacing:0 3px}#villa .lb tr.me td{background:rgba(150,40,22,.35)}#villa .lb th{font-family:Cinzel,Georgia,serif;letter-spacing:.1em;color:var(--g2-gold)}
#villa .v-tip{border-left:2px solid rgba(214,166,86,.55);padding-left:10px}
#villa .btn-enter{font-family:Cinzel,Georgia,serif;letter-spacing:.14em;background:linear-gradient(180deg,#c43a20,#7a160c 60%,#4a0c06)!important;border:1px solid #f0c070!important;box-shadow:inset 0 1px 0 rgba(255,220,180,.45),0 0 0 3px rgba(30,12,6,.85),0 0 0 4px rgba(214,166,86,.65),0 8px 24px rgba(0,0,0,.5),0 0 30px rgba(220,80,30,.35)!important}
#pick .pk-card{background:linear-gradient(180deg,rgba(58,30,18,.75),rgba(22,11,7,.85))!important;border:1px solid rgba(184,134,59,.7)!important;border-radius:14px!important;box-shadow:var(--g2-edge)!important;transition:transform .2s,box-shadow .2s}
#pick .pk-card:hover{transform:translateY(-3px);box-shadow:0 0 0 1px #ecc77e,0 0 26px rgba(236,199,126,.35),var(--g2-edge)!important}
#pick h2{font-family:Cinzel,Georgia,serif;letter-spacing:.14em;background:linear-gradient(180deg,var(--g2-gold2),var(--g2-gold) 55%,#a86e2a);-webkit-background-clip:text;background-clip:text;color:transparent}
/* the villa -> arena door: a short fade (the villa owns the screens) */
body.g2-going #villa{animation:g2out .45s ease forwards}@keyframes g2out{to{opacity:0;transform:scale(1.02)}}
body.pc #me{padding:0;background:none;border:0;box-shadow:none}body.pc #zone{font-size:13px!important}
body.pc #hp{height:16px!important}body.pc #hptxt{line-height:14px!important;font-size:10.5px!important}

/* ---- TEX1: real material textures on the 2D panels (CC0 scans, 1024px tiles drawn at ~2-3x density). If the asset host is unreachable the
   texture layers simply don't paint and the panels keep the gradients underneath. ---- */
#villa .v-side{background:linear-gradient(180deg,rgba(38,18,12,.78),rgba(18,9,6,.86)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/leather.webp) center/440px repeat!important}
#villa .v-head{background:linear-gradient(180deg,rgba(24,12,8,.72),rgba(24,12,8,.86)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/marble.webp) center/cover;border-radius:12px;box-shadow:inset 0 0 0 1px rgba(214,166,86,.35)}
#villa .r-card,#villa .g-slot,#villa .mk-card,#villa .s-box,#villa .g-body,#villa .g-train{background:linear-gradient(180deg,rgba(58,30,18,.70),rgba(26,13,8,.80)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/leather.webp) center/340px repeat!important}
#villa .ct-card{background:linear-gradient(180deg,rgba(46,26,14,.80),rgba(24,13,8,.88)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/parch.webp) center/360px repeat!important}
#villa .glad{background:radial-gradient(ellipse at 30% 0%,rgba(236,180,90,.22),transparent 60%),linear-gradient(180deg,rgba(58,30,18,.74),rgba(22,11,7,.84)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/leather.webp) center/340px repeat!important}
#villa .g-ic,#villa .mk-ic{background:radial-gradient(circle at 40% 30%,rgba(130,86,44,.55),rgba(20,10,5,.9) 75%),url(https://ludus-assets.137-184-110-149.sslip.io/ui/bronze.webp) center/160px!important}
#villa .v-purse{background:radial-gradient(circle at 30% 20%,rgba(90,52,20,.62),rgba(24,12,6,.82)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/bronze.webp) center/220px!important}
#villa .v-panel button:not(:disabled){background:linear-gradient(180deg,rgba(168,50,28,.92),rgba(106,20,9,.94)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/leather.webp) center/220px!important}
#villa .v-panel button.ghost:not(:disabled){background:linear-gradient(180deg,rgba(74,52,32,.9),rgba(36,22,12,.94)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/leather.webp) center/220px!important}
#villa .v-tabs button.on{background:linear-gradient(90deg,rgba(150,40,22,.62),rgba(150,40,22,.16)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/leather.webp) center/260px!important}
#auth .a-card{background:linear-gradient(180deg,rgba(34,17,11,.82),rgba(16,8,5,.9)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/leather.webp) center/400px repeat!important}
#me,#board,#ct,#tgt,#toast{background:linear-gradient(180deg,rgba(36,18,12,.76),rgba(16,8,6,.7)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/leather.webp) center/300px!important}
#items button{background:radial-gradient(circle at 50% 30%,rgba(74,44,28,.78),rgba(26,13,8,.92) 75%),url(https://ludus-assets.137-184-110-149.sslip.io/ui/stone.webp) center/140px!important}
#pad button{background:radial-gradient(circle at 50% 32%,rgba(168,52,30,.9),rgba(90,18,10,.92) 62%,rgba(42,8,6,.96)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/bronze.webp) center/150px!important}
#pad button[data-pad=blk]{background:radial-gradient(circle at 50% 32%,rgba(90,106,122,.88),rgba(42,52,64,.92) 62%,rgba(18,24,30,.96)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/stone.webp) center/150px!important}
#to-villa{background:linear-gradient(rgba(90,36,20,.9),rgba(42,16,10,.92)),url(https://ludus-assets.137-184-110-149.sslip.io/ui/bronze.webp) center/140px!important}