:root{
  --void:#0a0806;--wood:#16100a;--wood2:#221610;
  --bone:#d8c9a6;--bone-dim:#93866b;
  --blood:#a3322a;--blood-dim:#5e211c;
  --essence:#8ab8a1;--essence-dim:#3c5a4d;
  --candle:#cf9a4e;--ink:#1a140d;
  --cursor-main:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M3 3 L13 13 L10 16 L0 6 Z' fill='%23d8c9a6' stroke='%231a140d' stroke-width='1'/%3E%3Cpath d='M13 13 L21 21 L18 24 L10 16 Z' fill='%23a3322a' stroke='%231a140d' stroke-width='1'/%3E%3C/svg%3E") 3 3, auto;
  --cursor-pointer:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M3 3 L13 13 L10 16 L0 6 Z' fill='%23cf9a4e' stroke='%231a140d' stroke-width='1'/%3E%3Cpath d='M13 13 L21 21 L18 24 L10 16 Z' fill='%23a3322a' stroke='%231a140d' stroke-width='1'/%3E%3C/svg%3E") 3 3, pointer;
}
*{margin:0;padding:0;box-sizing:border-box;user-select:none;-webkit-user-select:none;}
html,body{height:100%;overscroll-behavior:none;touch-action:manipulation;}
body{background:var(--void);color:var(--bone);font-family:'IM Fell English',Georgia,serif;overflow:hidden;cursor:var(--cursor-main);}
img{-webkit-user-drag:none;user-drag:none;}

/* ===== FOCO POR CONTROLE (gamepad) ===== */
.gp-focus{outline:3px solid var(--candle) !important;outline-offset:3px;box-shadow:0 0 18px rgba(207,154,78,.65) !important;}

/* ===== SCREENS ===== */
.screen{position:absolute;inset:0;display:none;flex-direction:column;}
.screen.active{display:flex;}

/* ===== FUNDO COMPARTILHADO ===== */
.bg-table{
  position:absolute;inset:0;
  background:radial-gradient(ellipse 120% 90% at 50% 105%,#2a1c12 0%,var(--wood2) 35%,var(--wood) 60%,var(--void) 100%);
}
.bg-table::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 70% 60% at 50% 55%,transparent 40%,rgba(0,0,0,.55) 100%);
  animation:flicker 6s infinite;
}
@keyframes flicker{0%,100%{opacity:.92}47%{opacity:1}48%{opacity:.85}50%{opacity:.98}73%{opacity:.9}}
@media(prefers-reduced-motion:reduce){.bg-table::after{animation:none;}*{animation-duration:.001s!important;transition-duration:.001s!important;}}

/* ===== MENU SCREEN ===== */
#menu-screen{align-items:center;justify-content:center;z-index:200;}
#menu-screen .bg-table{z-index:0;}
#menu-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:18px;animation:fadeIn 1.5s ease;}
@keyframes fadeIn{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:none;}}
#menu-title{
  font-family:'IM Fell English SC',serif;font-size:clamp(32px,7vw,58px);letter-spacing:.18em;
  color:var(--bone);text-shadow:0 0 40px rgba(207,154,78,.35),0 0 80px rgba(207,154,78,.15);
  text-align:center;line-height:1.1;
}
#menu-subtitle{
  font-style:italic;font-size:clamp(13px,2.5vw,17px);color:var(--bone-dim);
  text-shadow:0 0 10px rgba(0,0,0,.9);margin-bottom:10px;
}
.menu-btn{
  font-family:'IM Fell English SC',serif;font-size:16px;letter-spacing:.1em;
  background:transparent;color:var(--bone);border:1px solid var(--bone-dim);
  border-radius:4px;padding:12px 40px;cursor:var(--cursor-pointer);transition:all .25s;min-width:220px;
}
.menu-btn:hover{border-color:var(--candle);background:rgba(207,154,78,.08);color:#e8dcc0;transform:translateY(-2px);}
.menu-btn:active{transform:translateY(0) scale(.98);}
.menu-btn.primary{border-color:var(--essence-dim);color:var(--essence);}
.menu-btn.primary:hover{border-color:var(--essence);background:rgba(138,184,161,.1);box-shadow:0 0 20px rgba(138,184,161,.2);}

/* difficulty selector */
#diff-selector{display:flex;gap:14px;margin:10px 0 6px;}
.diff-opt{
  display:flex;flex-direction:column;align-items:center;gap:5px;
  padding:10px 16px;border-radius:6px;border:1px solid #3a2c1c;cursor:var(--cursor-pointer);
  background:rgba(0,0,0,.3);transition:all .2s;min-width:80px;
}
.diff-opt:hover{border-color:var(--bone-dim);}
.diff-opt.selected{border-color:var(--candle);background:rgba(207,154,78,.1);box-shadow:0 0 16px rgba(207,154,78,.2);}
.diff-opt .diff-icon{font-size:24px;}
.diff-opt .diff-name{font-family:'IM Fell English SC',serif;font-size:11px;color:var(--bone-dim);letter-spacing:.06em;}
.diff-opt.selected .diff-name{color:var(--candle);}

/* ===== DECK BUILDER SCREEN ===== */
#deck-screen{z-index:190;overflow:hidden;}
#deck-screen .bg-table{z-index:0;}
#deck-content{position:relative;z-index:2;display:flex;flex-direction:column;height:100%;padding:12px;}
#deck-header{
  display:flex;align-items:center;justify-content:space-between;padding:0 4px 10px;
  border-bottom:1px solid #3a2c1c;margin-bottom:10px;
}
#deck-header h2{font-family:'IM Fell English SC',serif;font-size:18px;letter-spacing:.1em;font-weight:400;color:var(--bone);}
#deck-counter{font-family:'IM Fell English SC',serif;font-size:16px;color:var(--essence);}
#deck-counter.full{color:var(--candle);text-shadow:0 0 10px rgba(207,154,78,.4);}
#deck-filters{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap;}
.filter-btn{
  font-family:'IM Fell English SC',serif;font-size:11px;letter-spacing:.04em;
  background:rgba(0,0,0,.4);color:var(--bone-dim);border:1px solid #3a2c1c;
  border-radius:3px;padding:4px 10px;cursor:var(--cursor-pointer);transition:all .15s;
}
.filter-btn:hover{border-color:var(--bone-dim);}
.filter-btn.active{border-color:var(--candle);color:var(--candle);background:rgba(207,154,78,.1);}

#deck-body{flex:1;display:flex;gap:12px;overflow:hidden;}
#collection-panel,#mydeck-panel{flex:1;display:flex;flex-direction:column;overflow:hidden;}
#collection-panel h3,#mydeck-panel h3{
  font-family:'IM Fell English SC',serif;font-size:13px;letter-spacing:.08em;
  color:var(--bone-dim);margin-bottom:8px;font-weight:400;
}
#collection-list,#mydeck-list{
  flex:1;overflow-y:auto;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start;
  padding:4px;scrollbar-width:thin;scrollbar-color:#3a2c1c transparent;
}
#collection-list::-webkit-scrollbar,#mydeck-list::-webkit-scrollbar{width:6px;}
#collection-list::-webkit-scrollbar-thumb,#mydeck-list::-webkit-scrollbar-thumb{background:#3a2c1c;border-radius:3px;}
.deck-card{
  width:80px;height:110px;border-radius:5px;padding:4px;cursor:var(--cursor-pointer);
  background:linear-gradient(to bottom, #1a1612, #0d0a08);
  border:1px solid #4a3b2c;color:var(--bone);display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  transition:all .15s;position:relative;font-size:9px;
  box-shadow:0 4px 10px rgba(0,0,0,.9),inset 0 0 0 1px rgba(255,255,255,.05);
  overflow:hidden;
}
.deck-card:hover{transform:translateY(-3px);box-shadow:0 6px 14px rgba(0,0,0,.8);}
.deck-card.in-deck{opacity:.4;cursor:default;pointer-events:none;}
.deck-card.in-deck::after{content:'✓';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:24px;color:var(--essence);font-weight:bold;z-index:2;}
.deck-card .dc-name, .deck-card .dc-cost, .deck-card .dc-badges, .deck-card .dc-stats {
  position:relative; z-index:1;
}
.deck-card .dc-name{font-family:'IM Fell English SC',serif;font-size:9.5px;font-weight:bold;text-align:center;line-height:1.1;padding-right:12px;color:#e8dcc0;text-shadow:1px 1px 2px #000, 0 0 6px #000;}
.deck-card .dc-art{
  position:absolute;inset:0;z-index:0;
  display:flex;align-items:center;justify-content:center;font-size:22px;text-shadow:0 0 8px rgba(0,0,0,1);
}
.deck-card .dc-art::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(to bottom, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,0.95) 100%);
  pointer-events:none;
}
.deck-card .dc-stats{width:100%;display:flex;justify-content:space-between;font-family:'IM Fell English SC',serif;font-size:15px;font-weight:bold;}
.deck-card .dc-cost{position:absolute;top:3px;right:4px;font-size:12px;font-weight:bold;color:#a2dec3;font-family:'IM Fell English SC',serif;text-shadow:1px 1px 0px #000, 0 0 8px rgba(138,184,161,0.8);}
.deck-card .dc-badges{display:flex;gap:2px;font-size:9px;min-height:12px;margin-top:auto;}
.deck-card .dc-atk{color:#e64c41;text-shadow:1px 1px 0px #000, -1px -1px 0px #3a0a0a, 0 0 8px rgba(230,76,65,0.7);}
.deck-card .dc-hp{color:#6cba93;text-shadow:1px 1px 0px #000, -1px -1px 0px #0a1a12, 0 0 8px rgba(108,186,147,0.7);}

/* selected in my deck panel */
.deck-card.removable{border-color:var(--blood-dim);}
.deck-card.removable:hover{border-color:var(--blood);box-shadow:0 0 10px rgba(163,50,42,.3);}

#deck-actions{display:flex;gap:10px;padding:10px 0 0;justify-content:center;flex-wrap:wrap;}

/* ===== TUTORIAL OVERLAY ===== */
#tutorial-overlay{
  position:absolute;inset:0;z-index:300;display:none;
}
#tutorial-overlay.active{display:block;}
#tutorial-dim{position:absolute;inset:0;background:rgba(0,0,0,.75);}
#tutorial-box{
  position:absolute;bottom:60px;left:50%;transform:translateX(-50%);
  background:rgba(22,16,10,.95);border:1px solid #4d3a24;border-radius:8px;
  padding:18px 24px;max-width:440px;width:90%;z-index:5;
}
#tutorial-text{
  font-style:italic;font-size:14px;color:var(--bone-dim);line-height:1.6;
  text-shadow:0 0 6px rgba(0,0,0,.8);margin-bottom:12px;
}
#tutorial-advance{
  font-family:'IM Fell English SC',serif;font-size:12px;color:var(--bone-dim);
  background:transparent;border:1px solid #3a2c1c;border-radius:3px;
  padding:6px 18px;cursor:var(--cursor-pointer);transition:all .15s;
}
#tutorial-advance:hover{border-color:var(--candle);color:var(--bone);}

/* ===== SUSSURROS DA MEDULA ===== */
#whispers-overlay{position:absolute;inset:0;z-index:310;display:none;align-items:center;justify-content:center;}
#whispers-overlay.active{display:flex;}
#whispers-dim{position:absolute;inset:0;background:rgba(0,0,0,.85);}
#whispers-box{
  position:relative;z-index:5;background:rgba(22,16,10,.97);border:1px solid #4d3a24;border-radius:10px;
  padding:26px 30px;max-width:460px;width:90%;text-align:center;
}
#whispers-title{font-family:'IM Fell English SC',serif;font-size:20px;letter-spacing:.1em;color:var(--candle);margin-bottom:10px;}
#whispers-text{font-style:italic;font-size:14px;color:var(--bone-dim);margin-bottom:18px;}
#whispers-choices{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
#whispers-choices button{
  font-family:'IM Fell English SC',serif;font-size:13px;letter-spacing:.04em;color:var(--bone);
  background:rgba(0,0,0,.3);border:1px solid var(--bone-dim);border-radius:6px;
  padding:12px 18px;cursor:var(--cursor-pointer);transition:all .2s;min-width:160px;line-height:1.6;
}
#whispers-choices button span{font-style:italic;font-size:11px;color:var(--bone-dim);font-weight:400;}
#whispers-choices button:hover{border-color:var(--candle);background:rgba(207,154,78,.08);}
#whispers-pain:hover{border-color:var(--blood);}
#whispers-void:hover{border-color:var(--essence);}
#tutorial-step{font-family:'IM Fell English SC',serif;font-size:10px;color:#3a2c1c;position:absolute;top:8px;right:12px;}

/* ===== GAME SCREEN (existing mesa) ===== */
#game-screen{z-index:100;}
#table{
  position:relative;height:100%;display:flex;flex-direction:column;
  background:radial-gradient(ellipse 120% 90% at 50% 105%,#2a1c12 0%,var(--wood2) 35%,var(--wood) 60%,var(--void) 100%);
}
#table::after{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:40;
  background:radial-gradient(ellipse 70% 60% at 50% 55%,transparent 40%,rgba(0,0,0,.55) 100%);
  animation:flicker 6s infinite;
}
#table.shaking{animation:tableShake .3s ease;}
#table.shaking-hard{animation:tableShakeHard .45s ease;}
@keyframes tableShake{0%,100%{transform:translate(0,0);}15%{transform:translate(-3px,2px);}30%{transform:translate(4px,-2px);}45%{transform:translate(-2px,3px);}60%{transform:translate(3px,-1px);}80%{transform:translate(-1px,1px);}}
@keyframes tableShakeHard{0%,100%{transform:translate(0,0);}10%{transform:translate(-5px,3px);}20%{transform:translate(6px,-4px);}30%{transform:translate(-4px,5px);}40%{transform:translate(5px,-3px);}50%{transform:translate(-6px,2px);}60%{transform:translate(4px,-5px);}70%{transform:translate(-3px,4px);}85%{transform:translate(2px,-1px);}}

#top-right-actions{position:absolute;top:calc(8px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right));z-index:55;display:flex;gap:6px;align-items:center;}
#mute-btn{
  width:36px;height:36px;border-radius:50%;border:1px solid #3a2c1c;
  background:rgba(22,16,10,.85);color:var(--bone-dim);font-size:18px;
  cursor:var(--cursor-pointer);transition:all .2s;display:flex;align-items:center;justify-content:center;flex:none;
}
#mute-btn:hover{border-color:var(--candle);color:var(--bone);}
#mute-btn.muted{color:var(--blood-dim);border-color:var(--blood-dim);}
/* back to menu / surrender buttons */
#back-btn,#surrender-btn{
  font-family:'IM Fell English SC',serif;font-size:10px;letter-spacing:.04em;white-space:nowrap;
  background:rgba(22,16,10,.85);color:var(--bone-dim);border:1px solid #3a2c1c;
  border-radius:12px;padding:6px 12px;cursor:var(--cursor-pointer);transition:all .2s;flex:none;
}
#back-btn:hover{border-color:var(--candle);color:var(--bone);}
#surrender-btn:hover{border-color:var(--blood);color:var(--blood);}
#surrender-btn.armed{border-color:var(--blood);color:var(--blood);box-shadow:0 0 12px rgba(163,50,42,.5);animation:sacPulse 1.5s infinite;}

#opponent{display:flex;align-items:center;justify-content:center;gap:18px;padding:8px 0 2px;position:relative;z-index:2;}
#opp-face{
  width:50px;height:50px;border-radius:50%;
  background:radial-gradient(circle at 45% 35%,#241a12 0%,#0d0a07 70%);
  border:1px solid #3a2c1e;display:flex;align-items:center;justify-content:center;
  font-family:'IM Fell English SC',serif;font-size:22px;color:#4a3b28;
  text-shadow:0 0 12px rgba(207,154,78,.25);
}
#opp-hand-stack{
  position:relative;width:26px;height:36px;background:#18110c;border:1px solid #3a2c1c;border-radius:3px;
  box-shadow:3px -3px 0 0 #150e09,3px -3px 0 1px #3a2c1c,6px -6px 0 0 #120c07,6px -6px 0 1px #2e2315;
}
#opp-hand-count{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:'IM Fell English SC',serif;font-size:13px;color:#4a3b28;}
.lifebox{text-align:center;font-family:'IM Fell English SC',serif;letter-spacing:.08em;position:relative;}
.lifebox .label{font-size:11px;color:var(--bone-dim);}
.lifebox .val{font-size:28px;color:var(--bone);transition:color .2s;}
.lifebox.hurt .val{color:var(--blood);}

.dmg-pop{position:absolute;left:50%;transform:translateX(-50%);font-family:'IM Fell English SC',serif;font-weight:bold;pointer-events:none;z-index:60;white-space:nowrap;animation:dmgPop 1.2s ease-out forwards;}
.dmg-pop.neg{color:var(--blood);font-size:22px;text-shadow:0 0 12px rgba(163,50,42,.9),0 0 24px rgba(163,50,42,.4);}
.dmg-pop.pos{color:var(--essence);font-size:18px;text-shadow:0 0 12px rgba(138,184,161,.9);}
@keyframes dmgPop{0%{opacity:1;top:50%;transform:translateX(-50%) scale(.5);}15%{transform:translateX(-50%) scale(1.3);}30%{transform:translateX(-50%) scale(1);}100%{opacity:0;top:-5px;transform:translateX(-50%) scale(.8);}}

#board{flex:1;display:flex;flex-direction:column;justify-content:center;gap:14px;align-items:center;position:relative;z-index:2;}
.row{display:flex;gap:14px;}
.slot{
  width:108px;height:150px;border:1px solid #3a2c1c;border-radius:6px;
  background:linear-gradient(rgba(0,0,0,.25),rgba(0,0,0,.25)),repeating-linear-gradient(100deg,#1d130c 0 7px,#19100a 7px 14px);
  box-shadow:inset 0 0 18px rgba(0,0,0,.7);position:relative;transition:box-shadow .2s,border-color .2s;
}
.slot.center{border-color:#4d3a24;}
.slot.center:not(.playable):not(.sacrificeable)::before{content:'✦';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#3a2c1c;font-size:15px;}
.slot.playable{border-color:var(--essence-dim);box-shadow:inset 0 0 18px rgba(0,0,0,.7),0 0 14px rgba(138,184,161,.28);cursor:var(--cursor-pointer);}
.slot.playable:hover,.slot.playable:focus-visible{border-color:var(--essence);box-shadow:inset 0 0 18px rgba(0,0,0,.6),0 0 22px rgba(138,184,161,.5);}
.slot.sacrificeable{border-color:var(--blood-dim);box-shadow:inset 0 0 18px rgba(0,0,0,.7),0 0 14px rgba(163,50,42,.38);cursor:var(--cursor-pointer);}
.slot.sacrificeable:hover,.slot.sacrificeable:focus-visible{border-color:var(--blood);box-shadow:inset 0 0 18px rgba(0,0,0,.6),0 0 22px rgba(163,50,42,.65);}
.slot:focus-visible{outline:2px solid var(--essence);outline-offset:2px;}
#divider{width:min(620px,92vw);height:2px;background:linear-gradient(90deg,transparent,#3a2c1c 20%,#4d3a24 50%,#3a2c1c 80%,transparent);}

#bot-thinking{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:'IM Fell English',serif;font-style:italic;font-size:15px;color:var(--bone-dim);opacity:0;transition:opacity .5s;pointer-events:none;z-index:20;white-space:nowrap;text-shadow:0 0 14px rgba(0,0,0,.95);letter-spacing:.06em;}
#bot-thinking.show{opacity:1;}
#bot-thinking .dots span{animation:dotPulse 1.4s infinite;opacity:.3;}
#bot-thinking .dots span:nth-child(2){animation-delay:.2s;}
#bot-thinking .dots span:nth-child(3){animation-delay:.4s;}
@keyframes dotPulse{0%,80%,100%{opacity:.3;}40%{opacity:1;}}

.card{
  width:108px;height:150px;border-radius:6px;
  background:linear-gradient(to bottom, #1a1612, #0d0a08);
  border:1px solid #4a3b2c;box-shadow:0 4px 10px rgba(0,0,0,.9),inset 0 0 0 1px rgba(255,255,255,.05);
  color:var(--bone);position:relative;display:flex;flex-direction:column;align-items:center;
  justify-content:space-between;
  padding:6px 6px 5px;transition:transform .15s,box-shadow .15s,opacity .3s;
  overflow:hidden;
}
.card .cname, .card .costrow, .card .badges, .card .stats {
  position:relative; z-index:1;
}
.card .cname{font-family:'IM Fell English SC',serif;font-size:13.5px;font-weight:bold;line-height:1.15;text-align:center;letter-spacing:.05em;padding-right:18px;color:#e8dcc0;text-shadow:2px 2px 2px #000, 0 0 8px #000, 0 0 12px rgba(216,201,166,0.35);}
.card .sigilart{
  position:absolute;inset:0;z-index:0;
  display:flex;align-items:center;justify-content:center;font-size:34px;text-shadow:0 0 12px rgba(0,0,0,1);
}
.card .sigilart::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(to bottom, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.1) 25%, rgba(0,0,0,0.1) 65%, rgba(0,0,0,0.98) 100%);
  pointer-events:none;
}
.card .costrow{position:absolute;top:6px;right:7px;font-size:16px;font-weight:bold;color:#a2dec3;font-family:'IM Fell English SC',serif;text-shadow:1px 1px 0px #000, 0 0 10px rgba(138,184,161,0.8), 0 0 18px rgba(138,184,161,0.5);}
.card .stats{width:100%;display:flex;justify-content:space-between;font-family:'IM Fell English SC',serif;font-size:22px;font-weight:bold;}
.card .atk{color:#e64c41;text-shadow:2px 2px 0px #000, -1px -1px 0px #3a0a0a, 0 0 12px rgba(230,76,65,0.7);}
.card .hp{color:#6cba93;text-shadow:2px 2px 0px #000, -1px -1px 0px #0a1a12, 0 0 12px rgba(108,186,147,0.7);}
.card.in-slot{position:absolute;inset:-1px;width:auto;height:auto;}
.card.enemy{background:linear-gradient(to bottom, #140d0a, #080504);border-color:#3a201c;}

.badges{display:flex;gap:3px;min-height:17px;align-items:center;}
.badge{width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 40% 30%,#3a2f1e,#171208);border:1px solid #6b5b3c;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--bone);box-shadow:0 0 6px rgba(207,154,78,.25);}
.badge.martir{background:radial-gradient(circle at 40% 30%,#5e2a1c,#2a0f0a);border-color:var(--blood-dim);box-shadow:0 0 7px rgba(163,50,42,.4);}
.badge.espectral{background:radial-gradient(circle at 40% 30%,#1e2a3a,#0c0f14);border-color:#2e4a6a;box-shadow:0 0 7px rgba(80,130,200,.3);}
.badge.vampirico{background:radial-gradient(circle at 40% 30%,#4a1020,#1a0508);border-color:#6a1e2e;box-shadow:0 0 7px rgba(180,40,60,.35);}
.badge.espinhos{background:radial-gradient(circle at 40% 30%,#1e3a1e,#0a1408);border-color:#2e5a2e;box-shadow:0 0 7px rgba(80,160,80,.3);}

/* ===== PERSONALIDADE: molduras por sigil + efeito foil em combos ===== */
.card.accent-green,.deck-card.accent-green{border-color:#3a6a3a;box-shadow:0 4px 10px rgba(0,0,0,.6),inset 0 0 0 3px rgba(26,20,13,.15),0 0 12px rgba(80,160,80,.3);}
.card.accent-red,.deck-card.accent-red{border-color:#7a2a2a;box-shadow:0 4px 10px rgba(0,0,0,.6),inset 0 0 0 3px rgba(26,20,13,.15),0 0 12px rgba(180,40,60,.3);}
.card.accent-violet,.deck-card.accent-violet{border-color:#3a4a8a;box-shadow:0 4px 10px rgba(0,0,0,.6),inset 0 0 0 3px rgba(26,20,13,.15),0 0 12px rgba(90,110,220,.3);}
.card.accent-gold,.deck-card.accent-gold{border-color:#9a7a2e;box-shadow:0 4px 10px rgba(0,0,0,.6),inset 0 0 0 3px rgba(26,20,13,.15),0 0 12px rgba(207,154,78,.35);}
.card.combo{position:relative;overflow:hidden;}
.card.combo::after{
  content:'';position:absolute;inset:0;pointer-events:none;mix-blend-mode:overlay;opacity:.55;
  background:conic-gradient(from 0deg,transparent 0deg,rgba(255,255,255,.5) 15deg,transparent 40deg,transparent 180deg,rgba(255,255,255,.35) 195deg,transparent 220deg,transparent 360deg);
  animation:foilSpin 5s linear infinite;
}
@keyframes foilSpin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
.card-img,.dc-img{width:100%;height:100%;object-fit:cover;border-radius:0;border:none;box-shadow:none;}

.card.strike-up{animation:strikeUp .4s ease;}
.card.strike-down{animation:strikeDown .4s ease;}
@keyframes strikeUp{40%{transform:translateY(-26px) scale(1.05);}100%{transform:none;}}
@keyframes strikeDown{40%{transform:translateY(26px) scale(1.05);}100%{transform:none;}}
.card.soar-up{animation:soarUp .5s ease;}
.card.soar-down{animation:soarDown .5s ease;}
@keyframes soarUp{45%{transform:translateY(-46px) scale(1.1) rotate(-3deg);}100%{transform:none;}}
@keyframes soarDown{45%{transform:translateY(46px) scale(1.1) rotate(3deg);}100%{transform:none;}}
.card.wound{animation:wound .35s ease;}
@keyframes wound{0%,100%{filter:none;}30%{filter:sepia(1) saturate(3) hue-rotate(-30deg) brightness(.9);transform:translateX(-3px);}60%{transform:translateX(3px);}}
.card.poisoned{animation:poison .5s ease;}
@keyframes poison{0%,100%{filter:none;}40%{filter:sepia(1) saturate(2.5) hue-rotate(60deg) brightness(.75);}}
.card.vampHeal{animation:vampHeal .45s ease;}
@keyframes vampHeal{0%,100%{filter:none;}40%{filter:sepia(.8) saturate(3) hue-rotate(-60deg) brightness(1.2);}}
.card.thornHit{animation:thornHit .35s ease;}
@keyframes thornHit{0%,100%{filter:none;}30%{filter:sepia(1) saturate(2) hue-rotate(60deg) brightness(1.1);transform:scale(1.05);}60%{transform:scale(.97);}}
.card.perish{opacity:0;transform:scale(.85) rotate(4deg);}
.card.sacrificing{animation:sacrificing .55s ease forwards;}
@keyframes sacrificing{0%{opacity:1;transform:scale(1);}30%{filter:sepia(1) saturate(5) hue-rotate(80deg) brightness(1.5);transform:scale(1.1) rotate(2deg);}100%{opacity:0;transform:scale(.55) translateY(-22px) rotate(-5deg);filter:brightness(4);}}
.card.espectral-return{animation:espectralReturn .6s ease forwards;}
@keyframes espectralReturn{0%{opacity:1;transform:scale(1);}40%{filter:brightness(1.8) saturate(0) blur(1px);transform:scale(1.05);}100%{opacity:0;transform:scale(.8);filter:brightness(3) blur(3px);}}
.ess-pop{position:absolute;left:50%;transform:translateX(-50%);font-family:'IM Fell English SC',serif;color:var(--essence);font-size:19px;font-weight:bold;text-shadow:0 0 14px rgba(138,184,161,.9);pointer-events:none;animation:essPop 1.5s ease forwards;z-index:60;white-space:nowrap;}
@keyframes essPop{0%{opacity:1;top:40%;}100%{opacity:0;top:-10px;}}
@keyframes selectedGlow{0%,100%{box-shadow:0 0 0 2px var(--essence),0 10px 24px rgba(0,0,0,.8),0 0 16px rgba(138,184,161,.3);}50%{box-shadow:0 0 0 2px var(--essence),0 10px 24px rgba(0,0,0,.8),0 0 28px rgba(138,184,161,.6);}}

#bottom{position:relative;z-index:3;display:flex;align-items:flex-end;justify-content:center;gap:34px;padding:6px calc(12px + env(safe-area-inset-right)) calc(14px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));min-height:168px;}
#hand{display:flex;align-items:flex-end;justify-content:center;height:172px;}
#hand .card{margin:0 -18px;cursor:var(--cursor-pointer);transform-origin:50% 120%;}
#hand .card:hover,#hand .card:focus-visible{transform:translateY(-22px)!important;z-index:10;box-shadow:0 10px 22px rgba(0,0,0,.7);}
#hand .card.selected{transform:translateY(-26px)!important;z-index:11;animation:selectedGlow 2s ease-in-out infinite;}
#hand .card.unaffordable{filter:grayscale(.7) brightness(.7);cursor:not-allowed;}

#essence{display:flex;flex-direction:column;align-items:center;gap:5px;}
#essence .label{font-family:'IM Fell English SC',serif;font-size:10px;color:var(--bone-dim);letter-spacing:.12em;}
#flames{display:flex;gap:5px;flex-wrap:wrap;justify-content:center;max-width:96px;}
.flame{width:10px;height:18px;border-radius:50% 50% 45% 45%;background:radial-gradient(ellipse at 50% 80%,var(--essence) 0%,#3f6b58 55%,transparent 75%);box-shadow:0 0 10px rgba(138,184,161,.55);animation:sway 2.4s ease-in-out infinite;}
.flame:nth-child(2n){animation-delay:.6s;}.flame:nth-child(3n){animation-delay:1.1s;}
@keyframes sway{0%,100%{transform:scaleY(1) skewX(0);}50%{transform:scaleY(1.12) skewX(3deg);}}
.flame.spent{background:radial-gradient(ellipse at 50% 80%,#2a2620 0%,#17140f 60%,transparent 80%);box-shadow:none;animation:none;opacity:.5;}
#ess-count{font-family:'IM Fell English SC',serif;font-size:20px;color:var(--essence);letter-spacing:.05em;}
#deck-count-game{font-family:'IM Fell English SC',serif;font-size:10px;color:#5c4c35;letter-spacing:.06em;text-align:center;}

#actions{display:flex;flex-direction:column;align-items:center;gap:10px;align-self:center;}
#bell{width:68px;height:68px;border-radius:50%;border:2px solid #6e5636;background:radial-gradient(circle at 38% 30%,#8a6c3f 0%,#4d3a22 55%,#2b2013 100%);color:#e3d3a8;font-family:'IM Fell English SC',serif;font-size:11px;letter-spacing:.06em;line-height:1.15;cursor:var(--cursor-pointer);box-shadow:0 6px 14px rgba(0,0,0,.7),inset 0 2px 6px rgba(255,235,190,.25);transition:transform .12s,box-shadow .12s,filter .2s;}
#bell:hover{transform:translateY(-2px);}
#bell:active{transform:translateY(1px) scale(.97);}
#bell:disabled{filter:grayscale(.8) brightness(.6);cursor:wait;}
#sac-btn{width:52px;height:52px;border-radius:50%;border:1.5px solid #5e2a1c;background:radial-gradient(circle at 38% 30%,#3a1510 0%,#1c0907 55%,#100504 100%);color:var(--blood-dim);font-size:20px;cursor:var(--cursor-pointer);box-shadow:0 4px 10px rgba(0,0,0,.65);transition:all .2s;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;gap:1px;}
#sac-btn span.sac-label{font-family:'IM Fell English SC',serif;font-size:7px;line-height:1.15;color:#5e2a1c;letter-spacing:.03em;text-align:center;}
#sac-btn:hover{border-color:var(--blood);color:var(--blood);}
#sac-btn.active{border-color:var(--blood);color:var(--blood);box-shadow:0 0 20px rgba(163,50,42,.55),inset 0 0 12px rgba(163,50,42,.2);animation:sacPulse 1.5s infinite;}
@keyframes sacPulse{0%,100%{box-shadow:0 0 14px rgba(163,50,42,.4);}50%{box-shadow:0 0 26px rgba(163,50,42,.75);}}
#sac-btn:disabled{filter:grayscale(.8) brightness(.5);cursor:not-allowed;}
#actions-row{display:flex;gap:8px;}
#wager-btn{width:52px;height:52px;border-radius:50%;border:1.5px solid #6e5636;background:radial-gradient(circle at 38% 30%,#3a2f10 0%,#1c1607 55%,#100c04 100%);color:var(--candle);font-size:16px;cursor:var(--cursor-pointer);box-shadow:0 4px 10px rgba(0,0,0,.65);transition:all .2s;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;gap:1px;}
#wager-btn span.wager-label{font-family:'IM Fell English SC',serif;font-size:7px;line-height:1.15;color:var(--candle);letter-spacing:.03em;text-align:center;}
#wager-btn:hover{border-color:var(--candle);}
#wager-btn.active{border-color:var(--candle);box-shadow:0 0 20px rgba(207,154,78,.55),inset 0 0 12px rgba(207,154,78,.2);animation:sacPulse 1.5s infinite;}
#wager-btn:disabled{filter:grayscale(.8) brightness(.5);cursor:not-allowed;}
#sac-hint{position:absolute;bottom:172px;left:50%;transform:translateX(-50%);font-style:italic;font-size:12px;color:var(--blood-dim);opacity:0;transition:opacity .4s;pointer-events:none;z-index:20;white-space:nowrap;text-shadow:0 0 8px rgba(0,0,0,.9);}
#sac-hint.show{opacity:1;}
#player-info{display:flex;flex-direction:column;align-items:center;gap:5px;align-self:center;}
#whisper{position:absolute;left:50%;top:8px;transform:translateX(-50%);font-style:italic;font-size:14px;color:var(--bone-dim);text-shadow:0 0 8px rgba(0,0,0,.9);opacity:0;transition:opacity .5s;pointer-events:none;z-index:50;white-space:nowrap;}
#whisper.show{opacity:1;}
#title{position:absolute;top:calc(8px + env(safe-area-inset-top));left:calc(14px + env(safe-area-inset-left));z-index:5;font-family:'IM Fell English SC',serif;font-size:12px;letter-spacing:.22em;color:#4a3b28;}
#title .candle-icon{display:inline-block;animation:candleFlicker 3s ease-in-out infinite;}
@keyframes candleFlicker{0%,100%{opacity:.85;transform:scaleY(1);}25%{opacity:1;transform:scaleY(1.05);}50%{opacity:.7;transform:scaleY(.95);}75%{opacity:.95;transform:scaleY(1.02);}}
#player-hands-img{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:900px;height:auto;z-index:1;pointer-events:none;opacity:.55;mix-blend-mode:lighten;-webkit-mask-image:linear-gradient(to top,rgba(0,0,0,1) 0%,rgba(0,0,0,.6) 40%,transparent 75%);mask-image:linear-gradient(to top,rgba(0,0,0,1) 0%,rgba(0,0,0,.6) 40%,transparent 75%);}
#turn-flash{position:absolute;inset:0;z-index:45;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,rgba(207,154,78,.08),transparent 70%);opacity:0;}
#turn-flash.flash{animation:turnFlash 1.2s ease forwards;}
@keyframes turnFlash{0%{opacity:0;}20%{opacity:1;}100%{opacity:0;}}
#veil{position:absolute;inset:0;z-index:100;background:rgba(4,3,2,.88);display:none;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center;}
#veil.show{display:flex;animation:veilin 1.2s ease;}
@keyframes veilin{from{opacity:0;}to{opacity:1;}}
#veil h1{font-family:'IM Fell English SC',serif;font-size:clamp(28px,6vw,52px);letter-spacing:.14em;font-weight:400;}
#veil h1.win{color:var(--essence);text-shadow:0 0 30px rgba(138,184,161,.5);}
#veil h1.lose{color:var(--blood);text-shadow:0 0 30px rgba(163,50,42,.5);}
#veil p{color:var(--bone-dim);font-style:italic;max-width:420px;padding:0 20px;}
#veil button{font-family:'IM Fell English SC',serif;font-size:15px;letter-spacing:.08em;background:transparent;color:var(--bone);border:1px solid var(--bone-dim);border-radius:4px;padding:9px 26px;cursor:var(--cursor-pointer);transition:all .2s;}
#veil button:hover{border-color:var(--bone);background:rgba(216,201,166,.08);}
#veil-stats{font-family:'IM Fell English SC',serif;font-size:12px;color:var(--bone-dim);margin-top:4px;}

@media(max-width:700px){
  .slot,.card{width:72px;height:104px;}.row{gap:8px;}
  .card .sigilart{font-size:23px;}.card .cname{font-size:9px;padding-right:18px;}.card .stats{font-size:13px;}.card .costrow{font-size:11px;}
  .badge{width:15px;height:15px;font-size:8px;}#hand .card{margin:0 -22px;}
  #bottom{gap:14px;min-height:150px;}#hand{height:128px;}
  #bell{width:58px;height:58px;font-size:10px;}#sac-btn{width:44px;height:44px;font-size:16px;}
  #whisper{font-size:11px;white-space:normal;text-align:center;width:90%;}
  #player-hands-img{display:none;}
  #mute-btn{width:30px;height:30px;font-size:14px;}
  #title{font-size:9px;letter-spacing:.06em;}
  #back-btn,#surrender-btn{font-size:0;padding:6px 8px;}
  #back-btn::before{content:'☰';font-size:14px;}
  #surrender-btn::before{content:'🏳';font-size:12px;}
  #deck-body{flex-direction:column;}
  .deck-card{width:76px;height:105px;}.deck-card .dc-art{font-size:19px;}.deck-card .dc-stats{font-size:12px;}
  .menu-btn{padding:10px 28px;font-size:14px;min-width:180px;}
  #menu-title{letter-spacing:.1em;}
  /* o título e os botões ☰/🔊 são absolutos no canto superior; em telas estreitas
     a barra centralizada do oponente (rosto/mão/vida) precisa descer para não
     colidir com eles */
  #opponent{padding-top:40px;}
  #opp-disconnected-banner{top:76px;}
}

/* celular deitado (paisagem, pouca altura) — largura pode ser grande, mas
   sobra pouca altura pro tabuleiro + mão + HUD, então encolhe tudo verticalmente */
@media(max-height:500px) and (orientation:landscape){
  .slot,.card{width:64px;height:88px;}.row{gap:6px;}
  .card .sigilart{font-size:20px;}.card .cname{font-size:8px;padding-right:14px;}.card .stats{font-size:11px;}.card .costrow{font-size:10px;}
  #board{gap:6px;}
  #bottom{gap:16px;min-height:100px;padding-top:2px;padding-bottom:calc(4px + env(safe-area-inset-bottom));}
  #hand{height:96px;}
  #hand .card{margin:0 -20px;}
  #bell{width:46px;height:46px;font-size:9px;}
  #actions-row{gap:6px;}
  #sac-btn,#wager-btn{width:36px;height:36px;font-size:14px;}
  #opponent{padding:4px 0 0;gap:10px;}
  #opp-face{width:36px;height:36px;font-size:16px;}
  #player-hands-img{display:none;}
}

/* ===== ONLINE / OFFLINE SCREENS ===== */
#online-screen,#offline-screen{align-items:center;justify-content:center;z-index:195;}
#online-screen .bg-table,#offline-screen .bg-table{z-index:0;}
#online-content,#offline-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:16px;width:90%;max-width:380px;}
#online-content h2,#offline-content h2{font-family:'IM Fell English SC',serif;font-size:20px;letter-spacing:.12em;color:var(--bone);margin-bottom:4px;}
#offline-stats{font-family:'IM Fell English SC',serif;font-size:12px;color:var(--bone-dim);letter-spacing:.06em;text-align:center;}
#online-choice{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%;}
#online-join-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:center;}
#join-code-input{
  font-family:'IM Fell English SC',serif;font-size:16px;letter-spacing:.2em;text-align:center;text-transform:uppercase;
  background:rgba(0,0,0,.4);color:var(--bone);border:1px solid var(--bone-dim);border-radius:4px;
  padding:10px 8px;width:150px;max-width:100%;box-sizing:border-box;
}
#join-code-input:focus{outline:none;border-color:var(--candle);}
#online-error{color:var(--blood);font-style:italic;font-size:13px;min-height:18px;text-align:center;}
#online-waiting{display:none;flex-direction:column;align-items:center;gap:10px;text-align:center;}
#online-waiting p{color:var(--bone-dim);font-style:italic;}
#room-code-display{
  font-family:'IM Fell English SC',serif;font-size:34px;letter-spacing:.28em;color:var(--candle);
  text-shadow:0 0 20px rgba(207,154,78,.4);padding:8px 18px;border:1px solid #3a2c1c;border-radius:6px;
}
#online-divider{color:var(--bone-dim);font-style:italic;font-size:12px;margin:2px 0;}
#opp-disconnected-banner{
  position:absolute;top:44px;left:50%;transform:translateX(-50%);z-index:56;
  font-family:'IM Fell English SC',serif;font-size:12px;color:var(--blood);
  background:rgba(22,16,10,.9);border:1px solid var(--blood-dim);border-radius:12px;padding:6px 14px;
  display:none;letter-spacing:.05em;
}
#opp-disconnected-banner.show{display:block;}

/* ===== TOOLTIP DE CARTA (in-game) ===== */
#card-tooltip{
  position:fixed;z-index:500;pointer-events:none;display:none;
  max-width:240px;background:rgba(15,11,7,.97);border:1px solid #4d3a24;border-radius:6px;
  padding:10px 12px;box-shadow:0 8px 20px rgba(0,0,0,.7);
  font-family:'IM Fell English',Georgia,serif;color:var(--bone);
}
#card-tooltip.show{display:block;}
#card-tooltip .ct-title{
  font-family:'IM Fell English SC',serif;font-size:13px;letter-spacing:.05em;color:var(--candle);
  display:flex;justify-content:space-between;gap:10px;margin-bottom:4px;
}
#card-tooltip .ct-stats{font-size:12px;color:var(--bone-dim);margin-bottom:6px;}
#card-tooltip .ct-stats .atk{color:var(--blood);}
#card-tooltip .ct-stats .hp{color:#5c8a72;}
#card-tooltip .ct-sigil{font-size:11.5px;line-height:1.4;margin-top:4px;}
#card-tooltip .ct-sigil .ct-sigil-name{color:var(--essence);font-style:normal;}
