/* NT Idle — tema "pergaminho e laca": papel envelhecido com moldura vinho e filete dourado.
   Fica DEPOIS do game.css: o game.css cuida do layout, este arquivo cuida da aparência. */
:root{
  /* papel */
  --pg1:#f6ebcd; --pg2:#e7d3a8; --pg3:#dcc59a; --pg4:#cdb07f;
  /* tinta */
  --tx:#3b2a17; --mut:#7a6141; --dim:#9a8461;
  /* moldura */
  --vin1:#a33429; --vin2:#7d2318; --vin3:#4e0f0b; --vin-tx:#ffe9c9;
  /* metal */
  --our1:#f5d382; --our2:#d9a33a; --our3:#9d6b16;
  /* laca (painéis escuros) */
  --lac1:#2a1512; --lac2:#170b0a;
  /* barras */
  --xp:#a97bf0; --hp:#5fc45c; --ck:#4b92ef;
  --gold:#a4701a; --grn:#1f7a34; --red:#a82a22; --org:#b45a11; --pur:#6f3fb0;
  --line:rgba(78,15,11,.22); --line2:rgba(78,15,11,.38);
  --sh:0 10px 26px rgba(30,8,4,.45);
  --r:10px;
}
body{color:var(--tx);font-family:"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif}

/* ---------------------------------------------------------------- moldura de papel */
/* sem position aqui: .panel e .win já são fixed no game.css e mudar isso quebra o layout */
.panel,.win,.mbox,.toast{
  color:var(--tx);
  background:
    repeating-linear-gradient(103deg,rgba(120,80,30,.045) 0 2px,transparent 2px 6px),
    linear-gradient(168deg,var(--pg1) 0%,var(--pg2) 58%,var(--pg3) 100%);
  border:3px solid var(--vin2);
  border-radius:12px;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.55),
    inset 0 0 0 4px rgba(190,140,70,.30),
    inset 0 0 26px -8px rgba(120,80,30,.45),
    0 0 0 1px var(--vin3),
    var(--sh);
  backdrop-filter:none;
}
.mbox,.toast{position:relative}
/* tachas douradas nos quatro cantos */
.panel::after,.win::after,.mbox::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:
    radial-gradient(circle at 9px 9px,var(--our1) 0 2.2px,var(--our3) 2.2px 3.2px,transparent 3.4px),
    radial-gradient(circle at calc(100% - 9px) 9px,var(--our1) 0 2.2px,var(--our3) 2.2px 3.2px,transparent 3.4px),
    radial-gradient(circle at 9px calc(100% - 9px),var(--our1) 0 2.2px,var(--our3) 2.2px 3.2px,transparent 3.4px),
    radial-gradient(circle at calc(100% - 9px) calc(100% - 9px),var(--our1) 0 2.2px,var(--our3) 2.2px 3.2px,transparent 3.4px);
}

/* ---------------------------------------------------------------- painéis de laca */
.money,.activity,.hotbar,.event{
  background:linear-gradient(180deg,var(--lac1),var(--lac2));
  border:2px solid var(--our3);
  box-shadow:inset 0 0 0 1px rgba(245,211,130,.35),inset 0 0 20px -8px #000,var(--sh);
  color:#f3e4c6;
}
.money::after,.activity::after,.hotbar::after,.event::after{display:none}
.activity .act-s,.event b{color:#c3a878}
.money .fame{color:#c79bff}
.money b{color:#fff3da}
.icbtn{background:rgba(245,211,130,.1);border-color:rgba(245,211,130,.3);color:#f3e4c6}
.icbtn:hover{background:rgba(245,211,130,.22)}

/* ---------------------------------------------------------------- carta do ninja */
.pc-face{
  background:linear-gradient(180deg,#f8efd6,#d8bf90);
  border:2px solid var(--vin2);
  box-shadow:inset 0 0 0 1px var(--our2)
}
.pc-name{color:#2e1f0f;text-shadow:0 1px 0 rgba(255,255,255,.55)}
.pc-name small{color:var(--mut)} .pc-name small b{color:#8a5a12}
.bar{background:linear-gradient(180deg,#3a2a1c,#241709);border:2px solid var(--vin2);border-radius:7px;height:16px}
.bar span{color:#fff6e2;text-shadow:0 1px 2px rgba(0,0,0,.9);line-height:12px}
.bar.xp i{background:linear-gradient(180deg,#c49cf8,#7b4fd0)}
.bar.hp i{background:linear-gradient(180deg,#86e37f,#2f8f3a)}
.bar.ck i{background:linear-gradient(180deg,#7db6ff,#2b6bd0)}
.chip{background:linear-gradient(180deg,#f3e6c4,#dcc59a);border:1px solid var(--vin2);color:#4a3418}

/* ---------------------------------------------------------------- menu de cima: pergaminho com roletes */
.topmenu{left:292px;right:568px;transform:none;padding:6px 14px 8px;border-radius:8px;flex-direction:column;gap:0}
/* o trilho é o que rola; a barra abaixo mostra que existe botão fora da vista */
.tmtrilho{justify-content:center;justify-content:safe center}
.tmbar{background:rgba(120,80,30,.22);box-shadow:inset 0 0 0 1px rgba(120,80,30,.28)}
.tmbar i{background:linear-gradient(180deg,var(--vin1),var(--vin2));box-shadow:inset 0 0 0 1px var(--our2)}
.tmbar i:hover{background:linear-gradient(180deg,var(--vin2),var(--vin3))}
.topmenu::before,.topmenu::after{
  content:"";position:absolute;top:-7px;bottom:-7px;width:17px;border-radius:9px;
  background:linear-gradient(90deg,#6d1c14,#c05a3a 35%,#8e2a1c 60%,#5a140e);
  box-shadow:inset 0 0 0 1px rgba(245,211,130,.5),0 3px 8px rgba(0,0,0,.5);
}
.topmenu::before{left:-9px} .topmenu::after{right:-9px;background-image:linear-gradient(270deg,#6d1c14,#c05a3a 35%,#8e2a1c 60%,#5a140e)}
.topmenu button{color:#6b512e}
.topmenu button:hover{background:rgba(163,52,41,.12);color:var(--tx)}
.topmenu button.on,.topmenu button.hot.on{
  background:linear-gradient(180deg,var(--vin1),var(--vin2));color:#ffeacb;
  box-shadow:inset 0 0 0 1px var(--our2)
}

/* ---------------------------------------------------------------- botão de hunts: emblema redondo */
.huntbtn{
  width:92px;height:92px;border-radius:50%;padding:0;gap:2px;
  background:radial-gradient(circle at 50% 35%,#c2402f,#7d2318 65%,#4e0f0b);
  border:3px solid var(--vin3);
  box-shadow:inset 0 0 0 2px var(--our2),inset 0 6px 16px rgba(255,180,120,.25),0 8px 20px rgba(0,0,0,.55);
  color:#ffeacb;
}
.huntbtn::after{display:none}
.huntbtn:hover{filter:brightness(1.12)}
.huntbtn b{font-size:13px;letter-spacing:.06em;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.hb-ic{width:38px;height:38px}

/* ---------------------------------------------------------------- lista de jutsus */
.jlist header,.daily header{padding:0 10px;margin-bottom:8px}
.jlist header,.daily header,.sec{color:#8a5a12;letter-spacing:.1em}
.jrow{background:linear-gradient(180deg,rgba(255,255,255,.45),rgba(205,176,127,.35));border:1px solid var(--line2)}
.jrow:hover{border-color:var(--vin2);background:linear-gradient(180deg,#fff6df,#e6d3a9)}
.jrow .jn{color:#3b2a17}
.jrow .jn small{color:var(--mut)}
.jrow .cd{background:#3a2a1c;border:1px solid var(--vin3)}
.jrow .cd i{background:linear-gradient(180deg,#f5d382,#c98f2a)}

/* ---------------------------------------------------------------- chat */
.tabs{padding:6px 8px 0}
.tabs button{color:#7a6141;border-radius:7px 7px 0 0}
.tabs button.on{color:#ffeacb;background:linear-gradient(180deg,var(--vin1),var(--vin2));box-shadow:inset 0 0 0 1px var(--our2)}
.chat-body{border-top:2px solid var(--vin2);background:rgba(255,250,235,.35)}
.chat-body time{color:#9a8461}
.chat-body .t-level{color:#8a5a12}.chat-body .t-loot{color:#1f7a34}.chat-body .t-death{color:#a82a22}
.chat-body .t-warn{color:#b45a11}.chat-body .t-boss{color:#8f1f18}.chat-body .t-hunt{color:#2f5aa8}.chat-body .t-info{color:#54402a}

/* ---------------------------------------------------------------- missões */
.drow{border-top:1px solid var(--line2)}
.drow .dn{color:#3b2a17} .drow .dn small{color:var(--mut)}
.drow.done .dp{color:var(--grn)}

/* ---------------------------------------------------------------- botões */
.btn{
  background:linear-gradient(180deg,#f3e6c4,#d9c197);
  border:2px solid var(--vin2);color:#4a3418;border-radius:8px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 2px 0 rgba(78,15,11,.25)
}
.btn:hover{background:linear-gradient(180deg,#fff7e2,#e7d3a8)}
.btn:active{transform:translateY(1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.btn.pri{background:linear-gradient(180deg,#c2402f,#7d2318);border-color:var(--vin3);color:#ffeacb}
.btn.grn{background:linear-gradient(180deg,#3aa04a,#1d6b2c);border-color:#14471d;color:#f2ffe9}
.btn.red{background:linear-gradient(180deg,#c2402f,#8d1f16);border-color:#4e0f0b;color:#ffe6df}
.btn.gold{background:linear-gradient(180deg,#f2cd6e,#c98f2a);border-color:#8a5a12;color:#3b2a17}
.btn.xpc{background:linear-gradient(180deg,#6aa6ff,#2f6ed8);border-color:#1d4a97;color:#eef5ff}
.btn[disabled]{opacity:.45}

/* ---------------------------------------------------------------- caixas internas */
.card,.mdet,.an-c,.an-rates div,.hm-filter,.hm-side .reg,.icard,.tokhdr,.pack,.ccprev,.regras span{
  background:linear-gradient(180deg,rgba(255,252,240,.6),rgba(205,176,127,.35));
  border:1px solid var(--line2);border-radius:10px
}
.slot,.hk,.eqslot,.mc .mci{
  background:linear-gradient(180deg,#f2e6c8,#cdb07f);
  border:2px solid var(--vin2);border-radius:9px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)
}
.slot:hover,.hk:hover,.eqslot:hover{border-color:var(--our3);background:linear-gradient(180deg,#fff7e2,#dcc59a)}
.slot.sel{border-color:#8a5a12;box-shadow:0 0 0 2px var(--our2) inset}
.slot .q,.hk .lv{color:#3b2a17;text-shadow:0 1px 0 rgba(255,255,255,.7)}
.hk .ov{background:rgba(60,20,10,.55)}
.hotbar .hk{border-color:var(--our3)}
.switch{background:#6b5335;border:2px solid var(--vin3)}
.switch::after{background:#e7d3a8}
.switch.on{background:linear-gradient(180deg,#3aa04a,#1d6b2c);border-color:#14471d}
.opt,.tbl td,.tbl th,.drow{border-color:var(--line2)}
.lrow:nth-child(odd){background:rgba(120,80,30,.07)}
.lrow .lv{color:#8a5a12}
.kv span{color:var(--mut)}
input,select,textarea{background:#fbf3df;border:2px solid var(--vin2);color:#3b2a17}
input:focus,select:focus,textarea:focus{border-color:var(--our3)}
input[type=range]{accent-color:#a33429;border:0;background:none}

/* ---------------------------------------------------------------- janelas e modais */
.win>header,.mbox>header{
  background:linear-gradient(180deg,var(--vin1),var(--vin2));
  border-radius:9px 9px 0 0;border-bottom:2px solid var(--vin3);color:#ffeacb
}
.win>header h3,.mbox>header h2{color:#ffeacb;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.win>header small{color:#e8c39a}
.win>header button{color:#ffd9c4}
.win>header button:hover{background:rgba(0,0,0,.25);color:#fff}
.mbox>header .x{color:#ffd9c4}
.mfoot{border-top:2px solid var(--vin2)}
#modal{background:rgba(35,10,5,.62)}

/* ---------------------------------------------------------------- mapa de hunts */
.hc{background:linear-gradient(180deg,#f2e6c8,#d9c197);border:2px solid var(--vin2)}
.hc:hover{border-color:var(--our3)}
.hc.here{border-color:#1d6b2c;box-shadow:0 0 0 2px #3aa04a}
.hc .pv{background:#2a1512}
.hc .lvb{background:rgba(35,10,5,.8);color:var(--our1)}
.hc .hn{color:#3b2a17}
.hm-side .br{color:#5a4326}
.hm-side .br:hover{background:rgba(163,52,41,.1)}
.hm-side .br.on{background:linear-gradient(90deg,rgba(163,52,41,.25),transparent);box-shadow:inset 3px 0 0 var(--vin1);color:#3b2a17}

/* ---------------------------------------------------------------- comércio */
.shopbox>header{background:linear-gradient(180deg,var(--vin1),var(--vin2));border-bottom:2px solid var(--vin3)}
.shoplogo{background:linear-gradient(180deg,var(--our1),var(--our3));color:#3b2a17}
.wallet .w{background:rgba(35,10,5,.55);border:1px solid var(--our3);color:#ffeacb}
.wallet .vip{color:var(--our1);border-color:var(--our1)}
.shop-rail{background:rgba(120,80,30,.1);border-right:2px solid var(--line2)}
.shop-rail button .sn{color:#3b2a17}
.shop-rail button small{color:var(--mut)}
.shop-rail button:hover{background:rgba(163,52,41,.1)}
.shop-rail button.on{background:linear-gradient(180deg,rgba(163,52,41,.22),rgba(163,52,41,.08));border-color:var(--vin2)}
.shop-rail button.on .sn{color:#8d1f16}
.shop-head p{color:var(--mut)}
.chip-b{background:linear-gradient(180deg,#f3e6c4,#d9c197);border:2px solid var(--vin2);color:#5a4326}
.chip-b.on{background:linear-gradient(180deg,var(--vin1),var(--vin2));color:#ffeacb;border-color:var(--vin3)}
.mc{background:linear-gradient(180deg,#f7ecd2,#ddc89d);border:2px solid var(--vin2)}
.mc:hover,.mc.sel{border-color:var(--our3);box-shadow:0 0 0 1px var(--our2)}
.mc .mn{color:#3b2a17}
.mc .mp{color:#8a5a12}
.mc.promo{border-color:var(--our3)}
.mc .off{background:linear-gradient(180deg,#c2402f,#8d1f16);color:#ffeacb}
.mdet h4{color:#8d1f16}
.mtabs button,.mk-cats button{background:linear-gradient(180deg,#f3e6c4,#d9c197);border:2px solid var(--vin2);color:#5a4326}
.mtabs button.on,.mk-cats button.on{background:linear-gradient(180deg,var(--vin1),var(--vin2));color:#ffeacb;border-color:var(--vin3)}
.vipcard{background:linear-gradient(110deg,rgba(245,211,130,.35),rgba(255,252,240,.5));border:2px solid var(--our3)}
.vipcard.on{border-color:#1d6b2c;background:linear-gradient(110deg,rgba(90,200,120,.25),rgba(255,252,240,.5))}
.ativo{background:linear-gradient(90deg,rgba(245,211,130,.45),rgba(255,252,240,.4));border:2px solid var(--our3);color:#6b4a0f}

/* ---------------------------------------------------------------- criação / portão */
.chc{background:linear-gradient(180deg,#f2e6c8,#d9c197);border:2px solid var(--vin2)}
.chc:hover{border-color:var(--our3)}
.chc.sel{border-color:#8a5a12;background:linear-gradient(180deg,#fff7e2,#e7d3a8);box-shadow:0 0 0 2px var(--our2) inset}
.ccprev{background:radial-gradient(ellipse at 50% 20%,#fff7e2,#dcc59a)}
.sagas .spr{background:rgba(120,80,30,.12);border:1px solid var(--line2)}

/* ---------------------------------------------------------------- avisos */
.toast{color:#3b2a17;font-weight:800}
.toast.level{border-color:var(--our3);box-shadow:inset 0 0 0 2px rgba(245,211,130,.5),var(--sh);color:#6b4a0f}
.toast.warn{border-color:#8d1f16;color:#8d1f16}
.toast.death{border-color:#8d1f16;color:#8d1f16}

/* ---------------------------------------------------------------- carregando e barra de rolagem */
#loading{background:radial-gradient(ellipse at 50% 40%,#5a140e,#1d0705)}
.ld-logo{color:#ffeacb} .ld-logo b{color:var(--our1)}
.ld-bar{background:#2a1512;border:2px solid var(--our3)}
.ld-bar i{background:linear-gradient(90deg,#c2402f,var(--our1))}
.ld-txt{color:#e8c39a}
::-webkit-scrollbar-thumb{background:var(--vin2)}

@media (max-width:1660px){.topmenu{padding:6px 12px 8px}.topmenu button{min-width:46px;padding:5px 4px 4px}.topmenu button span{font-size:9.5px}}
@media (max-width:1560px){.topmenu{padding:6px 12px 8px}.topmenu button{min-width:38px;padding:5px 2px 4px}
  /* nome do botao preso dentro do proprio botao: nada de rotulo invadindo o vizinho */
  .topmenu button span{font-size:9px;display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
@media (max-width:1400px){.topmenu{left:280px;right:568px}}
@media (max-width:1100px){.topmenu{left:278px;right:568px}}
@media (max-width:760px){.topmenu{left:10px;right:10px;top:auto;bottom:86px}}

/* ---------------------------------------------------------------- pergaminhos, classes, invocação, pvp */
.mk-cats.row button{width:auto}
.scslot{background:linear-gradient(180deg,rgba(255,252,240,.65),rgba(205,176,127,.4));border:2px dashed var(--line2)}
.scslot small{color:var(--mut)}
.scslot.has{border-style:solid}
.scslot.has:hover{background:linear-gradient(180deg,#fff7e2,#e7d3a8)}
.scslot.lock{opacity:.55;background:repeating-linear-gradient(45deg,rgba(120,80,30,.10) 0 6px,rgba(120,80,30,.04) 6px 12px)}
.clscard,.pack{background:linear-gradient(180deg,rgba(255,252,240,.6),rgba(205,176,127,.35));border:2px solid var(--line2)}
.clscard:hover,.pack.can{border-color:var(--our3)}
.pack .pl{color:var(--mut)}
.cast,.pvpbars .bar{background:#3a2a1c;border:1px solid var(--vin3)}
.cast i{background:linear-gradient(90deg,var(--our1),#c2402f)}
.pvpbars .bar i.grn{background:linear-gradient(90deg,#86e37f,#2f8f3a)}
.pvpbars .bar i.red{background:linear-gradient(90deg,#e08a7a,#a82a22)}
.pvplog .me{color:#2f5aa8} .pvplog .op{color:#8d1f16}
.tokhdr b{color:#8a5a12}
.money .gem{color:#5aa0f5} .money .gemr{color:#ff7a6a}
.eqslot small{color:var(--mut)}
.icard .stats{color:#4a3418} .icard .stats .hdr{color:var(--mut)}
.hm-filter .tag.on{box-shadow:0 0 0 2px var(--vin3) inset}
.an-c small{color:var(--mut)}

/* ---------------------------------------------------------------- portão: login e personagens */
#gate{background:radial-gradient(120% 80% at 50% -10%,#6b1a13 0%,#2a0d09 55%,#140504 100%)}
.gate-logo{color:#ffeacb;text-shadow:0 0 28px rgba(255,170,90,.45)}
.gate-logo b{color:var(--our1)}
.gate-logo small{color:#d8ab7e}
.gate-card{
  background:
    repeating-linear-gradient(103deg,rgba(120,80,30,.05) 0 2px,transparent 2px 6px),
    linear-gradient(168deg,var(--pg1),var(--pg3));
  border:3px solid var(--vin2);color:var(--tx);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55),inset 0 0 0 4px rgba(190,140,70,.3),0 0 0 1px var(--vin3),0 24px 60px -20px #000
}
.gate-card h2{color:#3b2a17}
.gate-sub,.gate-or,.gf span,.gchk{color:var(--mut)}
.gate-or::before,.gate-or::after{background:var(--line2)}
.gate-err{background:rgba(168,42,34,.12);border:1px solid rgba(168,42,34,.45);color:#8d1f16}
.gbtn{background:linear-gradient(180deg,#f3e6c4,#d9c197);border:2px solid var(--vin2);color:#4a3418}
.gbtn:hover{background:linear-gradient(180deg,#fff7e2,#e7d3a8);border-color:var(--our3)}
.gbtn.pri{background:linear-gradient(180deg,#c2402f,#7d2318);border-color:var(--vin3);color:#ffeacb}
.gbtn.ghost{background:none;border-color:transparent;color:var(--mut)}
.gbtn.ghost:hover{background:rgba(163,52,41,.1);color:var(--tx)}
.gate-foot{color:#c9a274}
.chcard{background:linear-gradient(180deg,#f2e6c8,#d9c197);border:2px solid var(--vin2)}
.chcard:hover{border-color:var(--our3);background:linear-gradient(180deg,#fff7e2,#e7d3a8)}
.chcard b{color:#3b2a17}
.chinfo{color:var(--mut)}
.chcard.new .plus{color:var(--vin1)}
.chcard.last{border-color:var(--our3)}
.chlast{background:linear-gradient(180deg,var(--our1),var(--our3));color:#3b2a17}
.gbadge{background:linear-gradient(180deg,var(--our1),var(--our3));color:#3b2a17}
.gtest{border-top:1px solid var(--line2)}
.gtest code{background:rgba(120,80,30,.14)}
.gchk input{accent-color:#a33429}
.gpweye:hover,.gpweye.on{background:rgba(120,80,30,.12)}
.deathov{background:radial-gradient(ellipse at center,rgba(120,10,0,.3),rgba(20,4,2,.6))}
.deathov div{color:#ffb4a4}
.dia{background:linear-gradient(180deg,rgba(255,252,240,.6),rgba(205,176,127,.35))}
.dia.hoje{border-color:var(--our3);box-shadow:0 0 0 2px var(--our2) inset}
.cmdout{background:rgba(58,42,28,.9);color:#f0e2c0;border:2px solid var(--vin2)}
.ic-caixa{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 7h18v3H3zm1 5h16v9H4zm7-9h2l3 3h-8z'/%3E%3C/svg%3E")}
.ic-troféu{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3h10v2h4v3a4 4 0 0 1-4 4h-.6A5 5 0 0 1 13 14.9V18h4v3H7v-3h4v-3.1A5 5 0 0 1 7.6 12H7a4 4 0 0 1-4-4V5h4zM5 7v1a2 2 0 0 0 2 2zm14 0v3a2 2 0 0 0 2-2V7z'/%3E%3C/svg%3E")}
.ic-dia{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2v2h10V2h2v2h2v18H3V4h2V2zm12 7H5v11h14zM8 12h3v3H8z'/%3E%3C/svg%3E")}
.ic-evento{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 9.5 8.5 3 11l6.5 2.5L12 20l2.5-6.5L21 11l-6.5-2.5z'/%3E%3C/svg%3E")}

/* ---------------------------------------------------------------- aviso de versão nova */
#verBanner b{color:var(--vin1)}
#verBanner span{color:#6b512e}
#verBanner button{
  background:linear-gradient(180deg,var(--vin1),var(--vin2));color:#ffeacb;
  border:1px solid var(--vin3);box-shadow:inset 0 0 0 1px var(--our2)
}
#verBanner button:hover{filter:brightness(1.12)}
#verBanner button.sec{
  background:linear-gradient(180deg,#e8d7ad,#d6c095);color:#6b4a0f;
  border-color:var(--vin2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)
}

/* ---------------------------------------------------------------- atalhos do card e modos de tela */
.pc-rail{border-top:1px solid rgba(120,80,30,.32)}
.pc-rail button{color:#6b512e}
.pc-rail button:hover{background:rgba(163,52,41,.12);color:var(--tx)}
.pc-rail button.on{background:linear-gradient(180deg,var(--vin1),var(--vin2));color:#ffeacb;box-shadow:inset 0 0 0 1px var(--our2)}
#imSair{background:linear-gradient(180deg,var(--vin1),var(--vin2));color:#ffeacb;border-color:var(--vin3)}
#economia .ecc{background:rgba(120,80,30,.12);box-shadow:inset 0 0 0 1px rgba(120,80,30,.2)}
#economia .ecc small{color:#6b512e}

/* ---------------------------------------------------------------- ficha do ninja */
.favatar{background:rgba(120,80,30,.12);border-color:rgba(120,80,30,.32)}
.ftit{color:#8a5a12;background:rgba(232,183,63,.22);border-color:var(--our3)}
.vit,.vitpool .vp{background:linear-gradient(180deg,rgba(255,255,255,.4),rgba(120,80,30,.07))}
.vit small,.fnum small{color:#6b512e}
.vitpool{background:rgba(120,80,30,.1)}
.fnum{background:rgba(120,80,30,.1);border-color:rgba(120,80,30,.26)}

/* ---------------------------------------------------------------- passe de batalha */
.pbnow,.pbcol,.pbc{background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(120,80,30,.07));border-color:rgba(120,80,30,.3)}
.pbcol small,.pbc small,.pblab,.pbnum,.pbval{color:#6b512e}
.pbsellh{color:#8a5a12}
.pbsell{border-color:var(--our3);background:linear-gradient(180deg,rgba(232,183,63,.26),rgba(232,183,63,.08))}
.pbc.hoje{border-color:var(--vin2);box-shadow:inset 0 0 0 1px var(--our2)}
.pbnum.hoje{color:var(--vin1)}

/* ---------------------------------------------------------------- loja VIP e diamantes */
.cosmc,.dpk{background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(120,80,30,.07));border-color:rgba(120,80,30,.3)}
.dpk small{color:#6b512e}
.dpk.on,.cosmc.sel{border-color:var(--vin2);box-shadow:inset 0 0 0 1px var(--our2)}
.aviso{border-color:var(--our3);background:rgba(232,183,63,.2)}
.aviso p{color:#6b512e}
.camostra{background:rgba(120,80,30,.16)}
.icbtn.mais{font-weight:900;color:#8a5a12}

/* ---------------------------------------------------------------- portão: aviso bom */
.gate-ok{border-color:#2f7a4f;background:rgba(47,122,79,.16);color:#1f5c39}
.linkb{color:var(--vin1)}

/* ---------------------------------------------------------------- ranking */
.rkpod,.rkd{background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(120,80,30,.07));border-color:rgba(120,80,30,.3)}
.rkpod.p1{border-color:var(--our3);box-shadow:inset 0 0 0 1px var(--our2)}
.rkpod.eu,.rklin.eu{box-shadow:inset 0 0 0 1px var(--vin2)}
.rklin{background:rgba(120,80,30,.07)}
.rklin:nth-child(2n){background:rgba(120,80,30,.13)}
.rkpos,.rksub,.rkd small{color:#6b512e}
.rkval,.rkv,.rkd span{color:#8a5a12}